aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorValerio Virgillito2012-05-15 16:05:41 -0700
committerValerio Virgillito2012-05-15 16:05:41 -0700
commit17bbf73c73eadf018b03bb21a7da571901b5a389 (patch)
treebd478adcc531685d874ec186cbb20ea277f55c61
parent3be58f9391cc2ef7f1d27ec69c98ea600cb93a22 (diff)
parent1c91748d8517656c0982c6fc194cd0010d02fb63 (diff)
downloadninja-17bbf73c73eadf018b03bb21a7da571901b5a389.tar.gz
Merge branch 'dom-architecture' of github.com:Motorola-Mobility/ninja-internal into dom-architecture
-rwxr-xr-xjs/document/models/base.js2
-rwxr-xr-xjs/document/views/design.js27
-rw-r--r--js/io/templates/descriptor.json17
-rwxr-xr-xjs/io/templates/files/animation.txt17
-rwxr-xr-xjs/io/templates/files/banner.txt9
-rw-r--r--js/mediators/io-mediator.js59
-rwxr-xr-xjs/stage/stage.reel/stage.js17
-rwxr-xr-xjs/tools/PanTool.js15
8 files changed, 121 insertions, 42 deletions
diff --git a/js/document/models/base.js b/js/document/models/base.js
index 0f58e75c..5f2a5893 100755
--- a/js/document/models/base.js
+++ b/js/document/models/base.js
@@ -138,6 +138,7 @@ exports.BaseDocumentModel = Montage.create(Component, {
138 file: this.file, 138 file: this.file,
139 webgl: this.webGlHelper.glData, 139 webgl: this.webGlHelper.glData,
140 styles: this.getStyleSheets(), 140 styles: this.getStyleSheets(),
141 template: this.fileTemplate,
141 document: this.views.design.iframe.contentWindow.document, 142 document: this.views.design.iframe.contentWindow.document,
142 head: this.views.design.iframe.contentWindow.document.head, 143 head: this.views.design.iframe.contentWindow.document.head,
143 body: this.views.design.iframe.contentWindow.document.body 144 body: this.views.design.iframe.contentWindow.document.body
@@ -165,6 +166,7 @@ exports.BaseDocumentModel = Montage.create(Component, {
165 file: this.file, 166 file: this.file,
166 webgl: this.webGlHelper.glData, 167 webgl: this.webGlHelper.glData,
167 css: this.getStyleSheets(), 168 css: this.getStyleSheets(),
169 template: this.fileTemplate,
168 document: this.views.design.iframe.contentWindow.document, 170 document: this.views.design.iframe.contentWindow.document,
169 head: this.views.design.iframe.contentWindow.document.head, 171 head: this.views.design.iframe.contentWindow.document.head,
170 body: this.views.design.iframe.contentWindow.document.body 172 body: this.views.design.iframe.contentWindow.document.body
diff --git a/js/document/views/design.js b/js/document/views/design.js
index 4c91ff39..c7aab1d7 100755
--- a/js/document/views/design.js
+++ b/js/document/views/design.js
@@ -160,17 +160,24 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
160 value: function (e) { 160 value: function (e) {
161 //Getting first element in DOM (assumes it's root) 161 //Getting first element in DOM (assumes it's root)
162 //TODO: Ensure wrapper logic is proper 162 //TODO: Ensure wrapper logic is proper
163 var banner = this._bodyFragment.getElementsByTagName('*')[2], 163 var wrapper = this._bodyFragment.getElementsByTagName('*')[1],
164 ninjaBanner = this.document.body.getElementsByTagName('ninja-content')[0]; 164 banner = this._bodyFragment.getElementsByTagName('*')[2],
165 //Copying attributes to maintain same properties as the banner root 165 ninjaBanner = this.document.body.getElementsByTagName('ninja-content')[0],
166 ninjaWrapper = this.document.body.getElementsByTagName('ninja-viewport')[0];
167 //Copying attributes to maintain same properties as the banner wrapper
168 for (var n in wrapper.attributes) {
169 if (wrapper.attributes[n].value) {
170 ninjaWrapper.setAttribute(wrapper.attributes[n].name, wrapper.attributes[n].value);
171 }
172 }
173 //Copying attributes to maintain same properties as the banner content
166 for (var n in banner.attributes) { 174 for (var n in banner.attributes) {
167 if (banner.attributes[n].value) { 175 if (banner.attributes[n].value) {
168 ninjaBanner.setAttribute(banner.attributes[n].name, banner.attributes[n].value); 176 ninjaBanner.setAttribute(banner.attributes[n].name, banner.attributes[n].value);
169 } 177 }
170 } 178 }
171 //Adjusting margin per size of document 179 //Adjusting margin per size of document
172 //this.document.head.getElementsByTagName('style')[0].innerHTML += '\n ninja-banner {overflow: visible !important; margin-top: -'+Math.floor(this._template.size.height/2)+'px; margin-left: -'+Math.floor(this._template.size.width/2)+'px}'; 180 this.document.head.getElementsByTagName('style')[0].innerHTML += '\n ninja-viewport {overflow: visible !important;} ninja-content, ninja-viewport {width: ' + this._template.size.width + 'px; height: ' + this._template.size.height + 'px;}';
173 this.document.head.getElementsByTagName('style')[0].innerHTML += '\n ninja-content {overflow: visible !important;} ninja-content, ninja-viewport {width: ' + this._template.size.width + 'px; height: ' + this._template.size.height + 'px;}';
174 //Setting content in template 181 //Setting content in template
175 ninjaBanner.innerHTML = banner.innerHTML; 182 ninjaBanner.innerHTML = banner.innerHTML;
176 //Garbage collection 183 //Garbage collection
@@ -204,7 +211,7 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
204 //Removing event, only needed on initial load 211 //Removing event, only needed on initial load
205 this._observer.body.disconnect(); 212 this._observer.body.disconnect();
206 this._observer.body = null; 213 this._observer.body = null;
207 //Removing loading container 214 //Removing loading container (should be removed)
208 this.document.body.removeChild(this.document.getElementsByTagName('ninjaloadinghack')[0]); 215 this.document.body.removeChild(this.document.getElementsByTagName('ninjaloadinghack')[0]);
209 //Getting style and link tags in document 216 //Getting style and link tags in document
210 var stags = this.document.getElementsByTagName('style'), 217 var stags = this.document.getElementsByTagName('style'),
@@ -218,8 +225,12 @@ exports.DesignDocumentView = Montage.create(BaseDocumentView, {
218 for (i = 0; i < ltags.length; i++) { 225 for (i = 0; i < ltags.length; i++) {
219 // 226 //
220 if (ltags[i].href) { 227 if (ltags[i].href) {
221 //TODO: Verify this works for tags in body as well (working in head) 228 //Inseting <style> right above of <link> to maintain hierarchy
222 this.document.head.insertBefore(this.getStyleTagFromCssFile(ltags[i]), ltags[i]) || this.document.body.insertBefore(this.getStyleTagFromCssFile(ltags[i]), ltags[i]); 229 try {
230 this.document.head.insertBefore(this.getStyleTagFromCssFile(ltags[i]), ltags[i])
231 } catch (e) {
232 this.document.body.insertBefore(this.getStyleTagFromCssFile(ltags[i]), ltags[i]);
233 }
223 //Disabling tag once it has been reloaded 234 //Disabling tag once it has been reloaded
224 ltags[i].setAttribute('disabled', 'true'); 235 ltags[i].setAttribute('disabled', 'true');
225 } else { 236 } else {
diff --git a/js/io/templates/descriptor.json b/js/io/templates/descriptor.json
index 0b2b70e5..9c9c4ac8 100644
--- a/js/io/templates/descriptor.json
+++ b/js/io/templates/descriptor.json
@@ -13,7 +13,7 @@
13 "name":"Template", 13 "name":"Template",
14 "uri":"/template", 14 "uri":"/template",
15 "type":"directory", 15 "type":"directory",
16 "children":["js/io/templates/files/banner.txt"] 16 "children":["js/io/templates/files/banner.txt", "js/io/templates/files/animation.txt"]
17 }, 17 },
18 18
19 "js/io/templates/files/html.txt":{ 19 "js/io/templates/files/html.txt":{
@@ -90,7 +90,7 @@
90 "uri":"js/io/templates/files/banner.txt", 90 "uri":"js/io/templates/files/banner.txt",
91 "type":"file", 91 "type":"file",
92 "fileExtension":".html", 92 "fileExtension":".html",
93 "children":["120x600", "160x600", "200x200", "250x250", "300x250", "336x280", "550x400"] 93 "children":["120x600", "160x600", "200x200", "250x250", "300x250", "336x280"]
94 }, 94 },
95 95
96 "120x600":{ 96 "120x600":{
@@ -123,8 +123,17 @@
123 "uri": "336x280", 123 "uri": "336x280",
124 "type":"file" 124 "type":"file"
125 }, 125 },
126 "550x400":{ 126
127 "name": "Animation Default", 127 "js/io/templates/files/animation.txt":{
128 "name":"Animation",
129 "uri":"js/io/templates/files/animation.txt",
130 "type":"file",
131 "fileExtension":".html",
132 "children":["550x400"]
133 },
134
135 "550x400":{
136 "name": "Default",
128 "uri": "550x400", 137 "uri": "550x400",
129 "type":"file" 138 "type":"file"
130 } 139 }
diff --git a/js/io/templates/files/animation.txt b/js/io/templates/files/animation.txt
new file mode 100755
index 00000000..8a3dbd41
--- /dev/null
+++ b/js/io/templates/files/animation.txt
@@ -0,0 +1,17 @@
1<!DOCTYPE html>
2
3<div class="ninja-content-wrapper">
4
5 <div class="ninja-banner">
6
7 <!-- Created with Motorola Mobility Ninja -->
8 <!-- Ninja-Banner Dimensions@@@ -->
9
10 <style type="text/css">
11 .ninja-content-wrapper {}
12 .ninja-banner {}
13 </style>
14
15 </div>
16
17</div> \ No newline at end of file
diff --git a/js/io/templates/files/banner.txt b/js/io/templates/files/banner.txt
index 33b45e53..f26accf6 100755
--- a/js/io/templates/files/banner.txt
+++ b/js/io/templates/files/banner.txt
@@ -2,12 +2,11 @@
2 2
3<div class="ninja-content-wrapper"> 3<div class="ninja-content-wrapper">
4 4
5 <!-- Created with Motorola Mobility Ninja -->
6
7 <!-- Ninja-Banner Dimensions@@@ -->
8
9 <div class="ninja-banner"> 5 <div class="ninja-banner">
10 6
7 <!-- Created with Motorola Mobility Ninja -->
8 <!-- Ninja-Banner Dimensions@@@ -->
9
11 <style type="text/css"> 10 <style type="text/css">
12 .ninja-content-wrapper {} 11 .ninja-content-wrapper {}
13 .ninja-banner {} 12 .ninja-banner {}
diff --git a/js/mediators/io-mediator.js b/js/mediators/io-mediator.js
index 7a905fc6..8346c75e 100644
--- a/js/mediators/io-mediator.js
+++ b/js/mediators/io-mediator.js
@@ -77,7 +77,7 @@ exports.IoMediator = Montage.create(Component, {
77 //TODO: Improve template data injection 77 //TODO: Improve template data injection
78 function parseTemplate (content, template) { 78 function parseTemplate (content, template) {
79 // 79 //
80 if (template.name.toLowerCase() === 'banner') { 80 if (template.name.toLowerCase() === 'banner' || template.name.toLowerCase() === 'animation') {
81 //Getting dimensions of banner 81 //Getting dimensions of banner
82 var dimensions = template.id.split('x'); 82 var dimensions = template.id.split('x');
83 dimensions = {width: String(dimensions[0])+'px', height: String(dimensions[1])+'px'}; 83 dimensions = {width: String(dimensions[0])+'px', height: String(dimensions[1])+'px'};
@@ -169,7 +169,11 @@ exports.IoMediator = Montage.create(Component, {
169 switch (doc.mode) { 169 switch (doc.mode) {
170 case 'html': 170 case 'html':
171 //Getting content from function to properly handle saving assets (as in external if flagged) 171 //Getting content from function to properly handle saving assets (as in external if flagged)
172 contents = this.parseNinjaTemplateToHtml(doc); 172 if (doc.template && (doc.template.type === 'banner' || doc.template.type === 'animation')) {
173 contents = this.parseNinjaTemplateToHtml(doc, true);
174 } else {
175 contents = this.parseNinjaTemplateToHtml(doc);
176 }
173 break; 177 break;
174 default: 178 default:
175 contents = doc.content; 179 contents = doc.content;
@@ -214,14 +218,20 @@ exports.IoMediator = Montage.create(Component, {
214 //TODO: Expand to allow more templates, clean up variables 218 //TODO: Expand to allow m