Adding lib copy blocking to preview

This fixes an issue with launching preview before libraries were copied, hence, first time run would fail. Need to add a feedback screen for this process.

3 files changed, 73 insertions, 28 deletions

diff --git a/js/document/mediators/template.js b/js/document/mediators/template.js
index 1aac7e15..17fa553c 100755
--- a/js/document/mediators/template.js
+++ b/js/document/mediators/template.js
@@ -93,7 +93,7 @@ exports.TemplateDocumentMediator = Montage.create(Component, {
     ////////////////////////////////////////////////////////////////////
     //TODO: Expand to allow more templates, clean up variables
     parseNinjaTemplateToHtml: {
-        value: function (template, ninjaWrapper) {
+        value: function (template, ninjaWrapper, libCopyCallback) {
                 //TODO: Improve reference for rootUrl
             var regexRootUrl,
                 rootUrl = this.application.ninja.coreIoApi.rootUrl + escape((this.application.ninja.documentController.documentHackReference.root.split(this.application.ninja.coreIoApi.cloudData.root)[1])),
@@ -332,7 +332,9 @@ exports.TemplateDocumentMediator = Montage.create(Component, {
             
             //
             var webgltag, webgllibtag, webglrdgetag, mjstag, mjslibtag, matchingtags = [],
-                scripts = template.file.content.document.getElementsByTagName('script');
+                scripts = template.file.content.document.getElementsByTagName('script'),
+                libsobserver = {montage: false, canvas: false, montageCopied: null, canvasCopied: null, callback: libCopyCallback, dispatched: false};
+            
             //
             for (var i in scripts) {
                 if (scripts[i].getAttribute) {
@@ -376,7 +378,8 @@ exports.TemplateDocumentMediator = Montage.create(Component, {
                     if (this.application.ninja.coreIoApi.ninjaLibrary.libs[i].name === 'RDGE') {
                         rdgeDirName = (this.application.ninja.coreIoApi.ninjaLibrary.libs[i].name + this.application.ninja.coreIoApi.ninjaLibrary.libs[i].version).toLowerCase();
                         rdgeVersion = this.application.ninja.coreIoApi.ninjaLibrary.libs[i].version;
-                        this.application.ninja.coreIoApi.ninjaLibrary.copyLibToCloud(template.file.root, rdgeDirName, function(result) {console.log(result)});
+                        libsobserver.canvas = true;
+                        this.application.ninja.coreIoApi.ninjaLibrary.copyLibToCloud(template.file.root, rdgeDirName, function(result) {libsobserver.canvasCopied = result; this.libCopied(libsobserver);}.bind(this));
                     } else {
                         //TODO: Error handle no available library to copy
                     }
@@ -502,7 +505,8 @@ exports.TemplateDocumentMediator = Montage.create(Component, {
                     if (this.application.ninja.coreIoApi.ninjaLibrary.libs[i].name === 'Montage') {
                         mjsDirName = (this.application.ninja.coreIoApi.ninjaLibrary.libs[i].name + this.application.ninja.coreIoApi.ninjaLibrary.libs[i].version).toLowerCase();
                         mjsVersion = this.application.ninja.coreIoApi.ninjaLibrary.libs[i].version;
-                        this.application.ninja.coreIoApi.ninjaLibrary.copyLibToCloud(template.file.root, mjsDirName, function(result) {console.log(result)});
+                        libsobserver.montage = true;
+                        this.application.ninja.coreIoApi.ninjaLibrary.copyLibToCloud(template.file.root, mjsDirName, function(result) {libsobserver.montageCopied = result; this.libCopied(libsobserver);}.bind(this));
                         
                         
                         
@@ -590,6 +594,44 @@ exports.TemplateDocumentMediator = Montage.create(Component, {
     },
     ////////////////////////////////////////////////////////////////////
     //
+    libCopied: {
+            value: function (observer) {
+                    if (observer.montage && observer.canvas) {
+                            //
+                            if (observer.montageCopied && observer.canvasCopied) {
+                                        if (observer.callback && !observer.dispatched) observer.callback(true);
+                                        observer.dispatched = true;
+                            } else if (observer.montageCopied === false || observer.canvasCopied === false) {
+                                    if (observer.callback && !observer.dispatched) observer.callback(false);
+                                    observer.dispatched = true;
+                            }
+                    } else if (observer.montage) {
+                            //
+                            if (observer.montageCopied) {
+                                    if (observer.callback && !observer.dispatched) observer.callback(true);
+                                    observer.dispatched = true;
+                            } else {
+                                    if (observer.callback && !observer.dispatched) observer.callback(false);
+                                    observer.dispatched = true;
+                            }
+                    } else if (observer.canvas && observer.canvasCopied) {
+                            //
+                            if (observer.canvasCopied) {
+                                    if (observer.callback && !observer.dispatched) observer.callback(true);
+                                    observer.dispatched = true;
+                            } else {
+                                    if (observer.callback && !observer.dispatched) observer.callback(false);
+                                    observer.dispatched = true;
+                            }
+                    } else {
+                            //Error
+                            if (observer.callback && !observer.dispatched) observer.callback(false);
+                            observer.dispatched = true;
+                    }
+            }
+    },
+    ////////////////////////////////////////////////////////////////////
+    //
     getUrlfromNinjaUrl: {
         enumerable: false,
         value: function (url, fileRootUrl, fileUrl) {
diff --git a/js/document/models/base.js b/js/document/models/base.js
index 76a5e62b..27f7d43f 100755
--- a/js/document/models/base.js
+++ b/js/document/models/base.js
@@ -103,7 +103,7 @@ exports.BaseDocumentModel = Montage.create(Component, {
                 //Generating URL for document
                 var url = this.application.ninja.coreIoApi.rootUrl + this.file.uri.split(this.application.ninja.coreIoApi.cloudData.root)[1];
                 //TODO: Add logic to prompt user to save (all) before preview
-                this.saveAll(function (result) {
+                this.saveAll(null,function (result) {
                         //Currently only supporting current browser (Chrome, obviously)
                         switch (this.browser) {
                                 case 'chrome':
@@ -145,7 +145,7 @@ exports.BaseDocumentModel = Montage.create(Component, {
     ////////////////////////////////////////////////////////////////////
         //
         save: {
-        value: function (callback) {
+        value: function (callback, libCopyCallback) {
                 //
                 if (this.needsSave) {
                         //Save
@@ -165,7 +165,7 @@ exports.BaseDocumentModel = Montage.create(Component, {
                                 head: this.views.design.iframe.contentWindow.document.head,
                                 body: this.views.design.iframe.contentWindow.document.body,
                                 mjsTemplateCreator: this.views.design.iframe.contentWindow.mjsTemplateCreator
-                        }, this.handleSaved.bind({callback: callback, model: this}));
+                        }, this.handleSaved.bind({callback: callback, model: this}), libCopyCallback);
                 } else {
                         //TODO: Add logic to save code view data
                 }
@@ -174,7 +174,7 @@ exports.BaseDocumentModel = Montage.create(Component, {
     ////////////////////////////////////////////////////////////////////
         //
         saveAll: {
-        value: function (callback) {
+        value: function (callback, libCopyCallback) {
                 //
                 if (this.needsSave) {
                         //Save
@@ -194,7 +194,7 @@ exports.BaseDocumentModel = Montage.create(Component, {
                                 head: this.views.design.iframe.contentWindow.document.head,
                                 body: this.views.design.iframe.contentWindow.document.body,
                                 mjsTemplateCreator: this.views.design.iframe.contentWindow.mjsTemplateCreator
-                        }, this.handleSaved.bind({callback: callback, model: this}));
+                        }, this.handleSaved.bind({callback: callback, model: this}), libCopyCallback);
                 } else {
                         //TODO: Add logic to save code view data
                 }
diff --git a/js/mediators/io-mediator.js b/js/mediators/io-mediator.js
index 4535cad6..c5ec951e 100644
--- a/js/mediators/io-mediator.js
+++ b/js/mediators/io-mediator.js
@@ -43,6 +43,24 @@ exports.IoMediator = Montage.create(Component, {
     },
     ////////////////////////////////////////////////////////////////////
     //
+    parseToTemplate: {
+            value: function(content, template) {
+                    //
+            if (template.name.toLowerCase() === 'banner' || template.name.toLowerCase() === 'animation') {
+                //Getting dimensions of banner
+                        var dimensions = template.id.split('x');
+                dimensions = {width: String(dimensions[0])+'px', height: String(dimensions[1])+'px'};
+                //
+                content = content.replace(/Dimensions@@@/gi, "Dimensions@@@"+template.id);
+                content = content.replace(/ninja-banner {}/gi, "ninja-banner {overflow: visible; width: "+dimensions.width+"; height: "+dimensions.height+"}");
+                content = content.replace(/ninja-content-wrapper {}/gi, "ninja-content-wrapper {overflow: hidden; width: "+dimensions.width+"; height: "+dimensions.height+"}");
+            }
+            //
+            return content;
+            }
+    },
+    ////////////////////////////////////////////////////////////////////
+    //
     fileNew: {
         value: function (file, url, callback, template) {
             //Loading template from template URL
@@ -51,7 +69,7 @@ exports.IoMediator = Montage.create(Component, {
             xhr.send();
             if (xhr.readyState === 4) {
                 //Making call to create file, checking for return code
-                switch (this.fio.newFile({ uri: file, contents: parseTemplate(xhr.response, template) })) {
+                switch (this.fio.newFile({ uri: file, contents: this.parseToTemplate(xhr.response, template) })) {
                     case 201:
                         result = { status: 201, success: true, uri: file };
                         break;
@@ -65,21 +83,6 @@ exports.IoMediator = Montage.create(Component, {
                         result = { status: 500, success: false, uri: file };
                         break;
                 }
-                //TODO: Improve template data injection
-                function parseTemplate (content, template) {
-                        //
-                        if (template.name.toLowerCase() === 'banner' || template.name.toLowerCase() === 'animation') {
-                                //Getting dimensions of banner
-                                var dimensions = template.id.split('x');