aboutsummaryrefslogtreecommitdiff
path: root/js/panels
diff options
context:
space:
mode:
authorJonathan Duran2012-02-07 07:29:32 -0800
committerJonathan Duran2012-02-07 07:29:32 -0800
commit7303780d92bce267eafd3793476674edf17816c9 (patch)
tree349e8079d8cfba12a40d622f0e1b236ff52a0687 /js/panels
parent68f6af70818652821507881daf0abd2e8b6d5d27 (diff)
downloadninja-7303780d92bce267eafd3793476674edf17816c9.tar.gz
Change DOM/layer handling workflow
Signed-off-by: Jonathan Duran <jduran@motorola.com>
Diffstat (limited to 'js/panels')
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js152
1 files changed, 95 insertions, 57 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index a0e2376a..67081cda 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -108,6 +108,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
108 this.initTimelineView(); 108 this.initTimelineView();
109 } 109 }
110 }, 110 },
111
111 _isLayer: { 112 _isLayer: {
112 value: false 113 value: false
113 }, 114 },
@@ -120,6 +121,11 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
120 value:true 121 value:true
121 }, 122 },
122 123
124 _firstLayerDraw:{
125 value:false,
126 writable:true
127 },
128
123 willDraw: { 129 willDraw: {
124 value: function() { 130 value: function() {
125 if (this._isLayer) { 131 if (this._isLayer) {
@@ -155,7 +161,11 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
155 161
156 // Default to one layer for new doc 162 // Default to one layer for new doc
157// this.newLayer(); 163// this.newLayer();
158 NJevent('newLayer'); 164 this._hashKey="123";
165 _firstLayerDraw = false;
166 NJevent('newLayer',this._hashKey);
167 _firstLayerDraw = true;
168
159 // TODO - add condition for existing doc and parse DOM for top level elements 169 // TODO - add condition for existing doc and parse DOM for top level elements
160 } 170 }
161 }, 171 },
@@ -190,6 +200,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
190 value:function(event){ 200 value:function(event){
191 event.stopPropagation(); 201 event.stopPropagation();
192 this._deleteKeyDown=false; 202 this._deleteKeyDown=false;
203 if(this.application.ninja.currentSelectedContainer.id==="UserContent"){
204 this._hashKey="123";
205 }
193 NJevent('deleteLayer') 206 NJevent('deleteLayer')
194 } 207 }
195 }, 208 },
@@ -201,11 +214,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
201 this.removeLayerFromParentUUid = this.application.ninja.currentSelectedContainer.parentNode.uuid; 214 this.removeLayerFromParentUUid = this.application.ninja.currentSelectedContainer.parentNode.uuid;
202 this.currentElement= event.detail.element; 215 this.currentElement= event.detail.element;
203 216
204 while(this.arrLayers.pop()){ 217// if(this._firstLayerDraw===false){
205 } 218// while(this.arrLayers.pop()){
206 while(this.arrTracks.pop()){ 219// }
207 } 220// while(this.arrTracks.pop()){
208 221// }
222// }
209 223
210 this._hashKey = event.detail.element.uuid; 224 this._hashKey = event.detail.element.uuid;
211 if(this.returnedObject = this.hashInstance.getItem(this._hashKey)){ 225 if(this.returnedObject = this.hashInstance.getItem(this._hashKey)){
@@ -237,39 +251,39 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
237 return; 251 return;
238 } 252 }
239 253
240 if(this._isElementAdded){
241 if(this.addButtonClicked){
242 layerObject = this.hashInstance.getItem(this.application.ninja.currentSelectedContainer.uuid);
243 trackObject = this.hashTrackInstance.getItem(this.application.ninja.currentSelectedContainer.uuid);
244 if(layerObject!==undefined){
245 while(layerObject[hashVariable]){
246 if(event.detail.parentElement!==this.application.ninja.currentSelectedContainer){
247 dLayer=this.hashInstance.getItem(event.detail.parentNode.uuid);
248 while(dLayer[hashVariable]){
249 if(dLayer[hashVariable].element===event.detail){
250 dLayer[hashVariable].deleted=true;
251 parentNode=dLayer[hashVariable].parentElement;
252 break;
253 }
254 hashVariable++;
255 }
256 this._setBreadCrumb=true;
257 NJevent('breadCrumbTrail',{"element":parentNode,"setFlag":this._setBreadCrumb});
258 254
259 } 255// if(this.addButtonClicked){
260 else if(layerObject[hashVariable].element===event.detail){ 256// layerObject = this.hashInstance.getItem(this.application.ninja.currentSelectedContainer.uuid);
261 this.arrLayers.splice(layerObject[hashVariable].layerPosition,0,layerObject[hashVariable]); 257// trackObject = this.hashTrackInstance.getItem(this.application.ninja.currentSelectedContainer.uuid);
262 this.arrTracks.splice(trackObject[hashVariable].trackPosition,0,trackObject[hashVariable]); 258// if(layerObject!==undefined){
263 this._isLayerAdded=true; 259// while(layerObject[hashVariable]){
264 break; 260// if(event.detail.parentElement!==this.application.ninja.currentSelectedContainer){
265 } 261// dLayer=this.hashInstance.getItem(event.detail.parentNode.uuid);
266 hashVariable++; 262// while(dLayer[hashVariable]){
267 this._isLayerAdded=false; 263// if(dLayer[hashVariable].element===event.detail){
268 } 264// dLayer[hashVariable].deleted=true;
269 } 265// parentNode=dLayer[hashVariable].parentElement;
270 } 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
271 286
272 if(this._isLayerAdded===false){
273 var newLayerName = "", 287 var newLayerName = "",
274 //thingToPush = Layer.create(), 288 //thingToPush = Layer.create(),
275 thingToPush = {}, 289 thingToPush = {},
@@ -278,6 +292,11 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
278 myIndex = 0; 292 myIndex = 0;
279 293
280 // Build the thingToPush object 294 // Build the thingToPush object
295 if(_firstLayerDraw){
296 if(this.application.ninja.currentSelectedContainer.id==="UserContent"){
297 this._hashKey="123";
298 }
299 }
281 300
282 this.currentLayerNumber = this.currentLayerNumber +1; 301 this.currentLayerNumber = this.currentLayerNumber +1;
283 newLayerName = "Layer " + this.currentLayerNumber; 302 newLayerName = "Layer " + this.currentLayerNumber;
@@ -288,10 +307,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
288 thingToPush.isTransformCollapsed = true; 307 thingToPush.isTransformCollapsed = true;
289 thingToPush.isStyleCollapsed = false; 308 thingToPush.isStyleCollapsed = false;
290 thingToPush.arrLayerStyles = []; 309 thingToPush.arrLayerStyles = [];
291 thingToPush.element=this.layerElement; 310 thingToPush.element=[];
292 thingToPush.deleted=false; 311 thingToPush.deleted=false;
293 thingToPush.parentElement=this.application.ninja.currentSelectedContainer; 312 thingToPush.parentElement=this.application.ninja.currentSelectedContainer;
294 this.layerElement.dataset.parentUUID=this.application.ninja.currentSelectedContainer.uuid; 313 // this.layerElement.dataset.parentUUID=this.application.ninja.currentSelectedContainer.uuid;
295 314
296 newTrack.trackID = this.currentLayerNumber; 315 newTrack.trackID = this.currentLayerNumber;
297 newTrack.isMainCollapsed = true; 316 newTrack.isMainCollapsed = true;
@@ -300,7 +319,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
300 newTrack.isStyleCollapsed = false; 319 newTrack.isStyleCollapsed = false;
301 newTrack.tweens = []; 320 newTrack.tweens = [];
302 321
303
304 // If a layer is selcted, splice the new layer on top 322 // If a layer is selcted, splice the new layer on top
305 // Otherwise, just push the new layer in at the bottom. 323 // Otherwise, just push the new layer in at the bottom.
306 324
@@ -312,20 +330,23 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
312 newTrack.trackPosition=myIndex; 330 newTrack.trackPosition=myIndex;
313 this.arrLayers.splice(myIndex, 0, thingToPush); 331 this.arrLayers.splice(myIndex, 0, thingToPush);
314 this.arrTracks.splice(myIndex, 0, newTrack); 332 this.arrTracks.splice(myIndex, 0, newTrack);
333 this.currentLayerSelected= this.arrLayers[myIndex];
315 this.layerRepetition.selectedIndexes = [myIndex]; 334 this.layerRepetition.selectedIndexes = [myIndex];
316 } else { 335 } else {
317 this.arrLayers.splice(0, 0, thingToPush); 336 this.arrLayers.push(thingToPush);
318 this.arrTracks.splice(0, 0, newTrack); 337 this.arrTracks.push(newTrack);
319 thingToPush.layerPosition=this.arrLayers.length-1; 338 thingToPush.layerPosition=this.arrLayers.length-1;
320