aboutsummaryrefslogtreecommitdiff
path: root/js/controllers
diff options
context:
space:
mode:
Diffstat (limited to 'js/controllers')
-rwxr-xr-xjs/controllers/elements/component-controller.js2
-rwxr-xr-xjs/controllers/elements/element-controller.js59
-rwxr-xr-xjs/controllers/elements/shapes-controller.js1
-rwxr-xr-xjs/controllers/elements/stage-controller.js16
-rwxr-xr-xjs/controllers/styles-controller.js66
5 files changed, 87 insertions, 57 deletions
diff --git a/js/controllers/elements/component-controller.js b/js/controllers/elements/component-controller.js
index 260ee8a0..d902e4a1 100755
--- a/js/controllers/elements/component-controller.js
+++ b/js/controllers/elements/component-controller.js
@@ -16,6 +16,7 @@ exports.ComponentController = Montage.create(ElementController, {
16 switch(prop) { 16 switch(prop) {
17 case "id": 17 case "id":
18 case "class": 18 case "class":
19 case "-webkit-transform-style":
19 case "left": 20 case "left":
20 case "top": 21 case "top":
21 case "width": 22 case "width":
@@ -38,6 +39,7 @@ exports.ComponentController = Montage.create(ElementController, {
38 switch(p) { 39 switch(p) {
39 case "id": 40 case "id":
40 case "class": 41 case "class":
42 case "-webkit-transform-style":
41 case "left": 43 case "left":
42 case "top": 44 case "top":
43 case "width": 45 case "width":
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index efb33292..fda3a3c5 100755
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -228,11 +228,10 @@ exports.ElementController = Montage.create(Component, {
228 228
229 if (el) 229 if (el)
230 { 230 {
231 var xformStr = this.application.ninja.elementMediator.getProperty(el, "-webkit-transform"); 231 mat = this.application.ninja.stylesController.getMatrixFromElement(el, false);
232 if (xformStr) 232 if (!mat) {
233 mat = this.transformStringToMat( xformStr );
234 if (!mat)
235 mat = Matrix.I(4); 233 mat = Matrix.I(4);
234 }
236 } 235 }
237 236
238 el.elementModel.props3D.matrix3d = mat; 237 el.elementModel.props3D.matrix3d = mat;
@@ -249,23 +248,9 @@ exports.ElementController = Montage.create(Component, {
249 } 248 }
250 else 249 else
251 { 250 {
252 var dist = 1400; 251 var dist = this.application.ninja.stylesController.getPerspectiveDistFromElement(el, false);
253 252 if(dist == null) {
254 var str = this.getProperty(el, "-webkit-transform"); 253 dist = 1400;
255 if (str)
256 {
257 var index1 = str.indexOf( "perspective(");
258 if (index1 >= 0)
259 {
260 index1 += 12; // do not include 'perspective('
261 var index2 = str.indexOf( ")", index1 );
262 if (index2 >= 0)
263 {
264 var substr = str.substr( index1, (index2-index1));
265 if (substr && (substr.length > 0))
266 dist = MathUtils.styleToNumber( substr );
267 }
268 }
269 } 254 }
270 255
271 el.elementModel.props3D.perspectiveDist = dist; 256 el.elementModel.props3D.perspectiveDist = dist;
@@ -308,36 +293,6 @@ exports.ElementController = Montage.create(Component, {
308 elt.elementModel.props3D.z3D = ~~(elt3DInfo.translation[2]); 293 elt.elementModel.props3D.z3D = ~~(elt3DInfo.translation[2]);
309 } 294 }
310 } 295 }
311 },
312
313 transformStringToMat: {
314 value: function( str ) {
315 var rtnMat;
316
317 var index1 = str.indexOf( "matrix3d(");
318 if (index1 >= 0)
319 {
320 index1 += 9; // do not include 'matrix3d('
321 var index2 = str.indexOf( ")", index1 );
322 if (index2 >= 0)
323 {
324 var substr = str.substr( index1, (index2-index1));
325 if (substr && (substr.length > 0))
326 {
327 var numArray = substr.split(',');
328 var nNums = numArray.length;
329 if (nNums == 16)
330 {
331 // gl-matrix wants row order
332 rtnMat = numArray;
333 for (var i=0; i<16; i++)
334 rtnMat[i] = Number( rtnMat[i] );
335 }
336 }
337 }
338 }
339
340 return rtnMat;
341 }
342 } 296 }
297
343}); \ No newline at end of file 298}); \ No newline at end of file
diff --git a/js/controllers/elements/shapes-controller.js b/js/controllers/elements/shapes-controller.js
index f9b63942..b97d04b0 100755
--- a/js/controllers/elements/shapes-controller.js
+++ b/js/controllers/elements/shapes-controller.js
@@ -627,6 +627,7 @@ exports.ShapesController = Montage.create(CanvasController, {
627 world = new World(el, true); 627 world = new World(el, true);
628 el.elementModel.shapeModel.GLWorld = world; 628 el.elementModel.shapeModel.GLWorld = world;
629 el.elementModel.shapeModel.useWebGl = true; 629 el.elementModel.shapeModel.useWebGl = true;
630 el.elementModel.controller.setProperty(el, "-webkit-transform-style", "preserve-3d");
630 world.importJSON(worldData); 631 world.importJSON(worldData);
631 el.elementModel.shapeModel.GLGeomObj = world.getGeomRoot(); 632 el.elementModel.shapeModel.GLGeomObj = world.getGeomRoot();
632 } 633 }
diff --git a/js/controllers/elements/stage-controller.js b/js/controllers/elements/stage-controller.js
index 97ea3aa5..dc916b1a 100755
--- a/js/controllers/elements/stage-controller.js
+++ b/js/controllers/elements/stage-controller.js
@@ -83,6 +83,12 @@ exports.StageController = Montage.create(ElementController, {
83 return el.elementModel.stageDimension.style.getProperty(p); 83 return el.elementModel.stageDimension.style.getProperty(p);
84 case "width": 84 case "width":
85 return el.elementModel.stageDimension.style.getProperty(p); 85 return el.elementModel.stageDimension.style.getProperty(p);
86 case "-webkit-transform-style":
87 if(el.id === "Viewport") {
88 return this.application.ninja.stylesController.getElementStyle(el, p, false, true);
89 } else {
90 return el.elementModel.stageView.style.getProperty(p);
91 }
86 default: 92 default:
87 return ElementController.getProperty(el, p, false, true); 93 return ElementController.getProperty(el, p, false, true);
88 //console.log("Undefined Stage property ", p); 94 //console.log("Undefined Stage property ", p);
@@ -111,6 +117,9 @@ exports.StageController = Montage.create(ElementController, {
111 this.application.ninja.currentDocument.iframe.height = parseInt(value) + 400; 117 this.application.ninja.currentDocument.iframe.height = parseInt(value) + 400;
112 el.elementModel.stageDimension.style.setProperty(p, value); 118 el.elementModel.stageDimension.style.setProperty(p, value);
113 break; 119 break;
120 case "-webkit-transform-style":
121 el.elementModel.stageView.style.setProperty(p, value);
122 break;
114 default: 123 default:
115 console.log("Undefined property ", p, "for the Stage Controller"); 124 console.log("Undefined property ", p, "for the Stage Controller");
116 } 125 }
@@ -143,11 +152,10 @@ exports.StageController = Montage.create(ElementController, {
143 152
144 if (el) 153 if (el)
145 { 154 {
146 var xformStr = this.application.ninja.elementMediator.getProperty(el, "-webkit-transform"); 155 mat = this.application.ninja.stylesController.getMatrixFromElement(el, true);
147 if (xformStr) 156 if (!mat) {
148 mat = this.transformStringToMat( xformStr );
149 if (!mat)
150 mat = Matrix.I(4); 157 mat = Matrix.I(4);
158 }
151 159
152 var zoom = this.application.ninja.elementMediator.getProperty(el, "zoom"); 160 var zoom = this.application.ninja.elementMediator.getProperty(el, "zoom");
153 if (zoom) 161 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