diff options
-rwxr-xr-x | js/document/html-document.js | 50 |
1 files changed, 44 insertions, 6 deletions
diff --git a/js/document/html-document.js b/js/document/html-document.js index 9a7755e6..02e9918f 100755 --- a/js/document/html-document.js +++ b/js/document/html-document.js | |||
@@ -377,29 +377,29 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
377 | value: function(event){ | 377 | value: function(event){ |
378 | //TODO: Clean up, using for prototyping save | 378 | //TODO: Clean up, using for prototyping save |
379 | this._templateDocument = {}; | 379 | this._templateDocument = {}; |
380 | this._templateDocument.html = this.iframe.contentWindow.document; | ||
380 | this._templateDocument.head = this.iframe.contentWindow.document.getElementById("userHead"); | 381 | this._templateDocument.head = this.iframe.contentWindow.document.getElementById("userHead"); |
381 | this._templateDocument.body = this.documentRoot = this.iframe.contentWindow.document.getElementById("UserContent"); | 382 | this._templateDocument.body = this.documentRoot = this.iframe.contentWindow.document.getElementById("UserContent"); |
382 | //TODO: Remove, also for prototyping | 383 | //TODO: Remove, also for prototyping |
383 | this.application.ninja.documentController._hackRootFlag = true; | 384 | this.application.ninja.documentController._hackRootFlag = true; |
384 | // | 385 | // |
385 | //this.documentRoot = this.iframe.contentWindow.document.getElementById("UserContent"); | ||
386 | this.stageBG = this.iframe.contentWindow.document.getElementById("stageBG"); | 386 | this.stageBG = this.iframe.contentWindow.document.getElementById("stageBG"); |
387 | this.stageBG.onclick = null; | 387 | this.stageBG.onclick = null; |
388 | this._document = this.iframe.contentWindow.document; | 388 | this._document = this.iframe.contentWindow.document; |
389 | this._window = this.iframe.contentWindow; | 389 | this._window = this.iframe.contentWindow; |
390 | // | 390 | // |
391 | if(!this.documentRoot.Ninja) this.documentRoot.Ninja = {}; | 391 | if(!this.documentRoot.Ninja) this.documentRoot.Ninja = {}; |
392 | // | 392 | //Inserting user's document into template |
393 | this._templateDocument.head.innerHTML = this._userDocument.content.head; | 393 | this._templateDocument.head.innerHTML = this._userDocument.content.head; |
394 | this._templateDocument.body.innerHTML = this._userDocument.content.body; | 394 | this._templateDocument.body.innerHTML = this._userDocument.content.body; |
395 | 395 | ||
396 | // Adding a handler for the main user document reel to finish loading. | 396 | //Adding a handler for the main user document reel to finish loading |
397 | this._document.body.addEventListener("userTemplateDidLoad", this.userTemplateDidLoad.bind(this), false); | 397 | this._document.body.addEventListener("userTemplateDidLoad", this.userTemplateDidLoad.bind(this), false); |
398 | 398 | ||
399 | 399 | ||
400 | /* this.iframe.contentWindow.document.addEventListener('DOMSubtreeModified', function (e) { */ //TODO: Remove events upon loading once | 400 | /* this.iframe.contentWindow.document.addEventListener('DOMSubtreeModified', function (e) { */ //TODO: Remove events upon loading once |
401 | 401 | ||
402 | //TODO: When written, the best way to initialize the document is to listen for the DOM tree being modified | 402 | //TODO: When re-written, the best way to initialize the document is to listen for the DOM tree being modified |
403 | setTimeout(function () { | 403 | setTimeout(function () { |
404 | 404 | ||
405 | 405 | ||
@@ -408,9 +408,47 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
408 | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | 408 | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////// |
409 | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | 409 | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////// |
410 | if(this._document.styleSheets.length > 1) { | 410 | if(this._document.styleSheets.length > 1) { |
411 | this._styles = this._document.styleSheets[this._document.styleSheets.length - 1]; | 411 | //Checking all styleSheets in document |
412 | for (var i in this._document.styleSheets) { | ||
413 | //If rules are null, assuming cross-origin issue | ||
414 | if(this._document.styleSheets[i].rules === null) { | ||
415 | //TODO: Revisit URLs and URI creation logic, very hack right now | ||
416 | var fileUri, cssUrl, cssData, tag, query; | ||
417 | if (this._document.styleSheets[i].href.indexOf('js/document/templates/montage-html') !== -1) { | ||
418 | //Getting the url of the CSS file | ||
419 | cssUrl = this._document.styleSheets[i].href.split('js/document/templates/montage-html')[1]; | ||
420 | //Creating the URI of the file (this is wrong should not be splitting cssUrl) | ||
421 | fileUri = this.application.ninja.coreIoApi.cloudData.root+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+cssUrl.split('/')[1]; | ||
422 | //Loading the data from the file | ||
423 | cssData = this.application.ninja.coreIoApi.readFile({uri: fileUri}); | ||
424 | //Creating tag with file content | ||
425 | tag = this.iframe.contentWindow.document.createElement('style'); | ||
426 | tag.setAttribute('ninjauri', fileUri); | ||
427 | tag.setAttribute('ninjafileurl', cssUrl); | ||
428 | tag.innerHTML = cssData.content; | ||
429 | //Looping through DOM to insert style tag at location of link element | ||
430 | query = this._templateDocument.html.querySelectorAll(['link']); | ||
431 | for (var j in query) { | ||
432 | if (query[j].href === this._document.styleSheets[i].href) { | ||
433 | //Disabling style sheet to reload via inserting in style tag | ||
434 | query[j].setAttribute('disabled', 'true'); | ||
435 | //Inserting tag | ||
436 | this._templateDocument.head.insertBefore(tag, query[j]); | ||
437 | } | ||
438 | } | ||
439 | } | ||
440 | } | ||
441 | } | ||
442 | |||
443 | //TODO: Revisit this logic | ||
444 | this._styles = this._document.styleSheets[1]; | ||
412 | this._stylesheets = this._document.styleSheets; // Entire stlyesheets array | 445 | this._stylesheets = this._document.styleSheets; // Entire stlyesheets array |
413 | 446 | ||
447 | console.log(this._document.styleSheets); | ||
448 | |||
449 | //////////////////////////////////////////////////////////////////////////// | ||
450 | //////////////////////////////////////////////////////////////////////////// | ||
451 | |||
414 | //TODO Finish this implementation once we start caching Core Elements | 452 | //TODO Finish this implementation once we start caching Core Elements |
415 | // Assign a model to the UserContent and add the ViewPort reference to it. | 453 | // Assign a model to the UserContent and add the ViewPort reference to it. |
416 | NJUtils.makeElementModel(this.documentRoot, "Stage", "stage"); | 454 | NJUtils.makeElementModel(this.documentRoot, "Stage", "stage"); |