aboutsummaryrefslogtreecommitdiff
path: root/js/stage
diff options
context:
space:
mode:
authorArmen Kesablyan2012-05-25 11:22:58 -0700
committerArmen Kesablyan2012-05-25 11:22:58 -0700
commit81239571c538f72e398fafa5b07725bf1bbb2d5d (patch)
treed31c876f5af61565eff8c934c9e5f119696d46e0 /js/stage
parente8c4e98c24092a360eb2f637983fd104fbb67f66 (diff)
parent9c8d724dd1605ee2e5257591e0bfaad575cbc906 (diff)
downloadninja-81239571c538f72e398fafa5b07725bf1bbb2d5d.tar.gz
Merge branch 'refs/heads/dom-architecture' into binding
Diffstat (limited to 'js/stage')
-rwxr-xr-xjs/stage/layout.js12
-rwxr-xr-xjs/stage/stage-deps.js46
-rwxr-xr-xjs/stage/stage.reel/stage.js109
-rwxr-xr-xjs/stage/tool-handle.js4
4 files changed, 70 insertions, 101 deletions
diff --git a/js/stage/layout.js b/js/stage/layout.js
index 9c5e2167..460c8b4a 100755
--- a/js/stage/layout.js
+++ b/js/stage/layout.js
@@ -62,12 +62,8 @@ exports.Layout = Montage.create(Component, {
62 value: function() { 62 value: function() {
63 // Initial elements to draw are the childrens of the root element 63 // Initial elements to draw are the childrens of the root element
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.model.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
@@ -241,7 +237,7 @@ exports.Layout = Montage.create(Component, {
241 value: function() { 237 value: function() {
242 if(this.application.ninja.currentDocument) { 238 if(this.application.ninja.currentDocument) {
243 this.clearCanvas(); 239 this.clearCanvas();
244 this.WalkDOM(this.application.ninja.currentDocument.documentRoot); 240 this.WalkDOM(this.application.ninja.currentDocument.model.documentRoot);
245 241
246 //drawUtils.updatePlanes(); 242 //drawUtils.updatePlanes();
247 //if(this.application.ninja.currentDocument.draw3DGrid) drawUtils.drawWorkingPlane(); 243 //if(this.application.ninja.currentDocument.draw3DGrid) drawUtils.drawWorkingPlane();
@@ -253,7 +249,7 @@ exports.Layout = Montage.create(Component, {
253 drawElementsOutline: { 249 drawElementsOutline: {
254 value: function(elements) { 250 value: function(elements) {
255 this.clearCanvas(); 251 this.clearCanvas();
256 this.WalkDOM(this.application.ninja.currentDocument.documentRoot, elements); 252 this.WalkDOM(this.application.ninja.currentDocument.model.documentRoot, elements);
257 } 253 }
258 }, 254 },
259 255
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..c7afb95c 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; }
@@ -189,7 +186,7 @@ exports.Stage = Montage.create(Component, {
189 set: function(value) { 186 set: function(value) {
190 this._userPaddingLeft = value; 187 this._userPaddingLeft = value;
191 this._documentOffsetLeft = -value; 188 this._documentOffsetLeft = -value;
192 this.application.ninja.currentDocument.documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-left"] = -value + "px"; 189 this.application.ninja.currentDocument.model.documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-left"] = -value + "px";
193 this.userContentLeft = this._documentOffsetLeft; 190 this.userContentLeft = this._documentOffsetLeft;
194 this.updatedStage = true; 191 this.updatedStage = true;
195 } 192 }
@@ -200,7 +197,7 @@ exports.Stage = Montage.create(Component, {
200 set: function(value) { 197 set: function(value) {
201 this._userPaddingTop = value; 198 this._userPaddingTop = value;
202 this._documentOffsetTop = -value; 199 this._documentOffsetTop = -value;
203 this.application.ninja.currentDocument.documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-top"] = -value + "px"; 200 this.application.ninja.currentDocument.model.documentRoot.ownerDocument.getElementsByTagName("HTML")[0].style["padding-top"] = -value + "px";
204 this.userContentTop = this._documentOffsetTop; 201 this.userContentTop = this._documentOffsetTop;
205 this.updatedStage = true; 202 this.updatedStage = true;
206 } 203 }
@@ -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