New: Adding method to switch from code to design view

Added functionality to parse the code view string back into a Ninja template object to redraw design view. Only outstanding bugs are timeline errors and code view layout issues.

2 files changed, 22 insertions, 15 deletions

diff --git a/js/components/layout/document-bar.reel/document-bar.js b/js/components/layout/document-bar.reel/document-bar.js
index 77f05bc1..bf84c652 100755
--- a/js/components/layout/document-bar.reel/document-bar.js
+++ b/js/components/layout/document-bar.reel/document-bar.js
@@ -233,23 +233,30 @@ exports.DocumentBar = Montage.create(Component, {
             value: function (view, render, aBtn, iBtn) {
                 //TODO: Remove reference to string view
                     if (this._currentDocument.model.currentView !== view) {
-                //
+                    var doc;
+                //Switching view and changing button modes
                 this._currentDocument.model.switchViewTo(view);
                 iBtn.setAttribute('class', 'inactive');
                 aBtn.removeAttribute('class');
-                //TODO: Add document parsing to reload view
-                this._currentDocument.reloadView(view, this.fileTemplate, {
-                    mode: 'html',
-                    libs: this._currentDocument.model.libs,
-                    file: this._currentDocument.model.file,
-                    webgl: this._currentDocument.model.webGlHelper.glData,
-                    styles: this._currentDocument.model.getStyleSheets(),
-                    template: this._currentDocument.fileTemplate,
-                    document: this._currentDocument.model.views.design.iframe.contentWindow.document,
-                    head: this._currentDocument.model.views.design.iframe.contentWindow.document.head,
-                    body: this._currentDocument.model.views.design.iframe.contentWindow.document.body,
-                    mjsTemplateCreator: this._currentDocument.model.views.design.iframe.contentWindow.mjsTemplateCreator
-                });
+                //Checking for view to get other view document (object to code and string to design)
+                if (view === 'code') {
+                    doc = {
+                        mode: 'html',
+                        libs: this._currentDocument.model.libs,
+                        file: this._currentDocument.model.file,
+                        webgl: this._currentDocument.model.webGlHelper.glData,
+                        styles: this._currentDocument.model.getStyleSheets(),
+                        template: this._currentDocument.fileTemplate,
+                        document: this._currentDocument.model.views.design.iframe.contentWindow.document,
+                        head: this._currentDocument.model.views.design.iframe.contentWindow.document.head,
+                        body: this._currentDocument.model.views.design.iframe.contentWindow.document.body,
+                        mjsTemplateCreator: this._currentDocument.model.views.design.iframe.contentWindow.mjsTemplateCreator
+                    }
+                } else if (view === 'design') {
+                    doc = this._currentDocument.model.views.code.textArea.value;
+                }
+                //Reloading the document from changes made
+                this._currentDocument.reloadView(view, this.fileTemplate, doc);
             }
             }
     },
diff --git a/js/document/document-html.js b/js/document/document-html.js
index 81a8912b..a59f5848 100755
--- a/js/document/document-html.js
+++ b/js/document/document-html.js
@@ -156,7 +156,7 @@ exports.HtmlDocument = Montage.create(Component, {
                 //Showing design iFrame
                 this.model.views.design.show();
                 this.model.views.design.iframe.style.opacity = 0;
-                this.model.views.design.content = this.model.file.content;
+                this.model.views.design.content = this.application.ninja.ioMediator.tmplt.parseHtmlToNinjaTemplate(doc);
                 //TODO: Improve reference (probably through binding values)
                 this.model.views.design._webGlHelper = this.model.webGlHelper;
                 //Rendering design view, using observers to know when template is ready