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.html4
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js1139
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css2
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss2
4 files changed, 697 insertions, 450 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
index 19709ca7..5c957619 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
@@ -20,6 +20,7 @@
20 "track_container": {"#": "right_inside"}, 20 "track_container": {"#": "right_inside"},
21 "timeline_leftpane" : {"#" : "leftpane_inside"}, 21 "timeline_leftpane" : {"#" : "leftpane_inside"},
22 "layer_tracks": {"#": "layer_tracks"}, 22 "layer_tracks": {"#": "layer_tracks"},
23 "layout_tracks": {"#": "layout_tracks"},
23 "master_track": {"#": "master_track"}, 24 "master_track": {"#": "master_track"},
24 "time_markers" : {"#": "timeline_markers"}, 25 "time_markers" : {"#": "timeline_markers"},
25 "layerRepetition" : {"@": "repetition1"}, 26 "layerRepetition" : {"@": "repetition1"},
@@ -31,6 +32,7 @@
31 "container_tracks" : {"#" : "container-tracks"}, 32 "container_tracks" : {"#" : "container-tracks"},
32 "end_hottext" : {"@" : "endHottext"}, 33 "end_hottext" : {"@" : "endHottext"},
33 "container_layers" : {"#" : "container-layers"}, 34 "container_layers" : {"#" : "container-layers"},
35 "container_tracks" : {"#" : "container-tracks"},
34 "timeline_disabler" : {"#" : "timeline-disabler"}, 36 "timeline_disabler" : {"#" : "timeline-disabler"},
35 "checkable_relative" : {"#" : "checkable_relative"}, 37 "checkable_relative" : {"#" : "checkable_relative"},
36 "checkable_absolute" : {"#" : "checkable_absolute"}, 38 "checkable_absolute" : {"#" : "checkable_absolute"},
@@ -210,7 +212,7 @@
210 212
211 213
212 <div data-montage-id="layer_tracks" class="tl_layertracks"> 214 <div data-montage-id="layer_tracks" class="tl_layertracks">
213 <div class="layout-tracks"> 215 <div class="layout-tracks" data-montage-id="layout_tracks">
214 <div data-montage-id="playhead_marker" class="playheadmarker"></div> 216 <div data-montage-id="playhead_marker" class="playheadmarker"></div>
215 <div data-montage-id="master_track" class="mastertrack"> 217 <div data-montage-id="master_track" class="mastertrack">
216 <div data-montage-id="time_bar" class="timebar"></div> 218 <div data-montage-id="time_bar" class="timebar"></div>
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index d1cab096..185211ae 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -57,12 +57,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
57 this._layerRepetition = newVal; 57 this._layerRepetition = newVal;
58 } 58 }
59 }, 59 },
60
61 _areTracksScrolling: {
62 value: false
63 },
60 64
61 // Set to false to skip array caching array sets in current document 65 // Set to false to skip array caching array sets in currentDocument
62 _boolCacheArrays:{ 66 _boolCacheArrays:{
63 value:true 67 value:true
64 }, 68 },
65 69
70 // Current layer number: iterated and used to assign layer IDs.
66 _currentLayerNumber:{ 71 _currentLayerNumber:{
67 value:0 72 value:0
68 }, 73 },
@@ -91,36 +96,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
91 this.cacheTimeline(); 96 this.cacheTimeline();
92 } 97 }
93 }, 98 },
94 99 _currentElementsSelected: {
95 _selectedLayerID:{ 100 value: []
96 value:false
97 }, 101 },
98 selectedLayerID:{ 102 currentElementsSelected: {
99 get:function () { 103 get: function() {
100 return this._selectedLayerID; 104 return this._currentElementsSelected;
101 }, 105 },
102 set:function (newVal) { 106 set: function(newVal) {
103 if (newVal === false) { 107 this._currentElementsSelected = newVal;
104 // We are clearing the timeline, so just set the value and return. 108 this.cacheTimeline();
105 this._selectedLayerID = newVal; 109 }
106 return;
107 }
108 if (newVal !== this._selectedLayerID) {
109 var selectIndex = this.getLayerIndexByID(newVal);
110 this._selectedLayerID = newVal;
111 this._captureSelection = true;
112 if (this.currentLayerSelected !== false) {
113 this.selectLayer(selectIndex, true);
114 }
115 if (this.currentLayersSelected !== false) {
116 this.selectLayers(this.currentLayersSelected);
117 }
118 if ((this.currentLayersSelected === false) && (this.currentLayerSelected === false)) {
119 this.selectLayers([]);
120 }
121
122 }
123 }
124 }, 110 },
125 111
126 _currentLayersSelected:{ 112 _currentLayersSelected:{
@@ -136,6 +122,21 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
136 } 122 }
137 }, 123 },
138 124
125 // The index of the last layer that was clicked on
126 // (used for shift-click multiselect)
127 _lastLayerClicked : {
128 value: 0
129 },
130 lastLayerClicked: {
131 serializable: true,
132 get: function() {
133 return this._lastLayerClicked;
134 },
135 set: function(newVal) {
136 this._lastLayerClicked = newVal
137 }
138 },
139
139 _currentSelectedContainer: { 140 _currentSelectedContainer: {
140 value: null 141 value: null
141 }, 142 },
@@ -177,7 +178,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
177 }, 178 },
178 set:function (val) { 179 set:function (val) {
179 this._masterDuration = val; 180 this._masterDuration = val;
180 this.timebar.style.width = (this._masterDuration / 12) + "px"; 181 var intDur = Math.round(val/12),
182 strWidth = intDur + "px";
183 this.timebar.style.width = strWidth;
181 } 184 }
182 }, 185 },
183 186
@@ -233,15 +236,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
233 set:function (value) { 236 set:function (value) {
234 if (this._breadCrumbContainer !== value) { 237 if (this._breadCrumbContainer !== value) {
235 this._breadCrumbContainer = value; 238 this._breadCrumbContainer = value;
236 //this.LayerBinding();
237 } 239 }
238 } 240 }
239 }, 241 },
240 242
241 _isLayer:{
242 value:false
243 },
244
245 _firstTimeLoaded:{ 243 _firstTimeLoaded:{
246 value:true 244 value:true
247 }, 245 },
@@ -257,6 +255,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
257 timeMarkerHolder:{ 255 timeMarkerHolder:{
258 value:null 256 value:null
259 }, 257 },
258
259 // Drag and Drop properties
260 _dragAndDropHelper : { 260 _dragAndDropHelper : {
261 value: false 261 value: false
262 }, 262 },
@@ -269,6 +269,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
269 _dragLayerID : { 269 _dragLayerID : {
270 value: null 270 value: null
271 }, 271 },
272 _draggingType: {
273 value: false
274 },
275 draggingType: {
276 get: function() {
277 return this._draggingType;
278 },
279 set: function(newVal) {
280 this._draggingType = newVal;
281 }
282 },
272 283
273 layersDragged:{ 284 layersDragged:{
274 value:[], 285 value:[],
@@ -285,6 +296,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
285 } 296 }
286 } 297 }
287 }, 298 },
299 _dragLayerIndexes: {
300 value: []
301 },
288 _dropLayerID : { 302 _dropLayerID : {
289 value: null 303 value: null