diff options
author | Kruti Shah | 2012-07-20 11:38:57 -0700 |
---|---|---|
committer | Kruti Shah | 2012-07-20 11:38:57 -0700 |
commit | 4436c04c81e0f372b7e03416a2515630de8c72c6 (patch) | |
tree | edfbd366df9d7e7514425561a817fc2c67f398d9 /js/stage/stage.reel/stage.js | |
parent | 5741fbc0a2eb1a43017b76406056bc98cdf00297 (diff) | |
parent | 936fbd6d76d35e3f9574983682c266de6dce55f7 (diff) | |
download | ninja-4436c04c81e0f372b7e03416a2515630de8c72c6.tar.gz |
Merge branch 'refs/heads/TimelineUberJD' into Timeline-local-kruti
Diffstat (limited to 'js/stage/stage.reel/stage.js')
-rwxr-xr-x | js/stage/stage.reel/stage.js | 352 |
1 files changed, 207 insertions, 145 deletions
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js index 7c587989..b7235d19 100755 --- a/js/stage/stage.reel/stage.js +++ b/js/stage/stage.reel/stage.js | |||
@@ -29,10 +29,10 @@ ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE | |||
29 | POSSIBILITY OF SUCH DAMAGE. | 29 | POSSIBILITY OF SUCH DAMAGE. |
30 | </copyright> */ | 30 | </copyright> */ |
31 | 31 | ||
32 | var Montage = require("montage/core/core").Montage, | 32 | var Montage = require("montage/core/core").Montage, |
33 | Component = require("montage/ui/component").Component, | 33 | Component = require("montage/ui/component").Component, |
34 | drawUtils = require("js/helper-classes/3D/draw-utils").DrawUtils, | 34 | drawUtils = require("js/helper-classes/3D/draw-utils").DrawUtils, |
35 | vecUtils = require("js/helper-classes/3D/vec-utils").VecUtils; | 35 | vecUtils = require("js/helper-classes/3D/vec-utils").VecUtils; |
36 | 36 | ||
37 | exports.Stage = Montage.create(Component, { | 37 | exports.Stage = Montage.create(Component, { |
38 | 38 | ||
@@ -46,8 +46,20 @@ exports.Stage = Montage.create(Component, { | |||
46 | drawNow: { value : false }, | 46 | drawNow: { value : false }, |
47 | switchedFromCodeDoc: { value : false }, | 47 | switchedFromCodeDoc: { value : false }, |
48 | 48 | ||
49 | drawLayout: { value : false }, | ||
50 | updatePlanes: { value : false }, | ||
51 | draw3DInfo: { value : false }, | ||
52 | |||
49 | // TO REVIEW | 53 | // TO REVIEW |
50 | zoomFactor: {value : 1 }, | 54 | zoomFactor: { |
55 | get: function() { | ||
56 | if (this._viewport && this._viewport.style && this._viewport.style.zoom) { | ||
57 | return Number(this._viewport.style.zoom); | ||
58 | } else { | ||
59 | return 1; | ||
60 | } | ||
61 | } | ||
62 | }, | ||
51 | 63 | ||
52 | _canvasSelectionPrefs: { value: { "thickness" : 1.0, "color" : "#46a1ff" } }, | 64 | _canvasSelectionPrefs: { value: { "thickness" : 1.0, "color" : "#46a1ff" } }, |
53 | _canvasDrawingPrefs: { value: { "thickness" : 1.0, "color" : "#000" } }, | 65 | _canvasDrawingPrefs: { value: { "thickness" : 1.0, "color" : "#000" } }, |
@@ -85,7 +97,21 @@ exports.Stage = Montage.create(Component, { | |||
85 | set: function(value) { | 97 | set: function(value) { |
86 | this._resizeCanvases = value; | 98 | this._resizeCanvases = value; |
87 | if(value) { | 99 | if(value) { |
88 | this.needsDraw = true; | 100 | // TODO GET THE SCROLL SIZE FROM THE CSS -- 11 px |
101 | this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this._gridCanvas.width = this.bindingView.width = this.element.offsetWidth - 11; | ||
102 | this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this._gridCanvas.height = this.bindingView.height = this.element.offsetHeight - 11;// - 26 - 26; | ||
103 | |||
104 | if(this.currentDocument) { | ||
105 | if(this.currentDocument.currentView === "design") { | ||
106 | this.drawLayout = true; | ||
107 | this.updatePlanes = true; | ||
108 | this.draw3DInfo = true; | ||
109 | this.needsDrawSelection = true; | ||
110 | } | ||
111 | if(this.currentDocument.model && this.currentDocument.model.documentRoot) { | ||
112 | this.currentDocument.model.documentRoot.elementModel.setProperty("offsetCache", false); | ||
113 | } | ||
114 | } | ||
89 | } | 115 | } |
90 | } | 116 | } |
91 | }, | 117 | }, |
@@ -99,6 +125,44 @@ exports.Stage = Montage.create(Component, { | |||
99 | set: function(value) { | 125 | set: function(value) { |
100 | this._updatedStage = value; | 126 | this._updatedStage = value; |
101 | if(value) { | 127 | if(value) { |
128 | if(this.currentDocument) { | ||
129 | if(this.currentDocument.currentView === "design") { | ||
130 | this.drawLayout = true; | ||
131 | this.updatePlanes = true; | ||
132 | this.draw3DInfo = true; | ||
133 | this.needsDrawSelection = true; | ||
134 | } | ||
135 | if(this.currentDocument.model && this.currentDocument.model.documentRoot) { | ||
136 | this.currentDocument.model.documentRoot.elementModel.setProperty("offsetCache", false); | ||
137 | } | ||
138 | } | ||
139 | } | ||
140 | } | ||
141 | }, | ||
142 | |||
143 | _needsDrawSelection: { value: false }, | ||
144 | |||
145 | needsDrawSelection: { | ||
146 | get: function() { | ||
147 | return this._needsDrawSelection; | ||
148 | }, | ||
149 | set: function(value) { | ||
150 | this._needsDrawSelection = value; | ||
151 | if(value) { | ||
152 | this.needsDraw = true; | ||
153 | } | ||
154 | } | ||
155 | }, | ||
156 | |||
157 | _needsDrawTool: { value: null }, | ||
158 | |||
159 | needsDrawTool: { | ||
160 | get: function() { | ||
161 | return this._needsDrawTool; | ||
162 | }, | ||
163 | set: function(value) { | ||
164 | this._needsDrawTool = value; | ||
165 | if(value) { | ||
102 | this.needsDraw = true; | 166 | this.needsDraw = true; |
103 | } | 167 | } |
104 | } | 168 | } |
@@ -346,20 +410,55 @@ exports.Stage = Montage.create(Component, { | |||
346 | 410 | ||
347 | willDraw: { | 411 | willDraw: { |
348 | value: function() { | 412 | value: function() { |
349 | if(this.resizeCanvases) { | 413 | if(this._needsDrawTool) { |
350 | // TODO GET THE SCROLL SIZE FROM THE CSS -- 11 px | 414 | // console.log("drawTool"); |
351 | this._canvas.width = this._layoutCanvas.width = this._drawingCanvas.width = this._gridCanvas.width = this.bindingView.width = this.element.offsetWidth - 11; | 415 | this.application.ninja.toolsData.selectedToolInstance.HandleMouseMove(this._needsDrawTool); |
352 | this._canvas.height = this._layoutCanvas.height = this._drawingCanvas.height = this._gridCanvas.height = this.bindingView.height = this.element.offsetHeight - 11;// - 26 - 26; | 416 | this.needsDrawTool = null; |
353 | // Hack for now until a full component | 417 | } |
354 | this.layout.draw(); | 418 | } |
355 | if(this.currentDocument && (this.currentDocument.currentView === "design")) { | 419 | }, |
356 | this.layout.draw3DInfo(true); | 420 | |
421 | draw: { | ||
422 | value: function() { | ||
423 | if(!this.currentDocument) return; | ||
424 | |||
425 | if(this.draw3DInfo) { | ||
426 | // console.log("draw3DInfo"); | ||
427 | if(this.updatePlanes) { | ||
428 | // console.log("updatePlanes"); | ||
429 | drawUtils.updatePlanes(); | ||
430 | this.stageDeps.snapManager._isCacheInvalid = true; | ||
431 | this.updatePlanes = false; | ||
432 | } | ||
433 | if(this.appModel.show3dGrid) { | ||
434 | // console.log("show3dGrid"); | ||
435 | this.stageDeps.snapManager.updateWorkingPlaneFromView(); | ||
357 | } | 436 | } |
358 | } else if(this.updatedStage) { | 437 | // console.log("drawWorkingPlane"); |
438 | drawUtils.drawWorkingPlane(); | ||
439 | this.draw3DInfo = false; | ||
440 | } | ||
441 | if(this.drawLayout) { | ||
442 | this.layout.clearCanvas(); | ||
443 | // console.log("drawLayout"); | ||
359 | this.layout.draw(); | 444 | this.layout.draw(); |
360 | this.layout.draw3DInfo(true); | 445 | this.drawLayout = false; |
446 | } | ||
447 | |||
448 | if(this._needsDrawSelection) { | ||
449 | this.clearCanvas(); | ||
450 | if(this.currentDocument.model.domContainer !== this.currentDocument.model.documentRoot) { | ||
451 | this.drawDomContainer(this.currentDocument.model.domContainer); | ||
452 | } | ||
453 | //TODO Set this variable in the needs draw so that it does not have to be calculated again for each draw for selection change | ||
454 | if(this.application.ninja.selectedElements.length) { | ||
455 | drawUtils.drawSelectionBounds(this.application.ninja.selectedElements, this.showSelectionBounds); | ||
456 | } | ||
457 | NJevent("selectionDrawn"); | ||
458 | this.needsDrawSelection = false; | ||
361 | } | 459 | } |
362 | } | 460 | } |
461 | |||
363 | }, | 462 | }, |
364 | 463 | ||
365 | didDraw: { | 464 | didDraw: { |
@@ -568,7 +667,7 @@ exports.Stage = Montage.create(Component, { | |||
568 | this._clickPoint.y = point.y; // event.layerY; | 667 | this._clickPoint.y = point.y; // event.layerY; |
569 | 668 | ||
570 | this.enableMouseInOut(); | 669 | this.enableMouseInOut(); |
571 | 670 | ||
572 | this.application.ninja.toolsData.selectedToolInstance.downPoint.x = point.x; | 671 | this.application.ninja.toolsData.selectedToolInstance.downPoint.x = point.x; |
573 | this.application.ninja.toolsData.selectedToolInstance.downPoint.y = point.y; | 672 | this.application.ninja.toolsData.selectedToolInstance.downPoint.y = point.y; |
574 | this.application.ninja.toolsData.selectedToolInstance.HandleLeftButtonDown(event); | 673 | this.application.ninja.toolsData.selectedToolInstance.HandleLeftButtonDown(event); |
@@ -630,7 +729,9 @@ exports.Stage = Montage.create(Component, { | |||
630 | 729 | ||
631 | handleMousemove: { | 730 | handleMousemove: { |
632 | value: function(event) { | 731 | value: function(event) { |
633 | this.application.ninja.toolsData.selectedToolInstance.HandleMouseMove(event); | 732 | // this.application.ninja.toolsData.selectedToolInstance.HandleMouseMove(event); |
733 | // Set a flag here, and tell the tool to handle mouse move in our draw cycle | ||
734 | this.needsDrawTool = event; | ||
634 | } | 735 | } |
635 | }, | 736 | }, |
636 | 737 | ||
@@ -653,25 +754,34 @@ exports.Stage = Montage.create(Component, { | |||
653 | 754 | ||
654 | handleSelectionChange: { | 755 | handleSelectionChange: { |
655 | value: function(event) { | 756 | value: function(event) { |
656 | // TODO - this is a hack for now because some tools depend on selectionDrawn event for some logic | 757 | this.showSelectionBounds = true; |
758 | this.needsDrawSelection = true; | ||
759 | this.drawLayout = true; | ||
760 | this.layout.handleSelectionChange(event); | ||
761 | // TODO - Some tools currently depend on selectionDrawn event at this point, so force a draw here | ||
657 | if(this.drawNow) { | 762 | if(this.drawNow) { |
658 | this.draw(); | 763 | this.draw(); |
659 | this.drawNow = false; | 764 | this.drawNow = false; |
660 | } else { | ||
661 | this.needsDraw = true; | ||
662 | } | 765 | } |
663 | } | 766 | } |
664 | }, | 767 | }, |
665 | 768 | ||
666 | handleElementCh |