aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorJose Antonio Marquez2012-03-05 15:55:30 -0800
committerJose Antonio Marquez2012-03-05 15:55:30 -0800
commit56efed8b1ed9974aade615fce2d96bc214d21540 (patch)
tree02ab232c4a5df53e136396ba3ec6efca4cc62a65
parent195624da6d0c5d15bcde8a8655355544687ef58a (diff)
downloadninja-56efed8b1ed9974aade615fce2d96bc214d21540.tar.gz
Resolved URL path issues in document and CSS
Added logic to allow for files opened and assets linked in any order all under the cloud server root.
-rwxr-xr-xjs/document/html-document.js121
-rw-r--r--js/mediators/io-mediator.js63
2 files changed, 143 insertions, 41 deletions
diff --git a/js/document/html-document.js b/js/document/html-document.js
index 1e41a797..ace1390f 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -409,16 +409,57 @@ exports.HTMLDocument = Montage.create(TextDocument, {
409 if(!this.documentRoot.Ninja) this.documentRoot.Ninja = {}; 409 if(!this.documentRoot.Ninja) this.documentRoot.Ninja = {};
410 //Inserting user's document into template 410 //Inserting user's document into template
411 411
412 //TODO: Add logic to parse URLs from head/body 412
413
414
415
416
417
418
419
420 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
421 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
422 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
423
424 //TODO: Clean up and make public method to prepend properties with Ninja URL
413 this._templateDocument.head.innerHTML = (this._userDocument.content.head.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, ninjaUrlRedirect.bind(this))).replace(/url\(([^"]*)(.+?)\1\)/g, ninjaUrlRedirect.bind(this)); 425 this._templateDocument.head.innerHTML = (this._userDocument.content.head.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, ninjaUrlRedirect.bind(this))).replace(/url\(([^"]*)(.+?)\1\)/g, ninjaUrlRedirect.bind(this));
414 this._templateDocument.body.innerHTML = (this._userDocument.content.body.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, ninjaUrlRedirect.bind(this))).replace(/url\(([^"]*)(.+?)\1\)/g, ninjaUrlRedirect.bind(this)); 426 this._templateDocument.body.innerHTML = (this._userDocument.content.body.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, ninjaUrlRedirect.bind(this))).replace(/url\(([^"]*)(.+?)\1\)/g, ninjaUrlRedirect.bind(this));
415 // 427 //
428 //var docRootUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]).replace(/\/\//gi, '/'));
429 //
416 function ninjaUrlRedirect (prop) { 430 function ninjaUrlRedirect (prop) {
417 console.log(prop); 431 //Checking for property value to not contain a full direct URL
432 if (!prop.match(/(\b(?:(?:https?|ftp|file|[A-Za-z]+):\/\/|www\.|ftp\.)(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[-A-Z0-9+&@#\/%=~_|$?!:,.])*(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[A-Z0-9+&@#\/%=~_|$]))/gi)) {
433 //Checking for attributes and type of source
434 if (prop.indexOf('href') !== -1 || prop.indexOf('src') !== -1) { //From HTML attribute
435 //
436 prop = prop.replace(/"([^"]*)"/gi, ninjaUrlPrepend.bind(this));
437 } else if (prop.indexOf('url') !== -1) { //From CSS property
438 //TODO: Add functionality
439 console.log('CSS: '+prop);
440 }
441 }
418 return prop; 442 return prop;
419 } 443 }
420 // 444 //
421 445 function ninjaUrlPrepend (url) {
446 var docRootUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]).replace(/\/\//gi, '/'));
447 return '"'+docRootUrl+url.replace(/\"/gi, '')+'"';
448 }
449
450 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
451 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
452 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
453
454
455
456
457
458
459
460
461
462
422 var scripttags = this._templateDocument.html.getElementsByTagName('script'), webgldata; //TODO: Use querySelectorAll 463 var scripttags = this._templateDocument.html.getElementsByTagName('script'), webgldata; //TODO: Use querySelectorAll
423 // 464 //
424 for (var w in scripttags) { 465 for (var w in scripttags) {
@@ -493,10 +534,55 @@ exports.HTMLDocument = Montage.create(TextDocument, {
493 //If rules are null, assuming cross-origin issue 534 //If rules are null, assuming cross-origin issue
494 if(this._document.styleSheets[i].rules === null) { 535 if(this._document.styleSheets[i].rules === null) {
495 //TODO: Revisit URLs and URI creation logic, very hack right now 536 //TODO: Revisit URLs and URI creation logic, very hack right now
496 var fileUri, cssUrl, cssData, query, prefixUrl, fileCouldDirUrl; 537 var fileUri, cssUrl, cssData, query, prefixUrl, fileCouldDirUrl, docRootUrl;
538 //
539 docRootUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]).replace(/\/\//gi, '/'));
497 //TODO: Parse out relative URLs and map them to absolute 540 //TODO: Parse out relative URLs and map them to absolute
498 if (this._document.styleSheets[i].href.indexOf(chrome.extension.getURL('')) !== -1) { 541 if (this._document.styleSheets[i].href.indexOf(this.application.ninja.coreIoApi.rootUrl) !== -1) {
499 //Getting the url of the CSS file 542
543 cssUrl = this._document.styleSheets[i].href.split(this.application.ninja.coreIoApi.rootUrl)[1];
544 fileUri = this.application.ninja.coreIoApi.cloudData.root+cssUrl;
545 //TODO: Add error handling for reading file
546 cssData = this.application.ninja.coreIoApi.readFile({uri: fileUri});
547
548
549 var tag = this.iframe.contentWindow.document.createElement('style');
550 tag.setAttribute('type', 'text/css');
551 tag.setAttribute('data-ninja-uri', fileUri);
552 tag.setAttribute('data-ninja-file-url', cssUrl);
553 tag.setAttribute('data-ninja-file-read-only', JSON.parse(this.application.ninja.coreIoApi.isFileWritable({uri: fileUri}).content).readOnly);
554 tag.setAttribute('data-ninja-file-name', cssUrl.split('/')[cssUrl.split('/').length-1]);
555 //Copying attributes to maintain same properties as the <link>
556 for (var n in this._document.styleSheets[i].ownerNode.attributes) {
557 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') {
558 if (this._document.styleSheets[i].ownerNode.attributes[n].value.indexOf(docRootUrl) !== -1) {
559 tag.setAttribute(this._document.styleSheets[i].ownerNode.attributes[n].name, this._document.styleSheets[i].ownerNode.attributes[n].value.split(docRootUrl)[1]);
560 } else {
561 tag.setAttribute(this._document.styleSheets[i].ownerNode.attributes[n].name, this._document.styleSheets[i].ownerNode.attributes[n].value);
562 }
563 }
564 }
565
566 fileCouldDirUrl = this._document.styleSheets[i].href.split(this._document.styleSheets[i].href.split('/')[this._document.styleSheets[i].href.split('/').length-1])[0];
567 prefixUrl = 'url('+fileCouldDirUrl; //This should be re-written with better RegEx
568 tag.innerHTML = cssData.content.replace(/url\(/gi, prefixUrl);
569
570
571
572 //Looping through DOM to insert style tag at location of link element
573 query = this._templateDocument.html.querySelectorAll(['link']);
574 for (var j in query) {
575 if (query[j].href === this._document.styleSheets[i].href) {
576 //Disabling style sheet to reload via inserting in style tag
577 query[j].setAttribute('disabled', 'true');
578 //Inserting tag
579 this._templateDocument.head.insertBefore(tag, query[j]);
580 }
581 }
582
583
584 /*
585//Getting the url of the CSS file
500 cssUrl = this._document.styleSheets[i].href.split('js/document/templates/montage-html')[1];//TODO: Parse out relative URLs and map them to absolute 586 cssUrl = this._document.styleSheets[i].href.split('js/document/templates/montage-html')[1];//TODO: Parse out relative URLs and map them to absolute
501 //Creating the URI of the file (this is wrong should not be splitting cssUrl) 587 //Creating the URI of the file (this is wrong should not be splitting cssUrl)
502 fileUri = (this.application.ninja.coreIoApi.cloudData.root+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+cssUrl).replace(/\/\//gi, '/'); 588 fileUri = (this.application.ninja.coreIoApi.cloudData.root+this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]+cssUrl).replace(/\/\//gi, '/');
@@ -517,8 +603,8 @@ exports.HTMLDocument = Montage.create(TextDocument, {
517 } 603 }
518 // 604 //
519 605
520 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, '/')); 606 //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, '/'));
521 607 fileCouldDirUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]).replace(/\/\//gi, '/'));
522 608
523 //TODO: Fix regEx to have logic for all possible URLs strings (currently prefixing all url()) 609 //TODO: Fix regEx to have logic for all possible URLs strings (currently prefixing all url())
524 prefixUrl = 'url('+fileCouldDirUrl; //This should be re-written with better RegEx 610 prefixUrl = 'url('+fileCouldDirUrl; //This should be re-written with better RegEx
@@ -534,6 +620,25 @@ exports.HTMLDocument = Montage.create(TextDocument, {
534 this._templateDocument.head.insertBefore(tag, query[j]); 620 this._templateDocument.head.insertBefore(tag, query[j]);
535 } 621 }
536 } 622 }
623*/
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
537 } else { 642 } else {
538 console.log('ERROR: Cross-Domain-Stylesheet detected, unable to load in Ninja'); 643 console.log('ERROR: Cross-Domain-Stylesheet detected, unable to load in Ninja');
539 //None local stylesheet, probably on a CDN (locked) 644 //None local stylesheet, probably on a CDN (locked)
diff --git a/js/mediators/io-mediator.js b/js/mediators/io-mediator.js
index 5917edba..c02710c2 100644
--- a/js/mediators/io-mediator.js
+++ b/js/mediators/io-mediator.js
@@ -213,9 +213,11 @@ exports.IoMediator = Montage.create(Component, {
213 parseNinjaTemplateToHtml: { 213 parseNinjaTemplateToHtml: {
214 enumerable: false, 214 enumerable: false,
215 value: function (template) { 215 value: function (template) {
216 var regexRootUrl, rootUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]));
217 regexRootUrl = new RegExp(rootUrl.replace(/\//gi, '\\\/'), 'gi');
216 //Injecting head and body into old document 218 //Injecting head and body into old document
217 template.document.content.document.head.innerHTML = template.head; 219 template.document.content.document.head.innerHTML = template.head.replace(regexRootUrl, '');
218 template.document.content.document.body.innerHTML = template.body; 220 template.document.content.document.body.innerHTML = template.body.replace(regexRootUrl, '');
219 //Getting all CSS (style or link) tags 221 //Getting all CSS (style or link) tags
220 var styletags = template.document.content.document.getElementsByTagName('style'), 222 var styletags = template.document.content.document.getElementsByTagName('style'),
221 linktags = template.document.content.document.getElementsByTagNa