From 52fac825174d16e3ff6875fc497d3f3cfaf4812c Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 21 Mar 2012 12:02:36 -0700 Subject: Get matrix and perspective distance from styles controller. Signed-off-by: Nivesh Rajbhandari --- js/controllers/elements/element-controller.js | 59 +++--------------------- js/controllers/elements/stage-controller.js | 7 ++- js/controllers/styles-controller.js | 66 ++++++++++++++++++++++++++- 3 files changed, 75 insertions(+), 57 deletions(-) (limited to 'js/controllers') diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js index b35251ad..4f360bb9 100755 --- a/js/controllers/elements/element-controller.js +++ b/js/controllers/elements/element-controller.js @@ -223,11 +223,10 @@ var ElementController = exports.ElementController = Montage.create(NJComponent, if (el) { - var xformStr = this.application.ninja.elementMediator.getProperty(el, "-webkit-transform"); - if (xformStr) - mat = this.transformStringToMat( xformStr ); - if (!mat) + mat = this.application.ninja.stylesController.getMatrixFromElement(el, false); + if (!mat) { mat = Matrix.I(4); + } } el.elementModel.props3D.matrix3d = mat; @@ -244,23 +243,9 @@ var ElementController = exports.ElementController = Montage.create(NJComponent, } else { - var dist = 1400; - - var str = this.getProperty(el, "-webkit-transform"); - if (str) - { - var index1 = str.indexOf( "perspective("); - if (index1 >= 0) - { - index1 += 12; // do not include 'perspective(' - var index2 = str.indexOf( ")", index1 ); - if (index2 >= 0) - { - var substr = str.substr( index1, (index2-index1)); - if (substr && (substr.length > 0)) - dist = MathUtils.styleToNumber( substr ); - } - } + var dist = this.application.ninja.stylesController.getPerspectiveDistFromElement(el, false); + if(dist === null) { + dist = 1400; } el.elementModel.props3D.perspectiveDist = dist; @@ -303,36 +288,6 @@ var ElementController = exports.ElementController = Montage.create(NJComponent, elt.elementModel.props3D.z3D = ~~(elt3DInfo.translation[2]); } } - }, - - transformStringToMat: { - value: function( str ) { - var rtnMat; - - var index1 = str.indexOf( "matrix3d("); - if (index1 >= 0) - { - index1 += 9; // do not include 'matrix3d(' - var index2 = str.indexOf( ")", index1 ); - if (index2 >= 0) - { - var substr = str.substr( index1, (index2-index1)); - if (substr && (substr.length > 0)) - { - var numArray = substr.split(','); - var nNums = numArray.length; - if (nNums == 16) - { - // gl-matrix wants row order - rtnMat = numArray; - for (var i=0; i<16; i++) - rtnMat[i] = Number( rtnMat[i] ); - } - } - } - } - - return rtnMat; - } } + }); \ No newline at end of file diff --git a/js/controllers/elements/stage-controller.js b/js/controllers/elements/stage-controller.js index 97ea3aa5..2734e226 100755 --- a/js/controllers/elements/stage-controller.js +++ b/js/controllers/elements/stage-controller.js @@ -143,11 +143,10 @@ exports.StageController = Montage.create(ElementController, { if (el) { - var xformStr = this.application.ninja.elementMediator.getProperty(el, "-webkit-transform"); - if (xformStr) - mat = this.transformStringToMat( xformStr ); - if (!mat) + mat = this.application.ninja.stylesController.getMatrixFromElement(el, true); + if (!mat) { mat = Matrix.I(4); + } var zoom = this.application.ninja.elementMediator.getProperty(el, "zoom"); if (zoom) diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index addfc24e..5d5f27ba 100755 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -836,7 +836,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { ///// For a given CSSKeyframesRule, we may add styles to the keyframe at ///// given index. - setKeyframeStyle : { + setKeyframeStyles : { value : function(rule, keyframeIndex, property, value, useImportant) { return this.setStyles(rule.cssRules[keyframeIndex], property, value, useImportant); } @@ -1124,6 +1124,70 @@ var stylesController = exports.StylesController = Montage.create(Component, { } }, + ///// Get Matrix From Element + ///// Returns the matrix from an element's -webkit-transform + //// TODO - This routine should eventually check for other transform styles, i.e., rotateX, translateZ, etc. + + getMatrixFromElement : { + value: function(element, isStage) { + var xformStr = this.getElementStyle(element, "-webkit-transform", false, isStage), + mat; + + if (xformStr) { + var index1 = xformStr.indexOf( "matrix3d("); + if (index1 >= 0) { + index1 += 9; // do not include 'matrix3d(' + var index2 = xformStr.indexOf( ")", index1 ); + if (index2 >= 0) { + var substr = xformStr.substr( index1, (index2-index1)); + if (substr && (substr.length > 0)) { + var numArray = substr.split(','); + var nNums = numArray.length; + if (nNums == 16) { + // gl-matrix wants row order + mat = numArray; + for (var i=0; i<16; i++) { + mat[i] = Number( mat[i] ); + } + } + } + } + } + } + return mat; + } + }, + + ///// Get Perspective Distance From Element + ///// Returns the perspective from an element's -webkit-transform + + getPerspectiveDistFromElement : { + value: function(element, isStage) { + var xformStr = this.getElementStyle(element, "-webkit-transform", false, isStage), + dist; + + if (xformStr) { + var index1 = xformStr.indexOf( "perspective("); + if (index1 >= 0) { + index1 += 12; // do not include 'perspective(' + var index2 = xformStr.indexOf( ")", index1 ); + if (index2 >= 0) { + var substr = xformStr.substr( index1, (index2-index1)); + if (substr && (substr.length > 0)) { + dist = parseInt( substr ); + } + } + } + } else { + xformStr = this.getElementStyle(element, "-webkit-perspective", false, isStage); + if(xformStr) { + dist = parseInt(xformStr); + } + } + return dist; + } + }, + ///// Create Rule From Inline Style ///// Creates a rule for an inline style with a specified, or partially random selector. -- cgit v1.2.3