aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js')
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js743
1 files changed, 395 insertions, 348 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index 087bf3cd..a1e320c4 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,40 @@ 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 },
141
142 _selectedLayerID:{
143 value: false
144 },
145 selectedLayerID : {
146 get: function() {
147 return this._selectedLayerID;
148 },
149 set: function(newVal) {
150 if (newVal === false) {
151 // We are clearing the timeline, so just set the value and return.
152 this._selectedLayerID = newVal;
153 return;
154 }
155 if (newVal !== this._selectedLayerID) {
156 var selectIndex = this.getLayerIndexByID(newVal);
157 this._selectedLayerID = newVal;
158 this._captureSelection = true;
159 this.selectLayer(selectIndex, true);
160 }
161 }
162 },
113 163
114 millisecondsOffset:{ 164 millisecondsOffset:{
115 value:1000 165 value:1000
@@ -217,9 +267,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
217 prepareForDraw:{ 267 prepareForDraw:{
218 value:function () { 268 value:function () {
219 this.initTimeline(); 269 this.initTimeline();
220 this.eventManager.addEventListener("onOpenDocument", this, false); 270 // Bind the event handler for the document change events
221 this.eventManager.addEventListener("closeDocument", this, false); 271 this.eventManager.addEventListener("onOpenDocument", this.handleDocumentChange.bind(this), false);
222 this.eventManager.addEventListener("switchDocument", this, false); 272 this.eventManager.addEventListener("closeDocument", this.handleDocumentChange.bind(this), false);
273 this.eventManager.addEventListener("switchDocument", this.handleDocumentChange.bind(this), false);
223 } 274 }
224 }, 275 },
225 276
@@ -233,41 +284,68 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
233 }, 284 },
234 /* === END: Draw cycle === */ 285 /* === END: Draw cycle === */
235 /* === BEGIN: Controllers === */ 286 /* === BEGIN: Controllers === */
236 // Bind all document-specific events (pass in true to unbind) 287 // Create an empty layer template object with minimal defaults and return it for use
237 _bindDocumentEvents : { 288 createLayerTemplate : {
238 value: function(boolUnbind) { 289 value : function() {
239 var arrEvents = ["deleteLayerClick", 290 var returnObj = {};
240 "newLayer", 291 returnObj.layerData = {};
241 "deleteLayer", 292 returnObj.layerData.layerName = null;
242 "elementAdded", 293 returnObj.layerData.layerID = null;
243 "elementDeleted", 294 returnObj.layerData.isMainCollapsed = true;
244 "selectionChange"], 295 returnObj.layerData.isPositionCollapsed = true;
245 i, 296 returnObj.layerData.isTransformCollapsed = true;
246 arrEventsLength = arrEvents.length; 297 returnObj.layerData.isStyleCollapsed = true;
247 298 returnObj.layerData.arrLayerStyles = [];
248 if (boolUnbind) { 299 returnObj.layerData.elementsList = [];
249 for (i = 0; i < arrEventsLength; i++) { 300 returnObj.layerData.deleted = false;
250 this.eventManager.removeEventListener(arrEvents[i], this, false); 301 returnObj.layerData.isSelected = false;
251 } 302 returnObj.layerData.layerPosition = null;
252 } else { 303 returnObj.layerData.created=false;
253 for (i = 0; i < arrEventsLength; i++) { 304 returnObj.layerData.isTrackAnimated = false;
254 this.eventManager.addEventListener(arrEvents[i], this, false); 305 returnObj.layerData.currentKeyframeRule = null;
255 } 306 returnObj.layerData.trackPosition = 0;
307 returnObj.layerData.arrStyleTracks = [];
308 returnObj.layerData.tweens = [];
309 returnObj.parentElementUUID = null;
310 returnObj.parentElement = null;
311 return returnObj;
312 }
313 },
314 // Bind all document-specific events (pass in true to unbind)
315 _bindDocumentEvents : {
316 value: function(boolUnbind) {
317 var arrEvents = ["deleteLayerClick",
318 "newLayer",
319 "deleteLayer",
320 "elementAdded",
321 "elementDeleted",
322 "selectionChange"],
323 i,
324 arrEventsLength = arrEvents.length;
325
326 if (boolUnbind) {
327 for (i = 0; i < arrEventsLength; i++) {
328 this.eventManager.removeEventListener(arrEvents[i], this, false);
329 }
330 } else {
331 for (i = 0; i < arrEventsLength; i++) {
332 this.eventManager.addEventListener(arrEvents[i], this, false);
333 }
256 Object.defineBinding(this, "breadCrumbContainer", { 334 Object.defineBinding(this, "breadCrumbContainer", {
257 boundObject: this.application.ninja, 335 boundObject: this.application.ninja,