aboutsummaryrefslogtreecommitdiff
path: root/js/stage
diff options
context:
space:
mode:
authorPushkar Joshi2012-02-28 14:01:05 -0800
committerPushkar Joshi2012-02-28 14:01:05 -0800
commit63307c9abf120985d979a40a53a0598d3f0d5c5a (patch)
tree57d9cffd7aa0959ea31fe0fa2d89a9080198bcb3 /js/stage
parente1a65d0c2a13e12ee53be98c731616e35aa07a41 (diff)
parent7c9291a5bab4abd849547f8878f6fb962fc88250 (diff)
downloadninja-63307c9abf120985d979a40a53a0598d3f0d5c5a.tar.gz
Merge branch 'master' into pentool
Conflicts: manifest.json
Diffstat (limited to 'js/stage')
-rwxr-xr-xjs/stage/layout.js76
-rwxr-xr-xjs/stage/stage-deps.js38
-rwxr-xr-xjs/stage/stage-view.reel/stage-view.js21
-rwxr-xr-xjs/stage/stage.reel/stage.js18
4 files changed, 93 insertions, 60 deletions
diff --git a/js/stage/layout.js b/js/stage/layout.js
index 56bb70bf..de4c67c1 100755
--- a/js/stage/layout.js
+++ b/js/stage/layout.js
@@ -53,36 +53,38 @@ exports.Layout = Montage.create(Component, {
53 this.ctx.lineWidth = this.ctxLineWidth; 53 this.ctx.lineWidth = this.ctxLineWidth;
54 this.ctx.fillStyle = this.drawFillColor; 54 this.ctx.fillStyle = this.drawFillColor;
55 55
56 this.eventManager.addEventListener("elementAdded", this, false); 56// this.eventManager.addEventListener("elementAdded", this, false);
57 this.eventManager.addEventListener("elementDeleted", this, false); 57 this.eventManager.addEventListener("elementDeleted", this, false);
58 58
59 this.eventManager.addEventListener("selectionChange", this, false); 59 this.eventManager.addEventListener("selectionChange", this, false);
60 60
61 this.eventManager.addEventListener("deleteSelection", this, false); 61 this.eventManager.addEventListener("deleteSelection", this, false);
62
63// this.addEventListener("change@stage.appModel.layoutView", this.handleLayoutView, false);
64
65 } 62 }
66 }, 63 },
67 64
68 handleLayoutView: { 65 handleOpenDocument: {
69 value: function() { 66 value: function() {
70 console.log(this.stage.appModel.layoutView); 67 // Initial elements to draw is the entire node list
68 this.elementsToDraw = this.application.ninja.documentController.activeDocument._liveNodeList;
69
70 // Draw the elements and the 3d info
71 this.draw();
72 this.draw3DInfo(false);
71 } 73 }
72 }, 74 },
73 75
76 // No need to keep track of the added elements. We now have a live node list of the dom
74 handleElementAdded: { 77 handleElementAdded: {
75 value: function(event) { 78 value: function(event) {
76 this.domTree.push(event.detail); 79 // this.domTree.push(event.detail);
77 80 // this.draw();
78 this.draw(); 81 // this.draw3DInfo(false);
79 this.draw3DInfo(false);
80 } 82 }
81 }, 83 },
82 84
83 handleElementDeleted: { 85 handleElementDeleted: {
84 value: function(event) { 86 value: function(event) {
85 this.domTree.splice(this.domTree.indexOf(event.detail), 1); 87 //this.domTree.splice(this.domTree.indexOf(event.detail), 1);
86 } 88 }
87 }, 89 },
88 90
@@ -96,8 +98,18 @@ exports.Layout = Montage.create(Component, {
96 98
97 handleSelectionChange: { 99 handleSelectionChange: {
98 value: function(event) { 100 value: function(event) {
99 this.elementsToDraw = [];
100 101
102 if(this.application.ninja.documentController.activeDocument === null){
103 return;
104 }
105
106 // Make an array copy of the line node list which is not an array like object
107 this.domTree = Array.prototype.slice.call(this.application.ninja.documentController.activeDocument._liveNodeList, 0);
108
109 // Clear the elements to draw
110 this.elementsToDraw.length = 0;
111
112 // Draw the non selected elements
101 if(!event.detail.isDocument) { 113 if(!event.detail.isDocument) {
102 var tmp = event.detail.elements.map(function(element){ return element._element}); 114 var tmp = event.detail.elements.map(function(element){ return element._element});
103 115
@@ -111,13 +123,15 @@ exports.Layout = Montage.create(Component, {
111 this.draw(); // Not a reel yet :) 123 this.draw(); // Not a reel yet :)
112 this.draw3DInfo(false); 124 this.draw3DInfo(false);
113 125
114 126 // Clear the domTree copy
127 this.domTree.length = 0;
115 } 128 }
116 }, 129 },
117 130
118 draw: { 131 draw: {
119 value: function() { 132 value: function() {
120 this.clearCanvas(); 133 this.clearCanvas();
134
121 var els = this.elementsToDraw.length; 135 var els = this.elementsToDraw.length;
122 for(var i = 0, el; i < els; i++){ 136 for(var i = 0, el; i < els; i++){
123 this.drawTagOutline(this.elementsToDraw[i]); 137 this.drawTagOutline(this.elementsToDraw[i]);
@@ -127,15 +141,15 @@ exports.Layout = Montage.create(Component, {
127 141
128 draw3DInfo: { 142 draw3DInfo: {
129 value: function(updatePlanes) { 143 value: function(updatePlanes) {
130 if(updatePlanes) 144 if(updatePlanes) {
131 {
132 drawUtils.updatePlanes(); 145 drawUtils.updatePlanes();
133 } 146 }
134 if(this.stage.appModel.show3dGrid) 147
135 { 148 if(this.stage.appModel.show3dGrid) {
136 this.application.ninja.stage.stageDeps.snapManager.updateWorkingPlaneFromView(); 149 this.application.ninja.stage.stageDeps.snapManager.updateWorkingPlaneFromView();
137 drawUtils.drawWorkingPlane(); 150 drawUtils.drawWorkingPlane();
138 } 151 }
152
139 drawUtils.draw3DCompass(); 153 drawUtils.draw3DCompass();
140 } 154 }
141 }, 155 },
@@ -152,29 +166,22 @@ exports.Layout = Montage.create(Component, {
152 if(!item) return; 166 if(!item) return;
153 167
154 // TODO Bind the layoutview mode to the current document 168 // TODO Bind the layoutview mode to the current document
155// var mode = this.application.ninja.currentDocument.layoutMode; 169 // var mode = this.application.ninja.currentDocument.layoutMode;
156 170
157 if(this.layoutView === "layoutOff") return; 171 if(this.layoutView === "layoutOff") return;
158 172
159 // Don't draw outlines for shapes. 173 // Don't draw outlines for shapes.
160 // TODO Use the element mediator/controller/model to see if its a shape 174 // TODO Use the element mediator/controller/model to see if its a shape
161 /* 175 // if (utilsModule.utils.isElementAShape(item)) return;
162 if (utilsModule.utils.isElementAShape(item)) 176
163 {
164 return;
165 }
166 */
167 177
168 /** 178 // draw the layout
169 * New Drawing layout code using 3D calculations
170 */
171 viewUtils.setViewportObj( item ); 179 viewUtils.setViewportObj( item );
172 var bounds3D = viewUtils.getElementViewBounds3D( item ); 180 var bounds3D = viewUtils.getElementViewBounds3D( item );
173 var tmpMat = viewUtils.getLocalToGlobalMatrix( item ); 181 var tmpMat = viewUtils.getLocalToGlobalMatrix( item );
174 182
175 var zoomFactor = 1; 183 var zoomFactor = 1;
176 if (this.stage._viewport.style && this.stage._viewport.style.zoom) 184 if (this.stage._viewport.style && this.stage._viewport.style.zoom) {
177 {
178 zoomFactor = Number(this.stage._viewport.style.zoom); 185 zoomFactor = Number(this.stage._viewport.style.zoom);
179 } 186 }
180 187
@@ -185,8 +192,7 @@ exports.Layout = Montage.create(Component, {
185 var localPt = bounds3D[j]; 192 var localPt = bounds3D[j];
186 var tmpPt = viewUtils.localToGlobal2(localPt, tmpMat); 193 var tmpPt = viewUtils.localToGlobal2(localPt, tmpMat);
187 194
188 if(zoomFactor !== 1) 195 if(zoomFactor !== 1) {
189 {
190 tmpPt = vecUtils.vecScale(3, tmpPt, zoomFactor); 196 tmpPt = vecUtils.vecScale(3, tmpPt, zoomFactor);
191 197
192 tmpPt[0] += sSL*(zoomFactor - 1); 198 tmpPt[0] += sSL*(zoomFactor - 1);
@@ -255,14 +261,6 @@ exports.Layout = Montage.create(Component, {
255 value: function(elements) { 261 value: function(elements) {
256 this.clearCanvas(); 262 this.clearCanvas();
257 this.WalkDOM(this.application.ninja.currentDocument.documentRoot, elements); 263 this.WalkDOM(this.application.ninja.currentDocument.documentRoot, elements);
258
259 //drawUtils.updatePlanes();
260
261 if(this.application.ninja.currentDocument.draw3DGrid) {
262 //drawUtils.drawWorkingPlane();
263 }
264
265 //drawUtils.draw3DCompass();
266 } 264 }
267 }, 265 },
268 266
diff --git a/js/stage/stage-deps.js b/js/stage/stage-deps.js
index d46e2b81..16f2c652 100755
--- a/js/stage/stage-deps.js
+++ b/js/stage/stage-deps.js
@@ -23,6 +23,10 @@ exports.StageDeps = Montage.create(Component, {
23 value: snapManager 23 value: snapManager
24 }, 24 },
25 25
26 drawUtils: {
27 value: drawUtils
28 },
29
26 currentStage: { 30 currentStage: {
27 value: null 31 value: null
28 }, 32 },
@@ -129,19 +133,47 @@ exports.StageDeps = Montage.create(Component, {
129 viewUtils.setRootElement(this.currentStage.parentNode); 133 viewUtils.setRootElement(this.currentStage.parentNode);
130 viewUtils.setStageElement(this.currentStage); 134 viewUtils.setStageElement(this.currentStage);
131 135
132 drawUtils.setDrawingSurfaceElement(this.stage.canvas);
133 drawUtils.setSourceSpaceElement( this.currentStage );
134 drawUtils.setWorkingPlane( workingPlane );
135 drawUtils.viewUtils = viewUtils; 136 drawUtils.viewUtils = viewUtils;
136 drawUtils.snapManager = snapManager; 137 drawUtils.snapManager = snapManager;
137 drawUtils.ElementPlanes = ElementPlanes; 138 drawUtils.ElementPlanes = ElementPlanes;
138 139
140 snapManager._isCacheInvalid=true;
141
142 snapManager.setupDragPlaneFromPlane ( workingPlane );
143
144 DrawingToolBase.stage = this.currentStage;
145 DrawingToolBase.stageComponent = this.stage;
146
147 drawUtils.initializeFromDocument();
148 }
149 },
150
151 reinitializeForSwitchDocument: {
152 value: function() {
153