aboutsummaryrefslogtreecommitdiff
path: root/js/document
diff options
context:
space:
mode:
authorValerio Virgillito2012-03-13 11:15:34 -0700
committerValerio Virgillito2012-03-13 11:15:34 -0700
commitf6b958360d82854bdaf51848e7fd715d1f633179 (patch)
tree80f6c08bb730089bdd3f26310df8d2363f9ba863 /js/document
parentc24f58c10231c30d3a8a4c9fb9a4f395dd746180 (diff)
parent4d7b86f55c504ee4e8c2460cf6b60cb9a2cf18f0 (diff)
downloadninja-f6b958360d82854bdaf51848e7fd715d1f633179.tar.gz
Merge pull request #105 from joseeight/FileIO-Build-Candidate
File I/O adding webGL/canvas data functionality
Diffstat (limited to 'js/document')
-rwxr-xr-xjs/document/html-document.js149
1 files changed, 127 insertions, 22 deletions
diff --git a/js/document/html-document.js b/js/document/html-document.js
index 23b55e92..051490f5 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -8,7 +8,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
8// 8//
9var Montage = require("montage/core/core").Montage, 9var Montage = require("montage/core/core").Montage,
10 TextDocument = require("js/document/text-document").TextDocument, 10 TextDocument = require("js/document/text-document").TextDocument,
11 NJUtils = require("js/lib/NJUtils").NJUtils; 11 NJUtils = require("js/lib/NJUtils").NJUtils,
12 GLWorld = require("js/lib/drawing/world").World;
12//////////////////////////////////////////////////////////////////////// 13////////////////////////////////////////////////////////////////////////
13// 14//
14exports.HTMLDocument = Montage.create(TextDocument, { 15exports.HTMLDocument = Montage.create(TextDocument, {
@@ -187,31 +188,112 @@ exports.HTMLDocument = Montage.create(TextDocument, {
187// }, 188// },
188 189
189 glData: { 190 glData: {
190 get: function() 191 get: function() {
191 { 192 //
192 var elt = this.iframe.contentWindow.document.getElementById("UserContent"); 193 var elt = this.iframe.contentWindow.document.getElementById("UserContent");
193 this._glData = null; 194 //
194 if (elt) 195 if (elt) {
195 {
196 var cdm = new CanvasDataManager();
197 this._glData = []; 196 this._glData = [];
198 cdm.collectGLData( elt, this._glData ); 197 //if (path) {
198 //this.collectGLData(elt, this._glData, path);
199 //} else {
200 this.collectGLData(elt, this._glData );
201 //}
202 } else {
203 this._glData = null
199 } 204 }
200 205 //
201 return this._glData; 206 return this._glData;
202 }, 207 },
208 set: function(value) {
209 var elt = this.documentRoot;
210 if (elt) {
211 var nWorlds= value.length;
212 for (var i=0; i<nWorlds; i++) {
213 var importStr = value[i];
214 var startIndex = importStr.indexOf( "id: " );
215 if (startIndex >= 0) {
216 var endIndex = importStr.indexOf( "\n", startIndex );
217 if (endIndex > 0) {
218 var id = importStr.substring( startIndex+4, endIndex );
219 if (id) {
220 var canvas = this.findCanvasWithID( id, elt );
221 if (canvas) {
222 if (!canvas.elementModel) {
223 NJUtils.makeElementModel(canvas, "Canvas", "shape", true);
224 }
225 if (canvas.elementModel) {
226 if (canvas.elementModel.shapeModel.GLWorld) {
227 canvas.elementModel.shapeModel.GLWorld.clearTree();
228 }
229 var index = importStr.indexOf( "webGL: " );
230 var useWebGL = (index >= 0)
231 var world = new GLWorld( canvas, useWebGL );
232 world.import( importStr );
233 this.buildShapeModel( canvas.elementModel, world );
234 }
235 }
236 }
237 }
238 }
239 }
240 }
241 }
242 },
203 243
204 set: function(value) 244 buildShapeModel:
245 {
246 value: function( elementModel, world )
205 { 247 {
206 var elt = this.documentRoot; 248 var shapeModel = elementModel.shapeModel;
207 if (elt) 249 shapeModel.shapeCount = 1; // for now...
250 shapeModel.useWebGl = world._useWebGL;
251 shapeModel.GLWorld = world;
252 var root = world.getGeomRoot();
253 if (root)
208 { 254 {
209 console.log( "load canvas data: " , value ); 255 shapeModel.GLGeomObj = root;
210 var cdm = new CanvasDataManager(); 256 shapeModel.strokeSize = root._strokeWidth;
211 cdm.loadGLData(elt, value); 257 shapeModel.stroke = root._strokeColor.slice();
258 shapeModel.strokeMaterial = root._strokeMaterial.dup();
259 shapeModel.strokeStyle = "solid";
260 //shapeModel.strokeStyleIndex
261 //shapeModel.border
262 //shapeModel.background
263 switch (root.geomType())
264 {
265 case root.GEOM_TYPE_RECTANGLE:
266 elementModel.selection = "Rectangle";
267 elementModel.pi = "RectanglePi";
268 shapeModel.fill = root._fillColor.slice();
269 shapeModel.fillMaterial = root._fillMaterial.dup();
270 shapeModel.tlRadius = root._tlRadius;
271 shapeModel.trRadius = root._trRadius;
272 shapeModel.blRadius = root._blRadius;
273 shapeModel.brRadius = root._brRadius;
274 break;
275
276 case root.GEOM_TYPE_CIRCLE:
277 elementModel.selection = "Oval";
278 elementModel.pi = "OvalPi";
279 shapeModel.fill = root._fillColor.slice();
280 shapeModel.fillMaterial = root._fillMaterial.dup();
281 shapeModel.innerRadius = root._innerRadius;
282 break;
283
284 case root.GEOM_TYPE_LINE:
285 elementModel.selection = "Line";
286 elementModel.pi = "LinePi";
287 shapeModel.slope = root._slope;
288 break;
289
290 default:
291 console.log( "geometry type not supported for file I/O, " + root.geomType());
292 break;
293 }
212 } 294 }
213 } 295 }
214 }, 296 },
215 297
216 zoomFactor: { 298 zoomFactor: {
217 get: function() { return this._zoomFactor; }, 299 get: function() { return this._zoomFactor; },
@@ -240,6 +322,27 @@ exports.HTMLDocument = Montage.create(TextDocument, {
240 } 322 }
241 } 323 }
242 }, 324 },
325
326 /**
327 * search the DOM tree to find a canvas with the given id
328 */
329 findCanvasWithID: {
330 value: function( id, elt ) {
331 var cid = elt.getAttribute( "data-RDGE-id" );
332 if (cid == id) return elt;
333
334 if (elt.children)
335 {
336 var nKids = elt.children.length;
337 for (var i=0; i<nKids; i++)
338 {
339 var child = elt.children[i];
340 var foundElt = this.findCanvasWithID( id, child );
341 if (foundElt) return foundElt;
342 }
343 }
344 }
345 },
243 346
244 347
245 348
@@ -768,8 +871,12 @@ exports.HTMLDocument = Montage.create(TextDocument, {
768 value: function () { 871 value: function () {
769 //TODO: Add logic to handle save before preview 872 //TODO: Add logic to handle save before preview
770 this.application.ninja.documentController.handleExecuteSaveAll(null); 873 this.application.ninja.documentController.handleExecuteSaveAll(null);
771 //Launching 'blank' tab for testing movie 874 //Temp check for webGL Hack
772 window.open(this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController._activeDocument.uri.split(this.application.ninja.coreIoApi.cloudData.root)[1]); 875 if (this.application.ninja.documentController.activeDocument.glData.length && this.application.ninja.documentController.activeDocument.glData.length > 0) {
876 setTimeout(function () {window.open(this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController._activeDocument.uri.split(this.application.ninja.coreIoApi.cloudData.root)[1]);}.bind(this), 3500);
877 } else {
878 window.open(this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController._activeDocument.uri.split(this.application.ninja.coreIoApi.cloudData.root)[1]);
879 }
773 //chrome.tabs.create({url: this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController._activeDocument.uri.split(this.application.ninja.coreIoApi.cloudData.root)[1]}); 880 //chrome.tabs.create({url: this.application.ninja.coreIoApi.rootUrl+this.application.ninja.documentController._activeDocument.uri.split(this.application.ninja.coreIoApi.cloudData.root)[1]});
774 } 881 }
775 }, 882 },
@@ -788,8 +895,7 @@ exports.HTMLDocument = Montage.create(TextDocument, {
788 } 895 }
789 } 896 }
790 } 897 }
791 //return {mode: 'html', document: this._userDocument, webgl: this.glData, styles: styles, head: this._templateDocument.head.innerHTML, body: this._templateDocument.body.innerHTML}; 898 return {mode: 'html', document: this._userDocument, webgl: this.glData, styles: styles, head: this._templateDocument.head.innerHTML, body: this._templateDocument.body.innerHTML};
792 return {mode: 'html', document: this._userDocument, styles: styles, head: this._templateDocument.head.innerHTML, body: this._templateDocument.body.innerHTML};
793 } else if (this.currentView === "code"){ 899 } else if (this.currentView === "code"){
794 //TODO: Would this get call when we are in code of HTML? 900 //TODO: Would this get call when we are in code of HTML?
795 } else { 901 } else {
@@ -812,8 +918,7 @@ exports.HTMLDocument = Montage.create(TextDocument, {
812 } 918 }
813 } 919 }
814 } 920 }
815 //return {mode: 'html', document: this._userDocument, webgl: this.glData, css: css, head: this._templateDocument.head.innerHTML, body: this._templateDocument.body.innerHTML}; 921 return {mode: 'html', document: this._userDocument, webgl: this.glData, css: css, head: this._templateDocument.head.innerHTML, body: this._templateDocument.body.innerHTML};
816 return {mode: 'html', document: this._userDocument, css: css, head: this._templateDocument.head.innerHTML, body: this._templateDocument.body.innerHTML};
817 } else if (this.currentView === "code"){ 922 } else if (this.currentView === "code"){