diff options
Diffstat (limited to 'js/io/document/html-document.js')
-rwxr-xr-x[-rw-r--r--] | js/io/document/html-document.js | 173 |
1 files changed, 123 insertions, 50 deletions
diff --git a/js/io/document/html-document.js b/js/io/document/html-document.js index dd3507c2..88cfec67 100644..100755 --- a/js/io/document/html-document.js +++ b/js/io/document/html-document.js | |||
@@ -4,16 +4,20 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. |
5 | </copyright> */ | 5 | </copyright> */ |
6 | 6 | ||
7 | //////////////////////////////////////////////////////////////////////// | ||
8 | // | ||
7 | var Montage = require("montage/core/core").Montage, | 9 | var Montage = require("montage/core/core").Montage, |
8 | baseDocumentModule = require("js/io/document/base-document"), | 10 | BaseDocument = require("js/io/document/base-document").BaseDocument, |
9 | NJUtils = require("js/lib/NJUtils").NJUtils; | 11 | NJUtils = require("js/lib/NJUtils").NJUtils; |
10 | 12 | //////////////////////////////////////////////////////////////////////// | |
11 | var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.BaseDocument, { | 13 | // |
14 | exports.HTMLDocument = Montage.create(BaseDocument, { | ||
12 | // PRIVATE MEMBERS | 15 | // PRIVATE MEMBERS |
13 | _selectionExclude: { value: null, enumerable: false }, | 16 | _selectionExclude: { value: null, enumerable: false }, |
14 | _cloudTemplateUri: { value: "user-document-templates/montage-application-cloud/index.html", enumerable: false}, | 17 | _htmlTemplateUrl: { value: "user-document-templates/montage-application-cloud/index.html", enumerable: false}, |
15 | _iframe: { value: null, enumerable: false }, | 18 | _iframe: { value: null, enumerable: false }, |
16 | _server: { value: null, enumerable: false }, | 19 | _server: { value: null, enumerable: false }, |
20 | _templateDocument: { value: null, enumerable: false }, | ||
17 | _selectionModel: { value: [], enumerable: false }, | 21 | _selectionModel: { value: [], enumerable: false }, |
18 | _undoModel: { value: { "queue" : [], "position" : 0 }, enumerable: false}, | 22 | _undoModel: { value: { "queue" : [], "position" : 0 }, enumerable: false}, |
19 | 23 | ||
@@ -24,9 +28,10 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
24 | _styles: { value: null, enumerable: false }, | 28 | _styles: { value: null, enumerable: false }, |
25 | _stylesheets: { value: null, enumerable: false }, | 29 | _stylesheets: { value: null, enumerable: false }, |
26 | _stageStyleSheetId : { value: 'nj-stage-stylesheet', enumerable: false }, | 30 | _stageStyleSheetId : { value: 'nj-stage-stylesheet', enumerable: false }, |
27 | _initialUserDocument: { value: null, enumerable: false }, | 31 | _userDocument: { value: null, enumerable: false }, |
28 | _htmlSource: {value: "<html></html>", enumerable: false}, | 32 | _htmlSource: {value: "<html></html>", enumerable: false}, |
29 | _glData: {value: null, enumerable: false }, | 33 | _glData: {value: null, enumerable: false }, |
34 | _userComponents: { value: {}, enumarable: false}, | ||
30 | 35 | ||
31 | _elementCounter: { value: 1, enumerable: false }, | 36 | _elementCounter: { value: 1, enumerable: false }, |
32 | _snapping : { value: true, enumerable: false }, | 37 | _snapping : { value: true, enumerable: false }, |
@@ -39,11 +44,36 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
39 | // PUBLIC MEMBERS | 44 | // PUBLIC MEMBERS |
40 | cssLoadInterval: { value: null, enumerable: false }, | 45 | cssLoadInterval: { value: null, enumerable: false }, |
41 | 46 | ||
47 | _savedLeftScroll: {value:null}, | ||
48 | _savedTopScroll: {value:null}, | ||
49 | |||
50 | _codeViewDocument:{ | ||
51 | writable: true, | ||
52 | enumerable: true, | ||
53 | value:null | ||
54 | }, | ||
55 | |||
42 | /* | 56 | /* |
43 | * PUBLIC API | 57 | * PUBLIC API |
44 | */ | 58 | */ |
45 | 59 | ||
46 | // GETTERS / SETTERS | 60 | // GETTERS / SETTERS |
61 | |||
62 | codeViewDocument:{ | ||
63 | get: function() { return this._codeViewDocument; }, | ||
64 | set: function(value) { this._codeViewDocument = value} | ||
65 | }, | ||
66 | |||
67 | savedLeftScroll:{ | ||
68 | get: function() { return this._savedLeftScroll; }, | ||
69 | set: function(value) { this._savedLeftScroll = value} | ||
70 | }, | ||
71 | |||
72 | savedTopScroll:{ | ||
73 | get: function() { return this._savedTopScroll; }, | ||
74 | set: function(value) { this._savedTopScroll = value} | ||
75 | }, | ||
76 | |||
47 | selectionExclude: { | 77 | selectionExclude: { |
48 | get: function() { return this._selectionExclude; }, | 78 | get: function() { return this._selectionExclude; }, |
49 | set: function(value) { this._selectionExclude = value; } | 79 | set: function(value) { this._selectionExclude = value; } |
@@ -108,23 +138,11 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
108 | } | 138 | } |
109 | }, | 139 | }, |
110 | 140 | ||
111 | _userComponentSet: { | 141 | userComponents: { |
112 | value: {}, | 142 | get: function() { |
113 | writable: true, | 143 | return this._userComponents; |
114 | enumerable:true | 144 | } |
115 | }, | 145 | }, |
116 | |||
117 | // userComponentSet:{ | ||
118 | // enumerable: true, | ||
119 | // get: function() { | ||
120 | // return this._userComponentSet; | ||
121 | // }, | ||
122 | // set: function(value) { | ||
123 | // this._userComponentSet = value; | ||
124 | // this._drawUserComponentsOnOpen(); | ||
125 | // } | ||
126 | // }, | ||
127 | // | ||
128 | // _drawUserComponentsOnOpen:{ | 146 | // _drawUserComponentsOnOpen:{ |
129 | // value:function(){ | 147 | // value:function(){ |
130 | // for(var i in this._userComponentSet){ | 148 | // for(var i in this._userComponentSet){ |
@@ -191,30 +209,52 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
191 | set: function(value) { this._zoomFactor = value; } | 209 | set: function(value) { this._zoomFactor = value; } |
192 | }, | 210 | }, |
193 | 211 | ||
194 | //****************************************// | 212 | /** |
195 | // PUBLIC METHODS | 213 | * Add a reference to a component instance to the userComponents hash using the |
196 | initialize: { | 214 | * element UUID |
197 | value: function(doc, uuid, iframe, callback) { | 215 | */ |
198 | // Shell mode is not used anymore | 216 | setComponentInstance: { |
199 | //if(!window.IsInShellMode()) { | 217 | value: function(instance, el) { |
218 | this.userComponents[el.uuid] = instance; | ||
219 | } | ||
220 | }, | ||
200 | 221 | ||
201 | this.init("index-cloud", this._cloudTemplateUri, doc.type, iframe, uuid, callback); | 222 | /** |
202 | /* | 223 | * Returns the component instance obj from the element |
224 | */ | ||
225 | getComponentFromElement: { | ||
226 | value: function(el) { | ||
227 | if(el) { | ||
228 | if(el.uuid) return this.userComponents[el.uuid]; | ||
203 | } else { | 229 | } else { |
204 | var tmpurl = doc.uri.split('\\'); | 230 | return null; |
205 | var fileUrl = doc.server.url + "/" + tmpurl[tmpurl.length -1] + "?fileio=true&template=/user-document-templates/montage-application/index.html"; | ||
206 | this.init(name, fileUrl, doc.type, iframe, uuid, callback); | ||
207 | this.server = doc.server; | ||
208 | this._initialUserDocument = doc; | ||
209 | } | 231 | } |
210 | */ | 232 | } |
233 | }, | ||
234 | |||
235 | //****************************************// | ||
236 | // PUBLIC METHODS | ||
237 | |||
238 | |||
239 | //////////////////////////////////////////////////////////////////// | ||
240 | // | ||
241 | initialize: { | ||
242 | value: function(file, uuid, iframe, callback) { | ||
243 | // | ||
244 | this._userDocument = file; | ||
245 | // | ||
246 | this.init(file.name, file.uri, file.extension, iframe, uuid, callback); | ||
247 | // | ||
211 | this.iframe = iframe; | 248 | this.iframe = iframe; |
212 | this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"]; | 249 | this.selectionExclude = ["HTML", "BODY", "Viewport", "UserContent", "stageBG"]; |
213 | this.currentView = "design"; | 250 | this.currentView = "design"; |
214 | 251 | // | |
215 | this._loadDocument(this.uri); | 252 | this.iframe.src = this._htmlTemplateUrl; |
253 | this.iframe.addEventListener("load", this, true); | ||
216 | } | 254 | } |
217 | }, | 255 | }, |
256 | //////////////////////////////////////////////////////////////////// | ||
257 | |||
218 | 258 | ||
219 | collectGLData: { | 259 | collectGLData: { |
220 | value: function( elt, dataArray ) | 260 | value: function( elt, dataArray ) |
@@ -318,6 +358,7 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
318 | } | 358 | } |
319 | }, | 359 | }, |
320 | 360 | ||
361 | /* | ||
321 | // Private | 362 | // Private |
322 | _loadDocument: { | 363 | _loadDocument: { |
323 | value: function(uri) { | 364 | value: function(uri) { |
@@ -326,23 +367,36 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base | |||
326 | this.iframe.addEventListener("load", this, true); | 367 | this.iframe.addEventListener("load", this, true); |
327 | } | 368 | } |
328 | }, | 369 | }, |
370 | */ | ||
329 | 371 | ||
372 | |||
373 | |||
374 | //////////////////////////////////////////////////////////////////// | ||
375 | // | ||
330 | handleEvent: { | 376 | handleEvent: { |
331 | value: function(event){ | 377 | value: function(event){ |
378 | //TODO: Clean up, using for prototyping save | ||
379 | this._templateDocument = {}; | ||
380 | this._templateDocument.head = this.iframe.contentWindow.document.getElementById("userHead");; | ||
381 | this._templateDocument.body = this.iframe.contentWindow.document.getElementById("UserContent");; | ||
382 | // | ||
332 | this.documentRoot = this.iframe.contentWindow.document.getElementById("UserContent"); | 383 | this.documentRoot = this.iframe.contentWindow.document.getElementById("UserContent"); |
333 | this.stageBG = this.iframe.contentWindow.document.getElementById("stageBG"); | 384 | this.stageBG = this.iframe.contentWindow.document.getElementById("stageBG"); |
334 | this.stageBG.onclick = null; | 385 | this.stageBG.onclick = null; |
335 | this._document = this.iframe.contentWindow.document; | 386 | this._document = this.iframe.contentWindow.document; |
336 | this._window = this.iframe.contentWindow; | 387 | this._window = this.iframe.contentWindow; |
337 | if(!this.documentRoot.Ninja) | 388 | // |
338 | { | 389 | if(!this.documentRoot.Ninja) this.documentRoot.Ninja = {}; |
339 | this.documentRoot.Ninja = {}; | 390 | // |
340 | } | 391 | |
392 | this.documentRoot.innerHTML = this._userDocument.content.body; | ||
393 | this.iframe.contentWindow.document.getElementById("userHead").innerHTML = this._userDocument.content.head; | ||
341 |