Updated color code to handle shapes.

Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>

2 files changed, 42 insertions, 3 deletions

diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index f254220c..8a0735f7 100644
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -83,13 +83,52 @@ var ElementController = exports.ElementController = Montage.create(NJComponent,
 
     setColor: {
         value: function(el, color, isFill) {
+            var mode = color.mode;
             if(isFill)
             {
-                this.application.ninja.stylesController.setElementStyle(el, "background-color", color.color.css);
+                if(mode)
+                {
+                    switch (mode) {
+                        case 'nocolor':
+                            this.setProperty(el, "background-image", "none");
+                            this.setProperty(el, "background-color", "none");
+                            break;
+                        case 'gradient':
+                            this.setProperty(el, "background-image", color.color.css);
+                            this.setProperty(el, "background-color", "none");
+                            break;
+                        default:
+                            this.setProperty(el, "background-image", "none");
+                            this.setProperty(el, "background-color", color.color.css);
+                    }
+                }
+                else
+                {
+                    this.application.ninja.stylesController.setElementStyle(el, "background-color", color.color.css);
+                }
             }
             else
             {
-                this.application.ninja.stylesController.setElementStyle(el, "border-color", color.color.css);
+                if(mode)
+                {
+                    switch (mode) {
+                        case 'nocolor':
+                            this.setProperty(el, "border-image", "none");
+                            this.setProperty(el, "border-color", "none");
+                            break;
+                        case 'gradient':
+                            this.setProperty(el, "border-image", color.color.css);
+                            this.setProperty(el, "border-color", "none");
+                            break;
+                        default:
+                            this.setProperty(el, "border-image", "none");
+                            this.setProperty(el, "border-color", color.color.css);
+                    }
+                }
+                else
+                {
+                    this.application.ninja.stylesController.setElementStyle(el, "border-color", color.color.css);
+                }
             }
         }
     },
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index d34644a7..92353f28 100644
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -168,7 +168,7 @@ exports.ShapesController = Montage.create(CanvasController, {
     setColor: {
         value: function(el, color, isFill) {
             // TODO - Format color for webGL before setting
-            color = color.webGlColor;
+            color = color.webGlColor || color.color.webGlColor;
             if(isFill)
             {
                 el.elementModel.shapeModel.GLGeomObj.setFillColor(color);