diff options
Diffstat (limited to 'js/document')
-rwxr-xr-x | js/document/html-document.js | 111 | ||||
-rwxr-xr-x | js/document/templates/montage-html/default_html.css | 75 | ||||
-rwxr-xr-x | js/document/templates/montage-html/index.html | 50 | ||||
-rw-r--r-- | js/document/templates/montage-html/main.reel/main.js | 54 | ||||
-rwxr-xr-x | js/document/templates/montage-html/package.json | 8 | ||||
-rwxr-xr-x | js/document/templates/montage-html/styles.css | 5 | ||||
-rwxr-xr-x | js/document/text-document.js | 5 |
7 files changed, 250 insertions, 58 deletions
diff --git a/js/document/html-document.js b/js/document/html-document.js index d0b63dcc..ae2b4600 100755 --- a/js/document/html-document.js +++ b/js/document/html-document.js | |||
@@ -12,9 +12,9 @@ var Montage = require("montage/core/core").Montage, | |||
12 | //////////////////////////////////////////////////////////////////////// | 12 | //////////////////////////////////////////////////////////////////////// |
13 | // | 13 | // |
14 | exports.HTMLDocument = Montage.create(TextDocument, { | 14 | exports.HTMLDocument = Montage.create(TextDocument, { |
15 | // PRIVATE MEMBERS | 15 | |
16 | _selectionExclude: { value: null, enumerable: false }, | 16 | _selectionExclude: { value: null, enumerable: false }, |
17 | _htmlTemplateUrl: { value: "user-document-templates/montage-application-cloud/index.html", enumerable: false}, | 17 | _htmlTemplateUrl: { value: "js/document/templates/montage-html/index.html", enumerable: false}, |
18 | _iframe: { value: null, enumerable: false }, | 18 | _iframe: { value: null, enumerable: false }, |
19 | _server: { value: null, enumerable: false }, | 19 | _server: { value: null, enumerable: false }, |
20 | _templateDocument: { value: null, enumerable: false }, | 20 | _templateDocument: { value: null, enumerable: false }, |
@@ -31,6 +31,7 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
31 | _userDocument: { value: null, enumerable: false }, | 31 | _userDocument: { value: null, enumerable: false }, |
32 | _htmlSource: {value: "<html></html>", enumerable: false}, | 32 | _htmlSource: {value: "<html></html>", enumerable: false}, |
33 | _glData: {value: null, enumerable: false }, | 33 | _glData: {value: null, enumerable: false }, |
34 | _userComponents: { value: {}, enumarable: false}, | ||
34 | 35 | ||
35 | _elementCounter: { value: 1, enumerable: false }, | 36 | _elementCounter: { value: 1, enumerable: false }, |
36 | _snapping : { value: true, enumerable: false }, | 37 | _snapping : { value: true, enumerable: false }, |
@@ -40,7 +41,6 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
40 | 41 | ||
41 | _zoomFactor: { value: 100, enumerable: false }, | 42 | _zoomFactor: { value: 100, enumerable: false }, |
42 | 43 | ||
43 | // PUBLIC MEMBERS | ||
44 | cssLoadInterval: { value: null, enumerable: false }, | 44 | cssLoadInterval: { value: null, enumerable: false }, |
45 | 45 | ||
46 | _savedLeftScroll: {value:null}, | 46 | _savedLeftScroll: {value:null}, |
@@ -52,9 +52,7 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
52 | value:null | 52 | value:null |
53 | }, | 53 | }, |
54 | 54 | ||
55 | /* | 55 | |
56 | * PUBLIC API | ||
57 | */ | ||
58 | 56 | ||
59 | // GETTERS / SETTERS | 57 | // GETTERS / SETTERS |
60 | 58 | ||
@@ -137,23 +135,11 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
137 | } | 135 | } |
138 | }, | 136 | }, |
139 | 137 | ||
140 | _userComponentSet: { | 138 | userComponents: { |
141 | value: {}, | 139 | get: function() { |
142 | writable: true, | 140 | return this._userComponents; |
143 | enumerable:true | 141 | } |
144 | }, | 142 | }, |
145 | |||
146 | // userComponentSet:{ | ||
147 | // enumerable: true, | ||
148 | // get: function() { | ||
149 | // return this._userComponentSet; | ||
150 | // }, | ||
151 | // set: function(value) { | ||
152 | // this._userComponentSet = value; | ||
153 | // this._drawUserComponentsOnOpen(); | ||
154 | // } | ||
155 | // }, | ||
156 | // | ||
157 | // _drawUserComponentsOnOpen:{ | 143 | // _drawUserComponentsOnOpen:{ |
158 | // value:function(){ | 144 | // value:function(){ |
159 | // for(var i in this._userComponentSet){ | 145 | // for(var i in this._userComponentSet){ |
@@ -220,22 +206,44 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
220 | set: function(value) { this._zoomFactor = value; } | 206 | set: function(value) { this._zoomFactor = value; } |
221 | }, | 207 | }, |
222 | 208 | ||
223 | //****************************************// | 209 | /** |
224 | // PUBLIC METHODS | 210 | * Add a reference to a component instance to the userComponents hash using the |
211 | * element UUID | ||
212 | */ | ||
213 | setComponentInstance: { | ||
214 | value: function(instance, el) { | ||
215 | this.userComponents[el.uuid] = instance; | ||
216 | } | ||
217 | }, | ||
218 | |||
219 | /** | ||
220 | * Returns the component instance obj from the element | ||
221 | */ | ||
222 | getComponentFromElement: { | ||
223 | value: function(el) { | ||
224 | if(el) { | ||
225 | if(el.uuid) return this.userComponents[el.uuid]; | ||
226 | } else { | ||
227 | return null; | ||
228 | } | ||
229 | } | ||
230 | }, | ||
231 | |||
225 | 232 | ||
226 | 233 | ||
227 | //////////////////////////////////////////////////////////////////// | 234 | //////////////////////////////////////////////////////////////////// |
228 | // | 235 | // |
229 | initialize: { | 236 | initialize: { |
230 | value: function(file, uuid, iframe, callback) { | 237 | value: function(file, uuid, iframe, callback) { |
238 | this.application.ninja.documentController._hackRootFlag = false; | ||
231 | // | 239 | // |
232 | this._userDocument = file; | 240 | this._userDocument = file; |
233 | // | 241 | // |
234 | this.init(file.name, file.uri, file.extension, iframe, uuid, callback); | 242 | this.init(file.name, file.uri, file.extension, iframe, uuid, callback); |
235 | // | 243 | // |
236 | this.iframe = iframe; | 244 | this.iframe = iframe; |
237 | this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"]; | 245 | this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"]; |
238 | this.currentView = "design"; | 246 | this.currentView = "design"; |
239 | // | 247 | // |
240 | this.iframe.src = this._htmlTemplateUrl; | 248 | this.iframe.src = this._htmlTemplateUrl; |
241 | this.iframe.addEventListener("load", this, true); | 249 | this.iframe.addEventListener("load", this, true); |
@@ -345,30 +353,24 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
345 | return this._window.getElement(x,y); | 353 | return this._window.getElement(x,y); |
346 | } | 354 | } |
347 | }, | 355 | }, |
348 | 356 | ||
349 | /* | 357 | |
350 | // Private | 358 | |
351 | _loadDocument: { | 359 | |
352 | value: function(uri) { | 360 | |
353 | // Load the document into the Iframe | ||
354 | this.iframe.src = uri; | ||
355 | this.iframe.addEventListener("load", this, true); | ||
356 | } | ||
357 | }, | ||
358 | */ | ||
359 | |||
360 | |||
361 | 361 | ||
362 | //////////////////////////////////////////////////////////////////// | 362 | //////////////////////////////////////////////////////////////////// |
363 | // | 363 | // |
364 | handleEvent: { | 364 | handleEvent: { |
365 | value: function(event){ | 365 | value: function(event){ |
366 | this.application.ninja.documentController._hackRootFlag = true; | ||
367 | //console.log(this._userDocument.root, this); | ||
366 | //TODO: Clean up, using for prototyping save | 368 | //TODO: Clean up, using for prototyping save |
367 | this._templateDocument = {}; | 369 | this._templateDocument = {}; |
368 | this._templateDocument.head = this.iframe.contentWindow.document.getElementById("userHead");; | 370 | this._templateDocument.head = this.iframe.contentWindow.document.getElementById("userHead");; |
369 | this._templateDocument.body = this.iframe.contentWindow.document.getElementById("UserContent");; | 371 | this._templateDocument.body = this.iframe.contentWindow.document.getElementById("UserContent");; |
370 | // | 372 | // |
371 | this.documentRoot = this.iframe.contentWindow.document.getElementById("UserContent"); | 373 | this.documentRoot = this.iframe.contentWindow.document.getElementById("UserContent"); |
372 | this.stageBG = this.iframe.contentWindow.document.getElementById("stageBG"); | 374 | this.stageBG = this.iframe.contentWindow.document.getElementById("stageBG"); |
373 | this.stageBG.onclick = null; | 375 | this.stageBG.onclick = null; |
374 | this._document = this.iframe.contentWindow.document; | 376 | this._document = this.iframe.contentWindow.document; |
@@ -376,10 +378,10 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
376 | // | 378 | // |
377 | if(!this.documentRoot.Ninja) this.documentRoot.Ninja = {}; | 379 | if(!this.documentRoot.Ninja) this.documentRoot.Ninja = {}; |
378 | // | 380 | // |
379 | 381 | ||
380 | this.documentRoot.innerHTML = this._userDocument.content.body; | 382 | this.documentRoot.innerHTML = this._userDocument.content.body; |
381 | this.iframe.contentWindow.document.getElementById("userHead").innerHTML = this._userDocument.content.head; | 383 | this.iframe.contentWindow.document.getElementById("userHead").innerHTML = this._userDocument.content.head; |
382 | 384 | ||
383 | 385 | ||
384 | //TODO: Look at code below and clean up | 386 | //TODO: Look at code below and clean up |
385 | 387 | ||
@@ -393,12 +395,10 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
393 | this._stylesheets = this._document.styleSheets; // Entire stlyesheets array | 395 | this._stylesheets = this._document.styleSheets; // Entire stlyesheets array |
394 | 396 | ||
395 | this.callback(this); | 397 | this.callback(this); |
398 | |||
399 | //console.log('file content end'); | ||
396 | } | 400 | } |
397 | }.bind(this), 50); | 401 | }.bind(this), 50); |
398 | |||
399 | // TODO - Not sure where this goes | ||
400 | this._userComponentSet = {}; | ||
401 | |||
402 | 402 | ||
403 | this._styles = this._document.styleSheets[this._document.styleSheets.length - 1]; | 403 | this._styles = this._document.styleSheets[this._document.styleSheets.length - 1]; |
404 | this._stylesheets = this._document.styleSheets; // Entire stlyesheets array | 404 | this._stylesheets = this._document.styleSheets; // Entire stlyesheets array |
@@ -447,9 +447,12 @@ exports.HTMLDocument = Montage.create(TextDocument, { | |||
447 | } | 447 | } |
448 | } | 448 | } |
449 | 449 | ||
450 | this.callback(this); | 450 | // Remving this callback and using the callback from the css load |
451 | //this.callback(this); | ||
452 | |||
453 | |||
451 | 454 | ||