diff options
-rwxr-xr-x | js/document/html-document.js | 121 | ||||
-rw-r--r-- | js/mediators/io-mediator.js | 63 |
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.getElementsByTagName('link'), | 223 | linktags = template.document.content.document.getElementsByTagName('link'), |
@@ -248,7 +250,7 @@ exports.IoMediator = Montage.create(Component, { | |||
248 | for (var l in linktags) { | 250 | for (var l in linktags) { |
249 | if (linktags[l].get |