diff options
Diffstat (limited to 'js/document/views')
-rwxr-xr-x | js/document/views/design.js | 106 |
1 files changed, 82 insertions, 24 deletions
diff --git a/js/document/views/design.js b/js/document/views/design.js index 9aeb370a..1a5b071e 100755 --- a/js/document/views/design.js +++ b/js/document/views/design.js | |||
@@ -7,7 +7,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
7 | //////////////////////////////////////////////////////////////////////// | 7 | //////////////////////////////////////////////////////////////////////// |
8 | // | 8 | // |
9 | var Montage = require("montage/core/core").Montage, | 9 | var Montage = require("montage/core/core").Montage, |
10 | BaseDocumentView = require("js/document/views/base").BaseDocumentView; | 10 | BaseDocumentView = require("js/document/views/base").BaseDocumentView, |
11 | ElementModel = require("js/models/element-model"); | ||
11 | //////////////////////////////////////////////////////////////////////// | 12 | //////////////////////////////////////////////////////////////////////// |
12 | // | 13 | // |
13 | exports.DesignDocumentView = Montage.create(BaseDocumentView, { | 14 | exports.DesignDocumentView = Montage.create(BaseDocumentView, { |
@@ -23,13 +24,13 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
23 | }, | 24 | }, |
24 | //////////////////////////////////////////////////////////////////// | 25 | //////////////////////////////////////////////////////////////////// |
25 | // | 26 | // |
26 | _template: { | 27 | _viewCallback: { |
27 | value: null | 28 | value: null |
28 | }, | 29 | }, |
29 | //////////////////////////////////////////////////////////////////// | 30 | //////////////////////////////////////////////////////////////////// |
30 | // | 31 | // |
31 | _document: { | 32 | _template: { |
32 | value: null | 33 | value: null |
33 | }, | 34 | }, |
34 | //////////////////////////////////////////////////////////////////// | 35 | //////////////////////////////////////////////////////////////////// |
35 | // | 36 | // |
@@ -52,8 +53,29 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
52 | value: null | 53 | value: null |
53 | }, | 54 | }, |
54 | //////////////////////////////////////////////////////////////////// | 55 | //////////////////////////////////////////////////////////////////// |
55 | //TODO: Remove usage | 56 | // |
56 | model: { | 57 | _liveNodeList: { |
58 | value: null | ||
59 | }, | ||
60 | //////////////////////////////////////////////////////////////////// | ||
61 | // | ||
62 | _webGlHelper: { | ||
63 | value: null | ||
64 | }, | ||
65 | //////////////////////////////////////////////////////////////////// | ||
66 | // | ||
67 | _baseHref: { | ||
68 | value: null | ||
69 | }, | ||
70 | //////////////////////////////////////////////////////////////////// | ||
71 | // | ||
72 | baseHref: { | ||
73 | get: function() {return this._baseHref;}, | ||
74 | set: function(value) {this._baseHref = value;} | ||
75 | }, | ||
76 | //////////////////////////////////////////////////////////////////// | ||
77 | // | ||
78 | _document: { | ||
57 | value: null | 79 | value: null |
58 | }, | 80 | }, |
59 | //////////////////////////////////////////////////////////////////// | 81 | //////////////////////////////////////////////////////////////////// |
@@ -63,11 +85,17 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
63 | set: function(value) {this._document = value;} | 85 | set: function(value) {this._document = value;} |
64 | }, | 86 | }, |
65 | //////////////////////////////////////////////////////////////////// | 87 | //////////////////////////////////////////////////////////////////// |
66 | // | 88 | // |
67 | _liveNodeList: { | 89 | _documentRoot: { |
68 | value: null | 90 | value: null |
69 | }, | 91 | }, |
70 | //////////////////////////////////////////////////////////////////// | 92 | //////////////////////////////////////////////////////////////////// |
93 | // | ||
94 | documentRoot: { | ||
95 | get: function() {return this._documentRoot;}, | ||
96 | set: function(value) {this._documentRoot = value;} | ||
97 | }, | ||
98 | //////////////////////////////////////////////////////////////////// | ||
71 | // | 99 | // |
72 | getLiveNodeList: { | 100 | getLiveNodeList: { |
73 | value: function(useFilter) { | 101 | value: function(useFilter) { |
@@ -104,12 +132,13 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
104 | //////////////////////////////////////////////////////////////////// | 132 | //////////////////////////////////////////////////////////////////// |
105 | // | 133 | // |
106 | render: { | 134 | render: { |
107 | value: function (callback, template) { | 135 | value: function (callback, template, viewCallback) { |
108 | //TODO: Remove, this is a temp patch for webRequest API gate | 136 | //TODO: Remove, this is a temp patch for webRequest API gate |
109 | this.application.ninja.documentController.redirectRequests = false; | 137 | this.application.ninja.documentController.redirectRequests = false; |
110 | //Storing callback for dispatch ready | 138 | //Storing callback for dispatch ready |
111 | this._callback = callback; | 139 | this._callback = callback; |
112 | this._template = template; | 140 | this._template = template; |
141 | this._viewCallback = viewCallback; | ||
113 | //Adding listener to know when template is loaded to then load user content | 142 | //Adding listener to know when template is loaded to then load user content |
114 | this.iframe.addEventListener("load", this.onTemplateLoad.bind(this), false); | 143 | this.iframe.addEventListener("load", this.onTemplateLoad.bind(this), false); |
115 | //TODO: Add source parameter and root (optional) | 144 | //TODO: Add source parameter and root (optional) |
@@ -142,7 +171,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
142 | if (basetag.length) { | 171 | if (basetag.length) { |
143 | if (basetag[basetag.length-1].getAttribute && basetag[basetag.length-1].getAttribute('href')) { | 172 | if (basetag[basetag.length-1].getAttribute && basetag[basetag.length-1].getAttribute('href')) { |
144 | //Setting base HREF in model | 173 | //Setting base HREF in model |
145 | this.model.baseHref = basetag[basetag.length-1].getAttribute('href'); | 174 | this.baseHref = basetag[basetag.length-1].getAttribute('href'); |
146 | } | 175 | } |
147 | } | 176 | } |
148 | //Checking to content to be template | 177 | //Checking to content to be template |
@@ -154,7 +183,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
154 | this._observer.body = new WebKitMutationObserver(this.insertBannerContent.bind(this)); | 183 | this._observer.body = new WebKitMutationObserver(this.insertBannerContent.bind(this)); |
155 | this._observer.body.observe(this._bodyFragment, {childList: true}); | 184 | this._observer.body.observe(this._bodyFragment, {childList: true}); |
156 | //Inserting <body> HTML and parsing URLs via mediator method | 185 | //Inserting <body> HTML and parsing URLs via mediator method |
157 | 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)); | 186 | this._bodyFragment.innerHTML = '<ninjaloadinghack></ninjaloadinghack>'+(this.content.body.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.tmplt.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator.tmplt))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.tmplt.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator.tmplt)); |
158 | } | 187 | } |
159 | } else { | 188 | } else { |
160 | //Creating temp code fragement to load head | 189 | //Creating temp code fragement to load head |
@@ -163,19 +192,31 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
163 | this._observer.head = new WebKitMutationObserver(this.insertHeadContent.bind(this)); | 192 | this._observer.head = new WebKitMutationObserver(this.insertHeadContent.bind(this)); |
164 | this._observer.head.observe(this._headFragment, {childList: true}); | 193 | this._observer.head.observe(this._headFragment, {childList: true}); |
165 | //Inserting <head> HTML and parsing URLs via mediator method | 194 | //Inserting <head> HTML and parsing URLs via mediator method |
166 | 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)); | 195 | this._headFragment.innerHTML = (this.content.head.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.tmplt.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator.tmplt))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.tmplt.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator.tmplt)); |
167 | //Adding event listener to know when the body is ready and make callback (using HTML5 new DOM Mutation Events) | 196 | //Adding event listener to know when the body is ready and make callback (using HTML5 new DOM Mutation Events) |
168 | this._observer.body = new WebKitMutationObserver(this.bodyContentLoaded.bind(this)); | 197 | this._observer.body = new WebKitMutationObserver(this.bodyContentLoaded.bind(this)); |
169 | this._observer.body.observe(this.document.body, {childList: true}); | 198 | this._observer.body.observe(this.document.body, {childList: true}); |
170 | //Inserting <body> HTML and parsing URLs via mediator method | 199 | //Inserting <body> HTML and parsing URLs via mediator method |
171 | 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)); | 200 | this.document.body.innerHTML += '<ninjaloadinghack></ninjaloadinghack>'+(this.content.body.replace(/\b(href|src)\s*=\s*"([^"]*)"/g, this.application.ninja.ioMediator.tmplt.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator.tmplt))).replace(/url\(([^"]*)(.+?)\1\)/g, this.application.ninja.ioMediator.tmplt.getNinjaPropUrlRedirect.bind(this.application.ninja.ioMediator.tmplt)); |
172 | //Copying attributes to maintain same properties as the <body> | 201 | //Copying attributes to maintain same properties as the <body> |
173 | for (var n in this.content.document.body.attributes) { | 202 | for (var n in this.content.document.body.attributes) { |
174 | if (this.content.document.body.attributes[n].value) { | 203 | if (this.content.document.body.attributes[n].value) { |
175 | this.document.body.setAttribute(this.content.document.body.attributes[n].name, this.content.document.body.attributes[n].value); | 204 | this.document.body.setAttribute(this.content.document.body.attributes[n].name, this.content.document.body.attributes[n].value); |
176 | } | 205 | } |
177 | } | 206 | } |
178 | //TODO: Add attribute copying for <HEAD> and <HTML> | 207 | //Copying attributes to maintain same properties as the <head> |
208 | for (var m in this.content.document.head.attributes) { | ||
209 | if (this.content.document.head.attributes[m].value) { | ||
210 | this.document.head.setAttribute(this.content.document.head.attributes[m].name, this.content.document.head.attributes[m].value); | ||
211 | } | ||
212 | } | ||
213 | //Copying attributes to maintain same properties as the <html> | ||
214 | var htmlTagMem = this.content.document.getElementsByTagName('html')[0], htmlTagDoc = this.document.getElementsByTagName('html')[0]; | ||
215 | for (var m in htmlTagMem.attributes) { | ||
216 | if (htmlTagMem.attributes[m].value) { | ||
217 | htmlTagDoc.setAttribute(htmlTagMem.attributes[m].name, htmlTagMem.attributes[m].value); | ||
218 | } | ||
219 | } | ||
179 | } | 220 | } |
180 | } | 221 | } |
181 | }, | 222 | }, |
@@ -264,6 +305,10 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
264 | } | 305 | } |
265 | } | 306 | } |
266 | } | 307 | } |
308 | |||
309 | // Assign the modelGenerator reference from the template to our own modelGenerator | ||
310 | this.document.modelGenerator = ElementModel.modelGenerator; | ||
311 | |||
267 | //Checking for script tags then parsing check for montage and webgl | 312 | //Checking for script tags then parsing check for montage and webgl |
268 | if (scripttags.length > 0) { | 313 | if (scripttags.length > 0) { |
269 | //Checking and initializing webGL | 314 | //Checking and initializing webGL |
@@ -272,23 +317,25 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
272 | this.initMontage(scripttags); | 317 | this.initMontage(scripttags); |
273 | } else { | 318 | } else { |
274 | //Else there is not data to parse | 319 | //Else there is not data to parse |
320 | if(this._viewCallback) { | ||
321 | this._viewCallback.viewCallback.call(this._viewCallback.context); | ||
322 | } | ||
275 | } | 323 | } |
276 | //TODO: Verify appropiate location for this operation | 324 | //TODO: Verify appropiate location for this operation |
277 | if (this._template && this._template.type === 'banner') { | 325 | if (this._template && this._template.type === 'banner') { |
278 | this.model.documentRoot = this.document.body.getElementsByTagName('ninja-content')[0]; | 326 | this.documentRoot = this.document.body.getElementsByTagName('ninja-content')[0]; |
279 | } else { | 327 | } else { |
280 | this.model.documentRoot = this.document.body; | 328 | this.documentRoot = this.document.body; |
281 | } | 329 | } |
282 | //Storing node list for reference (might need to store in the model) | 330 | //Storing node list for reference (might need to store in the model) |
283 | this._liveNodeList = this.model.documentRoot.getElementsByTagName('*'); | 331 | this._liveNodeList = this.documentRoot.getElementsByTagName('*'); |
284 | //Getting list of original nodes | 332 | //Getting list of original nodes |
285 | orgNodes = this.document.getElementsByTagName('*'); | 333 | orgNodes = this.document.getElementsByTagName('*'); |