11 files changed, 84 insertions, 41 deletions

diff --git a/js/components/layout/document-bar.reel/document-bar.css b/js/components/layout/document-bar.reel/document-bar.css
index 5eba72e8..2c547a22 100755
--- a/js/components/layout/document-bar.reel/document-bar.css
+++ b/js/components/layout/document-bar.reel/document-bar.css
@@ -33,7 +33,7 @@ POSSIBILITY OF SUCH DAMAGE.
     background: -webkit-radial-gradient(center, ellipse cover, rgba(100, 100, 100, .9) 40%, rgba(100, 100, 100, .4) 50%, rgba(100, 100, 100, 0) 51%), -webkit-radial-gradient(center, ellipse cover, rgba(100, 100, 100, .9) 40%, rgba(100, 100, 100, .4) 50%, rgba(100, 100, 100, 0) 51%), -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgb(60, 60, 60)), color-stop(70%, rgb(30, 30, 30)), color-stop(100%, rgb(25, 25, 25))), -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgb(10, 10, 10)), color-stop(50%, rgb(20, 20, 20)), color-stop(100%, rgb(10, 10, 10))) !important;
     background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat !important;
     background-position: 49.5% center, 50.5% center, center center, left top !important;
-    background-size: 5px 5px, 5px 5px, 3% 100%, 100% 100%;
+    background-size: 5px 5px, 5px 5px, 3% 100%, 100% 100% !important;
 }
 
 .documentBar {
diff --git a/js/components/layout/document-bar.reel/document-bar.js b/js/components/layout/document-bar.reel/document-bar.js
index 098e9e68..88c4a24b 100755
--- a/js/components/layout/document-bar.reel/document-bar.js
+++ b/js/components/layout/document-bar.reel/document-bar.js
@@ -246,7 +246,7 @@ exports.DocumentBar = Montage.create(Component, {
                         file: this._currentDocument.model.file,
                         webgl: this._currentDocument.model.webGlHelper.glData,
                         styles: this._currentDocument.model.getStyleSheets(),
-                        template: this._currentDocument.fileTemplate,
+                        template: this._currentDocument.model.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,
@@ -256,7 +256,7 @@ exports.DocumentBar = Montage.create(Component, {
                     doc = this._currentDocument.model.views.code.textArea.value;
                 }
                 //Reloading the document from changes made
-                this._currentDocument.reloadView(view, this.fileTemplate, doc);
+                this._currentDocument.reloadView(view, doc.template, doc);
             }
             }
     },
diff --git a/js/controllers/selection-controller.js b/js/controllers/selection-controller.js
index 7a26ed3b..4b031d70 100755
--- a/js/controllers/selection-controller.js
+++ b/js/controllers/selection-controller.js
@@ -58,13 +58,13 @@ exports.SelectionController = Montage.create(Component, {
                 return;
             }
 
-            if(this._currentDocument && this._currentDocument.currentView === "design") {
+            if(this._currentDocument && (this._currentDocument.currentView === "design" || this._currentDocument.model.currentView.identifier !== "code")) {
                 this._currentDocument.model._selection = this.application.ninja.selectedElements;
             }
 
             this._currentDocument = value;
 
-            if(this._currentDocument && this._currentDocument.currentView === "design") {
+            if(this._currentDocument && (this._currentDocument.currentView === "design" || this._currentDocument.model.currentView.identifier !== "code")) {
                 this.selectedElements = this._currentDocument.model.selection;
             }
             /*
diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js
index e95c6614..68d031fb 100755
--- a/js/controllers/styles-controller.js
+++ b/js/controllers/styles-controller.js
@@ -87,7 +87,7 @@ var stylesController = exports.StylesController = Montage.create(Component, {
         set : function(document) {
             ///// If the document is null set default stylesheets to null
 
-            if(!document || document.currentView === "code") {
+            if(!document || (document.currentView === "code" && document.model.currentView.identifier !== "design-code")) {
                 this._currentDocument   = null;
                 this._stageStylesheet  = null;
                 this.defaultStylesheet = null;
diff --git a/js/document/document-html.js b/js/document/document-html.js
index f3163339..d610c69d 100755
--- a/js/document/document-html.js
+++ b/js/document/document-html.js
@@ -157,6 +157,14 @@ exports.HtmlDocument = Montage.create(Component, {
                 this.model.views.design.show();
                 this.model.views.design.iframe.style.opacity = 0;
                 this.model.views.design.content = this.application.ninja.ioMediator.tmplt.parseHtmlToNinjaTemplate(doc);
+                //
+                if (!template) {
+                    if (this.model.views.design.content.body.indexOf('Ninja-Banner Dimensions@@@') !== -1) {
+                        dimensions = (this.model.views.design.content.body.split('Ninja-Banner Dimensions@@@'))[1].split('-->')[0].split('x');
+                        dimensions = {width: parseInt(dimensions[0]), height: parseInt(dimensions[1])};
+                        template = {type: 'banner', size: dimensions};
+                    }
+                }
                 //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
diff --git a/js/io/system/chromeapi.js b/js/io/system/chromeapi.js
index e33406ee..b13dd9de 100644
--- a/js/io/system/chromeapi.js
+++ b/js/io/system/chromeapi.js
@@ -96,7 +96,7 @@ exports.ChromeApi = Montage.create(Object.prototype, {
                 //
                 f.createWriter(function(writer) {
                     //
-                    var mime, blob, type = filePath.split('.');
+                    var mime, blob, type = filePath.split('.'), version = parseInt(window.navigator.appVersion.match(/Chrome\/(\d+)\./)[1], 10);
                     type = type[type.length-1];
                     switch (type) {
                         case 'bmp':
@@ -136,8 +136,12 @@ exports.ChromeApi = Montage.create(Object.prototype, {
                             mime = 'text/'+type;
                             break;
                     }
-                    //
-                    blob = new Blob([content], {type: type});
+                    //TODO: Remove version checking once Chrome version 22 is stable
+                    if (version > 21) {
+                        blob = new Blob([new Uint8Array(content)], {type: type});
+                    } else {
+                         blob = new Blob([content], {type: type});  
+                    }
                     //
                     writer.write(blob);
                     //
@@ -166,10 +170,15 @@ exports.ChromeApi = Montage.create(Object.prototype, {
             //
             this.fileSystem.root.getFile(filePath, {}, function(f) {
                 f.file(function(file) {
-                    var reader = new FileReader();
+                    var reader = new FileReader(), version = parseInt(window.navigator.appVersion.match(/Chrome\/(\d+)\./)[1], 10);
                     reader.onloadend = function(e) {
                         if (callback) {
-                            callback({content: this.result, data: file, file: f, url: f.toURL()});
+                            //TODO: Remove version checking once Chrome version 22 is stable
+                            if (version > 21) {
+                                callback({content: new Uint8Array(this.result), data: file, file: f, url: f.toURL()});
+                            } else {
+                                callback({content: this.result, data: file, file: f, url: f.toURL()});
+                            }
                         }
                     };
                     reader.readAsArrayBuffer(file);
diff --git a/js/lib/geom/line.js b/js/lib/geom/line.js
index eec4f6d9..df65ee86 100755
--- a/js/lib/geom/line.js
+++ b/js/lib/geom/line.js
@@ -537,6 +537,15 @@ exports.Line = Object.create(GeomObj, {
                     ctx.strokeStyle = c;
                 }
 
+                var viewUtils = require("js/helper-classes/3D/view-utils").ViewUtils;
+                viewUtils.pushViewportObj( world.getCanvas() );
+                var cop = viewUtils.getCenterOfProjection();
+                viewUtils.popViewportObj();
+                var xCtr = cop[0] + this._xOffset,                  yCtr = cop[1] - this._yOffset;
+                var xLeft = xCtr - 0.5*this.getWidth(),             yTop = yCtr - 0.5*this.getHeight();
+                var xDist = cop[0] - xLeft,                         yDist = cop[1] - yTop;
+                var xOff = 0.5*world.getViewportWidth() - xDist,    yOff  = 0.5*world.getViewportHeight() - yDist;
+
                 // get the points
                 var p0,  p1;
                 if(this._slope === "vertical") {
@@ -554,8 +563,8 @@ exports.Line = Object.create(GeomObj, {
                 }
 
                 // draw the line
-                ctx.moveTo( p0[0],  p0[1] );
-                ctx.lineTo( p1[0],  p1[1] );
+                ctx.moveTo( p0[0]+xOff,  p0[1]+yOff );
+                ctx.lineTo( p1[0]+xOff,  p1[1]+yOff );
                 ctx.stroke();
             }
         }
diff --git a/js/panels/Panel.reel/Panel.js b/js/panels/Panel.reel/Panel.js
index 988088e3..586636e1 100755
--- a/js/panels/Panel.reel/Panel.js
+++ b/js/panels/Panel.reel/Panel.js
@@ -159,11 +159,24 @@ exports.Panel = Montage.create(Component, {
                 this.disabled = true;
             } else {
                 this.disabled = this._currentDocument.currentView !== "design";
+                this._currentDocument.addPropertyChangeListener("model.currentViewIdentifier", this, false);
             }
 
         }
     },
 
+    handleChange: {
+        value: function(notification) {
+            if(notification.currentPropertyPath === "model.currentViewIdentifier") {
+                if(this.currentDocument.model.currentView.identifier === "design-code") {
+                    this.disabled = true;
+                } else {
+                    this.disabled = false;