15 files changed, 147 insertions, 149 deletions

diff --git a/js/panels/Materials/materials-popup.reel/materials-popup.css b/js/panels/Materials/materials-popup.reel/materials-popup.css
index 89233c64..2d339411 100755
--- a/js/panels/Materials/materials-popup.reel/materials-popup.css
+++ b/js/panels/Materials/materials-popup.reel/materials-popup.css
@@ -37,21 +37,53 @@
 .mp_property
 {
     height:40px;
+    position: relative;
 }
 
 .mp_property > .prop-label
 {
-  float: left;
-  /*width:86px;*/
-  margin: 0px 8px 2px 5px;
+    position:relative;
+    top:12px;
+    float: left;
+    width: 100px;
 }
 
 .mp_property > .prop-controller
 {
-  float: right;
-  clear: left;
-  width: auto;
-  margin: 0px 0px 3px 0px;
+    position:relative;
+    top:12px;
+    left: 10px;
+    float: left;
+}
+
+.mp_property .hottext,
+.mp_property .hottextInput
+{
+    width: 30px;
+}
+
+.mp_property .button
+{
+    width: 30px;
+    height: 20px;
+}
+
+.mp_property .inputRow
+{
+    top: 8px;
+    position: relative;
+}
+
+.mp_properties_list
+{
+   padding-bottom: 8px;
+}
+
+.mp_properties_list > .mp_property > .colortoolbar
+{
+        width: 27px !important;
+        height: 27px !important;
+    overflow:hidden !important;
 }
 
 .mp_buttons {
diff --git a/js/panels/Materials/materials-popup.reel/materials-popup.html b/js/panels/Materials/materials-popup.reel/materials-popup.html
index 34f68554..ae0ee2c8 100755
--- a/js/panels/Materials/materials-popup.reel/materials-popup.html
+++ b/js/panels/Materials/materials-popup.reel/materials-popup.html
@@ -104,7 +104,7 @@
 
             <hr />
 
-            <div id="mp_properties_list" class="mp_properties_list" style="-webkit-user-select: none;">
+            <div id="mp_properties_list" class="mp_properties_list">
                 <div id="mp_property" class="mp_property"></div>
             </div>
 
diff --git a/js/panels/Materials/materials-popup.reel/materials-popup.js b/js/panels/Materials/materials-popup.reel/materials-popup.js
index b44761bc..bbccf45d 100755
--- a/js/panels/Materials/materials-popup.reel/materials-popup.js
+++ b/js/panels/Materials/materials-popup.reel/materials-popup.js
@@ -237,7 +237,7 @@ exports.MaterialsPopup = Montage.create(Component, {
             }
             else
             {
-                this.materialsData = this._dummyData1;
+                this.materialsData = this._dummyData1.slice(0);
             }
             
            this.needsDraw = true;
diff --git a/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css b/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css
index 129b9771..067285ae 100644
--- a/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css
+++ b/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css
@@ -10,12 +10,12 @@
     height: 100%;
 }
 .maintimeline{
-    border-style: double;
     -webkit-box-flex: 1;
     display: -webkit-box;
-    -webkit-box-orient: horizontal
+    -webkit-box-orient: horizontal;
     height : 100%;
     position: relative;
+    margin-top:1px;
 }
 .leftinside{
     height: 100%;
diff --git a/js/panels/presets/animations-presets.reel/animations-presets.js b/js/panels/presets/animations-presets.reel/animations-presets.js
index 272f6c5b..92437cfd 100644
--- a/js/panels/presets/animations-presets.reel/animations-presets.js
+++ b/js/panels/presets/animations-presets.reel/animations-presets.js
@@ -22,52 +22,7 @@ exports.AnimationsLibrary = Montage.create(Component, {
     },
     handleNodeActivation: {
         value: function(presetData) {
-            //debugger;
-            var selection = this.application.ninja.selectedElements,
-                stylesController = this.application.ninja.stylesController,
-                selectorBase = presetData.selectorBase,
-                self = this;
-
-            if(!selection || !selection.length || selection.length === 0) {
-                return false;
-            }
-
-            selectorBase = stylesController.generateClassName(selectorBase);
-
-            presetData.rules.forEach(function(rule) {
-                if(rule.isKeyFrameRule) {
-                    this.application.ninja.stylesController.addRule(
-                        '@-webkit-keyframes ' + presetData.selectorBase,
-                        this.stringifyKeys(rule.keys)
-                    );
-                } else {
-                    this.application.ninja.stylesController.addRule('.' + selectorBase + rule.selectorSuffix, rule.styles);
-                }
-
-            }, this);
-
-            selection.forEach(function(el) {
-                el._element.classList.add(selectorBase);
-            }, this);
-
-        }
-    },
-
-    stringifyKeys : {
-        value: function(keysArray) {
-            var keysString = '';
-
-            keysArray.forEach(function(key) {
-                var styles = '', style;
-
-                for(style in key.styles) {
-                    styles += style + ':' + key.styles[style] + '; ';
-                }
-
-                keysString += key.keyText + ' {' + styles + ' }';
-            });
-
-            return keysString;
+            this.application.ninja.presetsController.applyPreset(presetData);
         }
         }
 });
diff --git a/js/panels/presets/default-animation-presets.js b/js/panels/presets/default-animation-presets.js
index 4793c356..578c1622 100644
--- a/js/panels/presets/default-animation-presets.js
+++ b/js/panels/presets/default-animation-presets.js
@@ -13,7 +13,6 @@ exports.animationPresets = {
                 "text": "Border Morph",
                 "selectorBase" : "border-morph",
                 "rules" : [{
-                    "selectorSuffix" : "",
                     "styles" : {
                         "-webkit-animation-name": "border-morph",
                         "-webkit-animation-duration": "2s",
@@ -93,7 +92,6 @@ exports.animationPresets = {
                 "text": "Rotater",