diff options
author | Kruti Shah | 2012-02-07 16:36:58 -0800 |
---|---|---|
committer | Kruti Shah | 2012-02-07 16:36:58 -0800 |
commit | 5bc386c6126e3c6669dd1b524d79c91358716412 (patch) | |
tree | 9764881880602dd01d85bddd60d3b7f555b471ec /js | |
parent | c687a27c990ca17fcd073adec882780916103802 (diff) | |
download | ninja-5bc386c6126e3c6669dd1b524d79c91358716412.tar.gz |
Timeline : Layers & DOM enchancement
- Undo & Redo of Layers within same container
- Undo & Redo of Layers between different containers
- Adding the element on the layer selected else default is the last layer drawn
Signed-off-by: Kruti Shah <kruti.shah@motorola.com>
Diffstat (limited to 'js')
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 478 |
1 files changed, 304 insertions, 174 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 67081cda..0a4a096f 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | |||
@@ -113,12 +113,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
113 | value: false | 113 | value: false |
114 | }, | 114 | }, |
115 | 115 | ||
116 | _isLayerAdded:{ | 116 | _firstTimeLoaded:{ |
117 | value:false | 117 | value:true, |
118 | }, | 118 | writable:true |
119 | |||
120 | addButtonClicked:{ | ||
121 | value:true | ||
122 | }, | 119 | }, |
123 | 120 | ||
124 | _firstLayerDraw:{ | 121 | _firstLayerDraw:{ |
@@ -129,11 +126,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
129 | willDraw: { | 126 | willDraw: { |
130 | value: function() { | 127 | value: function() { |
131 | if (this._isLayer) { | 128 | if (this._isLayer) { |
132 | this.addButtonClicked=false; | 129 | this.insertLayer(); |
133 | this._isElementAdded=true; | 130 | this._isLayer = false;; |
134 | NJevent('newLayer',this) | ||
135 | this._isLayer = false; | ||
136 | this.addButtonClicked=true; | ||
137 | } | 131 | } |
138 | } | 132 | } |
139 | }, | 133 | }, |
@@ -203,7 +197,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
203 | if(this.application.ninja.currentSelectedContainer.id==="UserContent"){ | 197 | if(this.application.ninja.currentSelectedContainer.id==="UserContent"){ |
204 | this._hashKey="123"; | 198 | this._hashKey="123"; |
205 | } | 199 | } |
206 | NJevent('deleteLayer') | 200 | this.removeLayer(); |
207 | } | 201 | } |
208 | }, | 202 | }, |
209 | 203 | ||
@@ -211,23 +205,28 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
211 | value:function(event){ | 205 | value:function(event){ |
212 | var i=0; | 206 | var i=0; |
213 | this.currentParentNode=this.application.ninja.currentSelectedContainer.parentNode; | 207 | this.currentParentNode=this.application.ninja.currentSelectedContainer.parentNode; |
214 | this.removeLayerFromParentUUid = this.application.ninja.currentSelectedContainer.parentNode.uuid; | ||
215 | this.currentElement= event.detail.element; | ||
216 | |||
217 | // if(this._firstLayerDraw===false){ | ||
218 | // while(this.arrLayers.pop()){ | ||
219 | // } | ||
220 | // while(this.arrTracks.pop()){ | ||
221 | // } | ||
222 | // } | ||
223 | |||
224 | this._hashKey = event.detail.element.uuid; | ||
225 | if(this.returnedObject = this.hashInstance.getItem(this._hashKey)){ | ||
226 | this.returnedTrack = this.hashTrackInstance.getItem(this._hashKey); | ||
227 | this._hashFind = true; | ||
228 | NJevent('newLayer'); | ||
229 | 208 | ||
230 | } | 209 | if(this._firstTimeLoaded){ |
210 | this._firstTimeLoaded=false; | ||
211 | }else{ | ||
212 | while(this.arrLayers.pop()){ | ||
213 | } | ||
214 | while(this.arrTracks.pop()){ | ||
215 | } | ||
216 | |||
217 | if(event.detail.element.id==="UserContent"){ | ||
218 | this._hashKey= "123"; | ||
219 | }else{ | ||
220 | this._hashKey = event.detail.element.uuid; | ||
221 | } | ||
222 | |||
223 | if(this.returnedObject = this.hashInstance.getItem(this._hashKey)){ | ||
224 | this.returnedTrack = this.hashTrackInstance.getItem(this._hashKey); | ||
225 | this._hashFind = true; | ||
226 | } | ||
227 | NJevent('newLayer',event.detail); | ||
228 | |||
229 | } | ||
231 | 230 | ||
232 | } | 231 | } |
233 | }, | 232 | }, |
@@ -250,40 +249,52 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
250 | this._hashFind=false; | 249 | this._hashFind=false; |
251 | return; | 250 | return; |
252 | } | 251 | } |
252 | if(event.detail._undoStatus){ | ||
253 | if(this.application.ninja.currentSelectedContainer.id==="UserContent" && event.detail._el.parentElementUUID===123 ){ | ||
254 | dLayer=this.hashInstance.getItem(event.detail._el.parentElementUUID); | ||
255 | while(dLayer[hashVariable]){ | ||
256 | if(dLayer[hashVariable]._layerID === event.detail._el._layerID){ | ||
257 | dLayer[hashVariable].deleted=false; | ||
258 | this.arrLayers.splice(event.detail._layerPosition,1,event.detail._el); | ||
259 | this.arrTracks.splice(event.detail._layerPosition,1,event.detail._track); | ||
260 | break; | ||
261 | |||
262 | } | ||
263 | hashVariable++; | ||
264 | } | ||
253 | 265 | ||
266 | } | ||
267 | |||
268 | else if(event.detail._el.parentElementUUID!==this.application.ninja.currentSelectedContainer.uuid){ | ||
269 | dLayer=this.hashInstance.getItem(event.detail._el.parentElementUUID); | ||
270 | while(dLayer[hashVariable]){ | ||
271 | if(dLayer[hashVariable]._layerID===event.detail._el._layerID){ | ||
272 | dLayer[hashVariable].deleted=false; | ||
273 | parentNode=dLayer[hashVariable].parentElement; | ||
274 | break; | ||
275 | } | ||
276 | hashVariable++; | ||
277 | } | ||
278 | this._setBreadCrumb=true; | ||
279 | NJevent('breadCrumbTrail',{"element":parentNode,"setFlag":this._setBreadCrumb}); | ||
280 | }else{ | ||
281 | dLayer=this.hashInstance.getItem(event.detail._el.parentElementUUID); | ||
282 | while(dLayer[hashVariable]){ | ||
283 | if(dLayer[hashVariable]._layerID === event.detail._el._layerID){ | ||
284 | dLayer[hashVariable].deleted=false; | ||
285 | this.arrLayers.splice(event.detail._layerPosition,1,event.detail._el); | ||
286 | this.arrTracks.splice(event.detail._layerPosition,1,event.detail._track); | ||
287 | break; | ||
288 | |||
289 | } | ||
290 | hashVariable++; | ||
291 | } | ||
292 | } | ||
293 | } | ||
254 | 294 | ||
255 | // if(this.addButtonClicked){ | ||
256 | // layerObject = this.hashInstance.getItem(this.application.ninja.currentSelectedContainer.uuid); | ||
257 | // trackObject = this.hashTrackInstance.getItem(this.application.ninja.currentSelectedContainer.uuid); | ||
258 | // if(layerObject!==undefined){ | ||
259 | // while(layerObject[hashVariable]){ | ||
260 | // if(event.detail.parentElement!==this.application.ninja.currentSelectedContainer){ | ||
261 | // dLayer=this.hashInstance.getItem(event.detail.parentNode.uuid); | ||
262 | // while(dLayer[hashVariable]){ | ||
263 | // if(dLayer[hashVariable].element===event.detail){ | ||
264 | // dLayer[hashVariable].deleted=true; | ||
265 | // parentNode=dLayer[hashVariable].parentElement; | ||
266 | // break; | ||
267 | // } | ||
268 | // hashVariable++; | ||
269 | // } | ||
270 | // this._setBreadCrumb=true; | ||
271 | // NJevent('breadCrumbTrail',{"element":parentNode,"setFlag":this._setBreadCrumb}); | ||
272 | // | ||
273 | // } | ||
274 | // else if(layerObject[hashVariable].element===event.detail){ | ||
275 | // this.arrLayers.splice(layerObject[hashVariable].layerPosition,0,layerObject[hashVariable]); | ||
276 | // this.arrTracks.splice(trackObject[hashVariable].trackPosition,0,trackObject[hashVariable]); | ||
277 | // this._isLayerAdded=true; | ||
278 | // break; | ||
279 | // } | ||
280 | // hashVariable++; | ||
281 | // this._isLayerAdded=false; | ||
282 | // } | ||
283 | // } | ||
284 | // } | ||
285 | 295 | ||
286 | 296 | ||
297 | else{ | ||
287 | var newLayerName = "", | 298 | var newLayerName = "", |
288 | //thingToPush = Layer.create(), | 299 | //thingToPush = Layer.create(), |
289 | thingToPush = {}, | 300 | thingToPush = {}, |
@@ -292,11 +303,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
292 | myIndex = 0; | 303 | myIndex = 0; |
293 | 304 | ||
294 | // Build the thingToPush object | 305 | // Build the thingToPush object |
295 | if(_firstLayerDraw){ | ||
296 | if(this.application.ninja.currentSelectedContainer.id==="UserContent"){ | ||
297 | this._hashKey="123"; | ||
298 | } | ||
299 | } | ||
300 | 306 | ||
301 | this.currentLayerNumber = this.currentLayerNumber +1; | 307 | this.currentLayerNumber = this.currentLayerNumber +1; |
302 | newLayerName = "Layer " + this.currentLayerNumber; | 308 | newLayerName = "Layer " + this.currentLayerNumber; |
@@ -309,8 +315,11 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
309 | thingToPush.arrLayerStyles = []; | 315 | thingToPush.arrLayerStyles = []; |
310 | thingToPush.element=[]; | 316 | thingToPush.element=[]; |
311 | thingToPush.deleted=false; | 317 | thingToPush.deleted=false; |
318 | if(_firstLayerDraw){ | ||
319 | thingToPush.parentElementUUID=this.application.ninja.currentSelectedContainer.uuid; | ||
312 |