diff options
author | Valerio Virgillito | 2012-04-20 16:37:47 -0700 |
---|---|---|
committer | Valerio Virgillito | 2012-04-20 16:37:47 -0700 |
commit | c62273126004f057de40ce91ecda5606643f4c92 (patch) | |
tree | 4f55b7017e3387b90ae57fa71222706bd0ebec66 /js/document/html-document.js | |
parent | c0bb9d7740a0fa2efce6c53c39054a46da4b63e0 (diff) | |
download | ninja-c62273126004f057de40ce91ecda5606643f4c92.tar.gz |
reverting old template to current working status. New template work.
Signed-off-by: Valerio Virgillito <valerio@motorola.com>
Diffstat (limited to 'js/document/html-document.js')
-rwxr-xr-x | js/document/html-document.js | 223 |
1 files changed, 4 insertions, 219 deletions
diff --git a/js/document/html-document.js b/js/document/html-document.js index b79281e4..9873fdd1 100755 --- a/js/document/html-document.js +++ b/js/document/html-document.js | |||
@@ -17,7 +17,6 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
17 | 17 | ||
18 | _selectionExclude: { value: null, enumerable: false }, | 18 | _selectionExclude: { value: null, enumerable: false }, |
19 | _htmlTemplateUrl: { value: "js/document/templates/montage-html/index.html", enumerable: false}, | 19 | _htmlTemplateUrl: { value: "js/document/templates/montage-html/index.html", enumerable: false}, |
20 | _webTemplateUrl: { value: "js/document/templates/montage-web/index.html", enumerable: false}, | ||
21 | _iframe: { value: null, enumerable: false }, | 20 | _iframe: { value: null, enumerable: false }, |
22 | _server: { value: null, enumerable: false }, | 21 | _server: { value: null, enumerable: false }, |
23 | _templateDocument: { value: null, enumerable: false }, | 22 | _templateDocument: { value: null, enumerable: false }, |
@@ -394,7 +393,7 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
394 | //////////////////////////////////////////////////////////////////// | 393 | //////////////////////////////////////////////////////////////////// |
395 | // | 394 | // |
396 | initialize: { | 395 | initialize: { |
397 | value: function(file, uuid, iframe, callback, webTemplate) { | 396 | value: function(file, uuid, iframe, callback) { |
398 | this.application.ninja.documentController._hackRootFlag = false; | 397 | this.application.ninja.documentController._hackRootFlag = false; |
399 | // | 398 | // |
400 | this._userDocument = file; | 399 | this._userDocument = file; |
@@ -405,13 +404,9 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
405 | this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"]; | 404 | this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"]; |
406 | this.currentView = "design"; | 405 | this.currentView = "design"; |
407 | // | 406 | // |
408 | if(webTemplate) { | 407 | |
409 | this.iframe.src = this._webTemplateUrl; | 408 | this.iframe.src = this._htmlTemplateUrl; |
410 | this.iframe.addEventListener("load", this.handleWebTemplateLoad.bind(this), true); | 409 | this.iframe.addEventListener("load", this, true); |
411 | } else { | ||
412 | this.iframe.src = this._htmlTemplateUrl; | ||
413 | this.iframe.addEventListener("load", this, true); | ||
414 | } | ||
415 | } | 410 | } |
416 | }, | 411 | }, |
417 | //////////////////////////////////////////////////////////////////// | 412 | //////////////////////////////////////////////////////////////////// |
@@ -534,216 +529,6 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
534 | value: 0 | 529 | value: 0 |
535 | }, | 530 | }, |
536 | */ | 531 | */ |
537 | handleWebTemplateLoad: { | ||
538 | value: function(event) { | ||
539 | //TODO: Clean up, using for prototyping save | ||
540 | this._templateDocument = {}; | ||
541 | this._templateDocument.html = this.iframe.contentWindow.document; | ||
542 | // this._templateDocument.head = this.iframe.contentWindow.document.getElementById("userHead"); | ||
543 | this._templateDocument.body = this.documentRoot = this.iframe.contentWindow.document.body; | ||
544 | //TODO: Remove, also for prototyping | ||
545 | this.application.ninja.documentController._hackRootFlag = true; | ||
546 | // | ||
547 | // this.stageBG = this.iframe.contentWindow.document.getElementById("stageBG"); | ||
548 | this._document = this.iframe.contentWindow.document; | ||
549 | this._window = this.iframe.contentWindow; | ||
550 | |||
551 | for (var k in this._document.styleSheets) { | ||
552 | if (this._document.styleSheets[k].ownerNode && this._document.styleSheets[k].ownerNode.setAttribute) { | ||
553 | this._document.styleSheets[k].ownerNode.setAttribute('data-ninja-template', 'true'); | ||
554 | } | ||
555 | } | ||
556 | |||
557 | //Adding a handler for the main user document reel to finish loading | ||
558 | this._document.body.addEventListener("userTemplateDidLoad", this.userTemplateDidLoad.bind(this), false); | ||
559 | |||
560 | // Live node list of the current loaded document | ||
561 | this._liveNodeList = this.documentRoot.getElementsByTagName('*'); | ||
562 | |||
563 | // TODO Move this to the appropriate location | ||
564 | var len = this._liveNodeList.length; | ||
565 | |||
566 | for(var i = 0; i < len; i++) { | ||
567 | NJUtils.makeModelFromElement(this._liveNodeList[i]); | ||
568 | } | ||
569 | |||
570 | setTimeout(function () { | ||
571 | |||
572 | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | ||
573 | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | ||
574 | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | ||
575 | if(this._document.styleSheets.length) { | ||
576 | //Checking all styleSheets in document | ||
577 | for (var i in this._document.styleSheets) { | ||
578 | //If rules are null, assuming cross-origin issue | ||
579 | if(this._document.styleSheets[i].rules === null) { | ||
580 | //TODO: Revisit URLs and URI creation logic, very hack right now | ||
581 | var fileUri, cssUrl, cssData, query, prefixUrl, fileCouldDirUrl, docRootUrl; | ||
582 | // | ||
583 | docRootUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]).replace(/\/\//gi, '/')); | ||
584 | //TODO: Parse out relative URLs and map them to absolute | ||
585 | if (this._document.styleSheets[i].href.indexOf(this.application.ninja.coreIoApi.rootUrl) !== -1) { | ||
586 | // | ||
587 | cssUrl = this._document.styleSheets[i].href.split(this.application.ninja.coreIoApi.rootUrl)[1]; | ||
588 | fileUri = this.application.ninja.coreIoApi.cloudData.root+cssUrl; | ||
589 | //TODO: Add error handling for reading file | ||
590 | cssData = this.application.ninja.coreIoApi.readFile({uri: fileUri}); | ||
591 | // | ||
592 | var tag = this.iframe.contentWindow.document.createElement('style'); | ||
593 | tag.setAttribute('type', 'text/css'); | ||
594 | tag.setAttribute('data-ninja-uri', fileUri); | ||
595 | tag.setAttribute('data-ninja-file-url', cssUrl); | ||
596 | tag.setAttribute('data-ninja-file-read-only', JSON.parse(this.application.ninja.coreIoApi.isFileWritable({uri: fileUri}).content).readOnly); | ||
597 | tag.setAttribute('data-ninja-file-name', cssUrl.split('/')[cssUrl.split('/').length-1]); | ||
598 | //Copying attributes to maintain same properties as the <link> | ||
599 | for (var n in this._document.styleSheets[i].ownerNode.attributes) { | ||
600 | if (this._document.styleSheets[i].ownerNode.attributes[n].value && this._document.styleSheets[i].ownerNode.attributes[n].name !== 'disabled' && this._document.styleSheets[i].ownerNode.attributes[n].name !== 'disabled') { | ||
601 | if (this._document.styleSheets[i].ownerNode.attributes[n].value.indexOf(docRootUrl) !== -1) { | ||
602 | tag.setAttribute(this._document.styleSheets[i].ownerNode.attributes[n].name, this._document.styleSheets[i].ownerNode.attributes[n].value.split(docRootUrl)[1]); | ||
603 | } else { | ||
604 | tag.setAttribute(this._document.styleSheets[i].ownerNode.attributes[n].name, this._document.styleSheets[i].ownerNode.attributes[n].value); | ||
605 | } | ||
606 | } | ||
607 | } | ||
608 | // | ||
609 | fileCouldDirUrl = this._document.styleSheets[i].href.split(this._document.styleSheets[i].href.split('/')[this._document.styleSheets[i].href.split('/').length-1])[0]; | ||
610 | |||
611 | //TODO: Make public version of this.application.ninja.ioMediator.getNinjaPropUrlRedirect with dynamic ROOT | ||
612 | tag.innerHTML = cssData.content.replace(/url\(()(.+?)\1\)/g, detectUrl); | ||
613 | |||
614 | function detectUrl (prop) { | ||
615 | return prop.replace(/[^()\\""\\'']+/g, prefixUrl);; | ||
616 | } | ||
617 | |||
618 | function prefixUrl (url) { | ||
619 | if (url !== 'url') { | ||
620 | if (!url.match(/(\b(?:(?:https?|ftp|file|[A-Za-z]+):\/\/|www\.|ftp\.)(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[-A-Z0-9+&@#\/%=~_|$?!:,.])*(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[A-Z0-9+&@#\/%=~_|$]))/gi)) { | ||
621 | url = fileCouldDirUrl+url; | ||
622 | } | ||
623 | } | ||
624 | return url; | ||
625 | } | ||
626 | |||
627 | //Looping through DOM to insert style tag at location of link element | ||
628 | query = this._templateDocument.html.querySelectorAll(['link']); | ||
629 | for (var j in query) { | ||
630 | if (query[j].href === this._document.styleSheets[i].href) { | ||
631 | //Disabling style sheet to reload via inserting in style tag | ||
632 | query[j].setAttribute('disabled', 'true'); | ||
633 | //Inserting tag | ||
634 | this._templateDocument.head.insertBefore(tag, query[j]); | ||
635 | } | ||
636 | } | ||
637 | } else { | ||
638 | console.log('ERROR: Cross-Domain-Stylesheet detected, unable to load in Ninja'); | ||
639 | //None local stylesheet, probably on a CDN (locked) | ||
640 | var tag = this.iframe.contentWindow.document.createElement('style'); | ||
641 | tag.setAttribute('type', 'text/css'); | ||
642 | tag.setAttribute('data-ninja-external-url', this._document.styleSheets[i].href); | ||
643 | tag.setAttribute('data-ninja-file-read-only', "true"); | ||
644 | tag.setAttribute('data-ninja-file-name', this._document.styleSheets[i].href.split('/')[this._document.styleSheets[i].href.split('/').length-1]); | ||
645 | //Copying attributes to maintain same properties as the <link> | ||
646 | for (var n in this._document.styleSheets[i].ownerNode.attributes) { | ||
647 | if (this._document.styleSheets[i].ownerNode.attributes[n].value && this._document.styleSheets[i].ownerNode.attributes[n].name !== 'disabled' && this._document.styleSheets[i].ownerNode.attributes[n].name !== 'disabled') { | ||
648 | if (this._document.styleSheets[i].ownerNode.attributes[n].value.indexOf(docRootUrl) !== -1) { | ||
649 | tag.setAttribute(this._document.styleSheets[i].ownerNode.attributes[n].name, this._document.styleSheets[i].ownerNode.attributes[n].value.split(docRootUrl)[1]); | ||
650 | } else { | ||
651 | tag.setAttribute(this._document.styleSheets[i].ownerNode.attributes[n].name, this._document.styleSheets[i].ownerNode.attributes[n].value); | ||
652 | } | ||
653 | } | ||
654 | } | ||
655 | /* | ||
656 | |||
657 | //TODO: Figure out cross-domain XHR issue, might need cloud to handle | ||
658 | var xhr = new XMLHttpRequest(); | ||
659 | xhr.open("GET", this._document.styleSheets[i].href, true); | ||
660 | xhr.send(); | ||
661 | // | ||
662 | if (xhr.readyState === 4) { | ||
663 | console.log(xhr); | ||
664 | } | ||
665 | //tag.innerHTML = xhr.responseText //xhr.response; | ||
666 | */ | ||
667 | //Temp rule so it's registered in the array | ||
668 | tag.innerHTML = 'noRULEjustHACK{background: #000}'; | ||
669 | //Disabling external style sheets | ||
670 | query = this._templateDocument.html.querySelectorAll(['link']); | ||
671 | for (var k in query) { | ||
672 | if (query[k].href === this._document.styleSheets[i].href) { | ||
673 | |||
674 | //TODO: Removed the temp insertion of the stylesheet | ||
675 | //because it wasn't the proper way to do it | ||
676 | //need to be handled via XHR with proxy in Cloud Sim | ||
677 | |||
678 | //Disabling style sheet to reload via inserting in style tag | ||
679 | //var tempCSS = query[k].cloneNode(true); | ||
680 | //tempCSS.setAttribute('data-ninja-template', 'true'); | ||
681 | query[k].setAttribute('disabled', 'true'); | ||
682 | //this.iframe.contentWindow.document.head.appendChild(tempCSS); | ||
683 | //Inserting tag | ||
684 | this._templateDocument.head.insertBefore(tag, query[k]); | ||
685 | } | ||
686 | } | ||
687 | } | ||
688 | } | ||
689 | } | ||
690 | //////////////////////////////////////////////////////////////////////////// | ||
691 | //////////////////////////////////////////////////////////////////////////// | ||
692 | |||
693 | //TODO: Check if this is needed | ||
694 | this._stylesheets = this._document.styleSheets; | ||
695 | |||
696 | //////////////////////////////////////////////////////////////////////////// | ||
697 | //////////////////////////////////////////////////////////////////////////// |