diff options
author | Nivesh Rajbhandari | 2012-03-21 17:13:56 -0700 |
---|---|---|
committer | Nivesh Rajbhandari | 2012-03-21 17:13:56 -0700 |
commit | 3987b73569e58843f2a91c0c6c4e4132f51ac247 (patch) | |
tree | c5e121861209f4067bf5c363e3a40e5bd515d0b4 /js/tools | |
parent | 52fac825174d16e3ff6875fc497d3f3cfaf4812c (diff) | |
download | ninja-3987b73569e58843f2a91c0c6c4e4132f51ac247.tar.gz |
Do not set webkit-transform styles on elements unless 3d is used on them.
Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
Diffstat (limited to 'js/tools')
-rwxr-xr-x | js/tools/SelectionTool.js | 47 | ||||
-rwxr-xr-x | js/tools/TagTool.js | 15 | ||||
-rwxr-xr-x | js/tools/drawing-tool-base.js | 2 |
3 files changed, 34 insertions, 30 deletions
diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js index f9411f48..e252e36b 100755 --- a/js/tools/SelectionTool.js +++ b/js/tools/SelectionTool.js | |||
@@ -318,18 +318,28 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
318 | this._targets.push({elt:elt, mat:curMat, matInv:curMatInv}); | 318 | this._targets.push({elt:elt, mat:curMat, matInv:curMatInv}); |
319 | if(addToUndoStack) | 319 | if(addToUndoStack) |
320 | { | 320 | { |
321 | var prevX, | ||
322 | prevY, | ||
323 | prevW, | ||
324 | prevH, | ||
325 | _x, | ||
326 | _y, | ||
327 | _w, | ||
328 | _h, | ||
329 | previousMat, | ||
330 | previousStyleStr, | ||
331 | newStyleStr; | ||
321 | 332 | ||
322 | if(!this._use3DMode) | 333 | if(!this._use3DMode) |
323 | { | 334 | { |
324 | var previousMat = this._undoArray[i].mat.slice(0); | 335 | prevX = this._undoArray[i]._x; |
325 | var prevX = this._undoArray[i]._x; | 336 | prevY = this._undoArray[i]._y; |
326 | var prevY = this._undoArray[i]._y; | 337 | prevW = this._undoArray[i]._w; |
327 | var prevW = this._undoArray[i]._w; | 338 | prevH = this._undoArray[i]._h; |
328 | var prevH = this._undoArray[i]._h; | 339 | _x = parseInt(ElementsMediator.getProperty(elt, "left")); |
329 | var _x = parseInt(ElementsMediator.getProperty(elt, "left")) + curMat[12] - previousMat[12]; | 340 | _y = parseInt(ElementsMediator.getProperty(elt, "top")); |
330 | var _y = parseInt(ElementsMediator.getProperty(elt, "top")) + curMat[13] - previousMat[13]; | 341 | _w = parseInt(ElementsMediator.getProperty(elt, "width")); |
331 | var _w = parseInt(ElementsMediator.getProperty(elt, "width")); | 342 | _h = parseInt(ElementsMediator.getProperty(elt, "height")); |
332 | var _h = parseInt(ElementsMediator.getProperty(elt, "height")); | ||
333 | 343 | ||
334 | previousLeft.push(prevX + "px"); | 344 | previousLeft.push(prevX + "px"); |
335 | previousTop.push(prevY + "px"); | 345 | previousTop.push(prevY + "px"); |
@@ -339,27 +349,22 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { | |||
339 | newTop.push(_y + "px"); | 349 | newTop.push(_y + "px"); |
340 | newWidth.push(_w + "px"); | 350 | newWidth.push(_w + "px"); |
341 | newHeight.push(_h + "px"); | 351 | newHeight.push(_h + "px"); |
342 | |||
343 | viewUtils.setMatrixForElement(elt, previousMat); | ||
344 | |||
345 | this._targets[i].mat = previousMat; | ||
346 | this._targets[i].matInv = glmat4.inverse(previousMat, []); | ||
347 | } | 352 | } |
348 | else | 353 | else |
349 | { | 354 | { |
350 | var previousMat = this._undoArray[i].mat.slice(0); | 355 | previousMat = this._undoArray[i].mat.slice(0); |
351 | var prevW = this._undoArray[i]._w; | 356 | prevW = this._undoArray[i]._w; |
352 | var prevH = this._undoArray[i]._h; | 357 | prevH = this._undoArray[i]._h; |
353 | var _w = parseInt(ElementsMediator.getProperty(elt, "width")); | 358 | _w = parseInt(ElementsMediator.getProperty(elt, "width")); |
354 | var _h = parseInt(ElementsMediator.getProperty(elt, "height")); | 359 | _h = parseInt(ElementsMediator.getProperty(elt, "height")); |
355 | previousWidth.push(prevW + "px"); | 360 | previousWidth.push(prevW + "px"); |
356 | previousHeight.push(prevH + "px"); | 361 | previousHeight.push(prevH + "px"); |
357 | newWidth.push(_w + "px"); | 362 | newWidth.push(_w + "px"); |
358 | newHeight.push(_h + "px"); | 363 | newHeight.push(_h + "px"); |
359 | 364 | ||
360 | var previousStyleStr = {dist:this._undoArray[i].dist, | 365 | previousStyleStr = {dist:this._undoArray[i].dist, |
361 | mat:MathUtils.scientificToDecimal(previousMat, 5)}; | 366 | mat:MathUtils.scientificToDecimal(previousMat, 5)}; |
362 | var newStyleStr = {dist:viewUtils.getPerspectiveDistFromElement(elt), | 367 | newStyleStr = {dist:viewUtils.getPerspectiveDistFromElement(elt), |
363 | mat:MathUtils.scientificToDecimal(curMat, 5)}; | 368 | mat:MathUtils.scientificToDecimal(curMat, 5)}; |
364 | previousStyles.push(previousStyleStr); | 369 | previousStyles.push(previousStyleStr); |
365 | newStyles.push(newStyleStr); | 370 | newStyles.push(newStyleStr); |
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, { | |||
222 | 222 | ||
223 | makeElement: { | 223 | makeElement: { |
224 | value: function(w, h, planeMat, midPt,tag) { | 224 | value: function(w, h, planeMat, midPt,tag) { |
225 | var styles; | ||
226 | |||
227 | var left = Math.round(midPt[0] - 0.5 * w); | 225 | var left = Math.round(midPt[0] - 0.5 * w); |
228 | var top = Math.round(midPt[1] - 0.5 * h); | 226 | var top = Math.round(midPt[1] - 0.5 * h); |
229 | 227 | ||
230 | var matStr = DrawingToolBase.getElementMatrix(planeMat, midPt); | 228 | var styles = { |
231 | |||
232 | styles = { | ||
233 | 'position': 'absolute', | 229 | 'position': 'absolute', |
234 | 'top' : top + 'px', | 230 | 'top' : top + 'px', |
235 | 'left' : left + 'px', | 231 | 'left' : left + 'px' |
236 | '-webkit-transform-style' : 'preserve-3d', | ||
237 | '-webkit-transform' : matStr | ||
238 | }; | 232 | }; |
239 | 233 | ||
234 | if(!MathUtils.isIdentityMatrix(planeMat)) { | ||
235 | styles['-webkit-transform-style'] = 'preserve-3d'; | ||
236 | styles['-webkit-transform'] = DrawingToolBase.getElementMatrix(planeMat, midPt); | ||
237 | } | ||
238 | |||
240 | // TODO - for canvas, set both as style and attribute. | 239 | // TODO - for canvas, set both as style and attribute. |
241 | // Otherwise, we need to create a separate controller for canvas elements | 240 | // Otherwise, we need to create a separate controller for canvas elements |
242 | if(tag.tagName === "CANVAS") { | 241 | if(tag.tagName === "CANVAS") { |
diff --git a/js/tools/drawing-tool-base.js b/js/tools/drawing-tool-base.js index 8d87605c..84602186 100755 --- a/js/tools/drawing-tool-base.js +++ b/js/tools/drawing-tool-base.js | |||
@@ -442,7 +442,7 @@ exports.DrawingToolBase = Montage.create(Montage, { | |||
442 | flatMat = divMat; | 442 | flatMat = divMat; |
443 | flatMatSafe = MathUtils.scientificToDecimal(flatMat, 10); | 443 | flatMatSafe = MathUtils.scientificToDecimal(flatMat, 10); |
444 | 444 | ||
445 | return "perspective(" + 1400 + ") matrix3d( " + flatMatSafe + ")"; | 445 | return "perspective(" + 1400 + ") matrix3d(" + flatMatSafe + ")"; |
446 | } | 446 | } |
447 | }, | 447 | }, |
448 | 448 | ||