aboutsummaryrefslogtreecommitdiff
path: root/js/stage
diff options
context:
space:
mode:
authorValerio Virgillito2012-06-11 17:46:29 -0700
committerValerio Virgillito2012-06-11 17:46:29 -0700
commitb6c88f548c8d3756738e534418732710af733f03 (patch)
treed651ce2811019a3bccfd8be1326762cd2c601316 /js/stage
parent91123fef348ec54d89005adbc151e816856a6a18 (diff)
parent6854a72504f57903bd5de003e377f2aefb02d0da (diff)
downloadninja-b6c88f548c8d3756738e534418732710af733f03.tar.gz
Merge branch 'refs/heads/master' into montage-v10-integration
Conflicts: js/io/system/ninjalibrary.json js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js Signed-off-by: Valerio Virgillito <valerio@motorola.com>
Diffstat (limited to 'js/stage')
-rwxr-xr-xjs/stage/layout.js6
-rwxr-xr-xjs/stage/stage.reel/stage.js149
2 files changed, 130 insertions, 25 deletions
diff --git a/js/stage/layout.js b/js/stage/layout.js
index a2f81e97..28484b71 100755
--- a/js/stage/layout.js
+++ b/js/stage/layout.js
@@ -111,11 +111,11 @@ exports.Layout = Montage.create(Component, {
111 // Make an array copy of the line node list which is not an array like object 111 // Make an array copy of the line node list which is not an array like object
112 this.domTree = this.application.ninja.currentDocument.model.views.design.getLiveNodeList(true); 112 this.domTree = this.application.ninja.currentDocument.model.views.design.getLiveNodeList(true);
113 // Index of the current container 113 // Index of the current container
114 containerIndex = this.domTree.indexOf(this.application.ninja.currentSelectedContainer); 114 containerIndex = this.domTree.indexOf(this.currentDocument.model.domContainer);
115 115
116 if(containerIndex < 0) { 116 if(containerIndex < 0) {
117 // Stage is the container. 117 // Stage is the container.
118 this.domTree = Array.prototype.slice.call(this.application.ninja.currentSelectedContainer.childNodes, 0); 118 this.domTree = Array.prototype.slice.call(this.currentDocument.model.domContainer.childNodes, 0);
119 } else { 119 } else {
120 // Child nodes of the container 120 // Child nodes of the container
121 this.domTree = Array.prototype.slice.call(this.domTree[containerIndex].childNodes, 0); 121 this.domTree = Array.prototype.slice.call(this.domTree[containerIndex].childNodes, 0);
@@ -213,7 +213,7 @@ exports.Layout = Montage.create(Component, {
213 bounds3D[j] = tmpPt; 213 bounds3D[j] = tmpPt;
214 } 214 }
215 215
216 if(item.uuid === this.application.ninja.currentSelectedContainer.uuid) { 216 if(item.uuid === this.currentDocument.model.domContainer.uuid) {
217 this.ctx.save(); 217 this.ctx.save();
218 this.ctx.strokeStyle = "#C61F00"; 218 this.ctx.strokeStyle = "#C61F00";
219 219
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index 0ad004d6..129bcc33 100755
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -243,6 +243,8 @@ exports.Stage = Montage.create(Component, {
243 if(this.currentDocument && (this.currentDocument.currentView === "design")) { 243 if(this.currentDocument && (this.currentDocument.currentView === "design")) {
244 this.currentDocument.model.scrollLeft = this._scrollLeft; 244 this.currentDocument.model.scrollLeft = this._scrollLeft;
245 this.currentDocument.model.scrollTop = this._scrollTop; 245 this.currentDocument.model.scrollTop = this._scrollTop;
246 //call configure false with the old document on the selected tool to tear down down any temp. stuff
247 this.application.ninja.toolsData.selectedToolInstance._configure(false);
246 } 248 }
247 249
248 this._currentDocument = value; 250 this._currentDocument = value;
@@ -301,7 +303,7 @@ exports.Stage = Montage.create(Component, {
301 303
302 // Hack for now until a full component 304 // Hack for now until a full component
303 this.layout.draw(); 305 this.layout.draw();
304 if(this.currentDocument) { 306 if(this.currentDocument && (this.currentDocument.currentView === "design")) {
305 this.layout.draw3DInfo(true); 307 this.layout.draw3DInfo(true);
306 } 308 }
307 } else if(this.updatedStage) { 309 } else if(this.updatedStage) {
@@ -336,9 +338,6 @@ exports.Stage = Montage.create(Component, {
336 338
337 this.eventManager.addEventListener( "appMouseUp", this, false); 339 this.eventManager.addEventListener( "appMouseUp", this, false);
338 340
339
340 this.eventManager.addEventListener( "openDocument", this, false);
341 this.eventManager.addEventListener( "switchDocument", this, false);
342 this.eventManager.addEventListener( "enableStageMove", this, false); 341 this.eventManager.addEventListener( "enableStageMove", this, false);
343 this.eventManager.addEventListener( "disableStageMove", this, false); 342 this.eventManager.addEventListener( "disableStageMove", this, false);
344 343
@@ -346,19 +345,9 @@ exports.Stage = Montage.create(Component, {
346 this.eventManager.addEventListener( "elementChanging", this, false); 345 this.eventManager.addEventListener( "elementChanging", this, false);
347 this.eventManager.addEventListener( "elementChange", this, false); 346 this.eventManager.addEventListener( "elementChange", this, false);
348 347
349 } 348 this.addPropertyChangeListener("currentDocument.model.domContainer", this, true);
350 }, 349// this.addPropertyChangeListener("currentDocument.model.domContainer", this);
351
352 // Event details will contain the active document prior to opening a new one
353 handleOpenDocument: {
354 value: function(evt) {
355 this.initWithDocument();
356 }
357 },
358 350
359 handleSwitchDocument: {
360 value: function(evt) {
361 this.initWithDocument(true);
362 } 351 }
363 }, 352 },
364 353
@@ -412,7 +401,6 @@ exports.Stage = Montage.create(Component, {
412 } else { 401 } else {
413 this.centerStage(); 402 this.centerStage();
414 } 403 }
415
416 // TODO - We will need to modify this once we support switching between multiple documents 404 // TODO - We will need to modify this once we support switching between multiple documents
417 this.application.ninja.toolsData.selectedToolInstance._configure(true); 405 this.application.ninja.toolsData.selectedToolInstance._configure(true);
418 } 406 }
@@ -438,6 +426,17 @@ exports.Stage = Montage.create(Component, {
438 this.updatedStage = true; 426 this.updatedStage = true;
439 } 427 }
440 } 428 }
429 /*
430 else if(notification.currentPropertyPath === "currentDocument.model.domContainer") {
431 if()
432 }
433 */
434 }
435 },
436
437 handleWillChange: {
438 value: function(notification) {
439// console.log("stage -> container is about to change");
441 } 440 }
442 }, 441 },
443 442
@@ -704,10 +703,10 @@ exports.Stage = Montage.create(Component, {
704 if(selectable) { 703 if(selectable) {
705 704
706 if(this.currentDocument.inExclusion(element) !== -1) { 705 if(this.currentDocument.inExclusion(element) !== -1) {
707 return this.application.ninja.currentSelectedContainer; 706 return this.currentDocument.model.domContainer;
708 } 707 }
709 708
710 var activeContainerId = this.application.ninja.currentSelectedContainer.uuid; 709 var activeContainerId = this.currentDocument.model.domContainer.uuid;
711 if(element.parentNode.uuid === activeContainerId) { 710 if(element.parentNode.uuid === activeContainerId) {
712 return element; 711 return element;
713 } else { 712 } else {
@@ -751,10 +750,16 @@ exports.Stage = Montage.create(Component, {
751 750
752 draw: { 751 draw: {
753 value: function() { 752 value: function() {
753 if(!this.currentDocument) return;
754
754 this.clearCanvas(); 755 this.clearCanvas();
755 756
756 drawUtils.updatePlanes(); 757 drawUtils.updatePlanes();
757 758
759 if(this.currentDocument.model.domContainer !== this.currentDocument.model.documentRoot) {
760 this.drawDomContainer(this.currentDocument.model.domContainer);
761 }
762
758 //TODO Set this variable in the needs draw so that it does not have to be calculated again for each draw for selection change 763 //TODO Set this variable in the needs draw so that it does not have to be calculated again for each draw for selection change
759 if(this.application.ninja.selectedElements.length) { 764 if(this.application.ninja.selectedElements.length) {
760 // drawUtils.drawSelectionBounds handles the single selection case as well, 765 // drawUtils.drawSelectionBounds handles the single selection case as well,
@@ -787,9 +792,6 @@ exports.Stage = Montage.create(Component, {
787 792
788 }, 793 },
789 794
790
791
792
793 /** 795 /**
794 * draw3DSelectionRectangle -- Draws a 3D rectangle used for marquee selection 796 * draw3DSelectionRectangle -- Draws a 3D rectangle used for marquee selection
795 * Uses the _canvasDrawingPrefs for line thickness and color 797 * Uses the _canvasDrawingPrefs for line thickness and color
@@ -891,6 +893,109 @@ exports.Stage = Montage.create(Component, {
891 } 893 }
892 }, 894 },
893 895
896
897 drawDomContainer: {
898 value: function(elt) {
899
900
901 this.stageDeps.viewUtils.setViewportObj( elt );
902 var bounds3D = this.stageDeps.viewUtils.getElementViewBounds3D( elt );
903
904 // convert the local bounds to the world
905
906
907
908 var zoomFactor = 1;
909 if (this._viewport && this._viewport.style && this._viewport.style.zoom) {
910 zoomFactor = Number(this._viewport.style.zoom);
911 }
912
913 var tmpMat = this.stageDeps.viewUtils.getLocalToGlobalMatrix( elt );
914 for (var j=0; j<4; j++) {
915 var localPt = bounds3D[j];
916 var tmpPt = this.stageDeps.viewUtils.localToGlobal2(localPt, tmpMat);
917
918 if(zoomFactor !== 1) {
919 tmpPt = vecUtils.vecScale(3, tmpPt, zoomFactor);
920
921 tmpPt[0] += this._scrollLeft*(zoomFactor - 1);
922 tmpPt[1] += this._scrollTop*(zoomFactor - 1);
923 }
924 bounds3D[j] = tmpPt;
925 }
926
927 // Draw 3 outlines
928// for(var i = 0; i < 3)
929
930 this.context.save();
931 // draw it
932 this.context.strokeStyle = "#ff0000";
933 this.context.lineWidth = 1;
934
935
936 this.context.beginPath();
937
938 this.context.moveTo( bounds3D[3][0] + 0.5 , bounds3D[3][1] - 0.5 );
939
940 // This more granular approach lets us specify different gaps for the selection around the element
941 this.context.lineTo( bounds3D[0][0] - 0.5 , bounds3D[0][1] - 0.5 );
942 this.context.lineTo( bounds3D[1][0] - 0.5 , bounds3D[1][1] + 0.5 );
943 this.context.lineTo( bounds3D[2][0] + 0.5 , bounds3D[2][1] + 0.5 );
<