diff options
Diffstat (limited to 'js/panels/Timeline/TimelinePanel.reel')
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html | 42 | ||||
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 189 |
2 files changed, 194 insertions, 37 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html index 0c302436..1aa9a725 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html | |||
@@ -32,7 +32,8 @@ | |||
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"} | ||
36 | } | 37 | } |
37 | }, | 38 | }, |
38 | 39 | ||
@@ -115,6 +116,41 @@ | |||
115 | "boundObject" : {"@" : "repetition1"}, | 116 | "boundObject" : {"@" : "repetition1"}, |
116 | "boundObjectPropertyPath" : "objectAtCurrentIteration.isStyleCollapsed", | 117 | "boundObjectPropertyPath" : "objectAtCurrentIteration.isStyleCollapsed", |
117 | "oneway" : false | 118 | "oneway" : false |
119 | }, | ||
120 | "dtextPositionX" : { | ||
121 | "boundObject" : {"@" : "repetition1"}, | ||
122 | "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextPositionX", | ||
123 | "oneway" : false | ||
124 | }, | ||
125 | "dtextPositionY" : { | ||
126 | "boundObject" : {"@" : "repetition1"}, | ||
127 | "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextPositionY", | ||
128 | "oneway" : false | ||
129 | }, | ||
130 | "dtextSkewX" : { | ||
131 | "boundObject" : {"@" : "repetition1"}, | ||
132 | "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextSkewX", | ||
133 | "oneway" : false | ||
134 | }, | ||
135 | "dtextSkewY" : { | ||
136 | "boundObject" : {"@" : "repetition1"}, | ||
137 | "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextSkewY", | ||
138 | "oneway" : false | ||
139 | }, | ||
140 | "dtextScaleX" : { | ||
141 | "boundObject" : {"@" : "repetition1"}, | ||
142 | "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextScaleX", | ||
143 | "oneway" : false | ||
144 | }, | ||
145 | "dtextScaleY" : { | ||
146 | "boundObject" : {"@" : "repetition1"}, | ||
147 | "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextScaleY", | ||
148 | "oneway" : false | ||
149 | }, | ||
150 | "dtextRotate" : { | ||
151 | "boundObject" : {"@" : "repetition1"}, | ||
152 | "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextRotate", | ||
153 | "oneway" : false | ||
118 | } | 154 | } |
119 | } | 155 | } |
120 | }, | 156 | }, |
@@ -249,7 +285,7 @@ | |||
249 | 285 | ||
250 | <div id="user_layers" class="userlayers"> | 286 | <div id="user_layers" class="userlayers"> |
251 | <div id="master_layer" class="masterlayer"> | 287 | <div id="master_layer" class="masterlayer"> |
252 | <div>Master Layer</div> | 288 | <div id="getme">Master Layer</div> |
253 | </div> | 289 | </div> |
254 | <div id="container-layers"> | 290 | <div id="container-layers"> |
255 | <div id="container-layer"></div> | 291 | <div id="container-layer"></div> |
@@ -264,7 +300,7 @@ | |||
264 | </div> | 300 | </div> |
265 | </div> | 301 | </div> |
266 | 302 | ||
267 | <div id="layer_resizer" class="layerresizer"></div> | 303 | <div data-montage-id="layer_resizer" class="layerresizer"></div> |
268 | 304 | ||
269 | <div id="timeline_rightpane" class="tl_rightpane"> | 305 | <div id="timeline_rightpane" class="tl_rightpane"> |
270 | <div id="right_inside" class="rightinside"> | 306 | <div id="right_inside" class="rightinside"> |
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index a5cde00f..81415951 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | |||
@@ -28,6 +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 | } | 32 | } |
32 | }, | 33 | }, |
33 | 34 | ||
@@ -99,6 +100,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
99 | }, | 100 | }, |
100 | set:function (newVal) { | 101 | set:function (newVal) { |
101 | this._arrTracks = newVal; | 102 | this._arrTracks = newVal; |
103 | this.application.ninja.currentDocument.tlArrTracks = newVal; | ||
102 | } | 104 | } |
103 | }, | 105 | }, |
104 | 106 | ||
@@ -171,12 +173,16 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
171 | /* === BEGIN: Draw cycle === */ | 173 | /* === BEGIN: Draw cycle === */ |
172 | prepareForDraw:{ | 174 | prepareForDraw:{ |
173 | value:function () { | 175 | value:function () { |
174 | this.eventManager.addEventListener( "onOpenDocument", this, false); | 176 | this.initTimeline(); |
177 | this.eventManager.addEventListener("onOpenDocument", this, false); | ||
178 | this.eventManager.addEventListener("closeDocument", this, false); | ||
179 | this.eventManager.addEventListener("switchDocument", this, false); | ||
175 | } | 180 | } |
176 | }, | 181 | }, |
177 | 182 | ||
178 | handleOnOpenDocument:{ | 183 | handleOnOpenDocument:{ |
179 | value:function(){ | 184 | value:function(){ |
185 | this.clearTimelinePanel(); | ||
180 | this.eventManager.addEventListener("deleteLayerClick", this, false); | 186 | this.eventManager.addEventListener("deleteLayerClick", this, false); |
181 | this.eventManager.addEventListener("newLayer", this, false); | 187 | this.eventManager.addEventListener("newLayer", this, false); |
182 | this.eventManager.addEventListener("deleteLayer", this, false); | 188 | this.eventManager.addEventListener("deleteLayer", this, false); |
@@ -194,6 +200,20 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
194 | 200 | ||
195 | } | 201 | } |
196 | }, | 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 | |||
197 | willDraw:{ | 217 | willDraw:{ |
198 | value:function () { | 218 | value:function () { |
199 | if (this._isLayer) { | 219 | if (this._isLayer) { |
@@ -205,10 +225,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
205 | /* === END: Draw cycle === */ | 225 | /* === END: Draw cycle === */ |
206 | 226 | ||
207 | /* === BEGIN: Controllers === */ | 227 | /* === BEGIN: Controllers === */ |
208 | initTimelineView:{ | 228 | initTimeline : { |
209 | value:function () { | 229 | value: function() { |
210 | var myIndex; | 230 | // Set up basic Timeline functions: event listeners, etc. Things that only need to be run once. |
211 | this.layout_tracks = this.element.querySelector(".layout-tracks"); | 231 | this.layout_tracks = this.element.querySelector(".layout-tracks"); |
212 | this.layout_markers = this.element.querySelector(".layout_markers"); | 232 | this.layout_markers = this.element.querySelector(".layout_markers"); |
213 | 233 | ||
214 | this.newlayer_button.identifier = "addLayer"; | 234 | this.newlayer_button.identifier = "addLayer"; |
@@ -219,20 +239,31 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
219 | this.layout_tracks.addEventListener("scroll", this.updateLayerScroll.bind(this), false); | 239 | this.layout_tracks.addEventListener("scroll", this.updateLayerScroll.bind(this), false); |
220 | this.user_layers.addEventListener("scroll", this.updateLayerScroll.bind(this), false); | 240 | this.user_layers.addEventListener("scroll", this.updateLayerScroll.bind(this), false); |
221 | this.end_hottext.addEventListener("changing", this.updateTrackContainerWidth.bind(this), false); | 241 | this.end_hottext.addEventListener("changing", this.updateTrackContainerWidth.bind(this), false); |
222 | 242 | ||
223 | this.drawTimeMarkers(); | 243 | } |
244 | }, | ||
245 | initTimelineView:{ | ||
246 | value:function () { | ||
247 | var myIndex; | ||
248 | |||
249 | this.drawTimeMarkers(); | ||
224 | 250 | ||
225 | this._hashKey = "123"; | 251 | this._hashKey = "123"; |
226 | _firstLayerDraw = false; | 252 | _firstLayerDraw = false; |
227 | if(this.application.ninja.currentDocument.documentRoot.children[0]){ | 253 | if(!this.application.ninja.documentController.creatingNewFile){ |
228 | myIndex=0; | 254 | if(this.application.ninja.currentDocument.documentRoot.children[0]){ |
229 | while(this.application.ninja.currentDocument.documentRoot.children[myIndex]) | 255 | myIndex=0; |
230 | { | 256 | while(this.application.ninja.currentDocument.documentRoot.children[myIndex]) |
231 | this._openDoc=true; | 257 | { |
232 | NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) | 258 | this._openDoc=true; |
233 | // this.selectLayer(myIndex); | 259 | this._captureSelection=true; |
234 | // TimelineTrack.retrieveStoredTweens(); | 260 | NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) |
235 | myIndex++; | 261 | myIndex++; |
262 | } | ||
263 | } | ||
264 | else{ | ||