Merge branch 'FileIO' of github.com:joseeight/ninja-internal into FileIO

12 files changed, 470 insertions, 25 deletions

diff --git a/js/components/combobox.reel/combobox.js b/js/components/combobox.reel/combobox.js
index f262bb06..a68a7d6b 100755
--- a/js/components/combobox.reel/combobox.js
+++ b/js/components/combobox.reel/combobox.js
@@ -67,7 +67,7 @@ exports.Combobox = Montage.create(Component, {
                 var e = document.createEvent("CustomEvent");
                 e.initEvent("change", true, true);
                 e.type = "change";
-                e._wasSetByCode = this._wasSetByCode;
+                e.wasSetByCode = this._wasSetByCode;
                 e.value = this._value;
                 this.dispatchEvent(e);
 
diff --git a/js/components/layout/bread-crumb.reel/bread-crumb.css b/js/components/layout/bread-crumb.reel/bread-crumb.css
index f84c6e80..cc984609 100755
--- a/js/components/layout/bread-crumb.reel/bread-crumb.css
+++ b/js/components/layout/bread-crumb.reel/bread-crumb.css
@@ -5,6 +5,7 @@
  </copyright> */
 
 .bread_crumb{
+    background-color: #282828;
     border-style: double;
     height: 26px;
 }
diff --git a/js/components/popup-manager.reel/popup-manager.js b/js/components/popup-manager.reel/popup-manager.js
index be3c1e8d..bc755f74 100755
--- a/js/components/popup-manager.reel/popup-manager.js
+++ b/js/components/popup-manager.reel/popup-manager.js
@@ -32,7 +32,8 @@ exports.PopupMananger = Montage.create(Component, {
     addPopup: {
         enumerable: true,
         value: function (popup, depth, blackout) {
-                //
+                //Fix to ensure always highest
+                this.element.style.zIndex = this._getNextHighestZindex(document.body); // Highest z-index in body
                 //TODO: Add blackout background
                 //Checking for manual or setting auto to next highest depth
                 if (depth) {
diff --git a/js/components/radio.reel/radio.js b/js/components/radio.reel/radio.js
index 954da3c4..c661ec11 100755
--- a/js/components/radio.reel/radio.js
+++ b/js/components/radio.reel/radio.js
@@ -41,7 +41,7 @@ exports.RadioGroup = Montage.create(Component, {
                     e = document.createEvent("CustomEvent");
                     e.initEvent("change", true, true);
                     e.type = "change";
-                    e._wasSetByCode = this._wasSetByCode;
+                    e.wasSetByCode = this._wasSetByCode;
                     e.selectedIndex = i;
                     e.selectedItem = value;
                     this.dispatchEvent(e);
@@ -77,7 +77,7 @@ exports.RadioGroup = Montage.create(Component, {
     {
         value:function(event)
         {
-            this._wasSetByCode = event._event._wasSetByCode;
+            this._wasSetByCode = event._event.wasSetByCode;
             this.selectedItem = event._event.value;
         }
     }
@@ -126,7 +126,7 @@ exports.Radio = Montage.create(Component, {
             var e = document.createEvent("CustomEvent");
             e.initEvent("change", true, true);
             e.type = "change";
-            e._wasSetByCode = this._wasSetByCode;
+            e.wasSetByCode = this._wasSetByCode;
             e.value = this;
             this.dispatchEvent(e);
 
diff --git a/js/io/system/coreioapi.js b/js/io/system/coreioapi.js
index 43812b3c..3a007028 100755
--- a/js/io/system/coreioapi.js
+++ b/js/io/system/coreioapi.js
@@ -10,7 +10,9 @@ NOTES:
 ////////////////////////////////////////////////////////////////////////
 ///////////////////////////////////////////////////////////////////// */
 var Montage =           require("montage/core/core").Montage,
-    Component =         require("montage/ui/component").Component;
+    Component =         require("montage/ui/component").Component,
+    Popup =             require("js/components/popup.reel").Popup,
+    CloudPopup =        require("js/io/ui/cloudpopup.reel").CloudPopup;
 ////////////////////////////////////////////////////////////////////////
 //Exporting as Project I/O
 exports.CoreIoApi = Montage.create(Component, {
@@ -25,17 +27,9 @@ exports.CoreIoApi = Montage.create(Component, {
                                 this.rootUrl = window.localStorage['ioRootUrl'];
                                 //Checks for IO API to be active
                                 this.ioServiceDetected = this.cloudAvailable();
-                                //
-                                console.log('FileIO: localStorage URL detected | IO Service Detected: '+ this.ioServiceDetected);
-                                //
                         } else {
-                                //TODO: Remove, automatically prompt user on welcome
-                                this.rootUrl = 'http://localhost:16380';
-                                //TODO: Changed to false, welcome screen prompts user
-                                this.ioServiceDetected = this.cloudAvailable();
-                                //
-                                console.log('FileIO: localStorage URL NOT detected | IO Service Detected: '+ this.ioServiceDetected);
-                                //
+                                //IO API to be inactive
+                                this.ioServiceDetected = false;
                         }
                 }
         },
@@ -44,19 +38,98 @@ exports.CoreIoApi = Montage.create(Component, {
         cloudAvailable: {
                 enumerable: false,
                 value: function () {
+                        var cloud = this.getCloudStatus();
                         //
-                        if (this.getCloudStatus().status === 200) {
+                        if (this.rootUrl && cloud.status === 200) {
                                 //Active
+                                this.cloudData.name = cloud.response['name'];
+                                this.cloudData.root = cloud.response['server-root'];
                                 return true;
                         } else {
                                 //Inactive
-                                //TODO: Logic to prompt the user for cloud, otherwise return false
+                                if (!this._cloudDialogOpen && this.application.ninja) {
+                                        this.showCloudDialog();
+                                }
                                 return false;
                         }
                 }
         },
         ////////////////////////////////////////////////////////////////////
     //
+    _cloudDialogOpen: {
+        enumerable: false,
+                value: false
+    },
+    ////////////////////////////////////////////////////////////////////
+    //
+    cloudData: {
+        enumerable: false,
+                value: {name: null, root: ''}
+    },
+    ////////////////////////////////////////////////////////////////////
+    //
+    _cloudDialogComponents: {
+        enumerable: false,
+                value: {blackout: null, popup: null, dialog: null}
+    },
+        ////////////////////////////////////////////////////////////////////
+    //
+    showCloudDialog: {
+        enumerable: false,
+                value: function () {
+                        //
+                        this._cloudDialogOpen = true;
+                        //
+                        this._cloudDialogComponents.blackout = document.createElement('div');
+                        this._cloudDialogComponents.blackout.style.width = '100%';
+                        this._cloudDialogComponents.blackout.style.height = '100%';
+                        this._cloudDialogComponents.blackout.style.background = '-webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,.65) 0%, rgba(0,0,0,0.8) 80%)';
+                        this.application.ninja.popupManager.addPopup(this._cloudDialogComponents.blackout);
+                //
+                ////////////////////////////////////////////////////
+                //Creating popup from m-js component
+                var popup = document.createElement('div');
+                //
+                this._cloudDialogComponents.dialog = CloudPopup.create();
+                //
+                document.body.appendChild(popup);
+                //
+                this._cloudDialogComponents.dialog.element = popup;
+                this._cloudDialogComponents.dialog.needsDraw = true;
+                this._cloudDialogComponents.dialog.element.style.opacity = 0;
+                //
+                this._cloudDialogComponents.dialog.addEventListener('firstDraw', this, false);
+                }
+    },
+    ////////////////////////////////////////////////////////////////////
+    //
+    handleFirstDraw: {
+        value: function (e) {
+                        if (e._target._element.className === 'cloud_popup') {
+                        this._cloudDialogComponents.dialog.removeEventListener('firstDraw', this, false);
+                        //
+                                this._cloudDialogComponents.popup = this.application.ninja.popupManager.createPopup(this._cloudDialogComponents.dialog.element, {x: '50%', y: '50%'});
+                                this._cloudDialogComponents.popup.addEventListener('firstDraw', this, false);
+                        } else {
+                                //
+                                this._cloudDialogComponents.dialog.element.style.opacity = 1;
+                                this._cloudDialogComponents.popup.element.style.opacity = 1;
+                                this._cloudDialogComponents.popup.element.style.margin = '-100px 0px 0px -190px';
+