diff options
Diffstat (limited to 'js/controllers/elements/stage-controller.js')
-rwxr-xr-x | js/controllers/elements/stage-controller.js | 94 |
1 files changed, 53 insertions, 41 deletions
diff --git a/js/controllers/elements/stage-controller.js b/js/controllers/elements/stage-controller.js index 97ea3aa5..3ef7dacc 100755 --- a/js/controllers/elements/stage-controller.js +++ b/js/controllers/elements/stage-controller.js | |||
@@ -31,46 +31,34 @@ exports.StageController = Montage.create(ElementController, { | |||
31 | } | 31 | } |
32 | }, | 32 | }, |
33 | 33 | ||
34 | |||
34 | // TODO - perspective distance needs to be passed in as "dist" and matrix3d needs to be passed in as "mat" | 35 | // TODO - perspective distance needs to be passed in as "dist" and matrix3d needs to be passed in as "mat" |
35 | set3DProperties: { | 36 | set3DProperties: { |
36 | value: function(el, props, index, update3DModel) { | 37 | value: function(el, props, update3DModel) { |
37 | var dist = props[index]["dist"], | 38 | var dist = props["dist"], mat = props["mat"]; |
38 | mat = props[index]["mat"]; | 39 | this.application.ninja.stylesController.setElementStyle(el, "-webkit-transform", "perspective(" + dist + ") " + "matrix3d(" + MathUtils.scientificToDecimal(mat, 5) + ")", true); |
39 | this.application.ninja.stylesController.setElementStyle(el, | 40 | |
40 | "-webkit-transform", | 41 | el.elementModel.props3D.matrix3d = mat; |
41 | "perspective(" + dist + ") " + | 42 | el.elementModel.props3D.perspectiveDist = dist; |
42 | "matrix3d(" + MathUtils.scientificToDecimal(mat, 5) + ")", | ||
43 | true); | ||
44 | |||
45 | el.elementModel.props3D.matrix3d = mat; | ||
46 | el.elementModel.props3D.perspectiveDist = dist; | ||
47 | |||
48 | // TODO - Move this to matrix class | ||
49 | if(this._isRotated(mat)) | ||
50 | { | ||
51 | this.application.ninja.currentDocument.stageBG.style.display = "none"; | ||
52 | } | ||
53 | else | ||
54 | { | ||
55 | this.application.ninja.stylesController.setElementStyle(this.application.ninja.currentDocument.stageBG, | ||
56 | "-webkit-transform", | ||
57 | "perspective(" + dist + ") " + | ||
58 | "matrix3d(" + MathUtils.scientificToDecimal(mat, 5) + ")", | ||
59 | true); | ||
60 | |||
61 | this.application.ninja.currentDocument.stageBG.elementModel.props3D.matrix3d = mat; | ||
62 | this.application.ninja.currentDocument.stageBG.elementModel.props3D.perspectiveDist = dist; | ||
63 | this.application.ninja.currentDocument.stageBG.style.display = "block"; | ||
64 | } | ||
65 | 43 | ||
66 | this.application.ninja.stage.updatedStage = true; | 44 | // TODO - Move this to matrix class |
45 | if(this._isRotated(mat)) { | ||
46 | this.application.ninja.currentDocument.stageBG.style.display = "none"; | ||
47 | } else { | ||
48 | this.application.ninja.stylesController.setElementStyle(this.application.ninja.currentDocument.stageBG, "-webkit-transform", "perspective(" + dist + ") " + "matrix3d(" + MathUtils.scientificToDecimal(mat, 5) + ")", true); | ||
67 | 49 | ||
68 | if(update3DModel) | 50 | this.application.ninja.currentDocument.stageBG.elementModel.props3D.matrix3d = mat; |
69 | { | 51 | this.application.ninja.currentDocument.stageBG.elementModel.props3D.perspectiveDist = dist; |
70 | this._update3DProperties(el, mat, dist); | 52 | this.application.ninja.currentDocument.stageBG.style.display = "block"; |
53 | } | ||
54 | |||
55 | this.application.ninja.stage.updatedStage = true; | ||
56 | |||
57 | if(update3DModel) { | ||
58 | this._update3DProperties(el, mat, dist); | ||
59 | } | ||
71 | } | 60 | } |
72 | } | 61 | }, |
73 | }, | ||
74 | 62 | ||
75 | getProperty: { | 63 | getProperty: { |
76 | value: function(el, p) { | 64 | value: function(el, p) { |
@@ -83,8 +71,14 @@ exports.StageController = Montage.create(ElementController, { | |||
83 | return el.elementModel.stageDimension.style.getProperty(p); | 71 | return el.elementModel.stageDimension.style.getProperty(p); |
84 | case "width": | 72 | case "width": |
85 | return el.elementModel.stageDimension.style.getProperty(p); | 73 | return el.elementModel.stageDimension.style.getProperty(p); |
74 | case "-webkit-transform-style": | ||
75 | if(el.id === "Viewport") { | ||
76 | return this.application.ninja.stylesController.getElementStyle(el, p, false, true); | ||
77 | } else { | ||
78 | return el.elementModel.stageView.style.getProperty(p); | ||
79 | } | ||
86 | default: | 80 | default: |
87 | return ElementController.getProperty(el, p, false, true); | 81 | return ElementController.getProperty(el, p, true, true); |
88 | //console.log("Undefined Stage property ", p); | 82 | //console.log("Undefined Stage property ", p); |
89 | } | 83 | } |
90 | } | 84 | } |
@@ -111,6 +105,10 @@ exports.StageController = Montage.create(ElementController, { | |||
111 | this.application.ninja.currentDocument.iframe.height = parseInt(value) + 400; | 105 | this.application.ninja.currentDocument.iframe.height = parseInt(value) + 400; |
112 | el.elementModel.stageDimension.style.setProperty(p, value); | 106 | el.elementModel.stageDimension.style.setProperty(p, value); |
113 | break; | 107 | break; |
108 | case "-webkit-transform-style": | ||
109 | el.elementModel.stageView.style.setProperty(p, value); | ||
110 | this.application.ninja.stage.updatedStage = true; | ||
111 | break; | ||
114 | default: | 112 | default: |
115 | console.log("Undefined property ", p, "for the Stage Controller"); | 113 | console.log("Undefined property ", p, "for the Stage Controller"); |
116 | } | 114 | } |
@@ -143,11 +141,10 @@ exports.StageController = Montage.create(ElementController, { | |||
143 | 141 | ||
144 | if (el) | 142 | if (el) |
145 | { | 143 | { |
146 | var xformStr = this.application.ninja.elementMediator.getProperty(el, "-webkit-transform"); | 144 | mat = this.application.ninja.stylesController.getMatrixFromElement(el, true); |
147 | if (xformStr) | 145 | if (!mat) { |
148 | mat = this.transformStringToMat( xformStr ); | ||
149 | if (!mat) | ||
150 | mat = Matrix.I(4); | 146 | mat = Matrix.I(4); |
147 | } | ||
151 | 148 | ||
152 | var zoom = this.application.ninja.elementMediator.getProperty(el, "zoom"); | 149 | var zoom = this.application.ninja.elementMediator.getProperty(el, "zoom"); |
153 | if (zoom) | 150 | if (zoom) |
@@ -170,5 +167,20 @@ exports.StageController = Montage.create(ElementController, { | |||
170 | return mat; | 167 | return mat; |
171 | } | 168 | } |
172 | } | 169 | } |
173 | } | 170 | }, |
171 | |||
172 | getPerspectiveDist: { | ||
173 | value: function(el) { | ||
174 | if(el.elementModel && el.elementModel.props3D && el.elementModel.props3D.perspectiveDist) | ||
175 | { | ||
176 | return el.elementModel.props3D.perspectiveDist; | ||
177 | } | ||
178 | else | ||
179 | { | ||
180 | var dist = this.application.ninja.stylesController.getPerspectiveDistFromElement(el, true); | ||
181 | el.elementModel.props3D.perspectiveDist = dist; | ||
182 | return dist; | ||
183 | } | ||
184 | } | ||
185 | }, | ||
174 | }); | 186 | }); |