aboutsummaryrefslogtreecommitdiff
path: root/js/document/document-html.js
diff options
context:
space:
mode:
authorJose Antonio Marquez2012-05-01 15:26:37 -0700
committerJose Antonio Marquez2012-05-01 15:26:37 -0700
commit4ba680a7e9168d0f505a81e42a287dfbc54b4d7d (patch)
tree861610e3676bdcfd5d1e54ce268fdceb66016238 /js/document/document-html.js
parent7812925f6864a6f3a01e4a76924dc5c71706ff37 (diff)
downloadninja-4ba680a7e9168d0f505a81e42a287dfbc54b4d7d.tar.gz
Preliminary IO to new DOM view
Diffstat (limited to 'js/document/document-html.js')
-rwxr-xr-xjs/document/document-html.js191
1 files changed, 72 insertions, 119 deletions
diff --git a/js/document/document-html.js b/js/document/document-html.js
index 28406ee8..ad82c371 100755
--- a/js/document/document-html.js
+++ b/js/document/document-html.js
@@ -7,117 +7,108 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
7//////////////////////////////////////////////////////////////////////// 7////////////////////////////////////////////////////////////////////////
8// 8//
9var Montage = require("montage/core/core").Montage, 9var Montage = require("montage/core/core").Montage,
10 Component = require("montage/ui/component").Component; 10 Component = require("montage/ui/component").Component,
11 HtmlDocumentModel = require("js/document/models/html").HtmlDocumentModel; 11 HtmlDocumentModel = require("js/document/models/html").HtmlDocumentModel,
12 DesignDocumentView = require("js/document/views/design").DesignDocumentView;
12//////////////////////////////////////////////////////////////////////// 13////////////////////////////////////////////////////////////////////////
13// 14//
14exports.HtmlDocument = Montage.create(Component, { 15exports.HtmlDocument = Montage.create(Component, {
15 //////////////////////////////////////////////////////////////////// 16 ////////////////////////////////////////////////////////////////////
16 // 17 //
17 hasTemplate: { 18 hasTemplate: {
18 enumerable: false,
19 value: false 19 value: false
20 }, 20 },
21 //////////////////////////////////////////////////////////////////// 21 ////////////////////////////////////////////////////////////////////
22 // 22 //
23 model: { 23 model: {
24 enumerable: false,
25 value: null 24 value: null
26 }, 25 },
27 //////////////////////////////////////////////////////////////////// 26 ////////////////////////////////////////////////////////////////////
28 //
29 loadDelegate: {
30 enumerable: false,
31 value: null
32 },
33 ////////////////////////////////////////////////////////////////////
34 // 27 //
35 delegateContext: { 28 _document: {
36 enumerable: false, 29 value: null //TODO: Figure out if this will be needed, probably not
37 value: null
38 }, 30 },
39 //////////////////////////////////////////////////////////////////// 31 ////////////////////////////////////////////////////////////////////
40 // 32 //
41 exclusionList: { 33 exclusionList: {
42 enumerable: false, 34 value: [] //TODO: Update to correct list
43 value: ["HTML", "BODY"]
44 }, 35 },
45 //////////////////////////////////////////////////////////////////// 36 ////////////////////////////////////////////////////////////////////
46 //////////////////////////////////////////////////////////////////// 37 //
47 //TODO: Remove these setters/getters, should call model directly
48 name: {
49 get: function() {
50 return this.model._name;
51 },
52 set: function(value) {
53 this.model._name = value;
54 }
55 },
56 //
57 isActive: {
58 get: function() {
59 return this.model._isActive;
60 },
61 set: function(value) {
62 this.model._isActive = value;
63 }
64 },
65 //
66 needsSave: {
67 get: function() {
68 return this.model._needsSave;
69 },
70 set: function(value) {
71 this.model._needsSave = value;
72 }
73 },
74 //
75 uuid: { 38 uuid: {
76 get: function() { 39 get: function() {
77 return this._uuid; 40 return this._uuid;
78 } 41 }
79 }, 42 },
80 // 43 ////////////////////////////////////////////////////////////////////
81 currentView: { 44 //
82 value: "design" 45 inExclusion: {
83 }, 46 value: function(element) {
84 //////////////////////////////////////////////////////////////////// 47 if(this.exclusionList.indexOf(element.nodeName) === -1) {
85 //////////////////////////////////////////////////////////////////// 48 return -1;
86 // 49 }
87 iframe: { //MOVE TO: base.js in views 50 return 1;
88 value: null
89 },
90 //
91 createView: { //MOVE TO: design.js in views
92 value: function() {
93 var ifr = document.createElement("iframe");
94 //
95 ifr.id = "document_" + this._uuid;
96 ifr.style.border = "none";
97 ifr.style.background = "#FFF";
98 ifr.style.height = "100%";
99 ifr.style.width = "100%";
100 //
101 ifr.src = "js/document/templates/montage-web/index.html";
102 ifr.addEventListener("load", this.handleWebTemplateLoad.bind(this), true);
103 //
104 return document.getElementById("iframeContainer").appendChild(ifr);
105 } 51 }
106 }, 52 },
107 //////////////////////////////////////////////////////////////////// 53 ////////////////////////////////////////////////////////////////////
108 ////////////////////////////////////////////////////////////////////
109 // 54 //
110 init: { 55 init: {
111 value:function(file, context, callback) { 56 value:function(file, context, callback, view) {
112 this.model = Montage.create(HtmlDocumentModel, { 57 //Creating instance of HTML Document Model
113 file: { 58 this.model = Montage.create(HtmlDocumentModel,{
114 value: file 59 file: {value: file},
115 } 60 views: {value: {'design': DesignDocumentView.create(), 'code': null}} //TODO: Add code view logic
116 }); 61 });
117 this.name = file.name; 62 //Initiliazing views and hiding
118 this.iframe = this.createView(); 63 if (this.model.views.design.initiliaze(document.getElementById("iframeContainer"))) {
119 this.delegateContext = context; 64 //Hiding iFrame, just initiliazing
120 this.loadDelegate = callback; 65 this.model.views.design.hide();
66 } else {
67 //ERROR: Design View not initilized
68 }
69 //
70 if (view === 'design') {
71 //Showing design iFrame
72 this.model.views.design.show();
73 this.model.views.design.iframe.style.opacity = 0;
74 this.model.views.design.content = this.model.file.content;
75 //
76 this.model.views.design.render(function () {
77 //Setting opacity to be viewable after load
78 this.model.views.design.iframe.style.opacity = 1;
79
80
81
82
83 //TODO: Identify and remove usage of '_document'
84 this._document = this.model.views.design.document;
85 //TODO: Check for needed
86 this.documentRoot = this.model.views.design.document.body;
87 //
88 this._liveNodeList = this.documentRoot.getElementsByTagName('*');
89 //
90 document.application.njUtils.makeElementModel(this.documentRoot, "Body", "body");
91
92
93
94
95 this.hack = {callback: callback, context: context};
96
97 setTimeout(function () {
98 //Making callback after view is loaded
99 this.hack.callback.call(this.hack.context, this);
100 }.bind(this), 1000);
101
102
103
104
105
106
107
108 }.bind(this));
109 } else {
110 //TODO: Identify default view (probably code)
111 }
121 } 112 }
122 }, 113 },
123 //////////////////////////////////////////////////////////////////// 114 ////////////////////////////////////////////////////////////////////
@@ -137,21 +128,9 @@ exports.HtmlDocument = Montage.create(Component, {
137 } 128 }
138 } 129 }
139 130
140 // TODO: We don't need this anymore -> need to setup the main container still
141 //Adding a handler for the main user document reel to finish loading
142// this.documentRoot.addEventListener("userTemplateDidLoad", this.userTemplateDidLoad.bind(this), false);
143
144 // Live node list of the current loaded document 131 // Live node list of the current loaded document
145 this._liveNodeList = this.documentRoot.getElementsByTagName('*'); 132 this._liveNodeList = this.documentRoot.getElementsByTagName('*');
146 133
147 // TODO Move this to the appropriate location
148 /*
149 var len = this._liveNodeList.length;
150
151 for(var i = 0; i < len; i++) {
152 NJUtils.makeModelFromElement(this._liveNodeList[i]);
153 }
154 */
155 134
156 setTimeout(function () { 135 setTimeout(function () {
157 136
@@ -322,32 +301,6 @@ exports.HtmlDocument = Montage.create(Component, {
322 301
323 }.bind(this), 1000); 302 }.bind(this), 1000);
324 } 303 }
325 },