diff options
author | Valerio Virgillito | 2012-04-09 10:33:35 -0700 |
---|---|---|
committer | Valerio Virgillito | 2012-04-09 10:33:35 -0700 |
commit | bd43ce383b050d03b0f92cc923c517febc66ca28 (patch) | |
tree | 91b95c6c9aef779a743b710105546a8ae74bff12 /js/lib/geom | |
parent | 86b98ea086b133f4efb247c39fc6200dcf383a65 (diff) | |
parent | c62c5c4287a1ee8a276b32dc61f06abbc24818ec (diff) | |
download | ninja-bd43ce383b050d03b0f92cc923c517febc66ca28.tar.gz |
Merge pull request #159 from mqg734/WebGLMaterials
3D tools, eyedropper, fill, ink-bucket, gradients and shape fixes.
Diffstat (limited to 'js/lib/geom')
-rwxr-xr-x | js/lib/geom/circle.js | 19 | ||||
-rwxr-xr-x | js/lib/geom/geom-obj.js | 128 | ||||
-rwxr-xr-x | js/lib/geom/line.js | 10 | ||||
-rwxr-xr-x | js/lib/geom/rectangle.js | 15 |
4 files changed, 115 insertions, 57 deletions
diff --git a/js/lib/geom/circle.js b/js/lib/geom/circle.js index 7fa78b12..1073c2db 100755 --- a/js/lib/geom/circle.js +++ b/js/lib/geom/circle.js | |||
@@ -42,8 +42,8 @@ var Circle = function GLCircle() { | |||
42 | 42 | ||
43 | this._strokeWidth = strokeSize; | 43 | this._strokeWidth = strokeSize; |
44 | this._innerRadius = innerRadius; | 44 | this._innerRadius = innerRadius; |
45 | if (strokeColor) this._strokeColor = strokeColor; | 45 | this._strokeColor = strokeColor; |
46 | if (fillColor) this._fillColor = fillColor; | 46 | this._fillColor = fillColor; |
47 | 47 | ||
48 | this._strokeStyle = strokeStyle; | 48 | this._strokeStyle = strokeStyle; |
49 | } | 49 | } |
@@ -631,6 +631,21 @@ var Circle = function GLCircle() { | |||
631 | this._strokeStyle = jObj.strokeStyle; | 631 | this._strokeStyle = jObj.strokeStyle; |
632 | var strokeMaterialName = jObj.strokeMat; | 632 | var strokeMaterialName = jObj.strokeMat; |
633 | var fillMaterialName = jObj.fillMat; | 633 | var fillMaterialName = jObj.fillMat; |
634 | |||
635 | var strokeMat = MaterialsModel.getMaterial( strokeMaterialName ); | ||
636 | if (!strokeMat) { | ||
637 | console.log( "object material not found in library: " + strokeMaterialName ); | ||
638 | strokeMat = MaterialsModel.getMaterial( MaterialsModel.getDefaultMaterialName() ); | ||
639 | } | ||
640 | this._strokeMaterial = strokeMat; | ||
641 | |||
642 | var fillMat = MaterialsModel.getMaterial( fillMaterialName ); | ||
643 | if (!fillMat) { | ||
644 | console.log( "object material not found in library: " + fillMaterialName ); | ||
645 | fillMat = MaterialsModel.getMaterial( MaterialsModel.getDefaultMaterialName() ); | ||
646 | } | ||
647 | this._fillMaterial = fillMat; | ||
648 | |||
634 | this.importMaterialsJSON( jObj.materials ); | 649 | this.importMaterialsJSON( jObj.materials ); |
635 | }; | 650 | }; |
636 | 651 | ||
diff --git a/js/lib/geom/geom-obj.js b/js/lib/geom/geom-obj.js index bb5b4a9a..2cde8a75 100755 --- a/js/lib/geom/geom-obj.js +++ b/js/lib/geom/geom-obj.js | |||
@@ -1,8 +1,8 @@ | |||
1 | /* <copyright> | 1 | /* <copyright> |
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | 2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> |
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | 3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> |
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. |
5 | </copyright> */ | 5 | </copyright> */ |
6 | 6 | ||
7 | var MaterialsModel = require("js/models/materials-model").MaterialsModel; | 7 | var MaterialsModel = require("js/models/materials-model").MaterialsModel; |
8 | 8 | ||
@@ -144,46 +144,65 @@ var GeomObj = function GLGeomObj() { | |||
144 | this.setMaterialColor = function (c, type) { | 144 | this.setMaterialColor = function (c, type) { |
145 | var i = 0, | 145 | var i = 0, |
146 | nMats = 0; | 146 | nMats = 0; |
147 | if (c.gradientMode) { | 147 | if (c) { |
148 | // Gradient support | 148 | if (c.gradientMode) { |
149 | if (this._materialArray && this._materialTypeArray) { | 149 | // Gradient support |
150 | nMats = this._materialArray.length; | 150 | if (this._materialArray && this._materialTypeArray) { |
151 | } | 151 | nMats = this._materialArray.length; |
152 | 152 | } | |
153 | var stops = [], | ||
154 | colors = c.color; | ||
155 | 153 | ||
156 | var len = colors.length; | 154 | var stops = [], |
157 | // TODO - Current shaders only support 4 color stops | 155 | colors = c.color; |
158 | if (len > 4) { | ||
159 | len = 4; | ||
160 | } | ||
161 | 156 | ||
162 | for (var n = 0; n < len; n++) { | 157 | var len = colors.length; |
163 | var position = colors[n].position / 100; | 158 | // TODO - Current shaders only support 4 color stops |
164 | var cs = colors[n].value; | 159 | if (len > 4) { |
165 | var stop = [cs.r / 255, cs.g / 255, cs.b / 255, cs.a]; | 160 | len = 4; |
166 | stops.push(stop); | 161 | } |
167 | 162 | ||
168 | if (nMats === this._materialTypeArray.length) { | 163 | for (var n = 0; n < len; n++) { |
169 | for (i = 0; i < nMats; i++) { | 164 | var position = colors[n].position / 100; |
170 | if (this._materialTypeArray[i] == type) { | 165 | var cs = colors[n].value; |
171 | this._materialArray[i].setProperty("color" + (n + 1), stop.slice(0)); | 166 | var stop = [cs.r / 255, cs.g / 255, cs.b / 255, cs.a]; |
172 | this._materialArray[i].setProperty("colorStop" + (n + 1), position); | 167 | stops.push(stop); |
168 | |||
169 | if (nMats === this._materialTypeArray.length) { | ||
170 | for (i = 0; i < nMats; i++) { | ||
171 | if (this._materialTypeArray[i] == type) { | ||
172 | this._materialArray[i].setProperty("color" + (n + 1), stop.slice(0)); | ||
173 | this._materialArray[i].setProperty("colorStop" + (n + 1), position); | ||
174 | } | ||
173 | } | 175 | } |
174 | } | 176 | } |
175 | } | 177 | } |
176 | } | 178 | if (type === "fill") { |
177 | if (type === "fill") { | 179 | this._fillColor = c; |
178 | this._fillColor = c; | 180 | } else { |
181 | this._strokeColor = c; | ||
182 | } | ||
179 | } else { | 183 | } else { |
180 | this._strokeColor = c; | 184 | if (type === "fill") { |
185 | this._fillColor = c.slice(0); | ||
186 | } else { | ||
187 | this._strokeColor = c.slice(0); | ||
188 | } | ||
189 | |||
190 | if (this._materialArray && this._materialTypeArray) { | ||
191 | nMats = this._materialArray.length; | ||
192 | if (nMats === this._materialTypeArray.length) { | ||
193 | for (i = 0; i < nMats; i++) { | ||
194 | if (this._materialTypeArray[i] == type) { | ||
195 | this._materialArray[i].setProperty("color", c.slice(0)); | ||
196 | } | ||
197 | } | ||
198 | } | ||
199 | } | ||
181 | } | 200 | } |
182 | } else { | 201 | } else { |
183 | if (type === "fill") { | 202 | if (type === "fill") { |
184 | this._fillColor = c.slice(0); | 203 | this._fillColor = null; |
185 | } else { | 204 | } else { |
186 | this._strokeColor = c.slice(0); | 205 | this._strokeColor = null; |
187 | } | 206 | } |
188 | 207 | ||
189 | if (this._materialArray && this._materialTypeArray) { | 208 | if (this._materialArray && this._materialTypeArray) { |
@@ -191,7 +210,8 @@ var GeomObj = function GLGeomObj() { | |||
191 | if (nMats === this._materialTypeArray.length) { | 210 | if (nMats === this._materialTypeArray.length) { |
192 | for (i = 0; i < nMats; i++) { | 211 | for (i = 0; i < nMats; i++) { |
193 | if (this._materialTypeArray[i] == type) { | 212 | if (this._materialTypeArray[i] == type) { |
194 | this._materialArray[i].setProperty("color", c.slice(0)); | 213 | // TODO - Not sure how to set color to null values in shaders |
214 | this._materialArray[i].setProperty("color", [0, 0, 0, 0]); | ||
195 | } | 215 | } |
196 | } | 216 | } |
197 | } | 217 | } |
@@ -257,19 +277,19 @@ var GeomObj = function GLGeomObj() { | |||
257 | 277 | ||
258 | for (var i = 0; i < nMats; i++) { | 278 | for (var i = 0; i < nMats; i++) { |
259 | var matObj = | 279 | var matObj = |
260 | { | 280 | { |
261 | 'materialNodeName': this._materialNodeArray[i].name, | 281 | 'materialNodeName':this._materialNodeArray[i].name, |
262 | 'material': this._materialArray[i].exportJSON(), | 282 | 'material':this._materialArray[i].exportJSON(), |
263 | 'type': this._materialTypeArray[i] | 283 | 'type':this._materialTypeArray[i] |
264 | } | 284 | } |
265 | arr.push(matObj); | 285 | arr.push(matObj); |
266 | } | 286 | } |
267 | 287 | ||
268 | jObj = | 288 | jObj = |
269 | { | 289 | { |
270 | 'nMaterials': nMats, | 290 | 'nMaterials':nMats, |
271 | 'materials': arr | 291 | 'materials':arr |
272 | }; | 292 | }; |
273 | } | 293 | } |
274 | } | 294 | } |
275 | 295 | ||
@@ -280,7 +300,7 @@ var GeomObj = function GLGeomObj() { | |||
280 | this._materialArray = []; | 300 | this._materialArray = []; |
281 | this._materialTypeArray = []; | 301 | this._materialTypeArray = []; |
282 | 302 | ||
283 | if (!jObj) return; | 303 | if (!jObj) return; |
284 | 304 | ||
285 | var nMaterials = jObj.nMaterials; | 305 | var nMaterials = jObj.nMaterials; |
286 | var matArray = jObj.materials; | 306 | var matArray = jObj.materials; |
@@ -312,7 +332,7 @@ var GeomObj = function GLGeomObj() { | |||
312 | case "radialBlur": | 332 | case "radialBlur": |
313 | case "pulse": | 333 | case "pulse": |
314 | mat = MaterialsModel.getMaterialByShader(shaderName); | 334 | mat = MaterialsModel.getMaterialByShader(shaderName); |
315 | if (mat) mat = mat.dup(); | 335 | if (mat) mat = mat.dup(); |
316 | break; | 336 | break; |
317 | 337 | ||
318 | default: | 338 | default: |
@@ -325,8 +345,8 @@ var GeomObj = function GLGeomObj() { | |||
325 | this._materialArray.push(mat); | 345 | this._materialArray.push(mat); |
326 | this._materialTypeArray.push(matObj.type); | 346 | this._materialTypeArray.push(matObj.type); |
327 | var type = matArray[i].type; | 347 | var type = matArray[i].type; |
328 | if (type == "fill") this._fillMaterial = mat; | 348 | if (type == "fill") this._fillMaterial = mat; |
329 | else this._strokeMaterial = mat; | 349 | else this._strokeMaterial = mat; |
330 | } | 350 | } |
331 | } | 351 | } |
332 | }; | 352 | }; |
@@ -381,7 +401,7 @@ var GeomObj = function GLGeomObj() { | |||
381 |