diff options
Diffstat (limited to 'js/helper-classes/3D/draw-utils.js')
-rwxr-xr-x | js/helper-classes/3D/draw-utils.js | 146 |
1 files changed, 102 insertions, 44 deletions
diff --git a/js/helper-classes/3D/draw-utils.js b/js/helper-classes/3D/draw-utils.js index 8ddd0d52..9c4f31b7 100755 --- a/js/helper-classes/3D/draw-utils.js +++ b/js/helper-classes/3D/draw-utils.js | |||
@@ -73,6 +73,7 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, { | |||
73 | 73 | ||
74 | // Properties that require element planes to be updated | 74 | // Properties that require element planes to be updated |
75 | _updatePlaneProps : {value: ["matrix", "left", "top", "width", "height"], writable: false }, | 75 | _updatePlaneProps : {value: ["matrix", "left", "top", "width", "height"], writable: false }, |
76 | _recalculateScrollOffsets : { value: false }, | ||
76 | 77 | ||
77 | /////////////////////////////////////////////////////////////////////// | 78 | /////////////////////////////////////////////////////////////////////// |
78 | // Property accessors | 79 | // Property accessors |
@@ -117,7 +118,7 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, { | |||
117 | }, | 118 | }, |
118 | 119 | ||
119 | initializeFromDocument:{ | 120 | initializeFromDocument:{ |
120 | value:function(adjustScrollOffsets){ | 121 | value:function(adjustScrollOffsets, useStageValues){ |
121 | var i, | 122 | var i, |
122 | documentRootChildren = this.application.ninja.currentDocument.model.views.design.getLiveNodeList(true), | 123 | documentRootChildren = this.application.ninja.currentDocument.model.views.design.getLiveNodeList(true), |
123 | stage = this.application.ninja.stage, | 124 | stage = this.application.ninja.stage, |
@@ -141,6 +142,13 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, { | |||
141 | t, | 142 | t, |
142 | plane, | 143 | plane, |
143 | elt; | 144 | elt; |
145 | if(useStageValues) { | ||
146 | initL = stage.userPaddingLeft; | ||
147 | initT = stage.userPaddingTop; | ||
148 | minLeft = stage.templateLeft; | ||
149 | minTop = stage.templateTop; | ||
150 | this._recalculateScrollOffsets = false; | ||
151 | } | ||
144 | for(i=0; i<len; i++) { | 152 | for(i=0; i<len; i++) { |
145 | elt = documentRootChildren[i]; | 153 | elt = documentRootChildren[i]; |
146 | plane = this.addElement(elt); | 154 | plane = this.addElement(elt); |
@@ -149,17 +157,19 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, { | |||
149 | t = plane._rect.m_top - docTop; | 157 | t = plane._rect.m_top - docTop; |
150 | if(l < minLeft) { | 158 | if(l < minLeft) { |
151 | minLeft = l; | 159 | minLeft = l; |
160 | stage.minLeftElement = elt; | ||
152 | } | 161 | } |
153 | if(t < minTop) { | 162 | if(t < minTop) { |
154 | minTop = t; | 163 | minTop = t; |
164 | stage.minTopElement = elt; | ||
155 | } | 165 | } |
156 | } | 166 | } |
157 | } | 167 | } |
158 | if(minLeft !== initL) { | 168 | if(minLeft !== initL) { |
159 | stage.userPaddingLeft = minLeft; | 169 | stage.userPaddingLeft = (minLeft < 0) ? minLeft : 0; |
160 | } | 170 | } |
161 | if(minTop !== initT) { | 171 | if(minTop !== initT) { |
162 | stage.userPaddingTop = minTop; | 172 | stage.userPaddingTop = (minTop < 0) ? minTop : 0; |
163 | } | 173 | } |
164 | } | 174 | } |
165 | } | 175 | } |
@@ -274,9 +284,11 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, { | |||
274 | t, | 284 | t, |
275 | plane, | 285 | plane, |
276 | changed = false, | 286 | changed = false, |
287 | elt, | ||
277 | adjustStagePadding = !isChanging || (event.detail.data.prop !== "matrix"); | 288 | adjustStagePadding = !isChanging || (event.detail.data.prop !== "matrix"); |
278 | for(var i=0; i < len; i++) { | 289 | for(var i=0; i < len; i++) { |
279 | plane = els[i].elementModel.props3D.elementPlane; | 290 | elt = els[i]; |
291 | plane = elt.elementModel.props3D.elementPlane; | ||
280 | if(plane) { | 292 | if(plane) { |
281 | plane.init(); | 293 | plane.init(); |
282 | if(adjustStagePadding) { | 294 | if(adjustStagePadding) { |
@@ -284,22 +296,34 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, { | |||
284 | t = plane._rect.m_top - docTop; | 296 | t = plane._rect.m_top - docTop; |
285 | if(l < minLeft) { | 297 | if(l < minLeft) { |
286 | minLeft = l; | 298 | minLeft = l; |
299 | stage.minLeftElement = elt; | ||
300 | } else if((elt === stage.minLeftElement) && (l > minLeft)) { | ||
301 | this._recalculateScrollOffsets = true; | ||
287 | } | 302 | } |
303 | |||
288 | if(t < minTop) { | 304 | if(t < minTop) { |
289 | minTop = t; | 305 | minTop = t; |
306 | stage.minTopElement = elt; | ||
307 | } else if((elt === stage.minTopElement) && (t > minTop)) { | ||
308 | this._recalculateScrollOffsets = true; | ||
290 | } | 309 | } |
291 | } | 310 | } |
292 | } | 311 | } |
293 | } | 312 | } |
294 | 313 | ||
295 | if(adjustStagePadding) { | 314 | if(adjustStagePadding) { |
296 | if(minLeft !== stage.userPaddingLeft) { | 315 | if(this._recalculateScrollOffsets && !isChanging) { |
297 | stage.userPaddingLeft = minLeft; | 316 | this.initializeFromDocument(true, true); |
298 | changed = true; | ||
299 | } | ||
300 | if(minTop !== stage.userPaddingTop) { | ||
301 | stage.userPaddingTop = minTop; | ||
302 | changed = true; | 317 | changed = true; |
318 | } else { | ||
319 | if(minLeft !== stage.userPaddingLeft) { | ||
320 | stage.userPaddingLeft = minLeft; | ||
321 | changed = true; | ||
322 | } | ||
323 | if(minTop !== stage.userPaddingTop) { | ||
324 | stage.userPaddingTop = minTop; | ||
325 | changed = true; | ||
326 | } | ||
303 | } | 327 | } |
304 | } | 328 | } |
305 | 329 | ||
@@ -630,6 +654,7 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, { | |||
630 | value: function () | 654 | value: function () |
631 | { | 655 | { |
632 | this.application.ninja.stage.clearGridCanvas(); | 656 | this.application.ninja.stage.clearGridCanvas(); |
657 | this.drawStageOutline(); | ||
633 | if (!this.isDrawingGrid()) return; | 658 | if (!this.isDrawingGrid()) return; |
634 | 659 | ||
635 | var saveContext = this.getDrawingSurfaceElement(); | 660 | var saveContext = this.getDrawingSurfaceElement(); |
@@ -701,21 +726,6 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, { | |||
701 | this._lineColor = saveColor; | 726 | this._lineColor = saveColor; |
702 | this._drawingContext.lineWidth = saveLineWidth; | 727 | this._drawingContext.lineWidth = saveLineWidth; |
703 | 728 | ||
704 | if(this.application.ninja.currentDocument.model.documentRoot.id !== "UserContent") { | ||
705 | // draw an outline around the body | ||
706 | var stagePt = MathUtils.getPointOnPlane([0,0,1,0]); | ||
707 | var stageMat = this.getPlaneToWorldMatrix([0,0,1], stagePt); | ||
708 | // glmat4.multiply( tMat, stageMat, stageMat); | ||
709 | pt0 = [0, 0, 0]; | ||
710 | pt1 = [0, height, 0]; | ||
711 | delta = [width, 0, 0]; | ||
712 | this.drawGridLines(pt0, pt1, delta, stageMat, 2); | ||
713 | pt0 = [0, 0, 0]; | ||
714 | pt1 = [width, 0, 0]; | ||
715 | delta = [0, height, 0]; | ||
716 | this.drawGridLines(pt0, pt1, delta, stageMat, 2); | ||
717 | } | ||
718 | |||
719 | // draw the lines | 729 | // draw the lines |
720 | this.redrawGridLines(); | 730 | this.redrawGridLines(); |
721 | 731 | ||
@@ -738,15 +748,11 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, { | |||
738 | var sourceSpaceMat = this.viewUtils.getLocalToGlobalMatrix( this._sourceSpaceElt ); | 748 | var sourceSpaceMat = this.viewUtils.getLocalToGlobalMatrix( this._sourceSpaceElt ); |
739 | for (var i = 0; i < nLines; i++) { | 749 | for (var i = 0; i < nLines; i++) { |
740 | // transform the points from working plane space to world space | 750 | // transform the points from working plane space to world space |
741 | //var t0 = mat.multiply(p0), | ||
742 | // t1 = mat.multiply(p1); | ||
743 | var t0 = glmat4.multiplyVec3( mat, p0, [] ), | 751 | var t0 = glmat4.multiplyVec3( mat, p0, [] ), |
744 | t1 = glmat4.multiplyVec3( mat, p1, [] ); | 752 | t1 = glmat4.multiplyVec3( mat, p1, [] ); |
745 | 753 | ||
746 | // transform from world space to global screen space | 754 | // transform from world space to global screen space |
747 | if (this._sourceSpaceElt) { | 755 | if (this._sourceSpaceElt) { |
748 | // t0 = this.viewUtils.localToGlobal(t0, this._sourceSpaceElt); | ||
749 | // t1 = this.viewUtils.localToGlobal(t1, this._sourceSpaceElt); | ||
750 | t0 = this.viewUtils.localToGlobal2(t0, sourceSpaceMat); | 756 | t0 = this.viewUtils.localToGlobal2(t0, sourceSpaceMat); |
751 | t1 = this.viewUtils.localToGlobal2(t1, sourceSpaceMat); | 757 | t1 = this.viewUtils.localToGlobal2(t1, sourceSpaceMat); |
752 | } | 758 | } |
@@ -764,9 +770,7 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, { | |||
764 | line.setVisibility(vis); | 770 | line.setVisibility(vis); |
765 | 771 | ||
766 | // increment the points to the next position | 772 | // increment the points to the next position |
767 | // p0 = p0.add(d); p0[3] = 1.0; | ||
768 | p0 = vecUtils.vecAdd(4, p0, d); p0[3] = 1.0; | 773 | p0 = vecUtils.vecAdd(4, p0, d); p0[3] = 1.0; |
769 | // p1 = p1.add(d); p1[3] = 1.0; | ||
770 | p1 = vecUtils.vecAdd(4, p1, d); p1[3] = 1.0; | 774 | p1 = vecUtils.vecAdd(4, p1, d); p1[3] = 1.0; |
771 | } | 775 | } |
772 | } | 776 | } |
@@ -819,25 +823,12 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, { | |||
819 | // draw the lines | 823 | // draw the lines |
820 | var line, | 824 | var line, |
821 | nLines = this._gridLineArray.length; | 825 | nLines = this._gridLineArray.length; |
822 | if(this.application.ninja.currentDocument.model.documentRoot.id !== "UserContent") { | ||
823 | nLines = this._gridLineArray.length-4; | ||
824 | } | ||
825 | 826 | ||
826 | for (var i = 0; i < nLines; i++) { | 827 | for (var i = 0; i < nLines; i++) { |
827 | line = this._gridLineArray[i]; | 828 | line = this._gridLineArray[i]; |
828 | this.drawIntersectedLine(line, this._drawingContext); | 829 | this.drawIntersectedLine(line, this._drawingContext); |
829 | } | 830 | } |
830 | <