diff options
author | Nivesh Rajbhandari | 2012-03-13 13:05:33 -0700 |
---|---|---|
committer | Nivesh Rajbhandari | 2012-03-13 13:05:33 -0700 |
commit | 92fc2e3c4bca2edb04102431b4959aafe022f329 (patch) | |
tree | d48c090f71ed2cd6bd6ce38ff68c36ab69299985 /js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | |
parent | efb92cf52680d31f05fed3757e74862592cc2d4c (diff) | |
parent | f56b8cf4d3316d250c0f0045fb78f0dbd5c56e94 (diff) | |
download | ninja-92fc2e3c4bca2edb04102431b4959aafe022f329.tar.gz |
Merge branch 'refs/heads/ninja-internal' into ToolFixes
Diffstat (limited to 'js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js')
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 725 |
1 files changed, 380 insertions, 345 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 087bf3cd..1afb9e5a 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | |||
@@ -19,24 +19,43 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
19 | 19 | ||
20 | /* === BEGIN: Models === */ | 20 | /* === BEGIN: Models === */ |
21 | _arrLayers:{ | 21 | _arrLayers:{ |
22 | serializable: true, | ||
22 | value:[] | 23 | value:[] |
23 | }, | 24 | }, |
24 | 25 | ||
25 | arrLayers:{ | 26 | arrLayers:{ |
27 | serializable: true, | ||
26 | get:function () { | 28 | get:function () { |
27 | return this._arrLayers; | 29 | return this._arrLayers; |
28 | }, | 30 | }, |
29 | set:function (newVal) { | 31 | set:function (newVal) { |
30 | this._arrLayers = newVal; | 32 | this._arrLayers = newVal; |
33 | this.needsDraw = true; | ||
31 | this._cacheArrays(); | 34 | this._cacheArrays(); |
32 | } | 35 | } |
33 | }, | 36 | }, |
34 | 37 | ||
38 | _temparrLayers:{ | ||
39 | value:[] | ||
40 | }, | ||
41 | |||
42 | temparrLayers:{ | ||
43 | get:function () { | ||
44 | return this._temparrLayers; | ||
45 | }, | ||
46 | set:function (newVal) { | ||
47 | this._temparrLayers = newVal; | ||
48 | } | ||
49 | }, | ||
50 | |||
51 | |||
35 | _layerRepetition:{ | 52 | _layerRepetition:{ |
53 | serializable: true, | ||
36 | value:null | 54 | value:null |
37 | }, | 55 | }, |
38 | 56 | ||
39 | layerRepetition:{ | 57 | layerRepetition:{ |
58 | serializable: true, | ||
40 | get:function () { | 59 | get:function () { |
41 | return this._layerRepetition; | 60 | return this._layerRepetition; |
42 | }, | 61 | }, |
@@ -46,17 +65,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
46 | }, | 65 | }, |
47 | 66 | ||
48 | _cacheArrays : { | 67 | _cacheArrays : { |
49 | value: function() { | 68 | value: function() { |
50 | if (this._boolCacheArrays) { | 69 | if (this._boolCacheArrays) { |
51 | this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; | 70 | this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; |
52 | 71 | ||
53 | } | 72 | } |
54 | } | 73 | } |
55 | }, | 74 | }, |
56 | 75 | ||
57 | // Set to false to skip array caching array sets in current document | 76 | // Set to false to skip array caching array sets in current document |
58 | _boolCacheArrays : { | 77 | _boolCacheArrays : { |
59 | value: true | 78 | value: true |
60 | }, | 79 | }, |
61 | 80 | ||
62 | _currentLayerNumber:{ | 81 | _currentLayerNumber:{ |
@@ -107,9 +126,18 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
107 | } | 126 | } |
108 | }, | 127 | }, |
109 | 128 | ||
110 | currentLayerSelected:{ | 129 | _currentLayerSelected:{ |
111 | value: null | 130 | value: null |
112 | }, | 131 | }, |
132 | currentLayerSelected : { | ||
133 | get: function() { | ||
134 | return this._currentLayerSelected; | ||
135 | }, | ||
136 | set: function(newVal) { | ||
137 | this._currentLayerSelected = newVal; | ||
138 | this.application.ninja.currentDocument.tlCurrentLayerSelected = newVal; | ||
139 | } | ||
140 | }, | ||
113 | 141 | ||
114 | millisecondsOffset:{ | 142 | millisecondsOffset:{ |
115 | value:1000 | 143 | value:1000 |
@@ -217,9 +245,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
217 | prepareForDraw:{ | 245 | prepareForDraw:{ |
218 | value:function () { | 246 | value:function () { |
219 | this.initTimeline(); | 247 | this.initTimeline(); |
220 | this.eventManager.addEventListener("onOpenDocument", this, false); | 248 | // Bind the event handler for the document change events |
221 | this.eventManager.addEventListener("closeDocument", this, false); | 249 | this.eventManager.addEventListener("onOpenDocument", this.handleDocumentChange.bind(this), false); |
222 | this.eventManager.addEventListener("switchDocument", this, false); | 250 | this.eventManager.addEventListener("closeDocument", this.handleDocumentChange.bind(this), false); |
251 | this.eventManager.addEventListener("switchDocument", this.handleDocumentChange.bind(this), false); | ||
223 | } | 252 | } |
224 | }, | 253 | }, |
225 | 254 | ||
@@ -233,41 +262,68 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
233 | }, | 262 | }, |
234 | /* === END: Draw cycle === */ | 263 | /* === END: Draw cycle === */ |
235 | /* === BEGIN: Controllers === */ | 264 | /* === BEGIN: Controllers === */ |
236 | // Bind all document-specific events (pass in true to unbind) | 265 | // Create an empty layer template object with minimal defaults and return it for use |
237 | _bindDocumentEvents : { | 266 | createLayerTemplate : { |
238 | value: function(boolUnbind) { | 267 | value : function() { |
239 | var arrEvents = ["deleteLayerClick", | 268 | var returnObj = {}; |
240 | "newLayer", | 269 | returnObj.layerData = {}; |
241 | "deleteLayer", | 270 | returnObj.layerData.layerName = null; |
242 | "elementAdded", | 271 | returnObj.layerData.layerID = null; |
243 | "elementDeleted", | 272 | returnObj.layerData.isMainCollapsed = true; |
244 | "selectionChange"], | 273 | returnObj.layerData.isPositionCollapsed = true; |
245 | i, | 274 | returnObj.layerData.isTransformCollapsed = true; |
246 | arrEventsLength = arrEvents.length; | 275 | returnObj.layerData.isStyleCollapsed = true; |
247 | 276 | returnObj.layerData.arrLayerStyles = []; | |
248 | if (boolUnbind) { | 277 | returnObj.layerData.elementsList = []; |
249 | for (i = 0; i < arrEventsLength; i++) { | 278 | returnObj.layerData.deleted = false; |
250 | this.eventManager.removeEventListener(arrEvents[i], this, false); | 279 | returnObj.layerData.isSelected = false; |
251 | } | 280 | returnObj.layerData.layerPosition = null; |
252 | } else { | 281 | returnObj.layerData.created=false; |
253 | for (i = 0; i < arrEventsLength; i++) { | 282 | returnObj.layerData.isTrackAnimated = false; |
254 | this.eventManager.addEventListener(arrEvents[i], this, false); | 283 | returnObj.layerData.currentKeyframeRule = null; |
255 | } | 284 | returnObj.layerData.trackPosition = 0; |
285 | returnObj.layerData.arrStyleTracks = []; | ||
286 | returnObj.layerData.tweens = []; | ||
287 | returnObj.parentElementUUID = null; | ||
288 | returnObj.parentElement = null; | ||
289 | return returnObj; | ||
290 | } | ||
291 | }, | ||
292 | // Bind all document-specific events (pass in true to unbind) | ||
293 | _bindDocumentEvents : { | ||
294 | value: function(boolUnbind) { | ||
295 | var arrEvents = ["deleteLayerClick", | ||
296 | "newLayer", | ||
297 | "deleteLayer", | ||
298 | "elementAdded", | ||
299 | "elementDeleted", | ||
300 | "selectionChange"], | ||
301 | i, | ||
302 | arrEventsLength = arrEvents.length; | ||
303 | |||
304 | if (boolUnbind) { | ||
305 | for (i = 0; i < arrEventsLength; i++) { | ||
306 | this.eventManager.removeEventListener(arrEvents[i], this, false); | ||
307 | } | ||
308 | } else { | ||
309 | for (i = 0; i < arrEventsLength; i++) { | ||
310 | this.eventManager.addEventListener(arrEvents[i], this, false); | ||
311 | } | ||
256 | Object.defineBinding(this, "breadCrumbContainer", { | 312 | Object.defineBinding(this, "breadCrumbContainer", { |
257 | boundObject: this.application.ninja, | 313 | boundObject: this.application.ninja, |
258 | boundObjectPropertyPath:"currentSelectedContainer", | 314 | boundObjectPropertyPath:"currentSelectedContainer", |
259 | oneway: true | 315 | oneway: true |
260 | }); | 316 | }); |
261 | } | 317 | } |
262 | } | 318 | } |
263 | }, | 319 | }, |
264 | 320 | ||
265 | initTimeline : { | 321 | // Initialize the timeline, runs only once when the component is first loaded. |
266 | value: function() { | 322 | // Sets up basic event listeners, gets some selectors, etc. |
267 | // Set up basic Timeline functions: event listeners, etc. Things that only need to be run once. | 323 | initTimeline : { |
268 |