6 files changed, 136 insertions, 91 deletions

diff --git a/js/document/document-html.js b/js/document/document-html.js
index 4767271f..87c776d5 100755
--- a/js/document/document-html.js
+++ b/js/document/document-html.js
@@ -43,13 +43,6 @@ exports.HtmlDocument = Montage.create(Component, {
     exclusionList: {
         value: ["HTML", "BODY"] //TODO: Update to correct list
     },
-        ////////////////////////////////////////////////////////////////////
-        //
-    uuid: {
-        get: function() {
-            return this._uuid;
-        }
-    },
     ////////////////////////////////////////////////////////////////////
         //
     inExclusion: {
@@ -100,14 +93,14 @@ exports.HtmlDocument = Montage.create(Component, {
                         this._document = this.model.views.design.document;
                         //TODO: Remove usage, seems as not needed
                                 if (template && template.type === 'banner') {
-                                        this.documentRoot = this.model.views.design.document.body.getElementsByTagName('ninja-banner')[0];
+                                        this.documentRoot = this.model.views.design.document.body.getElementsByTagName('ninja-content')[0];
                                 } else {
                                         this.documentRoot = this.model.views.design.document.body;
                                 }
                         //TODO: Why is this needed?
-                        this._liveNodeList = this.model.views.design.document.body.getElementsByTagName('*');
+                        this._liveNodeList = this.documentRoot.getElementsByTagName('*');
                         //Initiliazing document model
-                        document.application.njUtils.makeElementModel(this.model.views.design.document.body, "Body", "body");
+                        document.application.njUtils.makeElementModel(this.documentRoot, "Body", "body");
                         //Adding observer to know when template is ready
                         this._observer = new WebKitMutationObserver(this.handleTemplateReady.bind(this));
                                 this._observer.observe(this.model.views.design.document.head, {childList: true});
@@ -133,21 +126,10 @@ exports.HtmlDocument = Montage.create(Component, {
     ////////////////////////////////////////////////////////////////////
         //
         closeDocument: {
-                value: function () {
-                        //
-                        this.model.close(null, this.handleCloseDocument.bind(this));
-                }
-        },
-        ////////////////////////////////////////////////////////////////////
-        //
-        handleCloseDocument: {
-                value: function (success) {
-                        //TODO: Add logic for handling success or failure
-                        //
-                        this.application.ninja.documentController._documents.splice(this.uuid, 1);
-                        //
-                        NJevent("closeDocument", this.model.file.uri);
-                        //TODO: Delete object here
+                value: function (context, callback) {
+                        var closed = this.model.close(null);
+
+            callback.call(context, this);
                 }
         },
     ////////////////////////////////////////////////////////////////////
diff --git a/js/document/html-document.js b/js/document/html-document.js
index 9d083dd8..6a84abdf 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -972,44 +972,5 @@ exports.HTMLDocument = Montage.create(TextDocument, {
 
 
         }
-    },
-        ////////////////////////////////////////////////////////////////////
-    /**
-     *pause videos on switching or closing the document, so that the browser does not keep downloading the media data
-    */
-    pauseVideos:{
-        value:function(){
-            var videosArr = this.documentRoot.getElementsByTagName("video"), i=0;
-            for(i=0;i<videosArr.length;i++){
-                if(!videosArr[i].paused){
-                    videosArr[i].pause();
-                }
-            }
-        }
-    },
-
-    /**
-     * remove the video src on closing the document, so that the browser does not keep downloading the media data, if the tag does not get garbage collected
-     *removeSrc : boolean to remove the src if the video... set only in the close document flow
-    */
-    stopVideos:{
-        value:function(){
-            var videosArr = this.documentRoot.getElementsByTagName("video"), i=0;
-            for(i=0;i<videosArr.length;i++){
-                videosArr[i].src = "";
-            }
-        }
-    },
-    pauseAndStopVideos:{
-        value:function(){
-            var videosArr = this.documentRoot.getElementsByTagName("video"), i=0;
-            for(i=0;i<videosArr.length;i++){
-                if(!videosArr[i].paused){
-                    videosArr[i].pause();
-                }
-                videosArr[i].src = "";
-            }
-        }
     }
-    ////////////////////////////////////////////////////////////////////
 });
\ No newline at end of file
diff --git a/js/document/models/base.js b/js/document/models/base.js
index 0f58e75c..f9844b70 100755
--- a/js/document/models/base.js
+++ b/js/document/models/base.js
@@ -93,13 +93,21 @@ exports.BaseDocumentModel = Montage.create(Component, {
                         //Currently only supporting current browser (Chrome, obviously)
                         switch (this.browser) {
                                 case 'chrome':
-                                        window.open(this.url);
+                                        if (this.template.type === 'banner' || this.template.type === 'animation') {
+                                                window.open('/js/document/templates/preview/banner.html?width='+this.template.size.width+'&height='+this.template.size.height+'&url='+this.url);
+                                        } else {
+                                                window.open(this.url);
+                                        }
                                         break;
                         default:
-                                        window.open(this.url);
+                                        if (this.template.type === 'banner' || this.template.type === 'animation') {
+                                                window.open('/js/document/templates/preview/banner.html?width='+this.template.size.width+'&height='+this.template.size.height+'&url='+this.url);
+                                        } else {
+                                                window.open(this.url);
+                                        }
                                         break;
                         }
-                }.bind({browser: browser, url: url}));
+                }.bind({browser: browser, url: url, template: this.fileTemplate}));
         }
     },
     ////////////////////////////////////////////////////////////////////
@@ -138,6 +146,7 @@ exports.BaseDocumentModel = Montage.create(Component, {
                                 file: this.file,
                                 webgl: this.webGlHelper.glData,
                                 styles: this.getStyleSheets(),
+                                template: this.fileTemplate,
                                 document: this.views.design.iframe.contentWindow.document,
                                 head: this.views.design.iframe.contentWindow.document.head,
                                 body: this.views.design.iframe.contentWindow.document.body
@@ -165,6 +174,7 @@ exports.BaseDocumentModel = Montage.create(Component, {
                                 file: this.file,
                                 webgl: this.webGlHelper.glData,
                                 css: this.getStyleSheets(),
+                                template: this.fileTemplate,
                                 document: this.views.design.iframe.contentWindow.document,
                                 head: this.views.design.iframe.contentWindow.document.head,
                                 body: this.views.design.iframe.contentWindow.document.body
@@ -204,10 +214,11 @@ exports.BaseDocumentModel = Montage.create(Component, {
                 if (this.views.design && (!view || view === 'design')) {
                         //
                         this.parentContainer.removeChild(this.views.design.iframe);
+                this.views.design.pauseAndStopVideos();
                         this.views.design = null;
                 }
                 //
-                if (callback) callback(success);
+                return success;
         }
     }
         ////////////////////////////////////////////////////////////////////
diff --git a/js/document/templates/banner/index.html b/js/document/templates/banner/index.html
index 2cd82f51..91ef06de 100755
--- a/js/document/templates/banner/index.html
+++ b/js/document/templates/banner/index.html
@@ -27,8 +27,6 @@
                                 margin: 0;
                         padding: 0;
                                 position: absolute;
-                                -webkit-transform-style: preserve-3d;
-                                -webkit-transform: perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
                         }
 
             html {
@@ -40,10 +38,6 @@
                 height: 100%;
                 background: #666;
             }
-                        
-                        ninjaloadinghack {
-                                display: none;
-                        }
 
                         .active-element-outline {
                         outline: #adff2f solid 2px;
@@ -53,16 +47,29 @@
                                 -webkit-transition: all 450ms linear !important;