aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
Diffstat (limited to 'js')
-rwxr-xr-xjs/document/html-document.js12
-rwxr-xr-xjs/stage/layout.js71
-rwxr-xr-xjs/stage/stage.reel/stage.js2
3 files changed, 45 insertions, 40 deletions
diff --git a/js/document/html-document.js b/js/document/html-document.js
index 9a7755e6..b13dcc1e 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -23,6 +23,7 @@ exports.HTMLDocument = Montage.create(TextDocument, {
23 23
24 _document: { value: null, enumerable: false }, 24 _document: { value: null, enumerable: false },
25 _documentRoot: { value: null, enumerable: false }, 25 _documentRoot: { value: null, enumerable: false },
26 _liveNodeList: { value: null, enumarable: false },
26 _stageBG: { value: null, enumerable: false }, 27 _stageBG: { value: null, enumerable: false },
27 _window: { value: null, enumerable: false }, 28 _window: { value: null, enumerable: false },
28 _styles: { value: null, enumerable: false }, 29 _styles: { value: null, enumerable: false },
@@ -396,7 +397,16 @@ exports.HTMLDocument = Montage.create(TextDocument, {
396 // Adding a handler for the main user document reel to finish loading. 397 // Adding a handler for the main user document reel to finish loading.
397 this._document.body.addEventListener("userTemplateDidLoad", this.userTemplateDidLoad.bind(this), false); 398 this._document.body.addEventListener("userTemplateDidLoad", this.userTemplateDidLoad.bind(this), false);
398 399
399 400 // Live node list of the current loaded document
401 this._liveNodeList = this.documentRoot.getElementsByTagName('*');
402
403 // TODO Move this to the appropriate location
404 var len = this._liveNodeList.length;
405
406 for(var i = 0; i < len; i++) {
407 NJUtils.makeElementModel2(this._liveNodeList[i]);
408 }
409
400 /* this.iframe.contentWindow.document.addEventListener('DOMSubtreeModified', function (e) { */ //TODO: Remove events upon loading once 410 /* this.iframe.contentWindow.document.addEventListener('DOMSubtreeModified', function (e) { */ //TODO: Remove events upon loading once
401 411
402 //TODO: When written, the best way to initialize the document is to listen for the DOM tree being modified 412 //TODO: When written, the best way to initialize the document is to listen for the DOM tree being modified
diff --git a/js/stage/layout.js b/js/stage/layout.js
index 56bb70bf..a94dd10c 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,13 @@ exports.Layout = Montage.create(Component, {
96 98
97 handleSelectionChange: { 99 handleSelectionChange: {
98 value: function(event) { 100 value: function(event) {
99 this.elementsToDraw = []; 101 // Make an array copy of the line node list which is not an array like object
102 this.domTree = Array.prototype.slice.call(this.application.ninja.documentController.activeDocument._liveNodeList, 0);
103
104 // Clear the elements to draw
105 this.elementsToDraw.length = 0;
100 106
107 // Draw the non selected elements
101 if(!event.detail.isDocument) { 108 if(!event.detail.isDocument) {
102 var tmp = event.detail.elements.map(function(element){ return element._element}); 109 var tmp = event.detail.elements.map(function(element){ return element._element});
103 110
@@ -111,13 +118,15 @@ exports.Layout = Montage.create(Component, {
111 this.draw(); // Not a reel yet :) 118 this.draw(); // Not a reel yet :)
112 this.draw3DInfo(false); 119 this.draw3DInfo(false);
113 120
114 121 // Clear the domTree copy
122 this.domTree.length = 0;
115 } 123 }
116 }, 124 },
117 125
118 draw: { 126 draw: {
119 value: function() { 127 value: function() {
120 this.clearCanvas(); 128 this.clearCanvas();
129
121 var els = this.elementsToDraw.length; 130 var els = this.elementsToDraw.length;
122 for(var i = 0, el; i < els; i++){ 131 for(var i = 0, el; i < els; i++){
123 this.drawTagOutline(this.elementsToDraw[i]); 132 this.drawTagOutline(this.elementsToDraw[i]);
@@ -127,15 +136,15 @@ exports.Layout = Montage.create(Component, {
127 136
128 draw3DInfo: { 137 draw3DInfo: {
129 value: function(updatePlanes) { 138 value: function(updatePlanes) {
130 if(updatePlanes) 139 if(updatePlanes) {
131 {
132 drawUtils.updatePlanes(); 140 drawUtils.updatePlanes();
133 } 141 }
134 if(this.stage.appModel.show3dGrid) 142
135 { 143 if(this.stage.appModel.show3dGrid) {
136 this.application.ninja.stage.stageDeps.snapManager.updateWorkingPlaneFromView(); 144 this.application.ninja.stage.stageDeps.snapManager.updateWorkingPlaneFromView();
137 drawUtils.drawWorkingPlane(); 145 drawUtils.drawWorkingPlane();
138 } 146 }
147
139 drawUtils.draw3DCompass(); 148 drawUtils.draw3DCompass();
140 } 149 }
141 }, 150 },
@@ -152,29 +161,22 @@ exports.Layout = Montage.create(Component, {
152 if(!item) return; 161 if(!item) return;
153 162
154 // TODO Bind the layoutview mode to the current document 163 // TODO Bind the layoutview mode to the current document
155// var mode = this.application.ninja.currentDocument.layoutMode; 164 // var mode = this.application.ninja.currentDocument.layoutMode;
156 165
157 if(this.layoutView === "layoutOff") return; 166 if(this.layoutView === "layoutOff") return;
158 167
159 // Don't draw outlines for shapes. 168 // Don't draw outlines for shapes.
160 // TODO Use the element mediator/controller/model to see if its a shape 169 // TODO Use the element mediator/controller/model to see if its a shape
161 /* 170 // if (utilsModule.utils.isElementAShape(item)) return;
162 if (utilsModule.utils.isElementAShape(item))
163 {
164 return;
165 }
166 */
167 171
168 /** 172
169 * New Drawing layout code using 3D calculations 173 // draw the layout
170 */
171 viewUtils.setViewportObj( item ); 174 viewUtils.setViewportObj( item );
172 var bounds3D = viewUtils.getElementViewBounds3D( item ); 175 var bounds3D = viewUtils.getElementViewBounds3D( item );
173 var tmpMat = viewUtils.getLocalToGlobalMatrix( item ); 176 var tmpMat = viewUtils.getLocalToGlobalMatrix( item );
174 177
175 var zoomFactor = 1; 178 var zoomFactor = 1;
176 if (this.stage._viewport.style && this.stage._viewport.style.zoom) 179 if (this.stage._viewport.style && this.stage._viewport.style.zoom) {
177 {
178 zoomFactor = Number(this.stage._viewport.style.zoom); 180 zoomFactor = Number(this.stage._viewport.style.zoom);
179 } 181 }
180 182
@@ -185,8 +187,7 @@ exports.Layout = Montage.create(Component, {
185 var localPt = bounds3D[j]; 187 var localPt = bounds3D[j];
186 var tmpPt = viewUtils.localToGlobal2(localPt, tmpMat); 188 var tmpPt = viewUtils.localToGlobal2(localPt, tmpMat);
187 189
188 if(zoomFactor !== 1) 190 if(zoomFactor !== 1) {
189 {
190 tmpPt = vecUtils.vecScale(3, tmpPt, zoomFactor); 191 tmpPt = vecUtils.vecScale(3, tmpPt, zoomFactor);
191 192
192 tmpPt[0] += sSL*(zoomFactor - 1); 193 tmpPt[0] += sSL*(zoomFactor - 1);
@@ -255,14 +256,6 @@ exports.Layout = Montage.create(Component, {
255 value: function(elements) { 256 value: function(elements) {
256 this.clearCanvas(); 257 this.clearCanvas();
257 this.WalkDOM(this.application.ninja.currentDocument.documentRoot, elements); 258 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 } 259 }
267 }, 260 },
268 261
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index 44e14827..6536a45d 100755
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -258,6 +258,8 @@ exports.Stage = Montage.create(Component, {
258 this.application.ninja.toolsData.selectedToolInstance._configure(true); 258 this.application.ninja.toolsData.selectedToolInstance._configure(true);
259 259
260 this.addEventListener("change@appModel.show3dGrid", this, false); 260 this.addEventListener("change@appModel.show3dGrid", this, false);
261
262 this.layout.handleOpenDocument();
261 } 263 }
262 }, 264 },
263 265