Timeline : Changing the order of the arrLayers being built

Signed-off-by: Kruti Shah <kruti.shah@motorola.com>

1 files changed, 159 insertions, 133 deletions

diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index 0185d448..ce52d1f3 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -32,6 +32,20 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         }
     },
 
+    _temparrLayers:{
+        value:[]
+    },
+
+    temparrLayers:{
+        get:function () {
+            return this._temparrLayers;
+        },
+        set:function (newVal) {
+            this._temparrLayers = newVal;
+        }
+    },
+
+
     _layerRepetition:{
         value:null
     },
@@ -46,17 +60,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
     },
 
     _cacheArrays : {
-        value: function() {
-                if (this._boolCacheArrays) {
-                                this.application.ninja.currentDocument.tlArrLayers = this.arrLayers;
+        value: function() {
+            if (this._boolCacheArrays) {
+                this.application.ninja.currentDocument.tlArrLayers = this.arrLayers;
 
-                }
-        }
+            }
+        }
     },
     
     // Set to false to skip array caching array sets in current document
     _boolCacheArrays : {
-        value: true
+        value: true
     },
 
     _currentLayerNumber:{
@@ -233,39 +247,39 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
     },
     /* === END: Draw cycle === */
     /* === BEGIN: Controllers === */
-        // Bind all document-specific events (pass in true to unbind)
-        _bindDocumentEvents : {
-                value: function(boolUnbind) {
-                        var arrEvents = ["deleteLayerClick", 
-                                                         "newLayer", 
-                                                         "deleteLayer",
-                                                         "elementAdded", 
-                                                         "elementDeleted",
-                                                         "selectionChange"],
-                                i,
-                                arrEventsLength = arrEvents.length;
-                                
-                        if (boolUnbind) {
-                                for (i = 0; i < arrEventsLength; i++) {
-                                        this.eventManager.removeEventListener(arrEvents[i], this, false);
-                                }
-                        } else {
-                                for (i = 0; i < arrEventsLength; i++) {
-                                        this.eventManager.addEventListener(arrEvents[i], this, false);
-                                }
+    // Bind all document-specific events (pass in true to unbind)
+    _bindDocumentEvents : {
+        value: function(boolUnbind) {
+            var arrEvents = ["deleteLayerClick",
+                             "newLayer",
+                             "deleteLayer",
+                             "elementAdded",
+                             "elementDeleted",
+                             "selectionChange"],
+                i,
+                arrEventsLength = arrEvents.length;
+                
+            if (boolUnbind) {
+                for (i = 0; i < arrEventsLength; i++) {
+                    this.eventManager.removeEventListener(arrEvents[i], this, false);
+                }
+            } else {
+                for (i = 0; i < arrEventsLength; i++) {
+                    this.eventManager.addEventListener(arrEvents[i], this, false);
+                }
                 Object.defineBinding(this, "breadCrumbContainer", {
                     boundObject: this.application.ninja,
                     boundObjectPropertyPath:"currentSelectedContainer",
                     oneway: true
                 });
-                        }
-                }
-        },
-        
-        initTimeline : {
-                value: function() {
-                        // Set up basic Timeline functions: event listeners, etc.  Things that only need to be run once.
-                        this.layout_tracks = this.element.querySelector(".layout-tracks");
+            }
+        }
+    },
+    
+    initTimeline : {
+        value: function() {
+            // Set up basic Timeline functions: event listeners, etc.  Things that only need to be run once.
+            this.layout_tracks = this.element.querySelector(".layout-tracks");
             this.layout_markers = this.element.querySelector(".layout_markers");
 
             this.newlayer_button.identifier = "addLayer";
@@ -279,73 +293,74 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
             this.playhead.addEventListener("mousedown", this.startPlayheadTracking.bind(this), false);
             this.playhead.addEventListener("mouseup", this.stopPlayheadTracking.bind(this), false);
             this.time_markers.addEventListener("click", this.updatePlayhead.bind(this), false);
-                }
-        },
-        
+        }
+    },
+    
     initTimelineForDocument:{
         value:function () {
             var myIndex;
-                        this.drawTimeMarkers();
+            this.drawTimeMarkers();
             // Document switching
-                        // Check to see if we have saved timeline information in the currentDocument.
-                        if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined") {
-                                // No, we have no information stored.  Create it.
-                                this.application.ninja.currentDocument.isTimelineInitialized = true;
-                                this.application.ninja.currentDocument.tlArrLayers = [];
+            // Check to see if we have saved timeline information in the currentDocument.
+            if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined") {
+                // No, we have no information stored.  Create it.
+                this.application.ninja.currentDocument.isTimelineInitialized = true;
+                this.application.ninja.currentDocument.tlArrLayers = [];
                 this.application.ninja.currentDocument.tllayerNumber = 0;
                 this.application.ninja.currentDocument.tlLayerHashTable=[];
                 this.hashKey = this.application.ninja.currentSelectedContainer.uuid;
 
-                                // Loop through the DOM of the document to find layers and animations.
-                                // Fire off events as they are found.
-                    if(!this.application.ninja.documentController.creatingNewFile){
-                        if(this.application.ninja.currentDocument.documentRoot.children[0]){
-                            myIndex=0;
-                            while(this.application.ninja.currentDocument.documentRoot.children[myIndex])
-                            {
-                                this._openDoc=true;
+                // Loop through the DOM of the document to find layers and animations.
+                // Fire off events as they are found.
+                if(!this.application.ninja.documentController.creatingNewFile){
+                    if(this.application.ninja.currentDocument.documentRoot.children[0]){
+                        myIndex=0;
+                        while(this.application.ninja.currentDocument.documentRoot.children[myIndex])
+                        {
+                            this._openDoc=true;
                             this.restoreLayer(this.application.ninja.currentDocument.documentRoot.children[myIndex]);
-                                myIndex++;
-                                                }
-                        }
-                        else{
+                            myIndex++;
+                        }
+                    }
+                    else{
                         this.restoreLayer(1);
-                            this.selectLayer(0);
-                        }
-                    }else{
+                        this.selectLayer(0);
+                    }
+                }else{
                     this.createNewLayer(1);
-                        this.selectLayer(0);
-        
-                    }
-                    // After recreating the tracks and layers, store the result in the currentDocument.
-                                this.application.ninja.currentDocument.tlArrLayers = this.arrLayers;
+                    this.selectLayer(0);
+    
+                }
+                // After recreating the tracks and layers, store the result in the currentDocument.
+                this.arrLayers=this.temparrLayers;
+                this.application.ninja.currentDocument.tlArrLayers = this.arrLayers;
                 this.application.ninja.currentDocument.tllayerNumber = this.currentLayerNumber;
                 this.application.ninja.currentDocument.tlLayerHashTable = this.hashInstance;
                 this.application.ninja.currentDocument.tlElementHashTable = this.hashElementMapToLayer;
                 this.application.ninja.currentDocument.hashKey=this.hashKey;
-                        } else {
-                                // we do have information stored.  Use it.
-                                this._boolCacheArrays = false;
-                                this.arrLayers = this.application.ninja.currentDocument.tlArrLayers;
+            } else {
+                // we do have information stored.  Use it.
+                this._boolCacheArrays = false;
+                this.arrLayers = this.application.ninja.currentDocument.tlArrLayers;