aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorJose Antonio Marquez2012-03-05 23:18:49 -0800
committerJose Antonio Marquez2012-03-05 23:18:49 -0800
commit4f274aa5beff735f63905704e52e6ea938c140d9 (patch)
tree3849000a0cbb26894257343b0afc639af6547232
parenta68fe3f0180f5ab3304ff201be8da40c4432bd40 (diff)
downloadninja-4f274aa5beff735f63905704e52e6ea938c140d9.tar.gz
Temp support for CDN CSS
Added a temp fix for allow the viewing of CSS on a CDN, however, the styles should not be editable, but will allow for accurate preview of styles. Need to coordinate with the CSS panel and styles manager to insert styles in the appropriate files or tags that have write permission.
-rwxr-xr-xjs/document/html-document.js87
-rw-r--r--js/mediators/io-mediator.js48
2 files changed, 13 insertions, 122 deletions
diff --git a/js/document/html-document.js b/js/document/html-document.js
index a3424259..323c1488 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -546,13 +546,12 @@ exports.HTMLDocument = Montage.create(TextDocument, {
546 docRootUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]).replace(/\/\//gi, '/')); 546 docRootUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]).replace(/\/\//gi, '/'));
547 //TODO: Parse out relative URLs and map them to absolute 547 //TODO: Parse out relative URLs and map them to absolute
548 if (this._document.styleSheets[i].href.indexOf(this.application.ninja.coreIoApi.rootUrl) !== -1) { 548 if (this._document.styleSheets[i].href.indexOf(this.application.ninja.coreIoApi.rootUrl) !== -1) {
549 549 //
550 cssUrl = this._document.styleSheets[i].href.split(this.application.ninja.coreIoApi.rootUrl)[1]; 550 cssUrl = this._document.styleSheets[i].href.split(this.application.ninja.coreIoApi.rootUrl)[1];
551 fileUri = this.application.ninja.coreIoApi.cloudData.root+cssUrl; 551 fileUri = this.application.ninja.coreIoApi.cloudData.root+cssUrl;
552 //TODO: Add error handling for reading file 552 //TODO: Add error handling for reading file
553 cssData = this.application.ninja.coreIoApi.readFile({uri: fileUri}); 553 cssData = this.application.ninja.coreIoApi.readFile({uri: fileUri});
554 554 //
555
556 var tag = this.iframe.contentWindow.document.createElement('style'); 555 var tag = this.iframe.contentWindow.document.createElement('style');
557 tag.setAttribute('type', 'text/css'); 556 tag.setAttribute('type', 'text/css');
558 tag.setAttribute('data-ninja-uri', fileUri); 557 tag.setAttribute('data-ninja-uri', fileUri);
@@ -569,54 +568,10 @@ exports.HTMLDocument = Montage.create(TextDocument, {
569 } 568 }
570 } 569 }
571 } 570 }
572
573 fileCouldDirUrl = this._document.styleSheets[i].href.split(this._document.styleSheets[i].href.split('/')[this._document.styleSheets[i].href.split('/').length-1])[0];
574 prefixUrl = 'url('+fileCouldDirUrl; //This should be re-written with better RegEx
575 tag.innerHTML = cssData.content.replace(/url\(/gi, prefixUrl);
576
577
578
579 //Looping through DOM to insert style tag at location of link element
580 query = this._templateDocument.html.querySelectorAll(['link']);
581 for (var j in query) {
582 if (query[j].href === this._document.styleSheets[i].href) {
583 //Disabling style sheet to reload via inserting in style tag
584 query[j].setAttribute('disabled', 'true');
585 //Inserting tag
586 this._templateDocument.head.insertBefore(tag, query[j]);
587 }
588 }
589
590
591 /*
592//Getting the url of the CSS file
593 cssUrl = this._document.styleSheets[i].href.split('js/document/templates/montage-html')[1];//TODO: Parse out relative URLs and map them to absolute
594 //Creating the URI of the file (this is wrong should not be splitting cssUrl)
595 fileUri = (this.application.ninja.coreIoApi.cloudData.root+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+cssUrl).replace(/\/\//gi, '/');
596 //Loading the data from the file
597 cssData = this.application.ninja.coreIoApi.readFile({uri: fileUri});
598 //Creating tag with file content
599 var tag = this.iframe.contentWindow.document.createElement('style');
600 tag.setAttribute('type', 'text/css');
601 tag.setAttribute('data-ninja-uri', fileUri);
602 tag.setAttribute('data-ninja-file-url', cssUrl);
603 tag.setAttribute('data-ninja-file-read-only', JSON.parse(this.application.ninja.coreIoApi.isFileWritable({uri: fileUri}).content).readOnly);
604 tag.setAttribute('data-ninja-file-name', cssUrl.split('/')[cssUrl.split('/').length-1]);
605 //Copying attributes to maintain same properties as the <link>
606 for (var n in this._document.styleSheets[i].ownerNode.attributes) {
607 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') {
608 tag.setAttribute(this._document.styleSheets[i].ownerNode.attributes[n].name, this._document.styleSheets[i].ownerNode.attributes[n].value);
609 }
610 }
611 // 571 //
612 572 fileCouldDirUrl = this._document.styleSheets[i].href.split(this._document.styleSheets[i].href.split('/')[this._document.styleSheets[i].href.split('/').length-1])[0];
613 //fileCouldDirUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+cssUrl.split(cssUrl.split('/')[cssUrl.split('/').length-1])[0]).replace(/\/\//gi, '/'));
614 fileCouldDirUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]).replace(/\/\//gi, '/'));
615
616 //TODO: Fix regEx to have logic for all possible URLs strings (currently prefixing all url())
617 prefixUrl = 'url('+fileCouldDirUrl; //This should be re-written with better RegEx 573 prefixUrl = 'url('+fileCouldDirUrl; //This should be re-written with better RegEx
618 tag.innerHTML = cssData.content.replace(/url\(/gi, prefixUrl); 574 tag.innerHTML = cssData.content.replace(/url\(/gi, prefixUrl);
619
620 //Looping through DOM to insert style tag at location of link element 575 //Looping through DOM to insert style tag at location of link element
621 query = this._templateDocument.html.querySelectorAll(['link']); 576 query = this._templateDocument.html.querySelectorAll(['link']);
622 for (var j in query) { 577 for (var j in query) {
@@ -627,30 +582,10 @@ exports.HTMLDocument = Montage.create(TextDocument, {
627 this._templateDocument.head.insertBefore(tag, query[j]); 582 this._templateDocument.head.insertBefore(tag, query[j]);
628 } 583 }
629 } 584 }
630*/
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649 } else { 585 } else {
650 console.log('ERROR: Cross-Domain-Stylesheet detected, unable to load in Ninja'); 586 console.log('ERROR: Cross-Domain-Stylesheet detected, unable to load in Ninja');
651 //None local stylesheet, probably on a CDN (locked) 587 //None local stylesheet, probably on a CDN (locked)
652 /* 588 var tag = this.iframe.contentWindow.document.createElement('style');
653var tag = this.iframe.contentWindow.document.createElement('style');
654 tag.setAttribute('type', 'text/css'); 589 tag.setAttribute('type', 'text/css');
655 tag.setAttribute('data-ninja-external-url', this._document.styleSheets[i].href); 590 tag.setAttribute('data-ninja-external-url', this._document.styleSheets[i].href);
656 tag.setAttribute('data-ninja-file-read-only', "true"); 591 tag.setAttribute('data-ninja-file-read-only', "true");
@@ -669,7 +604,8 @@ var tag = this.iframe.contentWindow.document.createElement('style');
669 604
670 605
671 606
672 //TODO: Figure out cross-domain XHR issue, might need cloud to handle 607 /*
608//TODO: Figure out cross-domain XHR issue, might need cloud to handle
673 var xhr = new XMLHttpRequest(); 609 var xhr = new XMLHttpRequest();
674 xhr.open("GET", this._document.styleSheets[i].href, true); 610 xhr.open("GET", this._document.styleSheets[i].href, true);
675 xhr.send(); 611 xhr.send();
@@ -677,20 +613,21 @@ var tag = this.iframe.contentWindow.document.createElement('style');
677 if (xhr.readyState === 4) { 613 if (xhr.readyState === 4) {
678 console.log(xhr); 614 console.log(xhr);
679 } 615 }
616*/
680 //tag.innerHTML = xhr.responseText //xhr.response; 617 //tag.innerHTML = xhr.responseText //xhr.response;
618 tag.innerHTML = 'noRULEjustHACK{background: #000}'
681 //Currently no external styles will load if unable to load via XHR request 619 //Currently no external styles will load if unable to load via XHR request
682 620
683 //Disabling external style sheets 621 //Disabling external style sheets
684 query = this._templateDocument.html.querySelectorAll(['link']); 622 query = this._templateDocument.html.querySelectorAll(['link']);
685 for (var j in query) { 623 for (var k in query) {
686 if (query[j].href === this._document.styleSheets[i].href) { 624 if (query[k].href === this._document.styleSheets[i].href) {
687 //Disabling style sheet to reload via inserting in style tag 625 //Disabling style sheet to reload via inserting in style tag
688 query[j].setAttribute('disabled', 'true'); 626 query[k].setAttribute('disabled', 'true');
689 //Inserting tag 627 //Inserting tag
690 this._templateDocument.head.insertBefore(tag, query[j]); 628 this._templateDocument.head.insertBefore(tag, query[k]);
691 } 629 }
692 } 630 }
693*/
694 } 631 }
695 } 632 }
696 } 633 }
diff --git a/js/mediators/io-mediator.js b/js/mediators/io-mediator.js
index 07a139c0..6c2147c8 100644
--- a/js/mediators/io-mediator.js
+++ b/js/mediators/io-mediator.js
@@ -260,17 +260,6 @@ exports.IoMediator = Montage.create(Component, {
260 } 260 }
261 } 261 }
262 } 262 }
263
264
265 /////////////////////////////////////////////////////////////////////////////////////////
266 /////////////////////////////////////////////////////////////////////////////////////////
267
268 //TODO: Add logic for parse CSS string correct URLs since referencing is lost
269
270 /////////////////////////////////////////////////////////////////////////////////////////
271 /////////////////////////////////////////////////////////////////////////////////////////
272
273
274 //Checking for type of save: styles = <style> only | css = <style> and <link> (all CSS) 263 //Checking for type of save: styles = <style> only | css = <style> and <link> (all CSS)
275 if (template.styles) { 264 if (template.styles) {