From 3987b73569e58843f2a91c0c6c4e4132f51ac247 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 21 Mar 2012 17:13:56 -0700 Subject: Do not set webkit-transform styles on elements unless 3d is used on them. Signed-off-by: Nivesh Rajbhandari --- js/tools/TagTool.js | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) (limited to 'js/tools/TagTool.js') diff --git a/js/tools/TagTool.js b/js/tools/TagTool.js index e3f49bbe..6df49a7b 100755 --- a/js/tools/TagTool.js +++ b/js/tools/TagTool.js @@ -222,21 +222,20 @@ exports.TagTool = Montage.create(DrawingTool, { makeElement: { value: function(w, h, planeMat, midPt,tag) { - var styles; - var left = Math.round(midPt[0] - 0.5 * w); var top = Math.round(midPt[1] - 0.5 * h); - var matStr = DrawingToolBase.getElementMatrix(planeMat, midPt); - - styles = { + var styles = { 'position': 'absolute', 'top' : top + 'px', - 'left' : left + 'px', - '-webkit-transform-style' : 'preserve-3d', - '-webkit-transform' : matStr + 'left' : left + 'px' }; + if(!MathUtils.isIdentityMatrix(planeMat)) { + styles['-webkit-transform-style'] = 'preserve-3d'; + styles['-webkit-transform'] = DrawingToolBase.getElementMatrix(planeMat, midPt); + } + // TODO - for canvas, set both as style and attribute. // Otherwise, we need to create a separate controller for canvas elements if(tag.tagName === "CANVAS") { -- cgit v1.2.3 From 636014cf5d824909993d7dc3510fbe6ce2fc72f1 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Thu, 22 Mar 2012 14:24:46 -0700 Subject: WebGL needs to have 3d styles to render. Signed-off-by: Nivesh Rajbhandari --- js/tools/TagTool.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'js/tools/TagTool.js') diff --git a/js/tools/TagTool.js b/js/tools/TagTool.js index 6df49a7b..2b6742e6 100755 --- a/js/tools/TagTool.js +++ b/js/tools/TagTool.js @@ -221,7 +221,7 @@ exports.TagTool = Montage.create(DrawingTool, { }, makeElement: { - value: function(w, h, planeMat, midPt,tag) { + value: function(w, h, planeMat, midPt,tag, isWebGl) { var left = Math.round(midPt[0] - 0.5 * w); var top = Math.round(midPt[1] - 0.5 * h); @@ -234,6 +234,8 @@ exports.TagTool = Montage.create(DrawingTool, { if(!MathUtils.isIdentityMatrix(planeMat)) { styles['-webkit-transform-style'] = 'preserve-3d'; styles['-webkit-transform'] = DrawingToolBase.getElementMatrix(planeMat, midPt); + } else if(isWebGl) { + styles['-webkit-transform-style'] = 'preserve-3d'; } // TODO - for canvas, set both as style and attribute. -- cgit v1.2.3 From d42af4f0f5e893ab0e1f74f50055e0be3bd9e78e Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Thu, 5 Apr 2012 16:43:25 -0700 Subject: -webkit-transform-style needs to be set to preserve-3d for shapes regardless of whether they are 2d shapes or WebGL shapes. Signed-off-by: Nivesh Rajbhandari --- js/tools/TagTool.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/tools/TagTool.js') diff --git a/js/tools/TagTool.js b/js/tools/TagTool.js index f4b65c3e..752500e0 100755 --- a/js/tools/TagTool.js +++ b/js/tools/TagTool.js @@ -221,7 +221,7 @@ exports.TagTool = Montage.create(DrawingTool, { }, makeElement: { - value: function(w, h, planeMat, midPt,tag, isWebGl) { + value: function(w, h, planeMat, midPt, tag, isShape) { var left = Math.round(midPt[0] - 0.5 * w); var top = Math.round(midPt[1] - 0.5 * h); @@ -234,7 +234,7 @@ exports.TagTool = Montage.create(DrawingTool, { if(!MathUtils.isIdentityMatrix(planeMat)) { styles['-webkit-transform-style'] = 'preserve-3d'; styles['-webkit-transform'] = DrawingToolBase.getElementMatrix(planeMat, midPt); - } else if(isWebGl) { + } else if(isShape) { styles['-webkit-transform-style'] = 'preserve-3d'; } -- cgit v1.2.3 From 952e0b2c28af081041fa8987c3e865b931d052fa Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Mon, 9 Apr 2012 16:04:24 -0700 Subject: Single perspective fix. Note that rotating multiple objects when the stage is rotated still doesn't work and flatten still doesn't work. Signed-off-by: Nivesh Rajbhandari --- js/tools/TagTool.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/tools/TagTool.js') diff --git a/js/tools/TagTool.js b/js/tools/TagTool.js index 752500e0..d946db72 100755 --- a/js/tools/TagTool.js +++ b/js/tools/TagTool.js @@ -256,7 +256,7 @@ exports.TagTool = Montage.create(DrawingTool, { value: function(tag) { var styles = { "-webkit-transform-style": "preserve-3d", - "-webkit-transform": "perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)" + "-webkit-transform": "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)" }; tag.innerHTML = "content"; -- cgit v1.2.3