diff options
-rwxr-xr-x | js/controllers/elements/element-controller.js | 59 | ||||
-rwxr-xr-x | js/controllers/elements/shapes-controller.js | 4 | ||||
-rwxr-xr-x | js/controllers/elements/stage-controller.js | 7 | ||||
-rwxr-xr-x | js/controllers/styles-controller.js | 66 | ||||
-rwxr-xr-x | js/helper-classes/3D/view-utils.js | 48 | ||||
-rwxr-xr-x | js/lib/NJUtils.js | 5 | ||||
-rwxr-xr-x | js/lib/drawing/world.js | 9 | ||||
-rwxr-xr-x | js/mediators/element-mediator.js | 9 | ||||
-rwxr-xr-x | js/models/properties-3d.js | 50 | ||||
-rwxr-xr-x | js/stage/layout.js | 2 | ||||
-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 |
13 files changed, 152 insertions, 171 deletions
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js index b35251ad..9cba6d94 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, | |||
223 | 223 | ||
224 | if (el) | 224 | if (el) |
225 | { | 225 | { |
226 | var xformStr = this.application.ninja.elementMediator.getProperty(el, "-webkit-transform"); | 226 | mat = this.application.ninja.stylesController.getMatrixFromElement(el, false); |
227 | if (xformStr) | 227 | if (!mat) { |
228 | mat = this.transformStringToMat( xformStr ); | ||
229 | if (!mat) | ||
230 | mat = Matrix.I(4); | 228 | mat = Matrix.I(4); |
229 | } | ||
231 | } | 230 | } |
232 | 231 | ||
233 | el.elementModel.props3D.matrix3d = mat; | 232 | el.elementModel.props3D.matrix3d = mat; |
@@ -244,23 +243,9 @@ var ElementController = exports.ElementController = Montage.create(NJComponent, | |||
244 | } | 243 | } |
245 | else | 244 | else |
246 | { | 245 | { |
247 | var dist = 1400; | 246 | var dist = this.application.ninja.stylesController.getPerspectiveDistFromElement(el, false); |
248 | 247 | if(dist == null) { | |
249 | var str = this.getProperty(el, "-webkit-transform"); | 248 | dist = 1400; |
250 | if (str) | ||
251 | { | ||
252 | var index1 = str.indexOf( "perspective("); | ||
253 | if (index1 >= 0) | ||
254 | { | ||
255 | index1 += 12; // do not include 'perspective(' | ||
256 | var index2 = str.indexOf( ")", index1 ); | ||
257 | if (index2 >= 0) | ||
258 | { | ||
259 | var substr = str.substr( index1, (index2-index1)); | ||
260 | if (substr && (substr.length > 0)) | ||
261 | dist = MathUtils.styleToNumber( substr ); | ||
262 | } | ||
263 | } | ||
264 | } | 249 | } |
265 | 250 | ||
266 | el.elementModel.props3D.perspectiveDist = dist; | 251 | el.elementModel.props3D.perspectiveDist = dist; |
@@ -303,36 +288,6 @@ var ElementController = exports.ElementController = Montage.create(NJComponent, | |||
303 | elt.elementModel.props3D.z3D = ~~(elt3DInfo.translation[2]); | 288 | elt.elementModel.props3D.z3D = ~~(elt3DInfo.translation[2]); |
304 | } | 289 | } |
305 | } | 290 | } |
306 | }, | ||
307 | |||
308 | transformStringToMat: { | ||
309 | value: function( str ) { | ||
310 | var rtnMat; | ||
311 | |||
312 | var index1 = str.indexOf( "matrix3d("); | ||
313 | if (index1 >= 0) | ||
314 | { | ||
315 | index1 += 9; // do not include 'matrix3d(' | ||
316 | var index2 = str.indexOf( ")", index1 ); | ||
317 | if (index2 >= 0) | ||
318 | { | ||
319 | var substr = str.substr( index1, (index2-index1)); | ||
320 | if (substr && (substr.length > 0)) | ||
321 | { | ||
322 | var numArray = substr.split(','); | ||
323 | var nNums = numArray.length; | ||
324 | if (nNums == 16) | ||
325 | { | ||
326 | // gl-matrix wants row order | ||
327 | rtnMat = numArray; | ||
328 | for (var i=0; i<16; i++) | ||
329 | rtnMat[i] = Number( rtnMat[i] ); | ||
330 | } | ||
331 | } | ||
332 | } | ||
333 | } | ||
334 | |||
335 | return rtnMat; | ||
336 | } | ||
337 | } | 291 | } |
292 | |||
338 | }); \ No newline at end of file | 293 | }); \ No newline at end of file |
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js index b3ac9ddb..9b0159d4 100755 --- a/js/controllers/elements/shapes-controller.js +++ b/js/controllers/elements/shapes-controller.js | |||
@@ -495,7 +495,7 @@ exports.ShapesController = Montage.create(CanvasController, { | |||
495 | world = new World(el, true); | 495 | world = new World(el, true); |
496 | el.elementModel.shapeModel.GLWorld = world; | 496 | el.elementModel.shapeModel.GLWorld = world; |
497 | el.elementModel.shapeModel.useWebGl = true; | 497 | el.elementModel.shapeModel.useWebGl = true; |
498 | world.import(worldData); | 498 | world.import(worldData, true); |
499 | el.elementModel.shapeModel.GLGeomObj = world.getGeomRoot(); | 499 | el.elementModel.shapeModel.GLGeomObj = world.getGeomRoot(); |
500 | 500 | ||
501 | sm = Object.create(MaterialsModel.getMaterial("FlatMaterial")); | 501 | sm = Object.create(MaterialsModel.getMaterial("FlatMaterial")); |
@@ -531,7 +531,7 @@ exports.ShapesController = Montage.create(CanvasController, { | |||
531 | world = new World(el, false); | 531 | world = new World(el, false); |
532 | el.elementModel.shapeModel.GLWorld = world; | 532 | el.elementModel.shapeModel.GLWorld = world; |
533 | el.elementModel.shapeModel.useWebGl = false; | 533 | el.elementModel.shapeModel.useWebGl = false; |
534 | world.import(worldData); | 534 | world.import(worldData, true); |
535 | el.elementModel.shapeModel.GLGeomObj = world.getGeomRoot(); | 535 | el.elementModel.shapeModel.GLGeomObj = world.getGeomRoot(); |
536 | el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(null); | 536 | el.elementModel.shapeModel.GLGeomObj.setStrokeMaterial(null); |
537 | el.elementModel.shapeModel.strokeMaterial = null; | 537 | el.elementModel.shapeModel.strokeMaterial = null; |
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, { | |||
143 | 143 | ||
144 | if (el) | 144 | if (el) |
145 | { | 145 | { |
146 | var xformStr = this.application.ninja.elementMediator.getProperty(el, "-webkit-transform"); | 146 | mat = this.application.ninja.stylesController.getMatrixFromElement(el, true); |
147 | if (xformStr) | 147 | if (!mat) { |
148 | mat = this.transformStringToMat( xformStr ); | ||
149 | if (!mat) | ||
150 | mat = Matrix.I(4); | 148 | mat = Matrix.I(4); |
149 | } | ||
151 | 150 | ||
152 | var zoom = this.application.ninja.elementMediator.getProperty(el, "zoom"); | 151 | var zoom = this.application.ninja.elementMediator.getProperty(el, "zoom"); |
153 | if (zoom) | 152 | 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, { | |||
836 | ///// For a given CSSKeyframesRule, we may add styles to the keyframe at | 836 | ///// For a given CSSKeyframesRule, we may add styles to the keyframe at |
837 | ///// given index. | 837 | ///// given index. |
838 | 838 | ||
839 | setKeyframeStyle : { | 839 | setKeyframeStyles : { |
840 | value : function(rule, keyframeIndex, property, value, useImportant) { | 840 | value : function(rule, keyframeIndex, property, value, useImportant) { |
841 | return this.setStyles(rule.cssRules[keyframeIndex], property, value, useImportant); | 841 | return this.setStyles(rule.cssRules[keyframeIndex], property, value, useImportant); |
842 | } | 842 | } |
@@ -1124,6 +1124,70 @@ var stylesController = exports.StylesController = Montage.create(Component, { | |||
1124 | } | 1124 | } |
1125 | }, | 1125 | }, |
1126 | 1126 | ||
1127 | ///// Get Matrix From Element | ||
1128 | ///// Returns the matrix from an element's -webkit-transform | ||
1129 | //// TODO - This routine should eventually check for other transform styles, i.e., rotateX, translateZ, etc. | ||
1130 | |||
1131 | getMatrixFromElement : { | ||
1132 | value: function(element, isStage) { | ||
1133 | var xformStr = this.getElementStyle(element, "-webkit-transform", false, isStage), | ||
1134 | mat; | ||
1135 | |||
1136 | if (xformStr) { | ||
1137 | var index1 = xformStr.indexOf( "matrix3d("); | ||
1138 | if (index1 >= 0) { | ||
1139 | index1 += 9; // do not include 'matrix3d(' | ||
1140 | var index2 = xformStr.indexOf( ")", index1 ); | ||
1141 | if (index2 >= 0) { | ||
1142 | var substr = xformStr.substr( index1, (index2-index1)); | ||
1143 | if (substr && (substr.length > 0)) { | ||
1144 | var numArray = substr.split(','); | ||
1145 | var nNums = numArray.length; | ||
1146 | if (nNums == 16) { | ||
1147 | // gl-matrix wants row order | ||
1148 | mat = numArray; | ||
1149 | for (var i=0; i<16; i++) { | ||
1150 | mat[i] = Number( mat[i] ); | ||
1151 | } | ||
1152 | } | ||
1153 | } | ||
1154 | } | ||
1155 | } | ||
1156 | } | ||
1157 | return mat; | ||
1158 | } | ||
1159 | }, | ||
1160 | |||
1161 | ///// Get Perspective Distance From Element | ||
1162 | ///// Returns the perspective from an element's -webkit-transform | ||
1163 | |||
1164 | getPerspectiveDistFromElement : { | ||
1165 | value: function(element, isStage) { | ||
1166 | var xformStr = this.getElementStyle(element, "-webkit-transform", false, isStage), | ||
1167 | dist; | ||
1168 | |||
1169 | if (xformStr) { | ||
1170 | var index1 = xformStr.indexOf( "perspective("); | ||
1171 | if (index1 >= 0) { | ||
1172 | index1 += 12; // do not include 'perspective(' | ||
1173 | var index2 = xformStr.indexOf( ")", index1 ); | ||
1174 | if (index2 >= 0) { | ||
1175 | var substr = xformStr.substr( index1, (index2-index1)); | ||
1176 | if (substr && (substr.length > 0)) { | ||
1177 | dist = parseInt( substr ); | ||
1178 | } | ||