61 files changed, 1217 insertions, 1980 deletions

diff --git a/js/clipboard/internal-ops/elements-clipboard-agent.js b/js/clipboard/internal-ops/elements-clipboard-agent.js
index cd8de46e..1a4bfdba 100644
--- a/js/clipboard/internal-ops/elements-clipboard-agent.js
+++ b/js/clipboard/internal-ops/elements-clipboard-agent.js
@@ -232,7 +232,8 @@ var ElementsClipboardAgent = exports.ElementsClipboardAgent = Montage.create(Com
             canvas.height = sourceCanvas.height;
             //end - clone copied canvas
 
-            if (!canvas.getAttribute( "data-RDGE-id" )) canvas.setAttribute( "data-RDGE-id", document.application.njUtils.generateRandom() );
+            //genenerate data-RDGE-id only for shapes
+            if (sourceCanvas.elementModel.shapeModel && !canvas.getAttribute( "data-RDGE-id" )) canvas.setAttribute( "data-RDGE-id", document.application.njUtils.generateRandom() );
 
             if(sourceCanvas.ownerDocument.defaultView.getComputedStyle(sourceCanvas).getPropertyValue("position") === "absolute"){
                 styles = canvas.elementModel.data || {};
@@ -275,7 +276,8 @@ var ElementsClipboardAgent = exports.ElementsClipboardAgent = Montage.create(Com
             canvas.width = styles.width;
             canvas.height = styles.height;
 
-            if (!canvas.getAttribute( "data-RDGE-id" )) canvas.setAttribute( "data-RDGE-id", document.application.njUtils.generateRandom() );
+            //genenerate data-RDGE-id only for shapes
+            if (worldJson && !canvas.getAttribute( "data-RDGE-id" )) canvas.setAttribute( "data-RDGE-id", document.application.njUtils.generateRandom() );
 
             this.pastePositioned(canvas, styles, false/*from copy*/);
 
diff --git a/js/components/gradientpicker.reel/gradientpicker.js b/js/components/gradientpicker.reel/gradientpicker.js
index 6071f3c6..f912eb51 100755
--- a/js/components/gradientpicker.reel/gradientpicker.js
+++ b/js/components/gradientpicker.reel/gradientpicker.js
@@ -43,7 +43,7 @@ exports.GradientPicker = Montage.create(Component, {
         get: function() {return this._mode;},
         set: function(value) {
                 //
-                this.application.ninja.colorController.colorPopupManager.hideColorChipPopup();
+                this.application.ninja.colorController.colorPopupManager.hideGradientChipPopup();
                 //
             this._mode = value;
             //
@@ -132,7 +132,7 @@ exports.GradientPicker = Montage.create(Component, {
         value: function(data, silent) {
                 if (this.application.ninja.colorController.colorPopupManager) {
                         //Hiding any open popups (of gradient buttons)
-                        this.application.ninja.colorController.colorPopupManager.hideColorChipPopup();
+                        this.application.ninja.colorController.colorPopupManager.hideGradientChipPopup();
                         //Creating stop elements
                         var stop = document.createElement('div'),
                                 holder = document.createElement('div'),
@@ -147,6 +147,7 @@ exports.GradientPicker = Montage.create(Component, {
                                 stop.addEventListener('mouseup', this, false);
                                 //Storing refereces to buttons and actual stop container
                                 button.stop = stop;
+                                tooltip.stop = stop;
                                 stop.button = button;
                                 //Adding stop to container
                                 this.trackChips.appendChild(stop);
@@ -160,7 +161,7 @@ exports.GradientPicker = Montage.create(Component, {
                                 //Initialing button with color data
                                 button.color(data.color.mode, data.color.value);
                                 //Button popup data
-                                button.props = {side: 'top', align: 'center', nocolor: false, wheel: true, palette: true, gradient: false, image: false, offset: -84, panel: true};
+                                button.props = {side: 'top', align: 'center', nocolor: false, wheel: true, palette: false, gradient: false, image: false, offset: -84, gradientPopup: true, history: false};
                                 //Listening for color events from button
                                 button.addEventListener('change', this, false);
                                 //Dispatching event depending on type of mode
@@ -263,7 +264,7 @@ exports.GradientPicker = Montage.create(Component, {
                 //
                 this._updating = true;
                 //
-                this.application.ninja.colorController.colorPopupManager.hideColorChipPopup();
+                this.application.ninja.colorController.colorPopupManager.hideGradientChipPopup();
                 //
                 if (e._event.y > this._trackData.y+70 || e._event.y < this._trackData.y) {
                         this.removeStop(this.currentStop);
diff --git a/js/components/layout/stage-mode.reel/stage-mode.js b/js/components/layout/stage-mode.reel/stage-mode.js
index cb42276b..b772d688 100755
--- a/js/components/layout/stage-mode.reel/stage-mode.js
+++ b/js/components/layout/stage-mode.reel/stage-mode.js
@@ -9,17 +9,17 @@ var Montage = require("montage/core/core").Montage,
 
 exports.StageMode = Montage.create(Component, {
 
-    _livePreview: {
+    _chromePreview: {
         value: null
     },
 
-    livePreview: {
+    chromePreview: {
         get: function() {
-            return this._livePreview;
+            return this._chromePreview;
         },
         set: function(value) {
-            if(value !== this._livePreview) {
-                this._livePreview = value;
+            if(value !== this._chromePreview) {
+                this._chromePreview = value;
                 this.needsDraw = true;