From e75223a2c4c1e13d66639841e6418e94fe9b726f Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Tue, 31 Jan 2012 15:59:46 -0800 Subject: Cloud IO Prompt Setting up UI for the file IO prompt on initialization of Ninja and whenever a cloud IO call is made and the server is not detected. --- js/io/system/coreioapi.js | 84 ++++++++++++++++++++++++++++++++++++++++------- 1 file changed, 73 insertions(+), 11 deletions(-) (limited to 'js/io/system') diff --git a/js/io/system/coreioapi.js b/js/io/system/coreioapi.js index 33c7bc28..4407d59a 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, { @@ -26,16 +28,11 @@ exports.CoreIoApi = Montage.create(Component, { //Checks for IO API to be active this.ioServiceDetected = this.cloudAvailable(); // - console.log('FileIO: localStorage URL detected | IO Service Detected: '+ this.ioServiceDetected); - // + console.log('Cloud Status: URL detected in localStorage as '+this.rootUrl); } 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); // + this.ioServiceDetected = false; + console.log('Cloud Status: No URL detected in localStorage'); } } }, @@ -45,18 +42,83 @@ exports.CoreIoApi = Montage.create(Component, { enumerable: false, value: function () { // - if (this.getCloudStatus().status === 200) { + if (this.rootUrl && this.getCloudStatus().status === 200) { //Active 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 + }, + //////////////////////////////////////////////////////////////////// + // + _cloudDialogComponents: { + enumerable: false, + value: {blackout: null, popup: null, dialog: null} + }, + //////////////////////////////////////////////////////////////////// + // + showCloudDialog: { + enumerable: false, + value: function () { + // + this._cloudDialogComponents.blackout = document.createElement('div'); + this._cloudDialogComponents.blackout.style.width = '100%'; + this._cloudDialogComponents.blackout.style.height = '100%'; + this._cloudDialogComponents.blackout.style.background = 'rgba(0, 0, 0, .6)'; + 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: '200px', y: '200px'}); + this._cloudDialogComponents.popup.addEventListener('firstDraw', this, false); + } else { + // + this._cloudDialogComponents.dialog.element.style.opacity = 1; + this._cloudDialogComponents.popup.element.style.opacity = 1; + } + } + }, + + + //////////////////////////////////////////////////////////////////// + // + hideCloudDialog: { + enumerable: false, + value: function () { + } + }, + //////////////////////////////////////////////////////////////////// + // _ioServiceDetected: { enumerable: false, value: false -- cgit v1.2.3 From d2ff7026abd7e40b49917491773cba9367221f99 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Tue, 31 Jan 2012 22:44:15 -0800 Subject: Hooking cloud popup UI to core Set up the popup UI for cloud to core API to detected cloud API connection. --- js/io/system/coreioapi.js | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) (limited to 'js/io/system') diff --git a/js/io/system/coreioapi.js b/js/io/system/coreioapi.js index 4407d59a..6b803f22 100755 --- a/js/io/system/coreioapi.js +++ b/js/io/system/coreioapi.js @@ -47,7 +47,7 @@ exports.CoreIoApi = Montage.create(Component, { return true; } else { //Inactive - if (!this._cloudDialogOpen || this.application.ninja) { + if (!this._cloudDialogOpen && this.application.ninja) { this.showCloudDialog(); } return false; @@ -71,11 +71,13 @@ exports.CoreIoApi = Montage.create(Component, { 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 = 'rgba(0, 0, 0, .6)'; + 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); // //////////////////////////////////////////////////// @@ -93,28 +95,31 @@ exports.CoreIoApi = Montage.create(Component, { 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: '200px', y: '200px'}); + 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'; } } }, - - //////////////////////////////////////////////////////////////////// // hideCloudDialog: { enumerable: false, value: function () { + // + this.application.ninja.popupManager.removePopup(this._cloudDialogComponents.blackout); + this.application.ninja.popupManager.removePopup(this._cloudDialogComponents.popup.element); } }, //////////////////////////////////////////////////////////////////// -- cgit v1.2.3 From 372604713c2f7ac5c0b0ef475cf4043ba3194fec Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Tue, 31 Jan 2012 23:34:44 -0800 Subject: Cloud API Popup Fixes Minor layout fixes, adjusted functionality slightly, need to check into adjusting the file and directory URL constructs for API changes. --- js/io/system/coreioapi.js | 21 ++++++++++++++------- 1 file changed, 14 insertions(+), 7 deletions(-) (limited to 'js/io/system') diff --git a/js/io/system/coreioapi.js b/js/io/system/coreioapi.js index 6b803f22..74b066ac 100755 --- a/js/io/system/coreioapi.js +++ b/js/io/system/coreioapi.js @@ -27,12 +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('Cloud Status: URL detected in localStorage as '+this.rootUrl); } else { - // + //IO API to be inactive this.ioServiceDetected = false; - console.log('Cloud Status: No URL detected in localStorage'); } } }, @@ -41,9 +38,12 @@ exports.CoreIoApi = Montage.create(Component, { cloudAvailable: { enumerable: false, value: function () { + var cloud = this.getCloudStatus(); // - if (this.rootUrl && 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 @@ -62,6 +62,12 @@ exports.CoreIoApi = Montage.create(Component, { }, //////////////////////////////////////////////////////////////////// // + cloudData: { + enumerable: false, + value: {name: null, root: ''} + }, + //////////////////////////////////////////////////////////////////// + // _cloudDialogComponents: { enumerable: false, value: {blackout: null, popup: null, dialog: null} @@ -223,8 +229,8 @@ exports.CoreIoApi = Montage.create(Component, { if((urlOut.length > 1) && (urlOut.charAt(urlOut.length - 1) === "/")){ urlOut = urlOut.substring(0, (urlOut.length - 1)); } - - return serviceURL + urlOut; + // + return String(serviceURL+urlOut); } }, //////////////////////////////////////////////////////////////////// @@ -1009,6 +1015,7 @@ exports.CoreIoApi = Montage.create(Component, { // if (xhr.readyState === 4) { retValue.status = xhr.status; + eval('retValue.response = '+xhr.response); retValue.success = true; } } -- cgit v1.2.3 From d74910a897f2db920f6f67d922532d245074c8f7 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Wed, 1 Feb 2012 11:51:24 -0800 Subject: Fixing coreIO API referencing --- js/io/system/coreioapi.js | 3 ++- js/io/system/fileio.js | 11 ++++++----- 2 files changed, 8 insertions(+), 6 deletions(-) (limited to 'js/io/system') diff --git a/js/io/system/coreioapi.js b/js/io/system/coreioapi.js index 74b066ac..7e883b81 100755 --- a/js/io/system/coreioapi.js +++ b/js/io/system/coreioapi.js @@ -207,6 +207,7 @@ exports.CoreIoApi = Montage.create(Component, { directoryServiceURL: { enumerable: false, get: function() { + console.log(this); return String(this.rootUrl+this._directoryServiceURL); }, set: function(value) { @@ -1015,7 +1016,7 @@ exports.CoreIoApi = Montage.create(Component, { // if (xhr.readyState === 4) { retValue.status = xhr.status; - eval('retValue.response = '+xhr.response); + retValue.response = JSON.parse(xhr.response); retValue.success = true; } } diff --git a/js/io/system/fileio.js b/js/io/system/fileio.js index 38ab05e8..ac5812e9 100755 --- a/js/io/system/fileio.js +++ b/js/io/system/fileio.js @@ -11,11 +11,12 @@ NOTES: empty file will be created. 'contents' should be a string to be saved as the file. 'contentType' is the mime type of the file. + coreIoApi: this.application.ninja.coreIoApi + //////////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////// */ // -var Montage = require("montage/core/core").Montage, - CoreIoApi = require("js/io/system/coreioapi").CoreIoApi; +var Montage = require("montage/core/core").Montage; //////////////////////////////////////////////////////////////////////// //Exporting as File I/O exports.FileIo = Montage.create(Object.prototype, { @@ -28,12 +29,12 @@ exports.FileIo = Montage.create(Object.prototype, { enumerable: true, value: function(file) { //Checking for API to be available - if (!CoreIoApi.cloudAvailable()) { + if (!this.application.ninja.coreIoApi.cloudAvailable()) { //API not available, no IO action taken return null; } //Peforming check for file to exist - var check = CoreIoApi.fileExists(file.uri), status, create; + var check = this.application.ninja.coreIoApi.fileExists(file.uri), status, create; //Upon successful check, handling results if (check.success) { //Handling status of check @@ -44,7 +45,7 @@ exports.FileIo = Montage.create(Object.prototype, { break; case 404: //File does not exists, ready to be created - create = CoreIoApi.createFile(file); + create = this.application.ninja.coreIoApi.createFile(file); //Storing status to be returned (for UI handling) if (create.success) { status = check.status; -- cgit v1.2.3