diff options
Diffstat (limited to 'js/ninja.reel')
-rwxr-xr-x | js/ninja.reel/ninja.js | 73 |
1 files changed, 44 insertions, 29 deletions
diff --git a/js/ninja.reel/ninja.js b/js/ninja.reel/ninja.js index ca094936..9b5081dd 100755 --- a/js/ninja.reel/ninja.js +++ b/js/ninja.reel/ninja.js | |||
@@ -6,6 +6,7 @@ | |||
6 | 6 | ||
7 | var Montage = require("montage/core/core").Montage, | 7 | var Montage = require("montage/core/core").Montage, |
8 | Component = require("montage/ui/component").Component, | 8 | Component = require("montage/ui/component").Component, |
9 | UndoManager = require("montage/core/undo-manager").UndoManager, | ||
9 | AppData = require("js/data/appdata").AppData; | 10 | AppData = require("js/data/appdata").AppData; |
10 | 11 | ||
11 | var matrix = require("js/lib/math/matrix"); | 12 | var matrix = require("js/lib/math/matrix"); |
@@ -24,7 +25,7 @@ exports.Ninja = Montage.create(Component, { | |||
24 | }, | 25 | }, |
25 | 26 | ||
26 | _isResizing: { | 27 | _isResizing: { |
27 | value: false | 28 | value: null |
28 | }, | 29 | }, |
29 | _resizedHeight : { | 30 | _resizedHeight : { |
30 | value: 0 | 31 | value: 0 |
@@ -35,11 +36,18 @@ exports.Ninja = Montage.create(Component, { | |||
35 | 36 | ||
36 | height: { | 37 | height: { |
37 | get: function() { | 38 | get: function() { |
39 | if(this._height === null) { | ||
40 | var storedData = this.application.localStorage.getItem("timelinePanel"); | ||
41 | if(storedData && storedData.value) { | ||
42 | this._height = storedData.value; | ||
43 | } | ||
44 | } | ||
38 | return this._height; | 45 | return this._height; |
39 | }, | 46 | }, |
40 | set: function(val) { | 47 | set: function(val) { |
41 | if(this._height != val) { | 48 | if(this._height != val) { |
42 | this._height = val; | 49 | this._height = val; |
50 | this.application.localStorage.setItem("timelinePanel", {"version": this.version, "value": val}); | ||
43 | this.needsDraw = true; | 51 | this.needsDraw = true; |
44 | } | 52 | } |
45 | 53 | ||
@@ -55,11 +63,18 @@ exports.Ninja = Montage.create(Component, { | |||
55 | 63 | ||
56 | width: { | 64 | width: { |
57 | get: function() { | 65 | get: function() { |
66 | if(this._width === null) { | ||
67 | var storedData = this.application.localStorage.getItem("rightPanelsContainer"); | ||
68 | if(storedData && storedData.value) { | ||
69 | this._width = storedData.value; | ||
70 | } | ||
71 | } | ||
58 | return this._width; | 72 | return this._width; |
59 | }, | 73 | }, |
60 | set: function(val) { | 74 | set: function(val) { |
61 | if(this._width != val) { | 75 | if(this._width != val) { |
62 | this._width = val; | 76 | this._width = val; |
77 | this.application.localStorage.setItem("rightPanelsContainer", {"version": this.version, "value": val}); | ||
63 | this.needsDraw = true; | 78 | this.needsDraw = true; |
64 | } | 79 | } |
65 | 80 | ||
@@ -71,6 +86,8 @@ exports.Ninja = Montage.create(Component, { | |||
71 | this.isResizing = true; | 86 | this.isResizing = true; |
72 | this.height = parseInt(this.timeline.element.offsetHeight); | 87 | this.height = parseInt(this.timeline.element.offsetHeight); |
73 | this.width = parseInt(this.rightPanelContainer.offsetWidth); | 88 | this.width = parseInt(this.rightPanelContainer.offsetWidth); |
89 | this.rightPanelContainer.classList.add("disableTransition"); | ||
90 | this.timeline.element.classList.add("disableTransition"); | ||
74 | this.needsDraw = true; | 91 | this.needsDraw = true; |
75 | } | 92 | } |
76 | }, | 93 | }, |
@@ -79,7 +96,6 @@ exports.Ninja = Montage.create(Component, { | |||
79 | value:function(e) { | 96 | value:function(e) { |
80 | this._resizedHeight = e._event.dY; | 97 | this._resizedHeight = e._event.dY; |
81 | this._resizedWidth = e._event.dX; | 98 | this._resizedWidth = e._event.dX; |
82 | console.log("resizing"); | ||
83 | this.stage.resizeCanvases = true; | 99 | this.stage.resizeCanvases = true; |
84 | this.needsDraw = true; | 100 | this.needsDraw = true; |
85 | } | 101 | } |
@@ -87,13 +103,17 @@ exports.Ninja = Montage.create(Component, { | |||
87 | 103 | ||
88 | handleResizeEnd: { | 104 | handleResizeEnd: { |
89 | value: function(e) { | 105 | value: function(e) { |
90 | this.height -= this._resizedHeight; | 106 | // this.height -= this._resizedHeight; |
91 | this.width -= this._resizedWidth; | 107 | // this.width -= this._resizedWidth; |
92 | this.stage.resizeCanvases = true; | 108 | this.stage.resizeCanvases = true; |
93 | this._resizedHeight = 0; | 109 | this._resizedHeight = 0; |
94 | this._resizedWidth = 0; | 110 | this._resizedWidth = 0; |
95 | this.isResizing = false; | 111 | this.isResizing = false; |
96 | this.needsDraw = true; | 112 | this.needsDraw = true; |
113 | this.rightPanelContainer.classList.remove("disableTransition"); | ||
114 | this.timeline.element.classList.remove("disableTransition"); | ||
115 | this.height = this.timeline.element.offsetHeight; | ||
116 | this.width = this.rightPanelContainer.offsetWidth; | ||
97 | } | 117 | } |
98 | }, | 118 | }, |
99 | 119 | ||
@@ -103,9 +123,10 @@ exports.Ninja = Montage.create(Component, { | |||
103 | this.height = 140; | 123 | this.height = 140; |
104 | this._resizedHeight = 0; | 124 | this._resizedHeight = 0; |
105 | this._resizedWidth = 0; | 125 | this._resizedWidth = 0; |
106 | this.needsDraw = true; | ||
107 | this.timelineSplitter.collapsed = false; | 126 | this.timelineSplitter.collapsed = false; |
108 | this.panelSplitter.collapsed = false; | 127 | this.panelSplitter.collapsed = false; |
128 | this.stage.resizeCanvases = true; | ||
129 | this.needsDraw = true; | ||
109 | } | 130 | } |
110 | }, | 131 | }, |
111 | 132 | ||
@@ -121,7 +142,7 @@ exports.Ninja = Montage.create(Component, { | |||
121 | templateDidLoad: { | 142 | templateDidLoad: { |
122 | value: function() { | 143 | value: function() { |
123 | this.ninjaVersion = window.ninjaVersion.ninja.version; | 144 | this.ninjaVersion = window.ninjaVersion.ninja.version; |
124 | this.eventManager.addEventListener( "preloadFinish", this, false); | 145 | this.undoManager = document.application.undoManager = UndoManager.create(); |
125 | } | 146 | } |
126 | }, | 147 | }, |
127 | 148 | ||
@@ -140,7 +161,6 @@ exports.Ninja = Montage.create(Component, { | |||
140 | 161 | ||
141 | window.addEventListener("resize", this, false); | 162 | window.addEventListener("resize", this, false); |
142 | 163 | ||
143 | // this.eventManager.addEventListener( "appLoading", this, false); // Don't need this anymore | ||
144 | this.eventManager.addEventListener( "selectTool", this, false); | 164 | this.eventManager.addEventListener( "selectTool", this, false); |
145 | this.eventManager.addEventListener( "selectSubTool", this, false); | 165 | this.eventManager.addEventListener( "selectSubTool", this, false); |
146 | this.eventManager.addEventListener( "onOpenDocument", this, false); | 166 | this.eventManager.addEventListener( "onOpenDocument", this, false); |
@@ -167,30 +187,28 @@ exports.Ninja = Montage.create(Component, { | |||
167 | 187 | ||
168 | willDraw: { | 188 | willDraw: { |
169 | value: function() { | 189 | value: function() { |
170 | if (this.height === null) { | 190 | |
171 | this.height = parseInt(this.timeline.element.offsetHeight); | ||
172 | } | ||
173 | if (this.width === null) { | ||
174 | this.width = parseInt(this.rightPanelContainer.offsetWidth); | ||
175 | } | ||
176 | } | 191 | } |
177 | }, | 192 | }, |
178 | 193 | ||
179 | draw: { | 194 | draw: { |
180 | value: function() { | 195 | value: function() { |
181 | if (this.height - this._resizedHeight < 46) { | 196 | if(this.isResizing) { |
182 | this.timelineSplitter.collapsed = true; | 197 | if (this.height - this._resizedHeight < 46) { |
183 | } else { | 198 | this.timelineSplitter.collapsed = true; |
184 | this.timelineSplitter.collapsed = false; | 199 | } else { |
185 | } | 200 | this.timelineSplitter.collapsed = false; |
186 | if (this.width - this._resizedWidth < 30) { | 201 | } |
187 | this.panelSplitter.collapsed = true; | ||
188 | } else { | ||
189 | this.panelSplitter.collapsed = false; | ||
190 | } | ||
191 | 202 | ||
192 | this.timeline.element.style.height = (this.height - this._resizedHeight) + "px"; | 203 | if (this.width - this._resizedWidth < 30) { |
193 | this.rightPanelContainer.style.width = (this.width - this._resizedWidth) + "px"; | 204 | this.panelSplitter.collapsed = true; |
205 | } else { | ||
206 | this.panelSplitter.collapsed = false; | ||
207 | } | ||
208 | |||
209 | } | ||
210 | this.rightPanelContainer.style.width = (this.width - this._resizedWidth) + "px"; | ||
211 | this.timeline.element.style.height = (this.height - this._resizedHeight) + "px"; | ||
194 | } | 212 | } |
195 | }, | 213 | }, |
196 | 214 | ||
@@ -200,10 +218,7 @@ exports.Ninja = Montage.create(Component, { | |||
200 | 218 | ||
201 | didDraw: { | 219 | didDraw: { |
202 | value: function() { | 220 | value: function() { |
203 | if (!this.isResizing) { | 221 | |
204 | this.height = this.timeline.element.offsetHeight; | ||
205 | this.width = this.rightPanelContainer.offsetWidth; | ||
206 | } | ||
207 | if(!this._didDraw) { | 222 | if(!this._didDraw) { |
208 | if (!this.application.ninja.coreIoApi.ioServiceDetected) { | 223 | if (!this.application.ninja.coreIoApi.ioServiceDetected) { |
209 | var check = this.application.ninja.coreIoApi.cloudAvailable(); | 224 | var check = this.application.ninja.coreIoApi.cloudAvailable(); |