1 files changed, 605 insertions, 174 deletions

diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js
index a2d6444d..776d5ec8 100644
--- a/js/panels/Timeline/Layer.reel/Layer.js
+++ b/js/panels/Timeline/Layer.reel/Layer.js
@@ -12,6 +12,7 @@ var LayerStyle = require("js/panels/Timeline/Style.reel").LayerStyle;
 var DynamicText = require("montage/ui/dynamic-text.reel").DynamicText;
 var defaultEventManager = require("montage/core/event/event-manager").defaultEventManager;
 var nj = require("js/lib/NJUtils").NJUtils;
+var ElementsMediator = require("js/mediators/element-mediator").ElementMediator;
 
 var Layer = exports.Layer = Montage.create(Component, {
 
@@ -78,6 +79,7 @@ var Layer = exports.Layer = Montage.create(Component, {
         value: false
     },
     styleRepetition : {
+        serializable: true,
         get: function() {
                 return this._styleRepetition;
         },
@@ -88,10 +90,39 @@ var Layer = exports.Layer = Montage.create(Component, {
     _styleCounter : {
         value: 0
     },
+    styleCounter:{
+        serializable:true,
+        get:function () {
+            return this._styleCounter;
+        },
+        set:function (newVal) {
+            this._styleCounter = newVal;
+        }
+    },
+    _selectedStyleIndex: {
+        value: false
+    },
+    selectedStyleIndex: {
+        get: function() {
+                return this._selectedStyleIndex;
+        },
+        set: function(newVal) {
+                if (typeof(newVal) === "undefined") {
+                        return;
+                }
+                if (newVal !== this._selectedStyleIndex) {
+                        this._selectedStyleIndex = newVal;
+                        this.layerData.selectedStyleIndex = newVal;
+                }
+        }
+    },
+    _storedStyleIndex : {
+        value: false
+    },
 
-        /* Layer models: the name, ID, and selected and animation booleans for the layer */
+    /* Layer models: the name, ID, and selected and animation booleans for the layer */
     _layerName:{
-        value: "Default Layer Name"
+        value: ""
     },
     
     layerName:{
@@ -100,13 +131,22 @@ var Layer = exports.Layer = Montage.create(Component, {
             return this._layerName;
         },
         set:function(newVal){
+                        if (this._layerEditable.value !== newVal) {
+                                this._layerEditable.value = newVal;
+                        }
+                        if (this._layerName !== newVal) {
+                                this._layerName = newVal;
+                        }
+                        if (this.layerData.layerName !== newVal) {
+                                this.layerData.layerName = newVal;
+                        }
 
-                        this._layerEditable.value = newVal;
-                this._layerName = newVal;
-                this.layerData.layerName = newVal;
                 if (typeof(this.dynamicLayerName) !== "undefined") {
-                        this.dynamicLayerName.value = newVal;
+                        if (this.dynamicLayerName.value !== newVal) {
+                                this.dynamicLayerName.value = newVal;
+                        }
                 }
+                this.needsDraw = true;
         }
     },
     _layerID:{
@@ -150,6 +190,20 @@ var Layer = exports.Layer = Montage.create(Component, {
         }
     },
     
+    _stageElement: {
+        value: null
+    },
+    
+    stageElement: {
+        get: function() {
+                return this._stageElement;
+        },
+        set: function(newVal) {
+                this._stageElement = newVal;
+                this.layerData.stageElement = newVal;
+        }
+    },
+    
     
     _elementsList : {
         value: []
@@ -164,7 +218,7 @@ var Layer = exports.Layer = Montage.create(Component, {
         }
     },
     
-    /* Position and Transform hottext values */
+    /* Position and Size hottext values */
     _dtextPositionX : {
         value:null
     },
@@ -179,7 +233,6 @@ var Layer = exports.Layer = Montage.create(Component, {
                         this._dtextPositionX = value;
                         this.layerData.dtextPositionX = value;
                 }
-            
         }
     },
     
@@ -237,60 +290,6 @@ var Layer = exports.Layer = Montage.create(Component, {
         }
     },
     
-    _dtextSkewX : {
-        value:null
-    },
-
-    dtextSkewX:{
-        serializable: true,
-        get:function(){
-            return this._dtextSkewX;
-        },
-        set:function(value){
-                if (this._dtextSkewX !== value) {
-                        this._dtextSkewX = value;
-                        this.layerData.dtextSkewX = value;
-                }
-            
-        }
-    },
-    
-    _dtextSkewY : {
-        value:null
-    },
-
-    dtextSkewY:{
-        serializable: true,
-        get:function(){
-            return this._dtextSkewY;
-        },
-        set:function(value){
-                if (this._dtextSkewY !== value) {
-                        this._dtextSkewY = value;
-                        this.layerData.dtextSkewY = value;
-                }
-            
-        }
-    },
-    
-    _dtextRotate : {
-        value:null
-    },
-
-    dtextRotate:{
-        serializable: true,
-        get:function(){
-            return this._dtextRotate;
-        },
-        set:function(value){
-                if (this._dtextRotate !== value) {
-                        this._dtextRotate = value;
-                        this.layerData.dtextRotate = value;
-                }
-            
-        }
-    },
-    
     /* isSelected: whether or not the layer is currently selected. */
     _isSelected:{
         value: false
@@ -306,6 +305,10 @@ var Layer = exports.Layer = Montage.create(Component, {
                         if (value === false) {
                                 // If changing from true to false, we need to deselect any associated styles
                                 this.selectStyle(false);
+                        } else {
+                            if (this._storedStyleIndex !== false) {
+                                this.selectStyle(this._storedStyleIndex);
+                            }
                         }
                         this._isSelected = value;
                         this.layerData.isSelected = value;
@@ -365,6 +368,41 @@ var Layer = exports.Layer = Montage.create(Component, {
                 this.layerData.isVisible = value;
         }
     },
+
+    _isLock:{
+        value: false
+    },
+
+    isLock:{
+        get:function(){
+            return this._isLock;
+        },
+        set:function(value){
+            if (this._isLock !== value) {
+                this._isLock = value;