Squashed commit of the following:

commit 0285afe3d4bd458a51f11241f13ea6ffdb0283ed
Merge: 2f9f5e3 16d06ba
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Thu Jul 19 10:54:25 2012 -0700

    Merge branch 'refs/heads/ninja-mqg734-master' into StageToolDrawingOptimizations

commit 2f9f5e369eb96f6c81b5e4bcbe09b418825e2864
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Wed Jul 18 17:15:19 2012 -0700

    Fixed selection bounds not drawing in nested tags.

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

commit b0a3507f9d27579ad511c69314a09136d7f7c6a0
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Wed Jul 18 11:07:44 2012 -0700

    Layout info needs to redraw if stage is updated.

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

commit 63c5e0bf52c33706ba597cb69f7794e287bd0f06
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Tue Jul 17 15:40:54 2012 -0700

    Per feedback from QE, we are still going to draw tool feedback on each mouse move so the selection bounds are not out of sync with the elements.

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

commit 0599a742092b985c4002977e501e3b457173f1d9
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Tue Jul 17 15:28:25 2012 -0700

    Fixed grid not drawing correctly when switching documents and when adding/removing elements.

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

commit fd9410606ee6358910d65b2cb5f71812fd44a7c4
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Tue Jul 17 11:36:09 2012 -0700

    Updated drawing feedback to handle matrix 2d values entered via CSS Panel.

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

commit 559c16c7ac8c9f40b94a011a6f932d4f97df66a7
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Mon Jul 16 17:14:28 2012 -0700

    IKNinja-751 - Selection boundary doesn't follow the transform applied in the CSS Panel.

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

commit e2da5340159db5cd6f75bf6c9b7eb9cbf959e5cd
Merge: 7cc5de3 5146f22
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Mon Jul 16 15:36:28 2012 -0700

    Merge branch 'refs/heads/ninja-mqg734-master' into StageToolDrawingOptimizations

commit 7cc5de39e41b4220f53c91b15b0cf0ed53e0b0f6
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Mon Jul 16 14:52:06 2012 -0700

    Check if ownerDocument.defaultValue is null.

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

commit 5ae97995a28a4b06fb7f8703eb8090ea16d88acd
Merge: d17974d 0ede302
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Mon Jul 16 09:27:22 2012 -0700

    Merge branch 'refs/heads/ninja-mqg734-master' into StageToolDrawingOptimizations

commit d17974d77273bb635311cb6466f4427cf4d9e5d4
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Mon Jul 16 08:45:05 2012 -0700

    Pass in selectedElements array directly to drawUtils when drawing selection bounds instead of creating a duplicate array.

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

commit 0b1ea3144cb3e2c1d272f60da32423d0604ace3b
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Fri Jul 13 14:03:40 2012 -0700

    Fixed line tool not drawing the width and height info.

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

commit b9c70e8d9ae324aa21fa5490edc71d8503bcefbc
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Fri Jul 13 12:42:25 2012 -0700

    Used cached offsetWidth and offsetHeight.

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

commit 9e17ac7124745ba745014efe149b31dee4fe658f
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Thu Jul 12 16:25:41 2012 -0700

    Converting tabs to spaces … again!

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

commit 351726c951bb73c28f0e15ea1ab32e85cc735688
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Thu Jul 12 16:14:31 2012 -0700

    Tabs should be 4 spaces.

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

commit 250c419aa2dbcb10f012817ee7039aca77cb2518
Merge: 3f8d61a 2880e1d
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Thu Jul 12 16:08:31 2012 -0700

    Merge branch 'refs/heads/ninja-mqg734-master' into StageToolDrawingOptimizations

commit 3f8d61a676da3992947ed9a2ed0e449780fcfbe0
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Thu Jul 12 15:53:44 2012 -0700

    Rotate tool was not working immediately after switching selection and selection bounds were not drawing after resizing canvases.

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

commit e2e1f81e3b6917e1032e1b99b79c266937f3bb25
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Thu Jul 12 12:15:59 2012 -0700

    Single draw cycle for stage updates and tool drawings.

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

commit 95a90b4c95ee3163c97bea317144366674e49ade
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Mon Jun 18 11:46:38 2012 -0700

    Single draw cycle for the stage and layout.

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

commit 21966b1515d80d2161a14e5a19bc66f3f49a92ce
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Fri Jun 15 13:33:14 2012 -0700

    Cache element offsets, including offsetParent.

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

commit 80c563c8ba06149691c6c1e754dd9a5e43bc7d4b
Author: Nivesh Rajbhandari <mqg734@motorola.com>
Date:   Mon Jul 9 17:30:00 2012 -0700

    Open materials editor popup next to PI button.

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

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

3 files changed, 431 insertions, 330 deletions

diff --git a/js/helper-classes/3D/draw-utils.js b/js/helper-classes/3D/draw-utils.js
index 869de213..b59bbf39 100755
--- a/js/helper-classes/3D/draw-utils.js
+++ b/js/helper-classes/3D/draw-utils.js
@@ -42,7 +42,6 @@ var StageLine = require("js/helper-classes/3D/StageLine").StageLine;
 
 
 var DrawUtils = exports.DrawUtils = Montage.create(Component, {
-
     ///////////////////////////////////////////////////////////////////////
     // Instance variables
     ///////////////////////////////////////////////////////////////////////
@@ -97,7 +96,7 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
     _selectionCtr : {value: null, writable: true },
 
     // Properties that require element planes to be updated
-    _updatePlaneProps : {value: ["matrix", "left", "top", "width", "height"], writable: false },
+    _updatePlaneProps : {value: ["matrix", "left", "top", "width", "height", "border", "border-width", "border-style", "-webkit-transform"], writable: false },
     _recalculateScrollOffsets : { value: false },
 
     ///////////////////////////////////////////////////////////////////////
@@ -106,33 +105,33 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
     setDrawingSurfaceElement : { value: function( s ) {  this._drawingSurfaceElt = s;  if (s)  this._drawingContext = s.getContext("2d");     }},
     getDrawingSurfaceElement : { value: function()          {  return this._drawingSurfaceElt;      }},
 
-    getDrawingContext : { value: function()         {  return this._drawingContext;         }},
+    getDrawingContext : { value: function()            {  return this._drawingContext;            }},
 
     setSourceSpaceElement : { value: function(ss)          {  this._sourceSpaceElt = ss;           }},
     getSourceSpaceElement : { value: function()            {  return this._sourceSpaceElt;         }},
 
     getWorkingPlane : { value: function()            {  return this._workingPlane;           }},
-    setWorkingPlane : { value: function (wp)            { this._workingPlane = wp;              }},
+    setWorkingPlane : { value: function (wp)            { this._workingPlane = wp;                }},
 
-    getGridHorizontalSpacing : { value: function()  {  return this._gridHorizontalSpacing;      }},
+    getGridHorizontalSpacing : { value: function()    {  return this._gridHorizontalSpacing;        }},
     getGridVerticalSpacing : { value: function()    {  return this._gridVerticalSpacing;        }},
     getGridHorizontalLineCount : { value: function()    {  return this._gridHorizontalLineCount;    }},
-    getGridVerticalLineCount : { value: function()  {  return this._gridVerticalLineCount;  }},
-    getGridOrigin : { value: function() {  return this._gridOrigin.slice(0);            }},
+    getGridVerticalLineCount : { value: function()    {  return this._gridVerticalLineCount;    }},
+    getGridOrigin : { value: function()    {  return this._gridOrigin.slice(0);            }},
 
-    isDrawingGrid : { value: function()         {  return this.drawXY || this.drawYZ || this.drawXZ;    }},
-    isDrawingElementNormal : { value: function()            {  return this.drawElementN }},
+    isDrawingGrid : { value: function()            {  return this.drawXY || this.drawYZ || this.drawXZ;    }},
+    isDrawingElementNormal : { value: function()            {  return this.drawElementN    }},
 
-    getLineColor : { value: function()          {  return this._lineColor;                  }},
-    setLineColor : { value: function( color )       {  this._lineColor = color;                 }},
+    getLineColor : { value: function()            {  return this._lineColor;                    }},
+    setLineColor : { value: function( color )        {  this._lineColor = color;                    }},
 
-    getLineWidth : { value: function()          {  return this._drawingContext.lineWidth;   }},
-    setLineWidth : { value: function( w )           {  this._drawingContext.lineWidth = w;      }},
+    getLineWidth : { value: function()            {  return this._drawingContext.lineWidth;    }},
+    setLineWidth : { value: function( w )            {  this._drawingContext.lineWidth = w;        }},
 
 
     initialize: {
         value: function() {
-            this._gridOrigin = [0,0];   // 2D plane space point
+            this._gridOrigin = [0,0];    // 2D plane space point
 
             this.eventManager.addEventListener("elementAdded", this, false);
             this.eventManager.addEventListener("elementsRemoved", this, false);
@@ -212,7 +211,12 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
                 this.addElement(elements);
             }
 
-            this.drawWorkingPlane();
+            // Redraw stage only once after all addition is completed
+            var stage = this.application.ninja.stage;
+            stage.drawLayout = true;
+            stage.updatePlanes = true;
+            stage.draw3DInfo = true;
+            stage.needsDrawSelection = true;
         }
     },
 
@@ -229,7 +233,12 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
                 this.removeElement(elements);
             }
 
-            this.drawWorkingPlane();
+            // Redraw stage only once after all deletion is completed
+            var stage = this.application.ninja.stage;
+            stage.drawLayout = true;
+            stage.updatePlanes = true;
+            stage.draw3DInfo = true;
+            stage.needsDrawSelection = true;
         }
     },
 
@@ -310,9 +319,20 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
                     plane,
                     changed = false,
                     elt,
+                    eltModel,
                     adjustStagePadding = !isChanging || (event.detail.data.prop !== "matrix");
                 for(var i=0; i < len; i++) {
                     elt = els[i];
+                    eltModel = elt.elementModel;
+                    eltModel.setProperty("offsetCache", false);
+
+                    if(eltModel.selection !== "body") {
+                        if(isChanging) {
+                            eltModel.props3D.matrix3d = null;
+                        } else {
+                            eltModel.props3D.init(elt, false);
+                        }
+                    }
                     plane = elt.elementModel.props3D.elementPlane;
                     if(plane) {
                         plane.init();
@@ -353,8 +373,10 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
                 }
 
                 if(!changed) {
-                    this.drawWorkingPlane();
-                    this.draw3DCompass();
+                    // If we didn't already set userPaddingTop or userPaddingLeft, force stage to redraw
+                    //this.snapManager._isCacheInvalid = true;
+//                    stage.draw3DInfo = true;
+                    stage.needsDraw = true;
                 }
 
                 // TODO - Remove this once all stage drawing is consolidated into a single draw cycle
@@ -680,81 +702,82 @@ var DrawUtils = exports.DrawUtils = Montage.create(Component, {
         {
             this.application.ninja.stage.clearGridCanvas();
             this.drawStageOutline();
-            if (!this.isDrawingGrid()) return;
-
-            var saveContext = this.getDrawingSurfaceElement();
-            this.setDrawingSurfaceElement(this.application.ninja.stage.gridCanvas);
+            if (this.isDrawingGrid()) {
+                var saveContext = this.getDrawingSurfaceElement();
+                this.setDrawingSurfaceElement(this.application.ninja.stage.gridCanvas);
 
-            // 3 coordinate axes for the plane
-            var zAxis = [this._workingPlane[0], this._workingPlane[1], this._workingPlane[2]];
+                // 3 coordinate axes for the plane
+                var zAxis = [this._workingPlane[0], this._workingPlane[1], this._workingPlane[2]];
 
-            // get a point that lies on the plane
-            var ptOnPlane = MathUtils.getPointOnPlane(this._workingPlane);
+                // get a point that lies on the plane
+                var ptOnPlane = MathUtils.getPointOnPlane(this._workingPlane);
 
-            // define the grid parameters
-            var width = this.snapManager.getStageWidth(),
-                height = this.snapManager.getStageHeight(),
-                nLines = 10;
+                // define the grid parameters
+                var width = this.snapManager.getStageWidth(),
+                    height = this.snapManager.getStageHeight(),
+                    nLines = 10;
 
-            // get a matrix from working plane space to the world
-            var mat = this.getPlaneToWorldMatrix(zAxis, ptOnPlane);
-            var tMat = Matrix.Translation( [0.5*width, 0.5*height, 0] );
-            //mat = tMat.multiply(mat);
-            glmat4.multiply( tMat, mat, mat);
+                // get a matrix from working plane space to the world
+                var mat = this.getPlaneToWorldMatrix(zAxis, ptOnPlane);
+                var tMat = Matrix.Translation( [0.5*width, 0.5*height, 0] );
+                //mat = tMat.multiply(mat);
+                glmat4.multiply( tMat, mat, mat);
 
-            // the positioning of the grid may depend on the view direction.
+                // the positioning of the grid may depend on the view direction.