aboutsummaryrefslogtreecommitdiff
path: root/js/stage
diff options
context:
space:
mode:
Diffstat (limited to 'js/stage')
-rwxr-xr-xjs/stage/layout.js41
-rwxr-xr-xjs/stage/stage-view.reel/stage-view.js17
-rwxr-xr-xjs/stage/stage.reel/stage.html7
-rwxr-xr-xjs/stage/stage.reel/stage.js41
4 files changed, 77 insertions, 29 deletions
<
diff --git a/js/stage/layout.js b/js/stage/layout.js
index de4c67c1..6be2df1d 100755
--- a/js/stage/layout.js
+++ b/js/stage/layout.js
@@ -64,8 +64,10 @@ exports.Layout = Montage.create(Component, {
64 64
65 handleOpenDocument: { 65 handleOpenDocument: {
66 value: function() { 66 value: function() {
67 // Initial elements to draw is the entire node list 67 // Initial elements to draw are the childrens of the root element
68 this.elementsToDraw = this.application.ninja.documentController.activeDocument._liveNodeList; 68 if(this.application.ninja.documentController.activeDocument.currentView === "design") {
69 this.elementsToDraw = this.application.ninja.documentController.activeDocument.documentRoot.childNodes;
70 }
69 71
70 // Draw the elements and the 3d info 72 // Draw the elements and the 3d info
71 this.draw(); 73 this.draw();
@@ -73,21 +75,6 @@ exports.Layout = Montage.create(Component, {
73 } 75 }
74 }, 76 },
75 77
76 // No need to keep track of the added elements. We now have a live node list of the dom
77 handleElementAdded: {
78 value: function(event) {
79 // this.domTree.push(event.detail);
80 // this.draw();
81 // this.draw3DInfo(false);
82 }
83 },
84
85 handleElementDeleted: {
86 value: function(event) {
87 //this.domTree.splice(this.domTree.indexOf(event.detail), 1);
88 }
89 },
90
91 // Redraw stage only once after all deletion is completed 78 // Redraw stage only once after all deletion is completed
92 handleDeleteSelection: { 79 handleDeleteSelection: {
93 value: function(event) { 80 value: function(event) {
@@ -98,14 +85,26 @@ exports.Layout = Montage.create(Component, {
98 85
99 handleSelectionChange: { 86 handleSelectionChange: {
100 value: function(event) { 87 value: function(event) {
88 var containerIndex;
101 89
102 if(this.application.ninja.documentController.activeDocument === null){ 90 if(this.application.ninja.documentController.activeDocument === null){
103 return; 91 return;
104 } 92 }
105 93
106 // Make an array copy of the line node list which is not an array like object 94 if(this.application.ninja.documentController.activeDocument.currentView === "design"){
107 this.domTree = Array.prototype.slice.call(this.application.ninja.documentController.activeDocument._liveNodeList, 0); 95 // Make an array copy of the line node list which is not an array like object
96 this.domTree = Array.prototype.slice.call(this.application.ninja.documentController.activeDocument._liveNodeList, 0);
97 // Index of the current container
98 containerIndex = this.domTree.indexOf(this.application.ninja.currentSelectedContainer);
108 99
100 if(containerIndex < 0) {
101 // Stage is the container.
102 this.domTree = Array.prototype.slice.call(this.application.ninja.currentSelectedContainer.childNodes, 0);
103 } else {
104 // Child nodes of the container
105 this.domTree = Array.prototype.slice.call(this.domTree[containerIndex].childNodes, 0);
106 }
107 }
109 // Clear the elements to draw 108 // Clear the elements to draw
110 this.elementsToDraw.length = 0; 109 this.elementsToDraw.length = 0;
111 110
@@ -117,10 +116,10 @@ exports.Layout = Montage.create(Component, {
117 return (tmp.indexOf(value) === -1); 116 return (tmp.indexOf(value) === -1);
118 }); 117 });
119 } else { 118 } else {
120 this.elementsToDraw = this.domTree; 119 this.elementsToDraw = Array.prototype.slice.call(this.domTree, 0);
121 } 120 }
122 121
123 this.draw(); // Not a reel yet :) 122 this.draw(); // Not a reel yet
124 this.draw3DInfo(false); 123 this.draw3DInfo(false);
125 124
126 // Clear the domTree copy 125 // Clear the domTree copy
diff --git a/js/stage/stage-view.reel/stage-view.js b/js/stage/stage-view.reel/stage-view.js
index 91047e51..1f471431 100755
--- a/js/stage/stage-view.reel/stage-view.js
+++ b/js/stage/stage-view.reel/stage-view.js
@@ -125,6 +125,10 @@ exports.StageView = Montage.create(Component, {
125 125
126 this.application.ninja.documentController.activeDocument = doc; 126 this.application.ninja.documentController.activeDocument = doc;
127 127
128 if(this.application.ninja.documentController.activeDocument.currentView === "design") {
129 this.application.ninja.currentDocument = this.application.ninja.documentController.activeDocument;
130 }
131
128 this.application.ninja.stage._scrollFlag = false; // TODO HACK to prevent type error on Hide/Show Iframe 132 this.application.ninja.stage._scrollFlag = false; // TODO HACK to prevent type error on Hide/Show Iframe
129 this.application.ninja.documentController._showCurrentDocument(); 133 this.application.ninja.documentController._showCurrentDocument();
130 134
@@ -135,7 +139,6 @@ exports.StageView = Montage.create(Component, {
135 139
136 if(this.application.ninja.documentController.activeDocument.currentView === "design") { 140 if(this.application.ninja.documentController.activeDocument.currentView === "design") {
137 this.application.ninja.stage._scrollFlag = true; // TODO HACK to prevent type error on Hide/Show Iframe 141 this.application.ninja.stage._scrollFlag = true; // TODO HACK to prevent type error on Hide/Show Iframe
138 this.application.ninja.currentDocument = this.application.ninja.documentController.activeDocument;
139 142
140 //reinitialize draw-util, snapmanager and view-util 143 //reinitialize draw-util, snapmanager and view-util
141 this.application.ninja.stage.stageDeps.reinitializeForSwitchDocument(); 144 this.application.ninja.stage.stageDeps.reinitializeForSwitchDocument();
@@ -197,14 +200,18 @@ exports.StageView = Montage.create(Component, {
197 }, 200 },
198 showRulers:{ 201 showRulers:{
199 value:function(){ 202 value:function(){
200 this.application.ninja.rulerTop.style.background = "url('../images/temp/ruler-top.png')"; 203 this.application.ninja.rulerTop.style.display = "block";
201 this.application.ninja.rulerLeft.style.background = "url('../images/temp/ruler-left.png')"; 204 this.application.ninja.rulerLeft.style.display = "block";
205// this.application.ninja.rulerTop.style.background = "url('../images/temp/ruler-top.png')";
206// this.application.ninja.rulerLeft.style.background = "url('../images/temp/ruler-left.png')";
202 } 207 }
203 }, 208 },
204 hideRulers:{ 209 hideRulers:{
205 value:function(){ 210 value:function(){
206 this.application.ninja.rulerTop.style.background = "rgb(128,128,128)"; 211 this.application.ninja.rulerTop.style.display = "none";
207 this.application.ninja.rulerLeft.style.background = "rgb(128,128,128)"; 212 this.application.ninja.rulerLeft.style.display = "none";
213// this.application.ninja.rulerTop.style.background = "rgb(128,128,128)";
214// this.application.ninja.rulerLeft.style.background = "rgb(128,128,128)";
208 } 215 }
209 }, 216 },
210 217
diff --git a/js/stage/stage.reel/stage.html b/js/stage/stage.reel/stage.html
index 812e3d55..f796303c 100755
--- a/js/stage/stage.reel/stage.html
+++ b/js/stage/stage.reel/stage.html
@@ -50,6 +50,10 @@
50 "element" : {"#": "textToolObject"} 50 "element" : {"#": "textToolObject"}
51 } 51 }
52 }, 52 },
53
54 "focusManager": {
55 "object": "js/components/focus-manager.reel"
56 },
53 57
54 "owner": { 58 "owner": {
55 "module": "js/stage/stage.reel", 59 "module": "js/stage/stage.reel",
@@ -63,7 +67,8 @@
63 "stageDeps": {"@": "StageDeps1"}, 67 "stageDeps": {"@": "StageDeps1"},
64 "layout": {"@": "layout1"}, 68 "layout": {"@": "layout1"},
65 "stageView": {"@": "stageView"}, 69 "stageView": {"@": "stageView"},
66 "textTool": {"@": "textTool"} 70 "textTool": {"@": "textTool"},
71 "focusManager": {"@": "focusManager"}
67 }, 72 },
68 "bindings": { 73 "bindings": {
69 "currentDocumentStageView": { 74 "currentDocumentStageView": {
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index 4c1d046b..00b72490 100755
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -170,8 +170,7 @@ exports.Stage = Montage.create(Component, {
170 170
171 // Hack for now until a full component 171 // Hack for now until a full component
172 this.layout.draw(); 172 this.layout.draw();
173 } 173 } else if(this.updatedStage) {
174 else if(this.updatedStage) {
175 this.layout.draw(); 174 this.layout.draw();
176 this.layout.draw3DInfo(true); 175 this.layout.draw3DInfo(true);
177 } 176 }
@@ -235,6 +234,10 @@ exports.Stage = Montage.create(Component, {
235 234
236 this.hideCanvas(false); 235 this.hideCanvas(false);
237 236
237 // Recalculate the canvas sizes because of splitter resizing
238 this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this.element.offsetWidth - 11 ;
239 this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this.element.offsetHeight - 11;
240
238 this._documentRoot = this.application.ninja.currentDocument.documentRoot; 241 this._documentRoot = this.application.ninja.currentDocument.documentRoot;
239 this._viewport = this.application.ninja.currentDocument.documentRoot.parentNode; 242 this._viewport = this.application.ninja.currentDocument.documentRoot.parentNode;
240 243
@@ -319,6 +322,10 @@ exports.Stage = Montage.create(Component, {
319 322
320 handleMousedown: { 323 handleMousedown: {
321 value: function(event) { 324 value: function(event) {
325 // Call the focus manager to set focus to blur any focus'd elements
326 this.focusManager.setFocus();
327
328
322 var point; 329 var point;
323// event.preventDefault(); // commenting because HTML elements in the IDE are retaining focus 330// event.preventDefault(); // commenting because HTML elements in the IDE are retaining focus
324 // If right click set the context menu to true to prevent a mouse up. 331 // If right click set the context menu to true to prevent a mouse up.
@@ -512,6 +519,36 @@ exports.Stage = Montage.create(Component, {
512 }, 519 },
513 520
514 /** 521 /**
522 * GetSelectableElement: Returns a selectable object (direct child of current container) at clicked point
523 *
524 * @param: X,Y
525 * @return: Returns the current container if the the X,Y hits an element in the exclusion list
526 */
527 GetSelectableElement: {
528 value: function(pos) {
529 var item = this.GetElement(pos);
530 if(this.application.ninja.currentDocument.inExclusion(item) !== -1) {
531 return this.application.ninja.currentSelectedContainer;
532 }
533 var activeContainerId = this.application.ninja.currentSelectedContainer.uuid;
534 if(item.parentNode.uuid === activeContainerId) {
535 return item;
536 } else {
537 var outerElement = item.parentNode;