diff options
Diffstat (limited to 'js/document/views/design.js')
-rwxr-xr-x | js/document/views/design.js | 118 |
1 files changed, 88 insertions, 30 deletions
diff --git a/js/document/views/design.js b/js/document/views/design.js index 947ad196..dad6de8b 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 | //////////////////////////////////////////////////////////////////// |
@@ -64,13 +86,14 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
64 | }, | 86 | }, |
65 | //////////////////////////////////////////////////////////////////// | 87 | //////////////////////////////////////////////////////////////////// |
66 | // | 88 | // |
67 | propertiesPanel: { | 89 | _documentRoot: { |
68 | value: null | 90 | value: null |
69 | }, | 91 | }, |
70 | //////////////////////////////////////////////////////////////////// | 92 | //////////////////////////////////////////////////////////////////// |
71 | // | 93 | // |
72 | _liveNodeList: { | 94 | documentRoot: { |
73 | value: null | 95 | get: function() {return this._documentRoot;}, |
96 | set: function(value) {this._documentRoot = value;} | ||
74 | }, | 97 | }, |
75 | //////////////////////////////////////////////////////////////////// | 98 | //////////////////////////////////////////////////////////////////// |
76 | // | 99 | // |
@@ -109,12 +132,13 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
109 | //////////////////////////////////////////////////////////////////// | 132 | //////////////////////////////////////////////////////////////////// |
110 | // | 133 | // |
111 | render: { | 134 | render: { |
112 | value: function (callback, template) { | 135 | value: function (callback, template, viewCallback) { |
113 | //TODO: Remove, this is a temp patch for webRequest API gate | 136 | //TODO: Remove, this is a temp patch for webRequest API gate |
114 | this.application.ninja.documentController.redirectRequests = false; | 137 | this.application.ninja.documentController.redirectRequests = false; |
115 | //Storing callback for dispatch ready | 138 | //Storing callback for dispatch ready |
116 | this._callback = callback; | 139 | this._callback = callback; |
117 | this._template = template; | 140 | this._template = template; |
141 | this._viewCallback = viewCallback; | ||
118 | //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 |
119 | this.iframe.addEventListener("load", this.onTemplateLoad.bind(this), false); | 143 | this.iframe.addEventListener("load", this.onTemplateLoad.bind(this), false); |
120 | //TODO: Add source parameter and root (optional) | 144 | //TODO: Add source parameter and root (optional) |
@@ -129,7 +153,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
129 | // | 153 | // |
130 | onTemplateLoad: { | 154 | onTemplateLoad: { |
131 | value: function (e) { | 155 | value: function (e) { |
132 | //console.log(this.iframe.contentWindow); | 156 | //TODO: Remove, this is a temp patch for webRequest API gate |
133 | this.application.ninja.documentController.redirectRequests = true; | 157 | this.application.ninja.documentController.redirectRequests = true; |
134 | //TODO: Add support to constructing URL with a base HREF | 158 | //TODO: Add support to constructing URL with a base HREF |
135 | var basetag = this.content.document.getElementsByTagName('base'); | 159 | var basetag = this.content.document.getElementsByTagName('base'); |
@@ -147,7 +171,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
147 | if (basetag.length) { | 171 | if (basetag.length) { |
148 | 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')) { |
149 | //Setting base HREF in model | 173 | //Setting base HREF in model |
150 | this.model.baseHref = basetag[basetag.length-1].getAttribute('href'); | 174 | this.baseHref = basetag[basetag.length-1].getAttribute('href'); |
151 | } | 175 | } |
152 | } | 176 | } |
153 | //Checking to content to be template | 177 | //Checking to content to be template |
@@ -159,7 +183,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
159 | this._observer.body = new WebKitMutationObserver(this.insertBannerContent.bind(this)); | 183 | this._observer.body = new WebKitMutationObserver(this.insertBannerContent.bind(this)); |
160 | this._observer.body.observe(this._bodyFragment, {childList: true}); | 184 | this._observer.body.observe(this._bodyFragment, {childList: true}); |
161 | //Inserting <body> HTML and parsing URLs via mediator method | 185 | //Inserting <body> HTML and parsing URLs via mediator method |
162 | 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)); |
163 | } | 187 | } |
164 | } else { | 188 | } else { |
165 | //Creating temp code fragement to load head | 189 | //Creating temp code fragement to load head |
@@ -168,19 +192,31 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
168 | this._observer.head = new WebKitMutationObserver(this.insertHeadContent.bind(this)); | 192 | this._observer.head = new WebKitMutationObserver(this.insertHeadContent.bind(this)); |
169 | this._observer.head.observe(this._headFragment, {childList: true}); | 193 | this._observer.head.observe(this._headFragment, {childList: true}); |
170 | //Inserting <head> HTML and parsing URLs via mediator method | 194 | //Inserting <head> HTML and parsing URLs via mediator method |
171 | 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)); |
172 | //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) |
173 | this._observer.body = new WebKitMutationObserver(this.bodyContentLoaded.bind(this)); | 197 | this._observer.body = new WebKitMutationObserver(this.bodyContentLoaded.bind(this)); |
174 | this._observer.body.observe(this.document.body, {childList: true}); | 198 | this._observer.body.observe(this.document.body, {childList: true}); |
175 | //Inserting <body> HTML and parsing URLs via mediator method | 199 | //Inserting <body> HTML and parsing URLs via mediator method |
176 | 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)); |
177 | //Copying attributes to maintain same properties as the <body> | 201 | //Copying attributes to maintain same properties as the <body> |
178 | for (var n in this.content.document.body.attributes) { | 202 | for (var n in this.content.document.body.attributes) { |
179 | if (this.content.document.body.attributes[n].value) { | 203 | if (this.content.document.body.attributes[n].value) { |
180 | 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); |
181 | } | 205 | } |
182 | } | 206 | } |
183 | //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 | } | ||
184 | } | 220 | } |
185 | } | 221 | } |
186 | }, | 222 | }, |
@@ -245,7 +281,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
245 | this.document.body.removeChild(this.document.getElementsByTagName('ninjaloadinghack')[0]); | 281 | this.document.body.removeChild(this.document.getElementsByTagName('ninjaloadinghack')[0]); |
246 | //Getting style and link tags in document | 282 | //Getting style and link tags in document |
247 | var stags = this.document.getElementsByTagName('style'), | 283 | var stags = this.document.getElementsByTagName('style'), |
248 | ltags = this.document.getElementsByTagName('link'), i, | 284 | ltags = this.document.getElementsByTagName('link'), i, orgNodes, |
249 | scripttags = this.document.getElementsByTagName('script'); | 285 | scripttags = this.document.getElementsByTagName('script'); |
250 | //Temporarily checking for disabled special case (we must enabled for Ninja to access styles) | 286 | //Temporarily checking for disabled special case (we must enabled for Ninja to access styles) |
251 | this.ninjaDisableAttribute(stags); | 287 | this.ninjaDisableAttribute(stags); |
@@ -269,6 +305,10 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, { | |||
269 | } | 305 | } |
270 | } | 306 | } |
271 | } | 307 | } |
308 | |||
309 | // Assign the modelGenerator reference from the template to our own modelGenerator | ||
310 | this.document.modelGenerator = ElementModel.modelGenerator; | ||
311 | |||
272 | //Checking for script tags then parsing check for montage and webgl | 312 | //Checking for script tags then parsing check for montage and webgl |
273 | if (scripttags.length > 0) { | 313 | if (scripttags.length > 0) { |
274 | //Checking and initializing webGL | 314 | //Checking and initializing webGL |