aboutsummaryrefslogtreecommitdiff
path: root/js/helper-classes/3D
diff options
context:
space:
mode:
Diffstat (limited to 'js/helper-classes/3D')
-rwxr-xr-xjs/helper-classes/3D/draw-utils.js658
-rwxr-xr-xjs/helper-classes/3D/snap-manager.js4
-rwxr-xr-xjs/helper-classes/3D/view-utils.js99
3 files changed, 431 insertions, 330 deletions
diff --git a/js/helper-classes/3D/draw-utils.js b/js/helper-classes/3D/draw-utils.js
index 869de213..b59bbf39 100755
--- a/js/helper-classes/3D/draw-utils.js
+++ b/js/helper-classes/3D/draw-utils.js
@@ -42,7 +42,6 @@ var StageLine = require("js/helper-classes/3D/StageLine").StageLine;
42 42
43 43
44var DrawUtils = exports.DrawUtils = Montage.create(Component, { 44var DrawUtils = exports.DrawUtils = Montage.create(Component, {
45
46 /////////////////////////////////////////////////////////////////////// 45 ///////////////////////////////////////////////////////////////////////
47 // Instance variables 46 // Instance variables
48 /////////////////////////////////////////////////////////////////////// 47 ///////////////////////////////////////////////////////////////////////
@@ -97,7 +96,7 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
97 _selectionCtr : {value: null, writable: true }, 96 _selectionCtr : {value: null, writable: true },
98 97
99 // Properties that require element planes to be updated 98 // Properties that require element planes to be updated
100 _updatePlaneProps : {value: ["matrix", "left", "top", "width", "height"], writable: false }, 99 _updatePlaneProps : {value: ["matrix", "left", "top", "width", "height", "border", "border-width", "border-style", "-webkit-transform"], writable: false },
101 _recalculateScrollOffsets : { value: false }, 100 _recalculateScrollOffsets : { value: false },
102 101
103 /////////////////////////////////////////////////////////////////////// 102 ///////////////////////////////////////////////////////////////////////
@@ -106,33 +105,33 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
106 setDrawingSurfaceElement : { value: function( s ) { this._drawingSurfaceElt = s; if (s) this._drawingContext = s.getContext("2d"); }}, 105 setDrawingSurfaceElement : { value: function( s ) { this._drawingSurfaceElt = s; if (s) this._drawingContext = s.getContext("2d"); }},
107 getDrawingSurfaceElement : { value: function() { return this._drawingSurfaceElt; }}, 106 getDrawingSurfaceElement : { value: function() { return this._drawingSurfaceElt; }},
108 107
109 getDrawingContext : { value: function() { return this._drawingContext; }}, 108 getDrawingContext : { value: function() { return this._drawingContext; }},
110 109
111 setSourceSpaceElement : { value: function(ss) { this._sourceSpaceElt = ss; }}, 110 setSourceSpaceElement : { value: function(ss) { this._sourceSpaceElt = ss; }},
112 getSourceSpaceElement : { value: function() { return this._sourceSpaceElt; }}, 111 getSourceSpaceElement : { value: function() { return this._sourceSpaceElt; }},
113 112
114 getWorkingPlane : { value: function() { return this._workingPlane; }}, 113 getWorkingPlane : { value: function() { return this._workingPlane; }},
115 setWorkingPlane : { value: function (wp) { this._workingPlane = wp; }}, 114 setWorkingPlane : { value: function (wp) { this._workingPlane = wp; }},
116 115
117 getGridHorizontalSpacing : { value: function() { return this._gridHorizontalSpacing; }}, 116 getGridHorizontalSpacing : { value: function() { return this._gridHorizontalSpacing; }},
118 getGridVerticalSpacing : { value: function() { return this._gridVerticalSpacing; }}, 117 getGridVerticalSpacing : { value: function() { return this._gridVerticalSpacing; }},
119 getGridHorizontalLineCount : { value: function() { return this._gridHorizontalLineCount; }}, 118 getGridHorizontalLineCount : { value: function() { return this._gridHorizontalLineCount; }},
120 getGridVerticalLineCount : { value: function() { return this._gridVerticalLineCount; }}, 119 getGridVerticalLineCount : { value: function() { return this._gridVerticalLineCount; }},
121 getGridOrigin : { value: function() { return this._gridOrigin.slice(0); }}, 120 getGridOrigin : { value: function() { return this._gridOrigin.slice(0); }},
122 121
123 isDrawingGrid : { value: function() { return this.drawXY || this.drawYZ || this.drawXZ; }}, 122 isDrawingGrid : { value: function() { return this.drawXY || this.drawYZ || this.drawXZ; }},
124 isDrawingElementNormal : { value: function() { return this.drawElementN }}, 123 isDrawingElementNormal : { value: function() { return this.drawElementN }},
125 124
126 getLineColor : { value: function() { return this._lineColor; }}, 125 getLineColor : { value: function() { return this._lineColor; }},
127 setLineColor : { value: function( color ) { this._lineColor = color; }}, 126 setLineColor : { value: function( color ) { this._lineColor = color; }},
128 127
129 getLineWidth : { value: function() { return this._drawingContext.lineWidth; }}, 128 getLineWidth : { value: function() { return this._drawingContext.lineWidth; }},
130 setLineWidth : { value: function( w ) { this._drawingContext.lineWidth = w; }}, 129 setLineWidth : { value: function( w ) { this._drawingContext.lineWidth = w; }},
131 130
132 131
133 initialize: { 132 initialize: {
134 value: function() { 133 value: function() {
135 this._gridOrigin = [0,0]; // 2D plane space point 134 this._gridOrigin = [0,0]; // 2D plane space point
136 135
137 this.eventManager.addEventListener("elementAdded", this, false); 136 this.eventManager.addEventListener("elementAdded", this, false);
138 this.eventManager.addEventListener("elementsRemoved", this, false); 137 this.eventManager.addEventListener("elementsRemoved", this, false);
@@ -212,7 +211,12 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
212 this.addElement(elements); 211 this.addElement(elements);
213 } 212 }
214 213
215 this.drawWorkingPlane(); 214 // Redraw stage only once after all addition is completed
215 var stage = this.application.ninja.stage;
216 stage.drawLayout = true;
217 stage.updatePlanes = true;
218 stage.draw3DInfo = true;
219 stage.needsDrawSelection = true;
216 } 220 }
217 }, 221 },
218 222
@@ -229,7 +233,12 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
229 this.removeElement(elements); 233 this.removeElement(elements);
230 } 234 }
231 235
232 this.drawWorkingPlane(); 236 // Redraw stage only once after all deletion is completed
237 var stage = this.application.ninja.stage;
238 stage.drawLayout = true;
239 stage.updatePlanes = true;
240 stage.draw3DInfo = true;
241 stage.needsDrawSelection = true;
233 } 242 }
234 }, 243 },
235 244
@@ -310,9 +319,20 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
310 plane, 319 plane,
311 changed = false, 320 changed = false,
312 elt, 321 elt,
322 eltModel,
313 adjustStagePadding = !isChanging || (event.detail.data.prop !== "matrix"); 323 adjustStagePadding = !isChanging || (event.detail.data.prop !== "matrix");
314 for(var i=0; i < len; i++) { 324 for(var i=0; i < len; i++) {
315 elt = els[i]; 325 elt = els[i];
326 eltModel = elt.elementModel;
327 eltModel.setProperty("offsetCache", false);
328
329 if(eltModel.selection !== "body") {
330 if(isChanging) {
331 eltModel.props3D.matrix3d = null;
332 } else {
333 eltModel.props3D.init(elt, false);
334 }
335 }
316 plane = elt.elementModel.props3D.elementPlane; 336 plane = elt.elementModel.props3D.elementPlane;
317 if(plane) { 337 if(plane) {
318 plane.init(); 338 plane.init();
@@ -353,8 +373,10 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
353 } 373 }
354 374
355 if(!changed) { 375 if(!changed) {
356 this.drawWorkingPlane(); 376 // If we didn't already set userPaddingTop or userPaddingLeft, force stage to redraw
357 this.draw3DCompass(); 377 //this.snapManager._isCacheInvalid = true;
378// stage.draw3DInfo = true;
379 stage.needsDraw = true;
358 } 380 }
359 381
360 // TODO - Remove this once all stage drawing is consolidated into a single draw cycle 382 // TODO - Remove this once all stage drawing is consolidated into a single draw cycle
@@ -680,81 +702,82 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
680 { 702 {
681 this.application.ninja.stage.clearGridCanvas(); 703 this.application.ninja.stage.clearGridCanvas();
682 this.drawStageOutline(); 704 this.drawStageOutline();
683 if (!this.isDrawingGrid()) return; 705 if (this.isDrawingGrid()) {
684 706 var saveContext = this.getDrawingSurfaceElement();
685 var saveContext = this.getDrawingSurfaceElement(); 707 this.setDrawingSurfaceElement(this.application.ninja.stage.gridCanvas);
686 this.setDrawingSurfaceElement(this.application.ninja.stage.gridCanvas);
687 708
688 // 3 coordinate axes for the plane 709 // 3 coordinate axes for the plane
689 var zAxis = [this._workingPlane[0], this._workingPlane[1], this._workingPlane[2]]; 710 var zAxis = [this._workingPlane[0], this._workingPlane[1], this._workingPlane[2]];
690 711
691 // get a point that lies on the plane 712 // get a point that lies on the plane
692 var ptOnPlane = MathUtils.getPointOnPlane(this._workingPlane); 713 var ptOnPlane = MathUtils.getPointOnPlane(this._workingPlane);
693 714
694 // define the grid parameters 715 // define the grid parameters
695 var width = this.snapManager.getStageWidth(), 716 var width = this.snapManager.getStageWidth(),
696 height = this.snapManager.getStageHeight(), 717 height = this.snapManager.getStageHeight(),
697 nLines = 10; 718 nLines = 10;
698 719
699 // get a matrix from working plane space to the world 720 // get a matrix from working plane space to the world
700 var mat = this.getPlaneToWorldMatrix(zAxis, ptOnPlane); 721 var mat = this.getPlaneToWorldMatrix(zAxis, ptOnPlane);
701 var tMat = Matrix.Translation( [0.5*width, 0.5*height, 0] ); 722 var tMat = Matrix.Translation( [0.5*width, 0.5*height, 0] );
702 //mat = tMat.multiply(mat); 723 //mat = tMat.multiply(mat);
703 glmat4.multiply( tMat, mat, mat); 724 glmat4.multiply( tMat, mat, mat);
704 725
705 // the positioning of the grid may depend on the view direction. 726 // the positioning of the grid may depend on the view direction.
706 var stage = this.snapManager.getStage(); 727 var stage = this.snapManager.getStage();
707 var viewMat = this.viewUtils.getMatrixFromElement(stage); 728 var viewMat = this.viewUtils.getMatrixFromElement(stage);
708 var viewDir = [viewMat[8], viewMat[9], viewMat[10]]; 729 var viewDir = [viewMat[8], viewMat[9], viewMat[10]];
709 730
710 var dx, dy, delta, pt0, pt1; 731 var dx, dy, delta, pt0, pt1;
711 dx = this._gridVerticalSpacing; 732 dx = this._gridVerticalSpacing;
712 dy = this._gridHorizontalSpacing; 733 dy = this._gridHorizontalSpacing;
713 nLines = Math.floor(width / dx) + 1; 734 nLines = Math.floor(width / dx) + 1;
714 if (MathUtils.fpCmp(dx*nLines,width) == 0) nLines--; 735 if (MathUtils.fpCmp(dx*nLines,width) == 0) nLines--;
715 736
716 var saveColor = this._lineColor; 737 var saveColor = this._lineColor;
717 var saveLineWidth = this._drawingContext.lineWidth; 738 var saveLineWidth = this._drawingContext.lineWidth;
718 739
719 // reset the line cache 740 // reset the line cache
720 this._gridLineArray = new Array(); 741 this._gridLineArray = new Array();
721 742
722 if (this.drawXY) this._lineColor = "red"; 743 if (this.drawXY) this._lineColor = "red";