diff options
author | Jose Antonio Marquez | 2012-05-07 13:21:31 -0700 |
---|---|---|
committer | Jose Antonio Marquez | 2012-05-07 13:21:31 -0700 |
commit | b8c27edc106818ff84f93ebe30ce50359a03885b (patch) | |
tree | 1b66647f209efa429b444591c3d56ebc0fd8cc9d /js/document/models | |
parent | 5293ede5f3493900df93da33197416d853f8d907 (diff) | |
download | ninja-b8c27edc106818ff84f93ebe30ce50359a03885b.tar.gz |
Adding webGL support for opening files
Added I/O for loading webGL on open file. I/O support for saving to come.
Diffstat (limited to 'js/document/models')
-rwxr-xr-x | js/document/models/base.js | 13 | ||||
-rwxr-xr-x | js/document/models/html.js | 197 |
2 files changed, 207 insertions, 3 deletions
diff --git a/js/document/models/base.js b/js/document/models/base.js index 3bb69f6b..746922ad 100755 --- a/js/document/models/base.js +++ b/js/document/models/base.js | |||
@@ -74,6 +74,19 @@ exports.BaseDocumentModel = Montage.create(Component, { | |||
74 | }, | 74 | }, |
75 | //////////////////////////////////////////////////////////////////// | 75 | //////////////////////////////////////////////////////////////////// |
76 | // | 76 | // |
77 | browserPreview: { | ||
78 | value: function (browser) { | ||
79 | // | ||
80 | switch (browser) { | ||
81 | case 'chrome': | ||
82 | break; | ||
83 | default: | ||
84 | break; | ||
85 | } | ||
86 | } | ||
87 | }, | ||
88 | //////////////////////////////////////////////////////////////////// | ||
89 | // | ||
77 | save: { | 90 | save: { |
78 | value: function () { | 91 | value: function () { |
79 | // | 92 | // |
diff --git a/js/document/models/html.js b/js/document/models/html.js index 5eedb731..e0a18850 100755 --- a/js/document/models/html.js +++ b/js/document/models/html.js | |||
@@ -7,7 +7,10 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
7 | //////////////////////////////////////////////////////////////////////// | 7 | //////////////////////////////////////////////////////////////////////// |
8 | // | 8 | // |
9 | var Montage = require("montage/core/core").Montage, | 9 | var Montage = require("montage/core/core").Montage, |
10 | BaseDocumentModel = require("js/document/models/base").BaseDocumentModel; | 10 | BaseDocumentModel = require("js/document/models/base").BaseDocumentModel, |
11 | MaterialsModel = require("js/models/materials-model").MaterialsModel, | ||
12 | NJUtils = require("js/lib/NJUtils").NJUtils, | ||
13 | GLWorld = require("js/lib/drawing/world").World; | ||
11 | //////////////////////////////////////////////////////////////////////// | 14 | //////////////////////////////////////////////////////////////////////// |
12 | // | 15 | // |
13 | exports.HtmlDocumentModel = Montage.create(BaseDocumentModel, { | 16 | exports.HtmlDocumentModel = Montage.create(BaseDocumentModel, { |
@@ -16,10 +19,198 @@ exports.HtmlDocumentModel = Montage.create(BaseDocumentModel, { | |||
16 | hasTemplate: { | 19 | hasTemplate: { |
17 | value: false | 20 | value: false |
18 | }, | 21 | }, |
19 | 22 | //////////////////////////////////////////////////////////////////// | |
23 | // | ||
20 | draw3DGrid: { | 24 | draw3DGrid: { |
21 | value: false | 25 | value: false |
22 | } | 26 | }, |
27 | //////////////////////////////////////////////////////////////////// | ||
28 | // | ||
29 | _glData: { | ||
30 | value: null | ||
31 | }, | ||
32 | //////////////////////////////////////////////////////////////////// | ||
33 | // | ||
34 | glData: { | ||
35 | // | ||
36 | get: function() { | ||
37 | // | ||
38 | var elt = this.views.design.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.views.design.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 | }, | ||