aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorJose Antonio Marquez2012-02-22 16:45:19 -0800
committerJose Antonio Marquez2012-02-22 16:46:05 -0800
commit3524a22fa0745bb223ab6bcc312ca970a001157f (patch)
tree8f99d7d204927aa6e5411c2a4c609d292fdbcab2
parente150cea29af96c4d57e3f6cd2ecda0a3c86f366d (diff)
downloadninja-3524a22fa0745bb223ab6bcc312ca970a001157f.tar.gz
Logic to save <style> for a file
Saving CSS in <style> tags, need to implement saving CSS to files.
-rwxr-xr-xjs/document/html-document.js39
-rw-r--r--js/mediators/io-mediator.js50
2 files changed, 84 insertions, 5 deletions
diff --git a/js/document/html-document.js b/js/document/html-document.js
index ba5eea79..564daef3 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -388,6 +388,11 @@ exports.HTMLDocument = Montage.create(TextDocument, {
388 this._document = this.iframe.contentWindow.document; 388 this._document = this.iframe.contentWindow.document;
389 this._window = this.iframe.contentWindow; 389 this._window = this.iframe.contentWindow;
390 // 390 //
391 for (var k in this._document.styleSheets) {
392 this._document.styleSheets[k].ninjatemplate = true;
393 //TODO: Add as attribute
394 }
395 //
391 if(!this.documentRoot.Ninja) this.documentRoot.Ninja = {}; 396 if(!this.documentRoot.Ninja) this.documentRoot.Ninja = {};
392 //Inserting user's document into template 397 //Inserting user's document into template
393 this._templateDocument.head.innerHTML = this._userDocument.content.head; 398 this._templateDocument.head.innerHTML = this._userDocument.content.head;
@@ -423,6 +428,7 @@ exports.HTMLDocument = Montage.create(TextDocument, {
423 cssData = this.application.ninja.coreIoApi.readFile({uri: fileUri}); 428 cssData = this.application.ninja.coreIoApi.readFile({uri: fileUri});
424 //Creating tag with file content 429 //Creating tag with file content
425 tag = this.iframe.contentWindow.document.createElement('style'); 430 tag = this.iframe.contentWindow.document.createElement('style');
431 tag.setAttribute('type', 'text/css');
426 tag.setAttribute('ninjauri', fileUri); 432 tag.setAttribute('ninjauri', fileUri);
427 tag.setAttribute('ninjafileurl', cssUrl); 433 tag.setAttribute('ninjafileurl', cssUrl);
428 tag.setAttribute('ninjafilename', cssUrl.split('/')[cssUrl.split('/').length-1]); 434 tag.setAttribute('ninjafilename', cssUrl.split('/')[cssUrl.split('/').length-1]);
@@ -440,9 +446,11 @@ exports.HTMLDocument = Montage.create(TextDocument, {
440 } 446 }
441 } 447 }
442 } 448 }
449 ////////////////////////////////////////////////////////////////////////////
450 ////////////////////////////////////////////////////////////////////////////
443 451
444 //TODO: Revisit this logic 452 //TODO: Revisit this logic
445 this._styles = this._document.styleSheets[1]; 453 /* this._styles = this._document.styleSheets[1]; */
446 this._stylesheets = this._document.styleSheets; // Entire stlyesheets array 454 this._stylesheets = this._document.styleSheets; // Entire stlyesheets array
447 455
448 console.log(this._document.styleSheets); 456 console.log(this._document.styleSheets);
@@ -564,7 +572,34 @@ exports.HTMLDocument = Montage.create(TextDocument, {
564 value: function () { 572 value: function () {
565 //TODO: Add code view logic and also styles for HTML 573 //TODO: Add code view logic and also styles for HTML
566 if (this.currentView === 'design') { 574 if (this.currentView === 'design') {
567 return {mode: 'html', document: this._userDocument, webgl: this.glData, style: this._styles, head: this._templateDocument.head.innerHTML, body: this._templateDocument.body.innerHTML}; 575 var styles = [];
576 for (var k in this._document.styleSheets) {
577 if (!this._document.styleSheets[k].ninjatemplate) {
578 styles.push(this._document.styleSheets[k]);
579 }
580 }
581 return {mode: 'html', document: this._userDocument, webgl: this.glData, styles: styles, head: this._templateDocument.head.innerHTML, body: this._templateDocument.body.innerHTML};
582 } else if (this.currentView === "code"){
583 //TODO: Would this get call when we are in code of HTML?
584 } else {
585 //Error
586 }
587 }
588 },
589 ////////////////////////////////////////////////////////////////////
590 //
591 saveAll: {
592 enumerable: false,
593 value: function () {
594 //TODO: Add code view logic and also styles for HTML
595 if (this.currentView === 'design') {
596 var css = [];
597 for (var k in this._document.styleSheets) {
598 if (!this._document.styleSheets[k].ninjatemplate) {
599 css.push(this._document.styleSheets[k]);
600 }
601 }
602 return {mode: 'html', document: this._userDocument, webgl: this.glData, css: css, head: this._templateDocument.head.innerHTML, body: this._templateDocument.body.innerHTML};
568 } else if (this.currentView === "code"){ 603 } else if (this.currentView === "code"){
569 //TODO: Would this get call when we are in code of HTML? 604 //TODO: Would this get call when we are in code of HTML?
570 } else { 605 } else {
diff --git a/js/mediators/io-mediator.js b/js/mediators/io-mediator.js
index 56869839..de50f387 100644
--- a/js/mediators/io-mediator.js
+++ b/js/mediators/io-mediator.js
@@ -202,10 +202,54 @@ exports.IoMediator = Montage.create(Component, {
202 // 202 //
203 template.document.content.document.body.innerHTML = template.body; 203 template.document.content.document.body.innerHTML = template.body;
204 template.document.content.document.head.innerHTML = template.head; 204 template.document.content.document.head.innerHTML = template.head;
205 //TODO: Remove temp fix for styles 205 //
206 if (template.style) { 206 var styletags = template.document.content.document.getElementsByTagName('style'),
207 template.document.content.document.head.getElementsByTagName('style')[0].innerHTML = this.getCssFromRules(template.style.cssRules); 207 linktags = template.document.content.document.getElementsByTagName('link');
208 //
209 for (var j in styletags) {
210 if (styletags[j].getAttribute) {
211 if(styletags[j].getAttribute('ninjauri') !== null) {
212 try {
213 template.document.content.document.head.removeChild(styletags[j]);
214 } catch (e) {
215 try {
216 template.document.content.document.body.removeChild(styletags[j]);
217 } catch (e) {
218 //
219 }
220 }
221
222 }
223 }
224 }
225 //
226 for (var l in linktags) {
227 if (linktags[l].getAttribute && linktags[l].getAttribute('disabled')) {
228 linktags[l].removeAttribute('disabled');
229 }
230 }
231 //
232 if (template.styles) {
233 //
234 var styleCounter = 0,
235 docStyles = template.document.content.document.getElementsByTagName('style');
236 for(var i in template.styles) {
237 if (template.styles[i].ownerNode) {
238 if (template.styles[i].ownerNode.getAttribute) {
239 if (template.styles[i].ownerNode.getAttribute('ninjauri') === null) {
240 //console.log(docStyles[styleCounter], template.styles[i].cssRules);
241 docStyles[styleCounter].innerHTML = this.getCssFromRules(template.styles[i].cssRules);
242 styleCounter++;
243 }
244 }
245 }
246 }
247
248 //template.document.content.document.head.getElementsByTagName('style')[0].innerHTML = this.getCssFromRules(template.style.cssRules);
249 } else if (template.css) {
250 console.log('Save all css and style');
208 } 251 }
252 //
209 return template.document.content.document.documentElement.outerHTML; 253 return template.document.content.document.documentElement.outerHTML;
210 } 254 }
211 }, 255 },