aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/TimelinePanel.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline/TimelinePanel.reel')
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html5
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js248
2 files changed, 175 insertions, 78 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
index 1aa9a725..92adee05 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
@@ -32,8 +32,7 @@
32 "timetext" : {"#": "time_text"}, 32 "timetext" : {"#": "time_text"},
33 "timebar" : {"#": "time_bar"}, 33 "timebar" : {"#": "time_bar"},
34 "container_tracks" : {"#" : "container-tracks"}, 34 "container_tracks" : {"#" : "container-tracks"},
35 "end_hottext" : {"@" : "endHottext"}, 35 "end_hottext" : {"@" : "endHottext"}
36 "getme" : {"#" : "getme"}
37 } 36 }
38 }, 37 },
39 38
@@ -285,7 +284,7 @@
285 284
286 <div id="user_layers" class="userlayers"> 285 <div id="user_layers" class="userlayers">
287 <div id="master_layer" class="masterlayer"> 286 <div id="master_layer" class="masterlayer">
288 <div id="getme">Master Layer</div> 287 <div>Master Layer</div>
289 </div> 288 </div>
290 <div id="container-layers"> 289 <div id="container-layers">
291 <div id="container-layer"></div> 290 <div id="container-layer"></div>
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index e92c83db..59306705 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -28,7 +28,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
28 }, 28 },
29 set:function (newVal) { 29 set:function (newVal) {
30 this._arrLayers = newVal; 30 this._arrLayers = newVal;
31 this.application.ninja.currentDocument.tlArrLayers = newVal; 31 this._cacheArrays();
32 } 32 }
33 }, 33 },
34 34
@@ -44,6 +44,22 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
44 this._layerRepetition = newVal; 44 this._layerRepetition = newVal;
45 } 45 }
46 }, 46 },
47 _cacheArrays : {
48 value: function() {
49 // Cache this.arrLayers and this.arrTracks.
50 this.log('cacheArrays ' + this._boolCacheArrays)
51 if (this._boolCacheArrays) {
52 this.log('caching arrays for ', this.application.ninja.currentDocument.name);
53 this.application.ninja.currentDocument.tlArrLayers = this.arrLayers;
54 this.application.ninja.currentDocument.tlArrTracks = this.arrTracks;
55 }
56 }
57 },
58
59 // Set to false to skip array caching array sets in current document
60 _boolCacheArrays : {
61 value: true
62 },
47 63
48 _currentLayerNumber:{ 64 _currentLayerNumber:{
49 value:0 65 value:0
@@ -100,7 +116,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
100 }, 116 },
101 set:function (newVal) { 117 set:function (newVal) {
102 this._arrTracks = newVal; 118 this._arrTracks = newVal;
103 this.application.ninja.currentDocument.tlArrTracks = newVal; 119 this._cacheArrays();
104 } 120 }
105 }, 121 },
106 122
@@ -180,39 +196,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
180 } 196 }
181 }, 197 },
182 198
183 handleOnOpenDocument:{
184 value:function(){
185 this.clearTimelinePanel();
186 this.eventManager.addEventListener("deleteLayerClick", this, false);
187 this.eventManager.addEventListener("newLayer", this, false);
188 this.eventManager.addEventListener("deleteLayer", this, false);
189 this.eventManager.addEventListener("layerBinding", this, false);
190 this.eventManager.addEventListener("elementAdded", this, false);
191 this.eventManager.addEventListener("elementDeleted", this, false);
192 this.eventManager.addEventListener("deleteSelection", this, false);
193 this.eventManager.addEventListener("selectionChange", this, true);
194 this.hashInstance = this.createLayerHashTable();
195 this.hashTrackInstance = this.createTrackHashTable();
196 this.hashLayerNumber = this.createLayerNumberHash();
197 this.hashElementMapToLayer = this.createElementMapToLayer();
198 this.initTimelineView();
199
200
201 }
202 },
203
204 handleCloseDocument: {
205 value: function(event) {
206 this.clearTimelinePanel();
207 }
208 },
209
210 handleSwitchDocument : {
211 value: function(event) {
212 // Handle document change.
213 this.handleOnOpenDocument();
214 }
215 },
216 199
217 willDraw:{ 200 willDraw:{
218 value:function () { 201 value:function () {
@@ -225,6 +208,33 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
225 /* === END: Draw cycle === */ 208 /* === END: Draw cycle === */
226 209
227 /* === BEGIN: Controllers === */ 210 /* === BEGIN: Controllers === */
211
212 // Bind all document-specific events (pass in true to unbind)
213 _bindDocumentEvents : {
214 value: function(boolUnbind) {
215 var arrEvents = ["deleteLayerClick",
216 "newLayer",
217 "deleteLayer",
218 "layerBinding",
219 "elementAdded",
220 "elementDeleted",
221 "deleteSelection",
222 "selectionChange"],
223 i,
224 arrEventsLength = arrEvents.length;
225
226 if (boolUnbind) {
227 for (i = 0; i < arrEventsLength; i++) {
228 this.eventManager.removeEventListener(arrEvents[i], this, false);
229 }
230 } else {
231 for (i = 0; i < arrEventsLength; i++) {
232 this.eventManager.addEventListener(arrEvents[i], this, false);
233 }
234 }
235 }
236 },
237
228 initTimeline : { 238 initTimeline : {
229 value: function() { 239 value: function() {
230 // Set up basic Timeline functions: event listeners, etc. Things that only need to be run once. 240 // Set up basic Timeline functions: event listeners, etc. Things that only need to be run once.
@@ -242,49 +252,76 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
242 252
243 } 253 }
244 }, 254 },
245 initTimelineView:{ 255
256 initTimelineForDocument:{
246 value:function () { 257 value:function () {
247 var myIndex; 258 var myIndex;
248
249 this.drawTimeMarkers(); 259 this.drawTimeMarkers();
260 this._hashKey = "123";
261
262
263 // Document switching
264 // Check to see if we have saved timeline information in the currentDocument.
265 if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined") {
266 // No, we have no information stored. Create it.
267 this.log('newfile ' + this.application.ninja.currentDocument.name)
268 this.application.ninja.currentDocument.isTimelineInitialized = true;
269 this.application.ninja.currentDocument.tlArrLayers = [];
270 this.application.ninja.currentDocument.tlArrTracks = [];
271
272
273 // Loop through the DOM of the document to find layers and animations.
274 // Fire off events as they are found.
275 _firstLayerDraw = false;
276 if(!this.application.ninja.documentController.creatingNewFile){
277 if(this.application.ninja.currentDocument.documentRoot.children[0]){
278 myIndex=0;
279 while(this.application.ninja.currentDocument.documentRoot.children[myIndex])
280 {
281 this._openDoc=true;
282 NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]})
283 myIndex++;
284 }
285 }
286 else{
287 NJevent('newLayer', this._hashKey);
288 this.selectLayer(0);
289 }
290 }else{
291 NJevent('newLayer', this._hashKey);
292 this.selectLayer(0);
293
294 }
295 _firstLayerDraw = true;
296