aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rwxr-xr-xjs/document/document-html.js74
-rwxr-xr-xjs/document/views/design.js45
2 files changed, 85 insertions, 34 deletions
diff --git a/js/document/document-html.js b/js/document/document-html.js
index 6ace440f..b169e046 100755
--- a/js/document/document-html.js
+++ b/js/document/document-html.js
@@ -82,43 +82,71 @@ exports.HtmlDocument = Montage.create(Component, {
82 this.model.views.design.content = this.model.file.content; 82 this.model.views.design.content = this.model.file.content;
83 // 83 //
84 this.model.views.design.render(function () { 84 this.model.views.design.render(function () {
85
86
87
88
89
90 //TODO: Identify and remove usage of '_document' 85 //TODO: Identify and remove usage of '_document'
91 this._document = this.model.views.design.document; 86 this._document = this.model.views.design.document;
92 //TODO: Check for needed 87 //TODO: Check for needed
93 this.documentRoot = this.model.views.design.document.body; 88 this.documentRoot = this.model.views.design.document.body;
94 //TODO: Why is this needed? 89 //TODO: Why is this needed?
95 this._liveNodeList = this.documentRoot.getElementsByTagName('*'); 90 this._liveNodeList = this.documentRoot.getElementsByTagName('*');
96 // 91 //Initiliazing document model
97 document.application.njUtils.makeElementModel(this.documentRoot, "Body", "body"); 92 document.application.njUtils.makeElementModel(this.documentRoot, "Body", "body");
98 //TODO: Figure out why timeout is needed 93 //Adding event to know when template is ready
99 setTimeout(function () { 94 this.model.views.design.document.head.addEventListener('DOMSubtreeModified', this.handleTemplateReady.bind(this), false);
100 //Making callback after view is loaded
101 this.loaded.callback.call(this.loaded.context, this);
102 //Setting opacity to be viewable after load
103 setTimeout(function () {
104 this.model.views.design.iframe.style.opacity = 1;
105 }.bind(this), 1000);
106 }.bind(this), 1000);
107
108
109
110
111
112
113
114 }.bind(this)); 95 }.bind(this));
115 } else { 96 } else {
116 //TODO: Identify default view (probably code) 97 //TODO: Identify default view (probably code)
117 } 98 }
118 } 99 }
119 }, 100 },
120 //////////////////////////////////////////////////////////////////// 101 ////////////////////////////////////////////////////////////////////
121 // 102 //
103 handleTemplateReady: {
104 value: function (e) {
105 //Removing event listener, a must for this type of event
106 this.model.views.design.document.head.removeEventListener('DOMSubtreeModified', this.handleTemplateReady.bind(this), false);
107 //Making callback after view is loaded
108 this.loaded.callback.call(this.loaded.context, this);
109 //Setting opacity to be viewable after load
110 this.model.views.design.iframe.style.opacity = 1;
111 }
112 },
113 ////////////////////////////////////////////////////////////////////
114 ////////////////////////////////////////////////////////////////////
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
122 handleWebTemplateLoad: { 150 handleWebTemplateLoad: {
123 value: function(event) { 151 value: function(event) {
124 //TODO: Remove, also for prototyping 152 //TODO: Remove, also for prototyping
diff --git a/js/document/views/design.js b/js/document/views/design.js
index 10963cab..a2bf965a 100755
--- a/js/document/views/design.js
+++ b/js/document/views/design.js
@@ -28,6 +28,11 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
28 }, 28 },
29 //////////////////////////////////////////////////////////////////// 29 ////////////////////////////////////////////////////////////////////
30 // 30 //
31 _headFragment: {
32 value: null
33 },
34 ////////////////////////////////////////////////////////////////////
35 //
31 content: { 36 content: {
32 value: null 37 value: null
33 }, 38 },
@@ -69,22 +74,40 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
69 // 74 //
70 this.document = this.iframe.contentWindow.document; 75 this.document = this.iframe.contentWindow.document;
71 // 76 //
72 77 this._headFragment = this.document.createElement('head');
73 78 this._headFragment.addEventListener('DOMSubtreeModified', this.insertHeadContent.bind(this), false);
74 79 this._headFragment.innerHTML = this.content.head;
75
76 //this.document.head.innerHTML += this.content.head;
77 this.document.body.innerHTML = this.content.head + this.content.body;
78
79
80
81
82 // 80 //
83 if (this._callback) this._callback(); 81 this.document.body.addEventListener('DOMSubtreeModified', this.bodyContentLoaded.bind(this), false);
82 this.document.body.innerHTML += this.content.body;
84 } 83 }
85 }, 84 },
86 //////////////////////////////////////////////////////////////////// 85 ////////////////////////////////////////////////////////////////////
87 // 86 //
87 bodyContentLoaded: {
88 value: function (e) {
89 //
90 this.document.body.removeEventListener('DOMSubtreeModified', this.bodyContentLoaded.bind(this), false);
91 //
92 if (this._callback) this._callback();
93 }
94 },
95 ////////////////////////////////////////////////////////////////////
96 //
97 insertHeadContent: {
98 value: function (e) {
99 //
100 this._headFragment.removeEventListener('DOMSubtreeModified', this.insertHeadContent, false);
101 //
102 for(var i in this._headFragment.childNodes) {
103 if(this._headFragment.childNodes[i].outerHTML) {
104 this.document.head.appendChild(this._headFragment.childNodes[i]);
105 }
106 }
107 }
108 },
109 ////////////////////////////////////////////////////////////////////
110 //
88 initCss: { 111 initCss: {
89 value: function () { 112 value: function () {
90 // 113 //