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.js1368
1 files changed, 912 insertions, 456 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index cb8185e5..2cbd9e2b 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -4,9 +4,10 @@
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. 4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */ 5 </copyright> */
6 6
7var Montage = require("montage/core/core").Montage; 7var Montage = require("montage/core/core").Montage,
8var Component = require("montage/ui/component").Component; 8 Component = require("montage/ui/component").Component,
9var nj = require("js/lib/NJUtils").NJUtils; 9 nj = require("js/lib/NJUtils").NJUtils,
10 EasingMenuPopup = require("js/panels/Timeline/EasingMenu.reel").EasingMenu;
10 11
11var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { 12var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
12 13
@@ -223,12 +224,29 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
223 this._layerRepetition = newVal; 224 this._layerRepetition = newVal;
224 } 225 }
225 }, 226 },
227
228 _areTracksScrolling: {
229 value: false
230 },
231
232 _currentOpenSpanMenu: {
233 value: false
234 },
235 currentOpenSpanMenu: {
236 get: function() {
237 return this._currentOpenSpanMenu;
238 },
239 set: function(newVal) {
240 this._currentOpenSpanMenu = newVal;
241 }
242 },
226 243
227 // Set to false to skip array caching array sets in current document 244 // Set to false to skip array caching array sets in currentDocument
228 _boolCacheArrays:{ 245 _boolCacheArrays:{
229 value:true 246 value:true
230 }, 247 },
231 248
249 // Current layer number: iterated and used to assign layer IDs.
232 _currentLayerNumber:{ 250 _currentLayerNumber:{
233 value:0 251 value:0
234 }, 252 },
@@ -257,36 +275,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
257 this.cacheTimeline(); 275 this.cacheTimeline();
258 } 276 }
259 }, 277 },
260 278 _currentElementsSelected: {
261 _selectedLayerID:{ 279 value: []
262 value:false
263 }, 280 },
264 selectedLayerID:{ 281 currentElementsSelected: {
265 get:function () { 282 get: function() {
266 return this._selectedLayerID; 283 return this._currentElementsSelected;
267 }, 284 },
268 set:function (newVal) { 285 set: function(newVal) {
269 if (newVal === false) { 286 this._currentElementsSelected = newVal;
270 // We are clearing the timeline, so just set the value and return. 287 this.cacheTimeline();
271 this._selectedLayerID = newVal; 288 }
272 return;
273 }
274 if (newVal !== this._selectedLayerID) {
275 var selectIndex = this.getLayerIndexByID(newVal);
276 this._selectedLayerID = newVal;
277 this._captureSelection = true;
278 if (this.currentLayerSelected !== false) {
279 this.selectLayer(selectIndex, false);
280 }
281 if (this.currentLayersSelected !== false) {
282 this.selectLayers(this.currentLayersSelected);
283 }
284 if ((this.currentLayersSelected === false) && (this.currentLayerSelected === false)) {
285 this.selectLayers([]);
286 }
287
288 }
289 }
290 }, 289 },
291 290
292 _currentLayersSelected:{ 291 _currentLayersSelected:{
@@ -301,7 +300,34 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
301 this.cacheTimeline(); 300 this.cacheTimeline();
302 } 301 }
303 }, 302 },
304 303
304 _easingMenu: {
305 value: null
306 },
307 easingMenu: {
308 serializable: true,
309 get: function() {
310 return this._easingMenu;
311 },
312 set: function(newVal) {
313 this._easingMenu = newVal;
314 }
315 },
316
317 // The index of the last layer that was clicked on
318 // (used for shift-click multiselect)
319 _lastLayerClicked : {
320 value: 0
321 },
322 lastLayerClicked: {
323 serializable: true,
324 get: function() {
325 return this._lastLayerClicked;
326 },
327 set: function(newVal) {
328 this._lastLayerClicked = newVal
329 }
330 },
305 331
306 _millisecondsOffset:{ 332 _millisecondsOffset:{
307 value:1000 333 value:1000
@@ -331,7 +357,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
331 }, 357 },
332 set:function (val) { 358 set:function (val) {
333 this._masterDuration = val; 359 this._masterDuration = val;
334 this.timebar.style.width = (this._masterDuration / 12) + "px"; 360 var intDur = Math.round(val/12),
361 strWidth = intDur + "px";
362 this.timebar.style.width = strWidth;
335 } 363 }
336 }, 364 },
337 365
@@ -391,10 +419,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
391 } 419 }
392 }, 420 },
393 421
394 _isLayer:{
395 value:false
396 },
397
398 _firstTimeLoaded:{ 422 _firstTimeLoaded:{
399 value:true 423 value:true
400 }, 424 },
@@ -410,6 +434,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
410 timeMarkerHolder:{ 434 timeMarkerHolder:{
411 value:null 435 value:null
412 }, 436 },
437
438 // Drag and Drop properties
413 _dragAndDropHelper : { 439 _dragAndDropHelper : {
414 value: false 440 value: false
415 }, 441 },
@@ -422,10 +448,28 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
422 _dragLayerID : { 448 _dragLayerID : {
423 value: null 449 value: null
424 }, 450 },
425 451 _draggingType: {
426 layersDragged:{ 452 value: false
427 value:[], 453 },
428 writable:true 454 draggingType: {
455 get: function() {
456 return this._draggingType;
457 },
458 set: function(newVal) {
459 this._draggingType = newVal;
460 }
461 },
462
463 _elementsDragged: {
464 value: []
465 },
466 elementsDragged: {
467 get: function() {
468 return this._elementsDragged;
469 },
470 set: function(newVal) {
471 this._elementsDragged = newVal;
472 }
429 }, 473 },
430 474
431 dragLayerID : { 475 dragLayerID : {
@@ -438,6 +482,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
438 } 482 }
439 } 483 }
440 }, 484 },
485
441 _dropLayerID : { 486 _dropLayerID : {
442 value: null 487 value: null
443 }, 488 },
@@ -449,27 +494,59 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
449 if (newVal !== this._dropLayerID) { 494 if (newVal !== this._dropLayerID) {