diff options
-rwxr-xr-x | js/document/helpers/webgl-helper.js | 218 | ||||
-rwxr-xr-x | js/document/helpers/webgl-parser.js | 23 | ||||
-rwxr-xr-x | js/document/models/html.js | 196 | ||||
-rwxr-xr-x | js/document/views/design.js | 4 |
4 files changed, 227 insertions, 214 deletions
diff --git a/js/document/helpers/webgl-helper.js b/js/document/helpers/webgl-helper.js new file mode 100755 index 00000000..84ddc547 --- /dev/null +++ b/js/document/helpers/webgl-helper.js | |||
@@ -0,0 +1,218 @@ | |||
1 | /* <copyright> | ||
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/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | //////////////////////////////////////////////////////////////////////// | ||
8 | // | ||
9 | var Montage = require("montage/core/core").Montage, | ||
10 | Component = require("montage/ui/component").Component, | ||
11 | MaterialsModel = require("js/models/materials-model").MaterialsModel, | ||
12 | NJUtils = require("js/lib/NJUtils").NJUtils, | ||
13 | GLWorld = require("js/lib/drawing/world").World; | ||
14 | //////////////////////////////////////////////////////////////////////// | ||
15 | // | ||
16 | exports.webGlDocumentHelper = Montage.create(Component, { | ||
17 | //////////////////////////////////////////////////////////////////// | ||
18 | // | ||
19 | hasTemplate: { | ||
20 | value: false | ||
21 | }, | ||
22 | //////////////////////////////////////////////////////////////////// | ||
23 | //This is set when the design view is ready, for local reference | ||
24 | iframe: { | ||
25 | value: null | ||
26 | }, | ||
27 | //////////////////////////////////////////////////////////////////// | ||
28 | // | ||
29 | _glData: { | ||
30 | value: null | ||
31 | }, | ||
32 | //////////////////////////////////////////////////////////////////// | ||
33 | // | ||
34 | glData: { | ||
35 | // | ||
36 | get: function() { | ||
37 | // | ||
38 | var elt = this.iframe.contentWindow.document.body; | ||
39 | // | ||
40 | if (elt) { | ||
41 | var matLib = MaterialsModel.exportMaterials(); | ||
42 | this._glData = [matLib]; | ||
43 | this.collectGLData(elt, this._glData ); | ||
44 | } else { | ||
45 | this._glData = null | ||
46 | } | ||
47 | // | ||
48 | return this._glData; | ||
49 | }, | ||
50 | // | ||
51 | set: function(value) { | ||
52 | // | ||
53 | var elt = this.iframe.contentWindow.document.body; | ||
54 | // | ||
55 | if (elt) { | ||
56 | /* | ||
57 | // Use this code to test the runtime version of WebGL | ||
58 | var cdm = new NinjaCvsRt.CanvasDataManager(); | ||
59 | cdm.loadGLData(elt, value, null ); | ||
60 | */ | ||
61 | |||
62 | // | ||
63 | var i, nWorlds= value.length; | ||
64 | // | ||
65 | for (i = 0; i < nWorlds; i++) { | ||
66 | // get the data for the next canvas | ||
67 | var importStr = value[i], id, jObj, index = importStr.indexOf(';'), matLibStr, matLibObj, startIndex, endIndex, canvas, useWebGL, world; | ||
68 | // determine if it is the new (JSON) or old style format | ||
69 | if ((importStr[0] === 'v') && (index < 24)) { | ||
70 | // JSON format. pull off the | ||
71 | importStr = importStr.substr(index+1); | ||
72 | jObj = JSON.parse(importStr); | ||
73 | id = jObj.id; | ||
74 | } else { | ||
75 | // at this point the data could be either the materials library or | ||
76 | // an old style world. We can determine which by converting the string | ||
77 | // to an object via JSON.parse. That operation will fail if the string | ||
78 | // is an old style world. | ||
79 | matLibStr = 'materialLibrary;'; | ||
80 | index = importStr.indexOf(matLibStr); | ||
81 | if (index == 0) { | ||
82 | importStr = importStr.substr(matLibStr.length); | ||
83 | matLibObj = JSON.parse(importStr); | ||
84 | MaterialsModel.importMaterials(matLibObj); | ||
85 | } else { | ||
86 | startIndex = importStr.indexOf("id: "); | ||
87 | if (startIndex >= 0) { | ||
88 | endIndex = importStr.indexOf("\n", startIndex); | ||
89 | if (endIndex > 0) id = importStr.substring(startIndex+4, endIndex); | ||
90 | } | ||
91 | } | ||
92 | } | ||
93 | // | ||
94 | if (id != null) { | ||
95 | // | ||
96 | canvas = this.findCanvasWithID(id, elt); | ||
97 | // | ||
98 | if (canvas) { | ||
99 | // | ||
100 | if (!canvas.elementModel) { | ||
101 | NJUtils.makeElementModel(canvas, "Canvas", "shape", true); | ||
102 | } | ||
103 | // | ||
104 | if (canvas.elementModel) { | ||
105 | if (canvas.elementModel.shapeModel.GLWorld) { | ||
106 | canvas.elementModel.shapeModel.GLWorld.clearTree(); | ||
107 | } | ||
108 | // | ||
109 | if (jObj) { | ||
110 | useWebGL = jObj.webGL; | ||
111 | world = new GLWorld(canvas, useWebGL); | ||
112 | world.importJSON(jObj); | ||
113 | } | ||
114 | // | ||
115 | this.buildShapeModel(canvas.elementModel, world); | ||
116 | } | ||
117 | } | ||
118 | } | ||
119 | } | ||
120 | } | ||
121 | } | ||
122 | }, | ||
123 | //////////////////////////////////////////////////////////////////// | ||
124 | // | ||
125 | findCanvasWithID: { | ||
126 | value: function(id, elt) { | ||
127 | // | ||
128 | var i, child, nKids, foundElt, cid = elt.getAttribute("data-RDGE-id"); | ||
129 | // | ||
130 | if (cid == id) return elt; | ||
131 | // | ||
132 | if (elt.children) { | ||
133 | nKids = elt.children.length; | ||
134 | for (i=0; i<nKids; i++) { | ||
135 | child = elt.children[i]; | ||
136 | foundElt = this.findCanvasWithID( id, child ); | ||
137 | if (foundElt) return foundElt; | ||
138 | } | ||
139 | } | ||
140 | } | ||
141 | }, | ||
142 | //////////////////////////////////////////////////////////////////// | ||
143 | // | ||
144 | buildShapeModel: { | ||
145 | value: function(elementModel, world) { | ||
146 | // | ||
147 | var shapeModel = elementModel.shapeModel, root; | ||
148 | shapeModel.shapeCount = 1; // for now... | ||
149 | shapeModel.useWebGl = world._useWebGL; | ||
150 | shapeModel.GLWorld = world; | ||
151 | // | ||
152 | root = world.getGeomRoot(); | ||
153 | // | ||
154 | if (root) { | ||
155 | shapeModel.GLGeomObj = root; | ||
156 | shapeModel.strokeSize = root._strokeWidth; | ||
157 | shapeModel.strokeStyle = "solid"; | ||
158 | //shapeModel.strokeStyleIndex | ||
159 | switch (root.geomType()) { | ||
160 | case root.GEOM_TYPE_RECTANGLE: | ||
161 | elementModel.selection = "Rectangle"; | ||
162 | elementModel.pi = "RectanglePi"; | ||
163 | shapeModel.tlRadius = root._tlRadius; | ||
164 | shapeModel.trRadius = root._trRadius; | ||
165 | shapeModel.blRadius = root._blRadius; | ||
166 | shapeModel.brRadius = root._brRadius; | ||
167 | break; | ||
168 | case root.GEOM_TYPE_CIRCLE: | ||
169 | elementModel.selection = "Oval"; | ||
170 | elementModel.pi = "OvalPi"; | ||
171 | shapeModel.innerRadius = root._innerRadius; | ||
172 | break; | ||
173 | case root.GEOM_TYPE_LINE: | ||
174 | elementModel.selection = "Line"; | ||
175 | elementModel.pi = "LinePi"; | ||
176 | shapeModel.slope = root._slope; | ||
177 | break; | ||
178 | case root.GEOM_TYPE_BRUSH_STROKE: | ||
179 | elementModel.selection = "BrushStroke"; | ||
180 | elementModel.pi = "BrushStrokePi"; | ||
181 | break; | ||
182 | case root.GEOM_TYPE_CUBIC_BEZIER: | ||
183 | elementModel.selection = "Subpath"; | ||
184 | elementModel.pi = "SubpathPi"; | ||
185 | break; | ||
186 | default: | ||
187 | console.log("geometry type not supported for file I/O, " + root.geomType()); | ||
188 | break; | ||
189 | } | ||
190 | } | ||
191 | } | ||
192 | }, | ||
193 | //////////////////////////////////////////////////////////////////// | ||
194 | // | ||
195 | collectGLData: { | ||
196 | value: function( elt, dataArray ) { | ||
197 | // | ||
198 | var i, data, nKids, child; | ||
199 | // | ||
200 | if (elt.elementModel && elt.elementModel.shapeModel && elt.elementModel.shapeModel.GLWorld) { | ||
201 | data = elt.elementModel.shapeModel.GLWorld.exportJSON(); | ||
202 | dataArray.push(data); | ||
203 | } | ||
204 | // | ||
205 | if (elt.children) { | ||
206 | nKids = elt.children.length; | ||
207 | for (i=0; i<nKids; i++) { | ||
208 | child = elt.children[i]; | ||
209 | this.collectGLData( child, dataArray ); | ||
210 | } | ||
211 | } | ||
212 | } | ||
213 | } | ||
214 | //////////////////////////////////////////////////////////////////// | ||