Grow/shrink Line, Oval and Rectangles when changing stroke size.

Other shape types will be handled separately for now.

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

1 files changed, 51 insertions, 39 deletions

diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index 51ddea20..14cdc473 100755
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -22,53 +22,65 @@ exports.ShapesController = Montage.create(CanvasController, {
                 case "strokeSize":
                     // TODO - For now, just handling px units.
                     this.setShapeProperty(el, "strokeSize", value);
-                    // Changing stroke size should grow/shrink the shape from the center.
-                    var delta = ~~(val - el.elementModel.shapeModel.GLGeomObj.getStrokeWidth()),
-                        l = this.application.ninja.elementMediator.getProperty(el, "left", parseInt),
-                        t = this.application.ninja.elementMediator.getProperty(el, "top", parseInt),
-                        w = this.application.ninja.elementMediator.getProperty(el, "width", parseInt),
-                        h = this.application.ninja.elementMediator.getProperty(el, "height", parseInt);
-
-                    if(el.elementModel.selection === "Line")
+                    // TODO - For now, just handle Line, Rectangle and Oval. Eventually, move this into each class's
+                    // setStrokeWidth code like SubPath and BrushStroke do.
+                    var geomType = el.elementModel.shapeModel.GLGeomObj.geomType();
+                    if( (geomType > 0) && (geomType < 4) )
                     {
-                        var slope = el.elementModel.shapeModel.slope;
-                        // set the dimensions
-                        if(slope === "horizontal")
+                        // Changing stroke size should grow/shrink the shape from the center.
+                        var delta = ~~(val - el.elementModel.shapeModel.GLGeomObj.getStrokeWidth()),
+                            l = this.application.ninja.elementMediator.getProperty(el, "left", parseInt),
+                            t = this.application.ninja.elementMediator.getProperty(el, "top", parseInt),
+                            w = this.application.ninja.elementMediator.getProperty(el, "width", parseInt),
+                            h = this.application.ninja.elementMediator.getProperty(el, "height", parseInt);
+
+                        if(geomType === 3)
                         {
-                            h = Math.max(val, 1);
-                        }
-                        else if(slope === "vertical")
-                        {
-                            w = Math.max(val, 1);
-                        }
-                        else
-                        {
-                            var oldXAdj = el.elementModel.shapeModel.GLGeomObj.getXAdj();
-                            var oldYAdj = el.elementModel.shapeModel.GLGeomObj.getYAdj();
-                            var theta = Math.atan(el.elementModel.shapeModel.slope);
-                            var xAdj = Math.abs((val/2)*Math.sin(theta));
-                            var yAdj = Math.abs((val/2)*Math.cos(theta));
-                            var dX = ~~(xAdj*2 - oldXAdj*2);
-                            var dY = ~~(yAdj*2 - oldYAdj*2);
-
-                            if(delta > 0)
+                            var slope = el.elementModel.shapeModel.slope;
+                            // set the dimensions
+                            if(slope === "horizontal")
+                            {
+                                h = Math.max(val, 1);
+                                t -= ~~(delta/2);
+                            }
+                            else if(slope === "vertical")
                             {
-                                l -= dX*2;
-                                t -= dY*2;
+                                w = Math.max(val, 1);
+                                l -= ~~(delta/2);
+                            }
+                            else
+                            {
+                                var oldXAdj = el.elementModel.shapeModel.GLGeomObj.getXAdj();
+                                var oldYAdj = el.elementModel.shapeModel.GLGeomObj.getYAdj();
+                                var theta = Math.atan(el.elementModel.shapeModel.slope);
+                                var xAdj = Math.abs((val/2)*Math.sin(theta));
+                                var yAdj = Math.abs((val/2)*Math.cos(theta));
+                                var dX = ~~(xAdj*2 - oldXAdj*2);
+                                var dY = ~~(yAdj*2 - oldYAdj*2);
+
+                                l -= dX;
+                                t -= dY;
                                 w += dX*2;
                                 h += dY*2;
-                            }
-
-                            el.elementModel.shapeModel.GLGeomObj.setXAdj(xAdj);
-                            el.elementModel.shapeModel.GLGeomObj.setYAdj(yAdj);
 
+                                el.elementModel.shapeModel.GLGeomObj.setXAdj(xAdj);
+                                el.elementModel.shapeModel.GLGeomObj.setYAdj(yAdj);
+                            }
+                        }
+                        else
+                        {
+                            l -= ~~(delta/2);
+                            t -= ~~(delta/2);
+                            w += delta;
+                            h += delta;
                         }
+                        this.application.ninja.elementMediator.setProperties([el],
+                                                                            { "left": [l + "px"],
+                                                                              "top": [t + "px"],
+                                                                              "width": [w + "px"],
+                                                                              "height": [h + "px"] },
+                                                                            eventType, source );
                     }
-                    this.application.ninja.elementMediator.setProperties([el],
-                                                    { "left": [l + "px"],
-                                                      "top": [t + "px"],
-                                                      "width": [w + "px"],
-                                                      "height": [h + "px"] }, eventType, source );
                     el.elementModel.shapeModel.GLGeomObj.setStrokeWidth(val);
                     el.elementModel.shapeModel.GLGeomObj.buildBuffers();
                     el.elementModel.shapeModel.GLWorld.render();