aboutsummaryrefslogtreecommitdiff
path: root/js/document/views
diff options
context:
space:
mode:
authorJose Antonio Marquez2012-05-11 14:41:20 -0700
committerJose Antonio Marquez2012-05-11 14:41:20 -0700
commitc87e538fdc337639bc4d54bb087dbf2b4f20297f (patch)
treebbbcf496841932261b21f977061fd41c01c0e0a6 /js/document/views
parentf10bec0c594c6404eec51dc1a005f7f17570ba52 (diff)
downloadninja-c87e538fdc337639bc4d54bb087dbf2b4f20297f.tar.gz
Adding support for new templates
This is supported for NEW and OPEN, SAVE is not supported yet by I/O. Saving works, but it will not be a banner template.
Diffstat (limited to 'js/document/views')
-rwxr-xr-xjs/document/views/design.js90
1 files changed, 71 insertions, 19 deletions
diff --git a/js/document/views/design.js b/js/document/views/design.js
index 321f93e8..e838dd49 100755
--- a/js/document/views/design.js
+++ b/js/document/views/design.js
@@ -23,11 +23,21 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
23 }, 23 },
24 //////////////////////////////////////////////////////////////////// 24 ////////////////////////////////////////////////////////////////////
25 // 25 //
26 _template: {
27 value: null
28 },
29 ////////////////////////////////////////////////////////////////////
30 //
26 _document: { 31 _document: {
27 value: null 32 value: null
28 }, 33 },
29 //////////////////////////////////////////////////////////////////// 34 ////////////////////////////////////////////////////////////////////
30 // 35 //
36 _bodyFragment: {
37 value: null
38 },
39 ////////////////////////////////////////////////////////////////////
40 //
31 _headFragment: { 41 _headFragment: {
32 value: null 42 value: null
33 }, 43 },
@@ -70,14 +80,20 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
70 //////////////////////////////////////////////////////////////////// 80 ////////////////////////////////////////////////////////////////////
71 // 81 //
72 render: { 82 render: {
73 value: function (callback, template) {//TODO: Add support for templates 83 value: function (callback, template) {
84 //TODO: Remove, this is a temp patch for webRequest API gate
74 this.application.ninja.documentController._hackRootFlag = false; 85 this.application.ninja.documentController._hackRootFlag = false;
75 //Storing callback for dispatch ready 86 //Storing callback for dispatch ready
76 this._callback = callback; 87 this._callback = callback;
88 this._template = template;
77 //Adding listener to know when template is loaded to then load user content 89 //Adding listener to know when template is loaded to then load user content
78 this.iframe.addEventListener("load", this.onTemplateLoad.bind(this), false); 90 this.iframe.addEventListener("load", this.onTemplateLoad.bind(this), false);
79 //TODO: Add source parameter and root (optional) 91 //TODO: Add source parameter and root (optional)
80 this.iframe.src = "js/document/templates/montage-web/index.html"; 92 if (template && template.type === 'banner' && template.size) {
93 this.iframe.src = "js/document/templates/banner/index.html";
94 } else {
95 this.iframe.src = "js/document/templates/html/index.html";
96 }
81 } 97 }
82 }, 98 },
83 //////////////////////////////////////////////////////////////////// 99 ////////////////////////////////////////////////////////////////////
@@ -104,29 +120,65 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
104 this.model.baseHref = basetag[basetag.length-1].getAttribute('href'); 120 this.model.baseHref = basetag[basetag.length-1].getAttribute('href');
105 } 121 }
106 } 122 }
107 //Creating temp code fragement to load head 123 //Checking to content to be template
108 this._headFragment = this.document.createElement('head'); 124 if (this._template) {
109 //Adding event listener to know when head is ready, event only dispatched once when using innerHTML 125 if (this._template.type === 'banner') {
110 this._observer.head = new WebKitMutationObserver(this.insertHeadContent.bind(this)); 126 //Loading contents into a fragment
111 this._observer.head.observe(this._headFragment, {childList: true}); 127 this._bodyFragment = this.document.createElement('body');
112 //Inserting <head> HTML and parsing URLs via mediator method 128 //Listening for content to be ready
113 this._headFragment.innerHTML = (this.content.head.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator)); 129 this._observer.body = new WebKitMutationObserver(this.insertBannerContent.bind(this));
114 //Adding event listener to know when the body is ready and make callback (using HTML5 new DOM Mutation Events) 130 this._observer.body.observe(this._bodyFragment, {childList: true});
115 this._observer.body = new WebKitMutationObserver(this.bodyContentLoaded.bind(this)); 131 //Inserting <body> HTML and parsing URLs via mediator method
116 this._observer.body.observe(this.document.body, {childList: true}); 132 this._bodyFragment.innerHTML = '<ninjaloadinghack></ninjaloadinghack>'+(this.content.body.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator));
117 //Inserting <body> HTML and parsing URLs via mediator method 133 }
118 this.document.body.innerHTML += '<ninjaloadinghack></ninjaloadinghack>'+(this.content.body.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator)); 134 } else {
119 //Copying attributes to maintain same properties as the <body> 135 //Creating temp code fragement to load head
120 for (var n in this.content.document.body.attributes) { 136 this._headFragment = this.document.createElement('head');
121 if (this.content.document.body.attributes[n].value) { 137 //Adding event listener to know when head is ready, event only dispatched once when using innerHTML
122 this.document.body.setAttribute(this.content.document.body.attributes[n].name, this.content.document.body.attributes[n].value); 138 this._observer.head = new WebKitMutationObserver(this.insertHeadContent.bind(this));
139 this._observer.head.observe(this._headFragment, {childList: true});
140 //Inserting <head> HTML and parsing URLs via mediator method
141 this._headFragment.innerHTML = (this.content.head.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator));
142 //Adding event listener to know when the body is ready and make callback (using HTML5 new DOM Mutation Events)
143 this._observer.body = new WebKitMutationObserver(this.bodyContentLoaded.bind(this));
144 this._observer.body.observe(this.document.body, {childList: true});
145 //Inserting <body> HTML and parsing URLs via mediator method
146 this.document.body.innerHTML += '<ninjaloadinghack></ninjaloadinghack>'+(this.content.body.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator));
147 //Copying attributes to maintain same properties as the <body>
148 for (var n in this.content.document.body.attributes) {
149 if (this.content.document.body.attributes[n].value) {
150 this.document.body.setAttribute(this.content.document.body.attributes[n].name, this.content.document.body.attributes[n].value);
151 }
123 } 152 }
153 //TODO: Add attribute copying for <HEAD> and <HTML>
124 } 154 }
125 //TODO: Add attribute copying for <HEAD> and <HTML>
126 } 155 }
127 }, 156 },
128 //////////////////////////////////////////////////////////////////// 157 ////////////////////////////////////////////////////////////////////
129 // 158 //
159 insertBannerContent: {
160 value: function (e) {
161 //Getting first element in DOM (assumes it's root)
162 var banner = this._bodyFragment.getElementsByTagName('*')[1],
163 ninjaBanner = this.document.body.getElementsByTagName('ninja-banner')[0];
164 //Copying attributes to maintain same properties as the banner root
165 for (var n in banner.attributes) {
166 if (banner.attributes[n].value) {
167 ninjaBanner.setAttribute(banner.attributes[n].name, banner.attributes[n].value);
168 }
169 }
170 //Adjusting margin per size of document
171 this.document.head.getElementsByTagName('style')[0].innerHTML += '\n ninja-banner {margin-top: -'+Math.floor(this._template.size.height/2)+'px; margin-left: -'+Math.floor(this._template.size.width/2)+'px}';
172 //Setting content in template
173 ninjaBanner.innerHTML = banner.innerHTML;
174 //Garbage collection
175 this._bodyFragment = null;
176 //Calling standard method to finish opening document
177 this.bodyContentLoaded(null);
178 }
179 },
180 ////////////////////////////////////////////////////////////////////
181 //
130 insertHeadContent: { 182 insertHeadContent: {
131 value: function (e) { 183 value: function (e) {
132 //Removing event 184 //Removing event
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-23 02:13:09 +0000