diff options
-rwxr-xr-x | js/document/html-document.js | 137 | ||||
-rw-r--r-- | js/mediators/io-mediator.js | 71 |
2 files changed, 175 insertions, 33 deletions
diff --git a/js/document/html-document.js b/js/document/html-document.js index a56a7e3c..ace1390f 100755 --- a/js/document/html-document.js +++ b/js/document/html-document.js | |||
@@ -408,10 +408,59 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
408 | // | 408 | // |
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 | this._templateDocument.head.innerHTML = this._userDocument.content.head; | 411 | |
412 | this._templateDocument.body.innerHTML = this._userDocument.content.body; | 412 | |
413 | //TODO: Use querySelectorAll | 413 | |
414 | var scripttags = this._templateDocument.html.getElementsByTagName('script'), webgldata; | 414 | |
415 | |||
416 | |||
417 | |||
418 | |||
419 | |||
420 | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | ||
421 | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | ||
422 | //////////////////////////////////////////////////////////////////////////////////////////////////////////////////// | ||
423 | |||
424 | //TODO: Clean up and make public method to prepend properties with Ninja URL | ||
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)); | ||
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)); | ||
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 | // | ||
430 | function ninjaUrlRedirect (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 | } | ||
442 | return prop; | ||
443 | } | ||
444 | // | ||
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 | |||
463 | var scripttags = this._templateDocument.html.getElementsByTagName('script'), webgldata; //TODO: Use querySelectorAll | ||
415 | // | 464 | // |
416 | for (var w in scripttags) { | 465 | for (var w in scripttags) { |
417 | if (scripttags[w].getAttribute) { | 466 | if (scripttags[w].getAttribute) { |
@@ -485,10 +534,55 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
485 | //If rules are null, assuming cross-origin issue | 534 | //If rules are null, assuming cross-origin issue |
486 | if(this._document.styleSheets[i].rules === null) { | 535 | if(this._document.styleSheets[i].rules === null) { |
487 | //TODO: Revisit URLs and URI creation logic, very hack right now | 536 | //TODO: Revisit URLs and URI creation logic, very hack right now |
488 | 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, '/')); | ||
489 | //TODO: Parse out relative URLs and map them to absolute | 540 | //TODO: Parse out relative URLs and map them to absolute |
490 | 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) { |
491 | //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 | ||
492 | 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 |
493 | //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) |
494 | 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, '/'); |
@@ -509,17 +603,13 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
509 | } | 603 | } |
510 | // | 604 | // |
511 | 605 | ||
512 | 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, '/')); |
513 | 607 | fileCouldDirUrl = this.application.ninja.coreIoApi.rootUrl+escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1]).replace(/\/\//gi, '/')); | |
514 | 608 | ||
515 | //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()) |
516 | prefixUrl = 'url('+fileCouldDirUrl; | 610 | prefixUrl = 'url('+fileCouldDirUrl; //This should be re-written with better RegEx |
517 | tag.innerHTML = cssData.content.replace(/url\(/gi, prefixUrl); | 611 | tag.innerHTML = cssData.content.replace(/url\(/gi, prefixUrl); |
518 | 612 | ||
519 | //console.log(("http://hello.com, https://google.com").replace(/(\b(?:(?:https?|ftp|file|[A-Za-z]+):\/\/|www\.|ftp\.)(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[-A-Z0-9+&@#\/%=~_|$?!:,.])*(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[A-Z0-9+&@#\/%=~_|$]))/gi, 'hello')) | ||
520 | |||
521 | //console.log(tag.innerHTML); | ||
522 | |||
523 | //Looping through DOM to insert style tag at location of link element | 613 | //Looping through DOM to insert style tag at location of link element |
524 | query = this._templateDocument.html.querySelectorAll(['link']); | 614 | query = this._templateDocument.html.querySelectorAll(['link']); |
525 | for (var j in query) { | 615 | for (var j in query) { |
@@ -530,6 +620,25 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
530 | this._templateDocument.head.insertBefore(tag, query[j]); | 620 | this._templateDocument.head.insertBefore(tag, query[j]); |
531 | } | 621 | } |
532 | } | 622 | } |
623 | */ | ||
624 | |||
625 | |||
626 | |||
627 | |||
628 | |||
629 | |||
630 | |||
631 | |||
632 | |||
633 | |||
634 | |||
635 | |||
636 | |||
637 | |||
638 | |||
639 | |||
640 | |||
641 | |||
533 | } else { | 642 | } else { |
534 | 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'); |
535 | //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 0a851a4d..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 |