diff options
Diffstat (limited to 'js/io/document/html-document.js')
-rwxr-xr-x | js/io/document/html-document.js | 110 |
1 files changed, 71 insertions, 39 deletions
diff --git a/js/io/document/html-document.js b/js/io/document/html-document.js index d51cd279..dfd8566a 100755 --- a/js/io/document/html-document.js +++ b/js/io/document/html-document.js | |||
@@ -11,9 +11,10 @@ var Montage = require("montage/core/core").Montage, | |||
11 | var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.BaseDocument, { | 11 | var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.BaseDocument, { |
12 | // PRIVATE MEMBERS | 12 | // PRIVATE MEMBERS |
13 | _selectionExclude: { value: null, enumerable: false }, | 13 | _selectionExclude: { value: null, enumerable: false }, |
14 | _cloudTemplateUri: { value: "user-document-templates/montage-application-cloud/index.html", enumerable: false}, | 14 | _htmlTemplateUrl: { value: "user-document-templates/montage-application-cloud/index.html", enumerable: false}, |
15 | _iframe: { value: null, enumerable: false }, | 15 | _iframe: { value: null, enumerable: false }, |
16 | _server: { value: null, enumerable: false }, | 16 | _server: { value: null, enumerable: false }, |
17 | _templateDocument: { value: null, enumerable: false }, | ||
17 | _selectionModel: { value: [], enumerable: false }, | 18 | _selectionModel: { value: [], enumerable: false }, |
18 | _undoModel: { value: { "queue" : [], "position" : 0 }, enumerable: false}, | 19 | _undoModel: { value: { "queue" : [], "position" : 0 }, enumerable: false}, |
19 | 20 | ||
@@ -24,7 +25,7 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
24 | _styles: { value: null, enumerable: false }, | 25 | _styles: { value: null, enumerable: false }, |
25 | _stylesheets: { value: null, enumerable: false }, | 26 | _stylesheets: { value: null, enumerable: false }, |
26 | _stageStyleSheetId : { value: 'nj-stage-stylesheet', enumerable: false }, | 27 | _stageStyleSheetId : { value: 'nj-stage-stylesheet', enumerable: false }, |
27 | _initialUserDocument: { value: null, enumerable: false }, | 28 | _userDocument: { value: null, enumerable: false }, |
28 | _htmlSource: {value: "<html></html>", enumerable: false}, | 29 | _htmlSource: {value: "<html></html>", enumerable: false}, |
29 | _glData: {value: null, enumerable: false }, | 30 | _glData: {value: null, enumerable: false }, |
30 | 31 | ||
@@ -218,30 +219,27 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
218 | 219 | ||
219 | //****************************************// | 220 | //****************************************// |
220 | // PUBLIC METHODS | 221 | // PUBLIC METHODS |
221 | initialize: { | 222 | |
222 | value: function(doc, uuid, iframe, callback) { | 223 | |
223 | // Shell mode is not used anymore | 224 | //////////////////////////////////////////////////////////////////// |
224 | //if(!window.IsInShellMode()) { | 225 | // |
225 | if(!doc.name){doc.name = "index-cloud"}; | 226 | initialize: { |
226 | if(!doc.uri){doc.uri = this._cloudTemplateUri}; | 227 | value: function(file, uuid, iframe, callback) { |
227 | this.init(doc.name, doc.uri, doc.type, iframe, uuid, callback); | 228 | // |
228 | /* | 229 | this._userDocument = file; |
229 | } else { | 230 | // |
230 | var tmpurl = doc.uri.split('\\'); | 231 | this.init(file.name, file.uri, file.extension, iframe, uuid, callback); |
231 | var fileUrl = doc.server.url + "/" + tmpurl[tmpurl.length -1] + "?fileio=true&template=/user-document-templates/montage-application/index.html"; | 232 | // |
232 | this.init(name, fileUrl, doc.type, iframe, uuid, callback); | 233 | this.iframe = iframe; |
233 | this.server = doc.server; | 234 | this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"]; |
234 | this._initialUserDocument = doc; | 235 | this.currentView = "design"; |
235 | } | 236 | // |
236 | */ | 237 | this.iframe.src = this._htmlTemplateUrl; |
237 | this.iframe = iframe; | 238 | this.iframe.addEventListener("load", this, true); |
238 | this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"]; | ||
239 | this.currentView = "design"; | ||
240 | |||
241 | this._loadDocument(this.uri); | ||
242 | |||
243 | } | 239 | } |
244 | }, | 240 | }, |
241 | //////////////////////////////////////////////////////////////////// | ||
242 | |||
245 | 243 | ||
246 | collectGLData: { | 244 | collectGLData: { |
247 | value: function( elt, dataArray ) | 245 | value: function( elt, dataArray ) |
@@ -345,7 +343,8 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
345 | } | 343 | } |
346 | }, | 344 | }, |
347 | 345 | ||
348 | // Private | 346 | /* |
347 | // Private | ||
349 | _loadDocument: { | 348 | _loadDocument: { |
350 | value: function(uri) { | 349 | value: function(uri) { |
351 | // Load the document into the Iframe | 350 | // Load the document into the Iframe |
@@ -353,23 +352,36 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
353 | this.iframe.addEventListener("load", this, true); | 352 | this.iframe.addEventListener("load", this, true); |
354 | } | 353 | } |
355 | }, | 354 | }, |
356 | 355 | */ | |
356 | |||
357 | |||
358 | |||
359 | //////////////////////////////////////////////////////////////////// | ||
360 | // | ||
357 | handleEvent: { | 361 | handleEvent: { |
358 | value: function(event){ | 362 | value: function(event){ |
359 | this.documentRoot = this.iframe.contentWindow.document.getElementById("UserContent"); | 363 | //TODO: Clean up, using for prototyping save |
364 | this._templateDocument = {}; | ||
365 | this._templateDocument.head = this.iframe.contentWindow.document.getElementById("userHead");; | ||
366 | this._templateDocument.body = this.iframe.contentWindow.document.getElementById("UserContent");; | ||
367 | // | ||
368 | this.documentRoot = this.iframe.contentWindow.document.getElementById("UserContent"); | ||
360 | this.stageBG = this.iframe.contentWindow.document.getElementById("stageBG"); | 369 | this.stageBG = this.iframe.contentWindow.document.getElementById("stageBG"); |
361 | this.stageBG.onclick = null; | 370 | this.stageBG.onclick = null; |
362 | this._document = this.iframe.contentWindow.document; | 371 | this._document = this.iframe.contentWindow.document; |
363 | this._window = this.iframe.contentWindow; | 372 | this._window = this.iframe.contentWindow; |
364 | if(!this.documentRoot.Ninja) | 373 | // |
365 | { | 374 | if(!this.documentRoot.Ninja) this.documentRoot.Ninja = {}; |
366 | this.documentRoot.Ninja = {}; | 375 | // |
367 | } | 376 | |
368 | 377 | this.documentRoot.innerHTML = this._userDocument.content.body; | |
369 | if(this._initialUserDocument) { | 378 | this.iframe.contentWindow.document.getElementById("userHead").innerHTML = this._userDocument.content.head; |
370 | // Now load the user content | 379 | |
371 | this.documentRoot.innerHTML = this._initialUserDocument.body; | 380 | |
372 | this.iframe.contentWindow.document.getElementById("userHead").innerHTML = this._initialUserDocument.head; | 381 | //TODO: Look at code below and clean up |
382 | |||
383 | |||
384 | |||
373 | 385 | ||
374 | this.cssLoadInterval = setInterval(function() { | 386 | this.cssLoadInterval = setInterval(function() { |
375 | if(this._document.styleSheets.length > 1) { | 387 | if(this._document.styleSheets.length > 1) { |
@@ -383,7 +395,8 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
383 | 395 | ||
384 | // TODO - Not sure where this goes | 396 | // TODO - Not sure where this goes |
385 | this._userComponentSet = {}; | 397 | this._userComponentSet = {}; |
386 | } else { | 398 | |
399 | |||
387 | this._styles = this._document.styleSheets[this._document.styleSheets.length - 1]; | 400 | this._styles = this._document.styleSheets[this._document.styleSheets.length - 1]; |
388 | this._stylesheets = this._document.styleSheets; // Entire stlyesheets array | 401 | this._stylesheets = this._document.styleSheets; // Entire stlyesheets array |
389 | 402 | ||
@@ -429,7 +442,7 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
429 | } | 442 | } |
430 | 443 | ||
431 | this.callback(this); | 444 | this.callback(this); |
432 | } | 445 | |
433 | } | 446 | } |
434 | }, | 447 | }, |
435 | 448 | ||
@@ -453,7 +466,25 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
453 | * public method | 466 | * public method |
454 | * | 467 | * |
455 | */ | 468 | */ |
456 | save:{ | 469 | //////////////////////////////////////////////////////////////////// |
470 | // | ||
471 | save: { | ||
472 | enumerable: false, | ||
473 | value: function () { | ||
474 | //TODO: Add code view logic and also styles for HTML | ||
475 | if (this.currentView === 'design') { | ||
476 | return {mode: 'html', document: this._userDocument, style: this._styles, head: this._templateDocument.head.innerHTML, body: this._templateDocument.body.innerHTML}; | ||
477 | } else if(this.currentView === "code"){ | ||
478 | //TODO: Would this get call when we are in code of HTML? | ||
479 | } | ||
480 | } | ||
481 | } | ||
482 | //////////////////////////////////////////////////////////////////// | ||
483 | //////////////////////////////////////////////////////////////////// | ||
484 | |||
485 | |||
486 | /* | ||
487 | save:{ | ||
457 | value:function(){ | 488 | value:function(){ |
458 | try{ | 489 | try{ |
459 | if(this.currentView === "design"){ | 490 | if(this.currentView === "design"){ |
@@ -469,5 +500,6 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
469 | } | 500 | } |
470 | } | 501 | } |
471 | } | 502 | } |
503 | */ | ||
472 | 504 | ||
473 | }); \ No newline at end of file | 505 | }); \ No newline at end of file |