aboutsummaryrefslogtreecommitdiff
path: root/js/stage
diff options
context:
space:
mode:
authorValerio Virgillito2012-05-24 11:28:27 -0700
committerValerio Virgillito2012-05-24 11:28:27 -0700
commita8eb5c65a21af3bf8d8b8eb3e65b494b8bd9bc01 (patch)
treef6f2e044c646ea2749fafc29f1a1c3fabd2825ea /js/stage
parent0ca1910df1c78116139664bf39a95cf0ec7c8dc8 (diff)
parentf801708f83aadfc688e69a244eb7cbaeca5d5e8d (diff)
downloadninja-a8eb5c65a21af3bf8d8b8eb3e65b494b8bd9bc01.tar.gz
Merge pull request #254 from mqg734/Dom-Architecture
Updates to stage code for handling multiple document workflow.
Diffstat (limited to 'js/stage')
-rwxr-xr-xjs/stage/layout.js6
-rwxr-xr-xjs/stage/stage-deps.js46
-rwxr-xr-xjs/stage/stage.reel/stage.js95
3 files changed, 58 insertions, 89 deletions
diff --git a/js/stage/layout.js b/js/stage/layout.js
index 9c5e2167..71959f86 100755
--- a/js/stage/layout.js
+++ b/js/stage/layout.js
@@ -64,10 +64,6 @@ exports.Layout = Montage.create(Component, {
64 if(this.application.ninja.documentController.activeDocument.currentView === "design") { 64 if(this.application.ninja.documentController.activeDocument.currentView === "design") {
65 this.elementsToDraw = this.application.ninja.documentController.activeDocument.documentRoot.childNodes; 65 this.elementsToDraw = this.application.ninja.documentController.activeDocument.documentRoot.childNodes;
66 } 66 }
67
68 // Draw the elements and the 3d info
69 this.draw();
70 this.draw3DInfo(false);
71 } 67 }
72 }, 68 },
73 69
@@ -89,7 +85,7 @@ exports.Layout = Montage.create(Component, {
89 85
90 if(this.application.ninja.documentController.activeDocument.currentView === "design"){ 86 if(this.application.ninja.documentController.activeDocument.currentView === "design"){
91 // Make an array copy of the line node list which is not an array like object 87 // Make an array copy of the line node list which is not an array like object
92 this.domTree = Array.prototype.slice.call(this.application.ninja.documentController.activeDocument._liveNodeList, 0); 88 this.domTree = this.application.ninja.currentDocument.model.views.design.getLiveNodeList(true);
93 // Index of the current container 89 // Index of the current container
94 containerIndex = this.domTree.indexOf(this.application.ninja.currentSelectedContainer); 90 containerIndex = this.domTree.indexOf(this.application.ninja.currentSelectedContainer);
95 91
diff --git a/js/stage/stage-deps.js b/js/stage/stage-deps.js
index 0d53696b..896d4a5b 100755
--- a/js/stage/stage-deps.js
+++ b/js/stage/stage-deps.js
@@ -26,38 +26,10 @@ exports.StageDeps = Montage.create(Component, {
26 value: drawUtils 26 value: drawUtils
27 }, 27 },
28 28
29 _userContentLeft: {
30 value: null
31 },
32
33 userContentLeft: {
34 get: function() { return this._userContentLeft; },
35 set: function(value) {
36 if(value != null) {
37 viewUtils.setUserContentLeft(value);
38 }
39 }
40 },
41
42 _userContentTop: {
43 value: null
44 },
45
46 userContentTop: {
47 get: function() { return this._userContentTop; },
48 set: function(value) {
49 if(value != null) {
50 viewUtils.setUserContentTop(value);
51 }
52 }
53 },
54
55 deserializedFromTemplate: { 29 deserializedFromTemplate: {
56 value: function() { 30 value: function() {
57 31
58 this.eventManager.addEventListener("appLoaded", this, false); 32 this.eventManager.addEventListener("appLoaded", this, false);
59 this.eventManager.addEventListener("openDocument", this, false);
60 this.eventManager.addEventListener("switchDocument", this, false);
61 33
62 // Initialize Deps 34 // Initialize Deps
63 // HACK 35 // HACK
@@ -76,19 +48,6 @@ exports.StageDeps = Montage.create(Component, {
76 48
77 handleAppLoaded: { 49 handleAppLoaded: {
78 value: function() { 50 value: function() {
79
80 Object.defineBinding(this, "userContentLeft", {
81 boundObject: this.stage,
82 boundObjectPropertyPath: "_userContentLeft",
83 oneway: true
84 });
85
86 Object.defineBinding(this, "userContentTop", {
87 boundObject: this.stage,
88 boundObjectPropertyPath: "_userContentTop",
89 oneway: true
90 });
91
92 // Setup the snap manager pointer to the app model 51 // Setup the snap manager pointer to the app model
93 snapManager.appModel = this.application.ninja.appModel; 52 snapManager.appModel = this.application.ninja.appModel;
94 // bind the snap properties to the snap manager 53 // bind the snap properties to the snap manager
@@ -105,7 +64,7 @@ exports.StageDeps = Montage.create(Component, {
105 64
106 workingPlane = [0,0,1,0]; 65 workingPlane = [0,0,1,0];
107 66
108 snapManager.reload2DCache(); 67 snapManager._isCacheInvalid = true;
109 snapManager.setupDragPlaneFromPlane (workingPlane); 68 snapManager.setupDragPlaneFromPlane (workingPlane);
110 69
111 drawUtils.initializeFromDocument(); 70 drawUtils.initializeFromDocument();
@@ -116,9 +75,8 @@ exports.StageDeps = Montage.create(Component, {
116 value: function(){ 75 value: function(){
117 workingPlane = [0,0,1,0]; 76 workingPlane = [0,0,1,0];
118 77
78 snapManager._isCacheInvalid = true;
119 snapManager.setupDragPlaneFromPlane (workingPlane); 79 snapManager.setupDragPlaneFromPlane (workingPlane);
120 snapManager.reload2DCache();
121
122 80
123 drawUtils.initializeFromDocument(); 81 drawUtils.initializeFromDocument();
124 } 82 }
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index 69cfa7ba..6d421e4b 100755
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -117,9 +117,6 @@ exports.Stage = Montage.create(Component, {
117 _userContentTop: { value: 0 }, 117 _userContentTop: { value: 0 },
118 _userContentBorder: { value: 0 }, 118 _userContentBorder: { value: 0 },
119 119
120 _maxHorizontalScroll: { value: 0 },
121 _maxVerticalScroll: { value: 0 },
122
123 viewport: { 120 viewport: {
124 get: function () { return this._viewport; }, 121 get: function () { return this._viewport; },
125 set: function(value) { this._viewport = value; } 122 set: function(value) { this._viewport = value; }
@@ -235,14 +232,6 @@ exports.Stage = Montage.create(Component, {
235 this._context = this._canvas.getContext("2d"); 232 this._context = this._canvas.getContext("2d");
236 this._drawingContext= this._drawingCanvas.getContext("2d"); 233 this._drawingContext= this._drawingCanvas.getContext("2d");
237 234
238 this._scrollLeft = this._iframeContainer.scrollLeft;
239 this._scrollTop = this._iframeContainer.scrollTop;
240 this._userContentLeft = this._documentOffsetLeft - this._scrollLeft + this._userContentBorder;
241 this._userContentTop = this._documentOffsetTop - this._scrollTop + this._userContentBorder;
242
243 // TODO: Fix the mouse wheel scroll
244 // this._canvas.addEventListener("mousewheel", this, false);
245
246 // Setup event listeners 235 // Setup event listeners
247 this._drawingCanvas.addEventListener("mousedown", this, false); 236 this._drawingCanvas.addEventListener("mousedown", this, false);
248 this._drawingCanvas.addEventListener("mouseup", this, false); 237 this._drawingCanvas.addEventListener("mouseup", this, false);
@@ -256,6 +245,7 @@ exports.Stage = Montage.create(Component, {
256 245
257 246
258 this.eventManager.addEventListener( "openDocument", this, false); 247 this.eventManager.addEventListener( "openDocument", this, false);
248 this.eventManager.addEventListener( "switchDocument", this, false);
259 this.eventManager.addEventListener( "enableStageMove", this, false); 249 this.eventManager.addEventListener( "enableStageMove", this, false);
260 this.eventManager.addEventListener( "disableStageMove", this, false); 250 this.eventManager.addEventListener( "disableStageMove", this, false);
261 251
@@ -269,30 +259,66 @@ exports.Stage = Montage.create(Component, {
269 // Event details will contain the active document prior to opening a new one 259 // Event details will contain the active document prior to opening a new one
270 handleOpenDocument: { 260 handleOpenDocument: {
271 value: function(evt) { 261 value: function(evt) {
262 this.initWithDocument();
263 }
264 },
265
266 handleSwitchDocument: {
267 value: function(evt) {
268 this.initWithDocument(true);
269 }
270 },
271
272 initWithDocument: {
273 value: function(didSwitch) {
274 var designView = this.application.ninja.currentDocument.model.views.design;
275
272 this.hideCanvas(false); 276 this.hideCanvas(false);
273 277
274 // Recalculate the canvas sizes because of splitter resizing 278 // Recalculate the canvas sizes because of splitter resizing
275 this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this.element.offsetWidth - 11 ; 279 this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this.element.offsetWidth - 11 ;
276 this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this.element.offsetHeight - 11; 280 this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this.element.offsetHeight - 11;
277 281
282 designView.iframe.contentWindow.addEventListener("scroll", this, false);
283
284 this.addPropertyChangeListener("appModel.show3dGrid", this, false);
285
286 this._userPaddingLeft = 0;
287 this._userPaddingTop = 0;
288
289 this._documentOffsetLeft = 0;
290 this._documentOffsetTop = 0;
278 291
279 this.userContentBorder = 0; 292 this._userContentLeft = 0;
293 this._userContentTop = 0;
280 294
281 this._scrollLeft = 0; 295 this._scrollLeft = 0;
282 this._scrollTop = 0; 296 this._scrollTop = 0;
283 this._userContentLeft = this._documentOffsetLeft;
284 this._userContentTop = this._documentOffsetTop;
285 297
286 this._maxHorizontalScroll = this.application.ninja.currentDocument.documentRoot.scrollWidth - this._canvas.width - 11; 298 this.stageDeps.handleOpenDocument();
287 this._maxVerticalScroll = this.application.ninja.currentDocument.documentRoot.scrollHeight - this._canvas.height - 11; 299 this.layout.handleOpenDocument();
288 this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addEventListener("scroll", this, false);
289 300
290 // TODO - We will need to modify this once we support switching between multiple documents 301 if(designView._template) {
291 this.application.ninja.toolsData.selectedToolInstance._configure(true); 302 var initialLeft = parseInt((this.canvas.width - designView._template.size.width)/2);
303 var initialTop = parseInt((this.canvas.height - designView._template.size.height)/2);
304 if(initialLeft > this.documentOffsetLeft) {
305 this.userPaddingLeft = -initialLeft;
306 }
307 if(initialTop > this.documentOffsetTop) {
308 this.userPaddingTop = -initialTop;
309 }
310 }
292 311
293 this.addPropertyChangeListener("appModel.show3dGrid", this, false); 312 if(didSwitch) {</