diff options
Diffstat (limited to 'js/document')
-rwxr-xr-x | js/document/mediators/template.js | 756 | ||||
-rwxr-xr-x | js/document/models/base.js | 21 | ||||
-rw-r--r-- | js/document/templates/app/main.js | 51 | ||||
-rwxr-xr-x | js/document/views/design.js | 14 |
4 files changed, 821 insertions, 21 deletions
diff --git a/js/document/mediators/template.js b/js/document/mediators/template.js index c5b45ba1..068a1f48 100755 --- a/js/document/mediators/template.js +++ b/js/document/mediators/template.js | |||
@@ -6,16 +6,766 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
6 | 6 | ||
7 | //////////////////////////////////////////////////////////////////////// | 7 | //////////////////////////////////////////////////////////////////////// |
8 | // | 8 | // |
9 | var Montage = require("montage/core/core").Montage, | 9 | var Montage = require("montage/core/core").Montage, |
10 | Component = require("montage/ui/component").Component; | 10 | Component = require("montage/ui/component").Component, |
11 | TemplateCreator = require("node_modules/tools/template/template-creator").TemplateCreator; | ||
11 | //////////////////////////////////////////////////////////////////////// | 12 | //////////////////////////////////////////////////////////////////////// |
12 | // | 13 | // |
13 | exports.TemplateDocumentMediator = Montage.create(Component, { | 14 | exports.TemplateDocumentMediator = Montage.create(Component, { |
14 | //////////////////////////////////////////////////////////////////// | 15 | //////////////////////////////////////////////////////////////////// |
15 | // | 16 | // |
16 | hasTemplate: { | 17 | hasTemplate: { |
17 | enumerable: false, | ||
18 | value: false | 18 | value: false |
19 | }, | ||
20 | //////////////////////////////////////////////////////////////////// | ||
21 | // | ||
22 | getAppTemplatesUrlRegEx: { | ||
23 | value: function () { | ||
24 | var regex = new RegExp(chrome.extension.getURL(this.application.ninja.currentDocument.model.views.design.iframe.src.split(chrome.extension.getURL('/'))[1]).replace(/\//gi, '\\\/'), 'gi'); | ||
25 | return regex; | ||
26 | } | ||
27 | }, | ||
28 | //////////////////////////////////////////////////////////////////// | ||
29 | // | ||
30 | getDataDirectory: { | ||
31 | value: function (path) { | ||
32 | //TODO: Implement user overwrite | ||
33 | return this._getUserDirectory(path+'data/'); | ||
34 | } | ||
35 | }, | ||
36 | //////////////////////////////////////////////////////////////////// | ||
37 | // | ||
38 | getNinjaDirectory: { | ||
39 | value: function (path) { | ||
40 | //TODO: Implement user overwrite | ||
41 | return this._getUserDirectory(this.getDataDirectory(path)+'ninja/'); | ||
42 | } | ||
43 | }, | ||
44 | //////////////////////////////////////////////////////////////////// | ||
45 | // | ||
46 | getCanvasDirectory: { | ||
47 | value: function (path) { | ||
48 | //TODO: Implement user overwrite | ||
49 | return this._getUserDirectory(this.getNinjaDirectory(path)+'canvas/'); | ||
50 | } | ||
51 | }, | ||
52 | //////////////////////////////////////////////////////////////////// | ||
53 | // | ||
54 | _getUserDirectory: { | ||
55 | value: function (path) { | ||
56 | //Checking for data directory | ||
57 | var check = this.application.ninja.coreIoApi.fileExists({uri: path}), directory; | ||
58 | //Creating directory if doesn't exists | ||
59 | switch (check.status) { | ||
60 | case 204: //Exists | ||
61 | directory = path; | ||
62 | break; | ||
63 | case 404: //Doesn't exists | ||
64 | directory = this.application.ninja.coreIoApi.createDirectory({uri: path}); | ||
65 | //Checking for success | ||
66 | if (directory.status === 201) { | ||
67 | directory = path; | ||
68 | } else { | ||
69 | //Error | ||
70 | directory = null; | ||
71 | } | ||
72 | break; | ||
73 | default: //Error | ||
74 | directory = null; | ||
75 | break; | ||
76 | } | ||
77 | //Returning the path to the directory on disk (null for any error) | ||
78 | return directory; | ||
79 | } | ||
80 | }, | ||
81 | //////////////////////////////////////////////////////////////////// | ||
82 | // | ||
83 | parseHtmlToNinjaTemplate: { | ||
84 | value: function (html) { | ||
85 | //Creating temp object to mimic HTML | ||
86 | var doc = window.document.implementation.createHTMLDocument(), template; | ||
87 | //Setting content to temp | ||
88 | doc.getElementsByTagName('html')[0].innerHTML = html; | ||
89 | //Creating return object | ||
90 | return {head: doc.head.innerHTML, body: doc.body.innerHTML, document: doc}; | ||
91 | } | ||
92 | }, | ||
93 | //////////////////////////////////////////////////////////////////// | ||
94 | //TODO: Expand to allow more templates, clean up variables | ||
95 | parseNinjaTemplateToHtml: { | ||
96 | value: function (template, ninjaWrapper, libCopyCallback) { | ||
97 | //TODO: Improve reference for rootUrl | ||
98 | var regexRootUrl, | ||
99 | rootUrl = this.application.ninja.coreIoApi.rootUrl + escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1])), | ||
100 | mjsCreator = template.mjsTemplateCreator.create(), | ||
101 | mJsSerialization, | ||
102 | toremovetags = [], | ||
103 | presentNodes, | ||
104 | montageTemplate; | ||
105 | //Creating instance of template creator | ||
106 | montageTemplate = mjsCreator.initWithDocument(template.document); | ||
107 | //Setting up expression for parsing URLs | ||
108 | regexRootUrl = new RegExp(rootUrl.replace(/\//gi, '\\\/'), 'gi'); | ||
109 | //Injecting head and body into old document | ||
110 | if (montageTemplate._ownerSerialization.length > 0) { | ||
111 | template.file.content.document.head.innerHTML = montageTemplate._document.head.innerHTML.replace(regexRootUrl, ''); | ||
112 | template.file.content.document.body.innerHTML = montageTemplate._document.body.innerHTML.replace(regexRootUrl, ''); | ||
113 | // | ||
114 | mJsSerialization = montageTemplate._ownerSerialization; | ||
115 | } else { | ||
116 | template.file.content.document.head.innerHTML = template.head.innerHTML.replace(regexRootUrl, ''); | ||
117 | template.file.content.document.body.innerHTML = template.body.innerHTML.replace(regexRootUrl, ''); | ||
118 | } | ||
119 | //Copying attributes to maintain same properties as the <body> | ||
120 | for (var n in template.body.attributes) { | ||
121 | if (template.body.attributes[n].value) { | ||
122 | // | ||
123 | template.file.content.document.body.setAttribute(template.body.attributes[n].name, template.body.attributes[n].value); | ||
124 | } | ||
125 | } | ||
126 | |||
127 | |||
128 | |||
129 | //TODO: Add attribute copying for <HEAD> and <HTML> | ||
130 | |||
131 | |||
132 | |||
133 | //Getting list of current nodes (Ninja DOM) | ||
134 | presentNodes = template.file.content.document.getElementsByTagName('*'); | ||
135 | //Looping through nodes to determine origin and removing if not inserted by Ninja | ||
136 | for (var n in presentNodes) { | ||
137 | if (presentNodes[n].getAttribute && presentNodes[n].getAttribute('data-ninja-node') === null) { | ||
138 | toremovetags.push(presentNodes[n]); | ||
139 | } else if (presentNodes[n].getAttribute && presentNodes[n].getAttribute('data-ninja-node') !== null) { | ||
140 | //Removing attribute | ||
141 | presentNodes[n].removeAttribute('data-ninja-node'); | ||
142 | } | ||
143 | } | ||
144 | //Getting all CSS (style or link) tags | ||
145 | var styletags = template.file.content.document.getElementsByTagName('style'), | ||
146 | linktags = template.file.content.document.getElementsByTagName('link'), | ||
147 | njtemplatetags = template.file.content.document.querySelectorAll('[data-ninja-template]'); | ||
148 | |||
149 | ////////////////////////////////////////////////// | ||
150 | //TODO: Remove, temp hack, this is to be fixed by Montage | ||
151 | var basetags = template.file.content.document.getElementsByTagName('base'); | ||
152 | for (var g in basetags) { | ||
153 | if (basetags[g].getAttribute && basetags[g].href && basetags[g].href.indexOf('chrome-extension://') !== -1) toremovetags.push(basetags[g]); | ||
154 | } | ||
155 | ////////////////////////////////////////////////// | ||
156 | |||
157 | //Adding to tags to be removed form template | ||
158 | for (var f in njtemplatetags) { | ||
159 | if (njtemplatetags[f].getAttribute) toremovetags.push(njtemplatetags[f]); | ||
160 | } | ||
161 | //Getting styles tags to be removed from document | ||
162 | if (styletags.length) { | ||
163 | for (var j = 0; j < styletags.length; j++) { | ||
164 | if (styletags[j].getAttribute) { | ||
165 | if (styletags[j].getAttribute('data-ninja-uri') !== null && !styletags[j].getAttribute('data-ninja-template')) { | ||
166 | toremovetags.push(styletags[j]); | ||
167 | } else if (styletags[j].getAttribute('data-ninja-external-url')) { | ||
168 | toremovetags.push(styletags[j]); | ||
169 | } | ||
170 | } | ||
171 | } | ||
172 | } | ||
173 | //Removing styles tags from document | ||
174 | for (var h = 0; toremovetags[h]; h++) { | ||
175 | try { | ||
176 | //Checking head first | ||
177 | template.file.content.document.head.removeChild(toremovetags[h]); | ||
178 | } catch (e) { | ||
179 | |||
180 | } | ||
181 | try { | ||
182 | //Checking body if not in head | ||
183 | template.file.content.document.body.removeChild(toremovetags[h]); | ||
184 | } catch (e) { | ||
185 | //Error, not found! | ||
186 | } | ||
187 | } | ||
188 | //Removing disabled tags from tags that were not originally disabled by user (Ninja enables all) | ||
189 | for (var l in linktags) { | ||
190 | if (linktags[l].getAttribute && linktags[l].getAttribute('disabled')) {//TODO: Use querySelectorAll | ||
191 | for (var p = 0; toremovetags[p]; p++) { | ||
192 | if (toremovetags[p].getAttribute('href') === linktags[l].getAttribute('href')) { | ||
193 | if (!toremovetags[p].getAttribute('data-ninja-disabled')) { | ||
194 | linktags[l].removeAttribute('disabled'); | ||
195 | } | ||
196 | } | ||
197 | } | ||
198 | } | ||
199 | } | ||
200 | |||
201 | |||
202 | |||
203 | |||
204 | |||
205 | |||
206 | |||
207 | |||
208 | |||
209 | |||
210 | |||
211 | |||
212 | |||
213 | |||
214 | |||
215 | //TODO: Make proper CSS method | ||
216 | |||
217 | |||
218 | |||
219 | //Checking for type of save: styles = <style> only | css = <style> and <link> (all CSS) | ||
220 | if (template.styles) { | ||