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/ui/cloudpopup.reel/cloudpopup.html | 54 ++++++++++++ js/io/ui/cloudpopup.reel/cloudpopup.js | 55 ++++++++++++ js/io/ui/cloudpopup.reel/config.rb | 9 ++ js/io/ui/cloudpopup.reel/css/cloudpopup.css | 118 ++++++++++++++++++++++++++ js/io/ui/cloudpopup.reel/css/cloudpopup.scss | 122 +++++++++++++++++++++++++++ 5 files changed, 358 insertions(+) create mode 100755 js/io/ui/cloudpopup.reel/cloudpopup.html create mode 100755 js/io/ui/cloudpopup.reel/cloudpopup.js create mode 100755 js/io/ui/cloudpopup.reel/config.rb create mode 100644 js/io/ui/cloudpopup.reel/css/cloudpopup.css create mode 100755 js/io/ui/cloudpopup.reel/css/cloudpopup.scss (limited to 'js/io/ui') diff --git a/js/io/ui/cloudpopup.reel/cloudpopup.html b/js/io/ui/cloudpopup.reel/cloudpopup.html new file mode 100755 index 00000000..8e45f926 --- /dev/null +++ b/js/io/ui/cloudpopup.reel/cloudpopup.html @@ -0,0 +1,54 @@ + + + + + + + + + + + + + + + + + +
+
+ +

Cloud Service Dialog

+ +

Duis aliquet egestas purus in blandit. Curabitur vulputate, ligula lacinia scelerisque tempor, lacus lacus ornare ante, ac egestas.

+ + + + + +
Disconnected
+ + + + + +
+
+ + + + \ No newline at end of file diff --git a/js/io/ui/cloudpopup.reel/cloudpopup.js b/js/io/ui/cloudpopup.reel/cloudpopup.js new file mode 100755 index 00000000..3e104bb7 --- /dev/null +++ b/js/io/ui/cloudpopup.reel/cloudpopup.js @@ -0,0 +1,55 @@ +/* +This file contains proprietary software owned by Motorola Mobility, Inc.
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +//////////////////////////////////////////////////////////////////////// +// +var Montage = require("montage/core/core").Montage, + Component = require("montage/ui/component").Component; +//////////////////////////////////////////////////////////////////////// +// +exports.CloudPopup = Montage.create(Component, { + //////////////////////////////////////////////////////////////////// + // + hasTemplate: { + value: true + }, + //////////////////////////////////////////////////////////////////// + // + prepareForDraw: { + enumerable: false, + value: function () { + // + } + }, + //////////////////////////////////////////////////////////////////// + // + willDraw: { + enumerable: false, + value: function() { + // + } + }, + //////////////////////////////////////////////////////////////////// + // + draw: { + enumerable: false, + value: function() { + // + } + }, + //////////////////////////////////////////////////////////////////// + // + didDraw: { + enumerable: false, + value: function() { + // + } + } + //////////////////////////////////////////////////////////////////// + //////////////////////////////////////////////////////////////////// +}); +//////////////////////////////////////////////////////////////////////// +//////////////////////////////////////////////////////////////////////// \ No newline at end of file diff --git a/js/io/ui/cloudpopup.reel/config.rb b/js/io/ui/cloudpopup.reel/config.rb new file mode 100755 index 00000000..9b55af19 --- /dev/null +++ b/js/io/ui/cloudpopup.reel/config.rb @@ -0,0 +1,9 @@ +# Require any additional compass plugins here. +# Set this to the root of your project when deployed: +http_path = "/" +css_dir = "css" +sass_dir = "css" +images_dir = "img" +javascripts_dir = "../" +# To enable relative paths to assets via compass helper functions. Uncomment: +# relative_assets = true diff --git a/js/io/ui/cloudpopup.reel/css/cloudpopup.css b/js/io/ui/cloudpopup.reel/css/cloudpopup.css new file mode 100644 index 00000000..009ba835 --- /dev/null +++ b/js/io/ui/cloudpopup.reel/css/cloudpopup.css @@ -0,0 +1,118 @@ +@charset "UTF-8"; +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ +/* line 12, cloudpopup.scss */ +.cloud_popup { + font-size: 12px; + text-shadow: 1px 1px 1px #000; + font-family: 'Droid Sans', sans-serif; +} + +/* line 19, cloudpopup.scss */ +.cloud_popup .content { + width: 360px; +} + +/* line 24, cloudpopup.scss */ +.cloud_popup .content h3 { + text-transform: uppercase; + font-weight: normal; + font-size: 14px; + text-shadow: 1px 1px 1px #000; + font-family: 'Droid Sans', sans-serif; + display: block; + float: left; + clear: both; + margin: 4px 0px 8px 0px; + padding: 0px; + width: 100%; + text-align: center; +} + +/* line 40, cloudpopup.scss */ +.cloud_popup .content p { + text-shadow: 1px 1px 1px #333; + margin: 0px 0px 12px 0px; + text-align: justify; + color: #EEE; +} + +/* line 48, cloudpopup.scss */ +.cloud_popup .content .test { + float: right; + clear: right; + margin: 0px 0px 0px 8px; +} + +/* line 55, cloudpopup.scss */ +.cloud_popup .content label { + float: left; + margin: 5px 8px 0px 0px; + display: block; + width: 96px; + text-align: right; +} + +/* line 64, cloudpopup.scss */ +.cloud_popup .content input { + display: block; + border: 0px; + padding: 4px; + margin: 0px; + background: #292929 -webkit-gradient(linear, left top, left bottom, color-stop(45%, #434343), color-stop(100%, #292929)); + border: 1px #5c5c5c solid; + color: #FFF; + float: left; + width: 202px; + border-radius: 4px; +} + +/* line 77, cloudpopup.scss */ +.cloud_popup .content input:focus { + background: #FFF; + border: 1px #292929 solid; + color: #292929; +} + +/* line 84, cloudpopup.scss */ +.cloud_popup .content button { + display: block; + border: 0px; + margin: 0px; + padding: 4px; + border: 1px #333 solid; + background: #292929 -webkit-gradient(linear, left top, left bottom, color-stop(0%, #494949), color-stop(100%, #292929)); + border-radius: 4px; + color: #FFF; + text-transform: uppercase; + cursor: pointer; + text-shadow: 1px 1px 1px #000; +} + +/* line 99, cloudpopup.scss */ +.cloud_popup .content button:hover { + border: 1px #222 solid; + background: #292929 -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #161616)); + color: #EEE; +} + +/* line 107, cloudpopup.scss */ +.cloud_popup .content .status { + color: red; + float: left; + clear: right; + margin: 5px 0px 0px 6px; + text-shadow: 1px 1px 1px #333; + width: 240px; +} + +/* line 117, cloudpopup.scss */ +.cloud_popup .content .handle_ok, .cloud_popup .content .handle_cancel { + width: 80px; + text-align: center; + float: right; + margin: 4px 0px 0px 8px; +} diff --git a/js/io/ui/cloudpopup.reel/css/cloudpopup.scss b/js/io/ui/cloudpopup.reel/css/cloudpopup.scss new file mode 100755 index 00000000..ea54b1d8 --- /dev/null +++ b/js/io/ui/cloudpopup.reel/css/cloudpopup.scss @@ -0,0 +1,122 @@ +@charset "UTF-8"; +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +$grey_dark: #292929; +$grey_light: #494949; + +.cloud_popup +{ + font-size: 12px; + text-shadow: 1px 1px 1px #000; + font-family: 'Droid Sans', sans-serif; +} + +.cloud_popup .content +{ + width: 360px; +} + +.cloud_popup .content h3 +{ + text-transform: uppercase; + font-weight: normal; + font-size: 14px; + text-shadow: 1px 1px 1px #000; + font-family: 'Droid Sans', sans-serif; + display: block; + float: left; + clear: both; + margin: 4px 0px 8px 0px; + padding: 0px; + width: 100%; + text-align: center; +} + +.cloud_popup .content p +{ + text-shadow: 1px 1px 1px #333; + margin: 0px 0px 12px 0px; + text-align: justify; + color: #EEE; +} + +.cloud_popup .content .test +{ + float: right; + clear: right; + margin: 0px 0px 0px 8px; +} + +.cloud_popup .content label +{ + float: left; + margin: 5px 8px 0px 0px; + display: block; + width: 96px; + text-align: right; +} + +.cloud_popup .content input +{ + display: block; + border: 0px; + padding: 4px; + margin: 0px; + background: $grey_dark -webkit-gradient(linear, left top, left bottom, color-stop(45%, lighten($grey_dark, 10%)), color-stop(100%, $grey_dark)); + border: 1px lighten($grey_dark, 20%) solid; + color: #FFF; + float: left; + width: 202px; + border-radius: 4px; +} + +.cloud_popup .content input:focus { + background: #FFF; + border: 1px $grey_dark solid; + color: $grey_dark; +} + +.cloud_popup .content button +{ + display: block; + border: 0px; + margin: 0px; + padding: 4px; + border: 1px #333 solid; + background: $grey_dark -webkit-gradient(linear, left top, left bottom, color-stop(0%, $grey_light), color-stop(100%, $grey_dark)); + border-radius: 4px; + color: #FFF; + text-transform: uppercase; + cursor: pointer; + text-shadow: 1px 1px 1px #000; +} + +.cloud_popup .content button:hover +{ + + border: 1px #222 solid; + background: $grey_dark -webkit-gradient(linear, left top, left bottom, color-stop(0%, lighten($grey_dark, 20%)), color-stop(100%, darken($grey_light, 20%))); + color: #EEE; +} + +.cloud_popup .content .status +{ + color: red; + float: left; + clear: right; + margin: 5px 0px 0px 6px; + text-shadow: 1px 1px 1px #333; + width: 240px; +} + +.cloud_popup .content .handle_ok, .cloud_popup .content .handle_cancel +{ + width: 80px; + text-align: center; + float: right; + margin: 4px 0px 0px 8px; +} \ No newline at end of file -- 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/ui/cloudpopup.reel/cloudpopup.html | 10 +++---- js/io/ui/cloudpopup.reel/cloudpopup.js | 43 ++++++++++++++++++++++++++++ js/io/ui/cloudpopup.reel/css/cloudpopup.css | 34 +++++++++++----------- js/io/ui/cloudpopup.reel/css/cloudpopup.scss | 23 ++++++++------- 4 files changed, 79 insertions(+), 31 deletions(-) (limited to 'js/io/ui') diff --git a/js/io/ui/cloudpopup.reel/cloudpopup.html b/js/io/ui/cloudpopup.reel/cloudpopup.html index 8e45f926..5d7de347 100755 --- a/js/io/ui/cloudpopup.reel/cloudpopup.html +++ b/js/io/ui/cloudpopup.reel/cloudpopup.html @@ -36,15 +36,15 @@

Duis aliquet egestas purus in blandit. Curabitur vulputate, ligula lacinia scelerisque tempor, lacus lacus ornare ante, ac egestas.

- + - + -
Disconnected
+
 
- + - + diff --git a/js/io/ui/cloudpopup.reel/cloudpopup.js b/js/io/ui/cloudpopup.reel/cloudpopup.js index 3e104bb7..f81dc93c 100755 --- a/js/io/ui/cloudpopup.reel/cloudpopup.js +++ b/js/io/ui/cloudpopup.reel/cloudpopup.js @@ -18,10 +18,21 @@ exports.CloudPopup = Montage.create(Component, { }, //////////////////////////////////////////////////////////////////// // + components: { + enumerable: false, + value: {test_btn: null, ok_btn: null, cancel_btn: null, status: null, url: null} + }, + //////////////////////////////////////////////////////////////////// + // prepareForDraw: { enumerable: false, value: function () { // + this.components.test_btn = this.element.getElementsByClassName('btn_test')[0]; + this.components.ok_btn = this.element.getElementsByClassName('btn_ok')[0]; + this.components.cancel_btn = this.element.getElementsByClassName('btn_cancel')[0]; + this.components.status = this.element.getElementsByClassName('status')[0]; + this.components.url = this.element.getElementsByClassName('cloud_url')[0]; } }, //////////////////////////////////////////////////////////////////// @@ -30,6 +41,7 @@ exports.CloudPopup = Montage.create(Component, { enumerable: false, value: function() { // + } }, //////////////////////////////////////////////////////////////////// @@ -38,6 +50,7 @@ exports.CloudPopup = Montage.create(Component, { enumerable: false, value: function() { // + this.testConnection(); } }, //////////////////////////////////////////////////////////////////// @@ -46,6 +59,36 @@ exports.CloudPopup = Montage.create(Component, { enumerable: false, value: function() { // + this.components.test_btn.addEventListener('click', this.testConnection.bind(this), false); + // + this.components.ok_btn.addEventListener('click', this.closeDialog.bind(this), false); + this.components.cancel_btn.addEventListener('click', this.closeDialog.bind(this), false); + } + }, + //////////////////////////////////////////////////////////////////// + //this.application.ninja.coreIoApi.hideCloudDialog + testConnection: { + enumerable: false, + value: function() { + // + this.application.ninja.coreIoApi.rootUrl = this.components.url.value; + // + if (this.application.ninja.coreIoApi.cloudAvailable()) { + this.components.status.style.color = '#77FF00'; + this.components.status.innerHTML = 'Connected'; + } else { + this.components.status.style.color = '#FF3A3A'; + this.components.status.innerHTML = 'Disconnected'; + } + } + }, + //////////////////////////////////////////////////////////////////// + // + closeDialog: { + enumerable: false, + value: function() { + // + this.application.ninja.coreIoApi.hideCloudDialog(); } } //////////////////////////////////////////////////////////////////// diff --git a/js/io/ui/cloudpopup.reel/css/cloudpopup.css b/js/io/ui/cloudpopup.reel/css/cloudpopup.css index 009ba835..81e0742f 100644 --- a/js/io/ui/cloudpopup.reel/css/cloudpopup.css +++ b/js/io/ui/cloudpopup.reel/css/cloudpopup.css @@ -34,20 +34,21 @@ /* line 40, cloudpopup.scss */ .cloud_popup .content p { - text-shadow: 1px 1px 1px #333; + text-shadow: 1px 1px 1px #222; margin: 0px 0px 12px 0px; text-align: justify; color: #EEE; } /* line 48, cloudpopup.scss */ -.cloud_popup .content .test { +.cloud_popup .content .btn_test { float: right; clear: right; margin: 0px 0px 0px 8px; + width: 60px; } -/* line 55, cloudpopup.scss */ +/* line 56, cloudpopup.scss */ .cloud_popup .content label { float: left; margin: 5px 8px 0px 0px; @@ -56,28 +57,30 @@ text-align: right; } -/* line 64, cloudpopup.scss */ +/* line 65, cloudpopup.scss */ .cloud_popup .content input { display: block; + float: left; + color: #FFF; border: 0px; padding: 4px; margin: 0px; - background: #292929 -webkit-gradient(linear, left top, left bottom, color-stop(45%, #434343), color-stop(100%, #292929)); - border: 1px #5c5c5c solid; - color: #FFF; - float: left; - width: 202px; + width: 176px; border-radius: 4px; + text-shadow: 1px 1px 1px #222; + border: 1px #5c5c5c solid; + background: #292929 -webkit-gradient(linear, left top, left bottom, color-stop(45%, #434343), color-stop(100%, #292929)); } -/* line 77, cloudpopup.scss */ +/* line 80, cloudpopup.scss */ .cloud_popup .content input:focus { + text-shadow: none; background: #FFF; border: 1px #292929 solid; color: #292929; } -/* line 84, cloudpopup.scss */ +/* line 88, cloudpopup.scss */ .cloud_popup .content button { display: block; border: 0px; @@ -92,16 +95,15 @@ text-shadow: 1px 1px 1px #000; } -/* line 99, cloudpopup.scss */ +/* line 103, cloudpopup.scss */ .cloud_popup .content button:hover { border: 1px #222 solid; background: #292929 -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #161616)); color: #EEE; } -/* line 107, cloudpopup.scss */ +/* line 111, cloudpopup.scss */ .cloud_popup .content .status { - color: red; float: left; clear: right; margin: 5px 0px 0px 6px; @@ -109,8 +111,8 @@ width: 240px; } -/* line 117, cloudpopup.scss */ -.cloud_popup .content .handle_ok, .cloud_popup .content .handle_cancel { +/* line 120, cloudpopup.scss */ +.cloud_popup .content .btn_ok, .cloud_popup .content .btn_cancel { width: 80px; text-align: center; float: right; diff --git a/js/io/ui/cloudpopup.reel/css/cloudpopup.scss b/js/io/ui/cloudpopup.reel/css/cloudpopup.scss index ea54b1d8..ec03eb01 100755 --- a/js/io/ui/cloudpopup.reel/css/cloudpopup.scss +++ b/js/io/ui/cloudpopup.reel/css/cloudpopup.scss @@ -38,17 +38,18 @@ $grey_light: #494949; .cloud_popup .content p { - text-shadow: 1px 1px 1px #333; + text-shadow: 1px 1px 1px #222; margin: 0px 0px 12px 0px; text-align: justify; color: #EEE; } -.cloud_popup .content .test +.cloud_popup .content .btn_test { float: right; clear: right; margin: 0px 0px 0px 8px; + width: 60px; } .cloud_popup .content label @@ -63,18 +64,21 @@ $grey_light: #494949; .cloud_popup .content input { display: block; + float: left; + color: #FFF; border: 0px; padding: 4px; margin: 0px; - background: $grey_dark -webkit-gradient(linear, left top, left bottom, color-stop(45%, lighten($grey_dark, 10%)), color-stop(100%, $grey_dark)); - border: 1px lighten($grey_dark, 20%) solid; - color: #FFF; - float: left; - width: 202px; + width: 176px; border-radius: 4px; + text-shadow: 1px 1px 1px #222; + border: 1px lighten($grey_dark, 20%) solid; + background: $grey_dark -webkit-gradient(linear, left top, left bottom, color-stop(45%, lighten($grey_dark, 10%)), color-stop(100%, $grey_dark)); } -.cloud_popup .content input:focus { +.cloud_popup .content input:focus +{ + text-shadow: none; background: #FFF; border: 1px $grey_dark solid; color: $grey_dark; @@ -105,7 +109,6 @@ $grey_light: #494949; .cloud_popup .content .status { - color: red; float: left; clear: right; margin: 5px 0px 0px 6px; @@ -113,7 +116,7 @@ $grey_light: #494949; width: 240px; } -.cloud_popup .content .handle_ok, .cloud_popup .content .handle_cancel +.cloud_popup .content .btn_ok, .cloud_popup .content .btn_cancel { width: 80px; text-align: center; -- 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/ui/cloudpopup.reel/cloudpopup.js | 2 +- js/io/ui/cloudpopup.reel/css/cloudpopup.css | 2 +- js/io/ui/cloudpopup.reel/css/cloudpopup.scss | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) (limited to 'js/io/ui') diff --git a/js/io/ui/cloudpopup.reel/cloudpopup.js b/js/io/ui/cloudpopup.reel/cloudpopup.js index f81dc93c..d256f226 100755 --- a/js/io/ui/cloudpopup.reel/cloudpopup.js +++ b/js/io/ui/cloudpopup.reel/cloudpopup.js @@ -75,7 +75,7 @@ exports.CloudPopup = Montage.create(Component, { // if (this.application.ninja.coreIoApi.cloudAvailable()) { this.components.status.style.color = '#77FF00'; - this.components.status.innerHTML = 'Connected'; + this.components.status.innerHTML = 'Connected to '+this.application.ninja.coreIoApi.cloudData.name; } else { this.components.status.style.color = '#FF3A3A'; this.components.status.innerHTML = 'Disconnected'; diff --git a/js/io/ui/cloudpopup.reel/css/cloudpopup.css b/js/io/ui/cloudpopup.reel/css/cloudpopup.css index 81e0742f..b42263b9 100644 --- a/js/io/ui/cloudpopup.reel/css/cloudpopup.css +++ b/js/io/ui/cloudpopup.reel/css/cloudpopup.css @@ -116,5 +116,5 @@ width: 80px; text-align: center; float: right; - margin: 4px 0px 0px 8px; + margin: 8px 0px 0px 8px; } diff --git a/js/io/ui/cloudpopup.reel/css/cloudpopup.scss b/js/io/ui/cloudpopup.reel/css/cloudpopup.scss index ec03eb01..1ae5579b 100755 --- a/js/io/ui/cloudpopup.reel/css/cloudpopup.scss +++ b/js/io/ui/cloudpopup.reel/css/cloudpopup.scss @@ -121,5 +121,5 @@ $grey_light: #494949; width: 80px; text-align: center; float: right; - margin: 4px 0px 0px 8px; + margin: 8px 0px 0px 8px; } \ No newline at end of file -- cgit v1.2.3 From e824b4901817429231cd9ab6aa068cc0a0849e3a Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Wed, 1 Feb 2012 10:16:16 -0800 Subject: Applying global button styles to cloud popup --- js/io/ui/cloudpopup.reel/cloudpopup.html | 6 +++--- js/io/ui/cloudpopup.reel/cloudpopup.js | 6 +++--- js/io/ui/cloudpopup.reel/css/cloudpopup.css | 29 ++++------------------------ js/io/ui/cloudpopup.reel/css/cloudpopup.scss | 24 +---------------------- 4 files changed, 11 insertions(+), 54 deletions(-) (limited to 'js/io/ui') diff --git a/js/io/ui/cloudpopup.reel/cloudpopup.html b/js/io/ui/cloudpopup.reel/cloudpopup.html index 5d7de347..fa4533d7 100755 --- a/js/io/ui/cloudpopup.reel/cloudpopup.html +++ b/js/io/ui/cloudpopup.reel/cloudpopup.html @@ -38,13 +38,13 @@ - +
 
- + - + diff --git a/js/io/ui/cloudpopup.reel/cloudpopup.js b/js/io/ui/cloudpopup.reel/cloudpopup.js index d256f226..e8558179 100755 --- a/js/io/ui/cloudpopup.reel/cloudpopup.js +++ b/js/io/ui/cloudpopup.reel/cloudpopup.js @@ -28,9 +28,9 @@ exports.CloudPopup = Montage.create(Component, { enumerable: false, value: function () { // - this.components.test_btn = this.element.getElementsByClassName('btn_test')[0]; - this.components.ok_btn = this.element.getElementsByClassName('btn_ok')[0]; - this.components.cancel_btn = this.element.getElementsByClassName('btn_cancel')[0]; + this.components.test_btn = this.element.getElementsByClassName('btn_test nj-skinned')[0]; + this.components.ok_btn = this.element.getElementsByClassName('btn_ok nj-skinned')[0]; + this.components.cancel_btn = this.element.getElementsByClassName('btn_cancel nj-skinned')[0]; this.components.status = this.element.getElementsByClassName('status')[0]; this.components.url = this.element.getElementsByClassName('cloud_url')[0]; } diff --git a/js/io/ui/cloudpopup.reel/css/cloudpopup.css b/js/io/ui/cloudpopup.reel/css/cloudpopup.css index b42263b9..eac18083 100644 --- a/js/io/ui/cloudpopup.reel/css/cloudpopup.css +++ b/js/io/ui/cloudpopup.reel/css/cloudpopup.css @@ -68,11 +68,12 @@ width: 176px; border-radius: 4px; text-shadow: 1px 1px 1px #222; + font-family: 'Droid Sans', sans-serif; border: 1px #5c5c5c solid; background: #292929 -webkit-gradient(linear, left top, left bottom, color-stop(45%, #434343), color-stop(100%, #292929)); } -/* line 80, cloudpopup.scss */ +/* line 81, cloudpopup.scss */ .cloud_popup .content input:focus { text-shadow: none; background: #FFF; @@ -80,29 +81,7 @@ color: #292929; } -/* line 88, cloudpopup.scss */ -.cloud_popup .content button { - display: block; - border: 0px; - margin: 0px; - padding: 4px; - border: 1px #333 solid; - background: #292929 -webkit-gradient(linear, left top, left bottom, color-stop(0%, #494949), color-stop(100%, #292929)); - border-radius: 4px; - color: #FFF; - text-transform: uppercase; - cursor: pointer; - text-shadow: 1px 1px 1px #000; -} - -/* line 103, cloudpopup.scss */ -.cloud_popup .content button:hover { - border: 1px #222 solid; - background: #292929 -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c5c5c), color-stop(100%, #161616)); - color: #EEE; -} - -/* line 111, cloudpopup.scss */ +/* line 89, cloudpopup.scss */ .cloud_popup .content .status { float: left; clear: right; @@ -111,7 +90,7 @@ width: 240px; } -/* line 120, cloudpopup.scss */ +/* line 98, cloudpopup.scss */ .cloud_popup .content .btn_ok, .cloud_popup .content .btn_cancel { width: 80px; text-align: center; diff --git a/js/io/ui/cloudpopup.reel/css/cloudpopup.scss b/js/io/ui/cloudpopup.reel/css/cloudpopup.scss index 1ae5579b..047e2dd1 100755 --- a/js/io/ui/cloudpopup.reel/css/cloudpopup.scss +++ b/js/io/ui/cloudpopup.reel/css/cloudpopup.scss @@ -72,6 +72,7 @@ $grey_light: #494949; width: 176px; border-radius: 4px; text-shadow: 1px 1px 1px #222; + font-family: 'Droid Sans', sans-serif; border: 1px lighten($grey_dark, 20%) solid; background: $grey_dark -webkit-gradient(linear, left top, left bottom, color-stop(45%, lighten($grey_dark, 10%)), color-stop(100%, $grey_dark)); } @@ -84,29 +85,6 @@ $grey_light: #494949; color: $grey_dark; } -.cloud_popup .content button -{ - display: block; - border: 0px; - margin: 0px; - padding: 4px; - border: 1px #333 solid; - background: $grey_dark -webkit-gradient(linear, left top, left bottom, color-stop(0%, $grey_light), color-stop(100%, $grey_dark)); - border-radius: 4px; - color: #FFF; - text-transform: uppercase; - cursor: pointer; - text-shadow: 1px 1px 1px #000; -} - -.cloud_popup .content button:hover -{ - - border: 1px #222 solid; - background: $grey_dark -webkit-gradient(linear, left top, left bottom, color-stop(0%, lighten($grey_dark, 20%)), color-stop(100%, darken($grey_light, 20%))); - color: #EEE; -} - .cloud_popup .content .status { float: left; -- cgit v1.2.3 From fb5d5994b8d729ce6233549844817d2b7043d8a5 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Wed, 1 Feb 2012 12:05:08 -0800 Subject: Adding cloud popup copy --- js/io/ui/cloudpopup.reel/cloudpopup.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/io/ui') diff --git a/js/io/ui/cloudpopup.reel/cloudpopup.html b/js/io/ui/cloudpopup.reel/cloudpopup.html index fa4533d7..eb5e8178 100755 --- a/js/io/ui/cloudpopup.reel/cloudpopup.html +++ b/js/io/ui/cloudpopup.reel/cloudpopup.html @@ -34,7 +34,7 @@

Cloud Service Dialog

-

Duis aliquet egestas purus in blandit. Curabitur vulputate, ligula lacinia scelerisque tempor, lacus lacus ornare ante, ac egestas.

+

Connection to the Ninja Cloud Server was not detected. Please verify that the server is running and the URL below is correct.

-- cgit v1.2.3 From 54ccd309722797e79ca35fe115b0372e86850551 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Wed, 1 Feb 2012 13:31:35 -0800 Subject: Removing filesytem class, no longer used Also cleaning up cloud popup IU. --- js/io/ui/cloudpopup.reel/cloudpopup.html | 2 +- js/io/ui/cloudpopup.reel/css/cloudpopup.css | 13 ++++++------- js/io/ui/cloudpopup.reel/css/cloudpopup.scss | 1 - 3 files changed, 7 insertions(+), 9 deletions(-) (limited to 'js/io/ui') diff --git a/js/io/ui/cloudpopup.reel/cloudpopup.html b/js/io/ui/cloudpopup.reel/cloudpopup.html index eb5e8178..1ab0892d 100755 --- a/js/io/ui/cloudpopup.reel/cloudpopup.html +++ b/js/io/ui/cloudpopup.reel/cloudpopup.html @@ -34,7 +34,7 @@

Cloud Service Dialog

-

Connection to the Ninja Cloud Server was not detected. Please verify that the server is running and the URL below is correct.

+

Connection to the Cloud Server was not detected. Please verify
that the server is running and the URL below is correct.

diff --git a/js/io/ui/cloudpopup.reel/css/cloudpopup.css b/js/io/ui/cloudpopup.reel/css/cloudpopup.css index eac18083..6d804e50 100644 --- a/js/io/ui/cloudpopup.reel/css/cloudpopup.css +++ b/js/io/ui/cloudpopup.reel/css/cloudpopup.css @@ -36,11 +36,10 @@ .cloud_popup .content p { text-shadow: 1px 1px 1px #222; margin: 0px 0px 12px 0px; - text-align: justify; color: #EEE; } -/* line 48, cloudpopup.scss */ +/* line 47, cloudpopup.scss */ .cloud_popup .content .btn_test { float: right; clear: right; @@ -48,7 +47,7 @@ width: 60px; } -/* line 56, cloudpopup.scss */ +/* line 55, cloudpopup.scss */ .cloud_popup .content label { float: left; margin: 5px 8px 0px 0px; @@ -57,7 +56,7 @@ text-align: right; } -/* line 65, cloudpopup.scss */ +/* line 64, cloudpopup.scss */ .cloud_popup .content input { display: block; float: left; @@ -73,7 +72,7 @@ background: #292929 -webkit-gradient(linear, left top, left bottom, color-stop(45%, #434343), color-stop(100%, #292929)); } -/* line 81, cloudpopup.scss */ +/* line 80, cloudpopup.scss */ .cloud_popup .content input:focus { text-shadow: none; background: #FFF; @@ -81,7 +80,7 @@ color: #292929; } -/* line 89, cloudpopup.scss */ +/* line 88, cloudpopup.scss */ .cloud_popup .content .status { float: left; clear: right; @@ -90,7 +89,7 @@ width: 240px; } -/* line 98, cloudpopup.scss */ +/* line 97, cloudpopup.scss */ .cloud_popup .content .btn_ok, .cloud_popup .content .btn_cancel { width: 80px; text-align: center; diff --git a/js/io/ui/cloudpopup.reel/css/cloudpopup.scss b/js/io/ui/cloudpopup.reel/css/cloudpopup.scss index 047e2dd1..5137beff 100755 --- a/js/io/ui/cloudpopup.reel/css/cloudpopup.scss +++ b/js/io/ui/cloudpopup.reel/css/cloudpopup.scss @@ -40,7 +40,6 @@ $grey_light: #494949; { text-shadow: 1px 1px 1px #222; margin: 0px 0px 12px 0px; - text-align: justify; color: #EEE; } -- cgit v1.2.3 From b354ea65f7c53ce05aff6a204853e666f084950f Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Wed, 1 Feb 2012 13:56:49 -0800 Subject: Adding cancel functionality to cloud popup Added the functionality to the cloud pupup cancel button to set the rootURL to null if selected, ok button will allow the value to remain as last input. Test button tests the URL, and therefore set it, but does not handling closing the dialog. --- js/io/ui/cloudpopup.reel/cloudpopup.js | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) (limited to 'js/io/ui') diff --git a/js/io/ui/cloudpopup.reel/cloudpopup.js b/js/io/ui/cloudpopup.reel/cloudpopup.js index e8558179..7f494dcf 100755 --- a/js/io/ui/cloudpopup.reel/cloudpopup.js +++ b/js/io/ui/cloudpopup.reel/cloudpopup.js @@ -51,6 +51,9 @@ exports.CloudPopup = Montage.create(Component, { value: function() { // this.testConnection(); + if (this.application.ninja.coreIoApi.cloudAvailable()) { + this.closeDialog(); + } } }, //////////////////////////////////////////////////////////////////// @@ -62,7 +65,7 @@ exports.CloudPopup = Montage.create(Component, { this.components.test_btn.addEventListener('click', this.testConnection.bind(this), false); // this.components.ok_btn.addEventListener('click', this.closeDialog.bind(this), false); - this.components.cancel_btn.addEventListener('click', this.closeDialog.bind(this), false); + this.components.cancel_btn.addEventListener('click', this.cancelDialog.bind(this), false); } }, //////////////////////////////////////////////////////////////////// @@ -90,6 +93,16 @@ exports.CloudPopup = Montage.create(Component, { // this.application.ninja.coreIoApi.hideCloudDialog(); } + }, + //////////////////////////////////////////////////////////////////// + // + cancelDialog: { + enumerable: false, + value: function() { + // + this.application.ninja.coreIoApi.rootUrl = null; + this.application.ninja.coreIoApi.hideCloudDialog(); + } } //////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////// -- cgit v1.2.3 From 0e595c4e11ce9b44eff157de8616ed15fcd5d6fc Mon Sep 17 00:00:00 2001 From: Ananya Sen Date: Thu, 2 Feb 2012 12:37:29 -0800 Subject: refactoring some file names and locations, change made to maintain only one codemirror div. Signed-off-by: Ananya Sen --- .../new-file-location.reel/new-file-location.css | 59 ++++ .../new-file-location.reel/new-file-location.html | 90 +++++ .../new-file-location.reel/new-file-location.js | 56 +++ .../new-file-options-navigator.css | 156 +++++++++ .../new-file-options-navigator.html | 92 +++++ .../new-file-options-navigator.js | 378 +++++++++++++++++++++ .../new-file-workflow-controller.js | 116 +++++++ .../ui/new-file-dialog/new-file-workflow-model.js | 146 ++++++++ js/io/ui/save-as-dialog.reel/save-as-dialog.css | 100 ++++++ js/io/ui/save-as-dialog.reel/save-as-dialog.html | 86 +++++ js/io/ui/save-as-dialog.reel/save-as-dialog.js | 196 +++++++++++ 11 files changed, 1475 insertions(+) create mode 100755 js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css create mode 100755 js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html create mode 100755 js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.js create mode 100755 js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css create mode 100755 js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html create mode 100644 js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js create mode 100755 js/io/ui/new-file-dialog/new-file-workflow-controller.js create mode 100755 js/io/ui/new-file-dialog/new-file-workflow-model.js create mode 100644 js/io/ui/save-as-dialog.reel/save-as-dialog.css create mode 100644 js/io/ui/save-as-dialog.reel/save-as-dialog.html create mode 100644 js/io/ui/save-as-dialog.reel/save-as-dialog.js (limited to 'js/io/ui') diff --git a/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css new file mode 100755 index 00000000..7f11c225 --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.css @@ -0,0 +1,59 @@ +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +.newfileLocation .newFileName{ + width:70%; + margin-left:5px; +} + +.newfileLocation .newFileDirectory{ + width:70%; + margin-left:5px; +} + +.newfileLocation .templateSelection{ + float:left; + width:20%; + height:90%; + padding-right: 10px; +} + +.newfileLocation .templateSelection .template{ + width:80%; + height:60%; + background-color: #e1e1e1; + border:1px solid #000000; + box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8); +} + +.newfileLocation .locationSelection{ + float:left; + width:75%; +} + +.newfileLocation .locationSelection div{ + padding-bottom: 5px; +} + +.newfileLocation .locationSelection input{ + margin-left: 5px; + white-space: nowrap; +} + +.newfileLocation .templatePx{ + padding-left: 5px; + white-space: nowrap; +} + +.newfileLocation .nameText{ + margin-right:31px; +} + +.newfileLocation .hottextunit{ + float: none; + display: inline; +} + diff --git a/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html new file mode 100755 index 00000000..d7fbc235 --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.html @@ -0,0 +1,90 @@ + + + + + + + + + +
+
+
+
+
+
NAME:
+
+ DIRECTORY: +
+
+
+
WIDTH:
+
HEIGHT:
+
+
+ + \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.js b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.js new file mode 100755 index 00000000..7da13dfc --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-location.reel/new-file-location.js @@ -0,0 +1,56 @@ +/* +This file contains proprietary software owned by Motorola Mobility, Inc.
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +var Montage = require("montage/core/core").Montage; +var Component = require("montage/ui/component").Component; +var newFileWorkflowControllerModule = require("js/io/ui/new-file-dialog/new-file-workflow-controller"); + +var NewFileLocation = exports.NewFileLocation = Montage.create(Component, { + + templateHeight:{ + enumerable: true, + value:"25 px" + }, + + templateWidth:{ + enumerable: true, + value:"25 px" + }, + + willDraw: { + enumerable: false, + value: function() {} + }, + + draw: { + enumerable: false, + value: function() {} + }, + + didDraw: { + enumerable: false, + value: function() { + var that=this; + + this.fileInputField.selectDirectory = true; + + this.newFileName.addEventListener("blur", function(evt){that.handleNewFileNameOnblur(evt);}, false); + } + + }, + + handleNewFileNameOnblur:{ + value:function(evt){ + if(this.newFileName.value !== ""){ + var newFileNameSetEvent = document.createEvent("Events"); + newFileNameSetEvent.initEvent("newFileNameSet", false, false); + newFileNameSetEvent.newFileName = this.newFileName.value; + this.eventManager.dispatchEvent(newFileNameSetEvent); + } + } + } + +}); \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css new file mode 100755 index 00000000..7ef6d2ce --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.css @@ -0,0 +1,156 @@ +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +.newfile{ + font-size:12px; + width:650px; + height:350px; + padding-left: 15px; + padding-bottom:25px; + background-color:#313131; + color:#ffffff; +} + +.newfile .title{ + font-size:14px; + height:15px; + padding:5px; + text-align: center; + font-weight: bold; + color: #C1C1C1; +} + +.newfile .container{ + border: 1px groove #000000; + overflow: auto; + background-color:#5f5f5f; +} + +.newfile .left-nav{ + float:left; + width:27%; + height:90%; + overflow-x:auto; + overflow-y:auto +} + +.newfile .right-nav{ + float:left; + width:70%; + height:90%; + overflow: hidden; +} + +.newfile .right-top{ + border: 1px groove #000000; + overflow: auto; + min-height:150px; + height:58%; + width:auto; + padding:5px; +} + +.newfile .right-bottom{ + border: 1px groove #000000; + overflow: auto; + height:42%; + padding: 15px; +} + +.newfile .projectTypeHeader{ + border-bottom:1px solid #000000; + padding:5px; + text-align: center; + font-weight: bold; +} + +.newfile .buttons{ + float:right; + margin-top: 7px; +} + +.newfile .errorMsg{ + float:left; + margin-top: 7px; +} +.newfile .errorMsg span{ + color: #BF3B3B; +} + +.newfile .disable{ + color:#5f5f5f; + cursor:auto; +} + +.newfile .hide{ + display: none; +} + +.newfile .treeArrow + .name{ + font-weight: bold; +} + +.newfile .atreeItem .name{ + padding: 3px; +} + +.newfile .atreeItem .selected{ + background-color: #3f3f3f; +} + +.newfile .icon .selected{ + background-color: #7f7f7f; +} + +.newfile .icon{ + height:90px; +} + +.newfile .icon .iconLabel{ + margin-top:4px; + max-width:90%; + white-space: normal; + padding-bottom:4px; + overflow: visible; +} + +.newfile .icon .iconImg{ + margin-left:25px; +} + +.newfile .okButton{ + margin-right:25px; + -webkit-box-align: center; + text-align: center; + cursor: default; + padding: 0px 6px 0px; + border:2px solid #d1d1d1; + background-color: #e1e1e1; + box-sizing: border-box; + border-radius:10px; + background-image: -webkit-linear-gradient(bottom, #e1e1e1 13%, #d1d1d1 58%, #e1e1e1 40%); + cursor:pointer; +} + +.newfile .cancelButton{ + -webkit-box-align: center; + text-align: center; + cursor: default; + padding: 0px 6px 0px; + border:2px solid #d1d1d1; + background-color: #e1e1e1; + box-sizing: border-box; + border-radius:10px; + background-image: -webkit-linear-gradient(bottom, #e1e1e1 13%, #d1d1d1 58%, #e1e1e1 40%); + cursor:pointer; +} + +.newfile input[type="button"]:disabled{ + background-color: #a1a1a1; + border:2px solid #a1a1a1; + background-image:none; + cursor:auto; +} \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html new file mode 100755 index 00000000..eb4a8045 --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.html @@ -0,0 +1,92 @@ + + + + + + + + + +
+
Create New File
+
+
File Type
+
+
+
+
+
+
+
+
templateIcon
+
selections
+
+
+
+
+ + +
+
+ + \ No newline at end of file diff --git a/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js new file mode 100644 index 00000000..cee8d4b7 --- /dev/null +++ b/js/io/ui/new-file-dialog/new-file-options-navigator.reel/new-file-options-navigator.js @@ -0,0 +1,378 @@ +/* +This file contains proprietary software owned by Motorola Mobility, Inc.
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +var Montage = require("montage/core/core").Montage, + Component = require("montage/ui/component").Component, + iconsListModule = require("js/components/ui/icon-list-basic/iconsList.reel"), + treeModule = require("js/components/ui/tree-basic/tree.reel"), + newFileLocationSelectionModule = require("js/io/ui/new-file-dialog/new-file-workflow-controller"), + nj= require("js/lib/NJUtils.js").NJUtils; + +var NewFileOptionsNavigator = exports.NewFileOptionsNavigator = Montage.create(Component, { + + newFileModel: { + writable: true, + enumerable:false, + value:null + }, + selectedProjectType:{ + writable: true, + enumerable:false, + value:null + }, + selectedTemplate:{ + writable: true, + enumerable:false, + value:null + }, + newFileName:{ + writable:true, + enumerable:false, + value:"" + }, + newFileDirectory:{ + writable:true, + enumerable:false, + value:"" + }, + templateWidth:{ + writable:true, + enumerable:false, + value:"0 px" + }, + templateHeight:{ + writable:true, + enumerable:false, + value:"0 px" + }, + willDraw: { + enumerable: false, + value: function() {} + }, + draw: { + enumerable: false, + value: function() {} + }, + didDraw: { + enumerable: false, + value: function() { + var that = this; + + this.templateList = null; + + //draw left nav project type tree + var tree = treeModule.Tree.create(); + tree.showIcons = false; + tree.expandTreeAfterDraw = true; + tree.directoryBold = true; + tree.highlightedUri = this.newFileModel.defaultProjectType; + tree.treeViewDataObject = this.newFileModel.prepareContents("categories"); + tree.element = this.projectTypeTree; + tree.needsDraw = true; + + //highlight defaultProjectType + + this.addIdentifiers(); + + this.element.addEventListener("drawTree", function(evt){that.handleNewFileNavDrawTree(evt);}, false); + this.element.addEventListener("selectedItem", function(evt){that.handleNewFileNavSelectedItem(evt);}, false);//for single selection only + this.eventManager.addEventListener("newFileDirectorySet", function(evt){that.handleNewFileDirectorySet(evt);}, false); + this.eventManager.addEventListener("newFileNameSet", function(evt){that.handleNewFileNameSet(evt);}, false); + + if(!!this.newFileModel.defaultProjectType){ + var templates = this.newFileModel.prepareContents(this.newFileModel.defaultProjectType); + this.templateList = iconsListModule.IconsList.create(); + this.templateList.iconsViewDataObject = templates; + this.templateList.element = this.templateIcons; + this.templateList.needsDraw = true; + + + this.selectedProjectType = {"uri":this.newFileModel.defaultProjectType, "element":null}; + } + } + + }, + + /** + * Event Listners + */ + + addIdentifiers:{ + value: function(){ + this.element.identifier = "newFileNav"; + } + }, + + handleNewFileNavDrawTree:{ + value: function(evt){ + //toggle open or close for directory + if((evt.uriType === "directory") && (!!evt.subTreeContainer)){ + var tree = treeModule.Tree.create(); + tree.showIcons = false; + tree.highlightedUri = this.newFileModel.defaultProjectType; + tree.treeViewDataObject = this.newFileModel.prepareContents(evt.uri); + tree.element = evt.subTreeContainer; + tree.needsDraw = true; + } + } + }, + + handleNewFileNavSelectedItem:{ + value: function(evt){ + var selectionType = this.newFileModel.projectTypeData[evt.uri].type; + if(evt.target.classList.contains("atreeItemContent") && (selectionType === "file")){//populate templates for project type selection + this.highlightSelection(evt.target, "projectType", evt.uri); + + //clear current template selection + if((!!this.selectedTemplate) && (this.selectedTemplate.element.classList.contains("selected"))){ + this.selectedTemplate.element.classList.remove("selected"); + } + + //disable ok + if(!this.okButton.hasAttribute("disabled")){ + this.okButton.setAttribute("disabled", "true"); + } + + //save project type selection + this.selectedProjectType = {"uri":evt.uri, "element":evt.target}; + + //render templates + var templates = this.newFileModel.prepareContents(evt.uri); + if(this.templatesContainer.querySelectorAll(".list").length > 0){ + this.templateList.iconsViewDataObject = templates; + }else{ + this.templateList = iconsListModule.IconsList.create(); + this.templateList.iconsViewDataObject = templates; + this.templateList.element = this.templateIcons; + this.templateList.needsDraw = true; + } + + + } + + if(evt.target.classList.contains("icon")){ + this.highlightSelection(evt.target, "template", evt.uri); + + //save template selection + this.selectedTemplate = {"uri":evt.uri, "element":evt.target}; + + this.enableOk(); + + } + } + }, + + handleCancelButtonAction :{ + value:function(evt){ + //clean up memory + this.cleanup(); + + if(this.popup){ + this.popup.hide(); + } + + } + }, + + handleOkButtonAction:{ + value: function(evt){ + var selectedProjectTypeID = this.selectedProjectType.uri, + templateID = this.selectedTemplate.uri, + projectName = this.newFileLocation.newFileName.value, + projectDirectory = this.newFileLocation.fileInputField.newFileDirectory.value, + projectWidth = this.newFileLocation.templateWidth, + projectHeight = this.newFileLocation.templateHeight, + + + selectionlog= "selectedProjectTypeID="+selectedProjectTypeID +"\n"+ + "templateID="+templateID+ "\n"+ + "projectName="+projectName+"\n"+ + "projectDirectory="+projectDirectory+"\n"+ + "projectWidth="+projectWidth+"\n"+ + "projectHeight="+projectHeight; + + if(!!this.selectedProjectType && !!this.selectedTemplate + && this.isValidFileName(projectName) && this.isValidUri(projectDirectory) + && !this.checkFileExists(projectName, projectDirectory, this.selectedProjectType) + ){ + this.error.innerHTML=""; + console.log("$$$ new file selections: \n" + selectionlog); + if(!!this.newFileModel.callback && !!this.newFileModel.callbackScope){//inform document-controller if save successful + this.newFileModel.callback.call(this.newFileModel.callbackScope, {"selectedProjectTypeID":selectedProjectTypeID, + "templateID":templateID, + "projectName": projectName, + "projectDirectory":projectDirectory, + "projectWidth":projectWidth, + "projectHeight":projectHeight});//document-controller api + }else{ + //send selection event + var newFileSelectionEvent = document.createEvent("Events"); + newFileSelectionEvent.initEvent("createNewFile", false, false); + newFileSelectionEvent.newFileOptions = {"selectedProjectTypeID":selectedProjectTypeID, + "templateID":templateID, + "projectName": projectName, + "projectDirectory":projectDirectory, + "projectWidth":projectWidth, + "projectHeight":projectHeight}; + this.eventManager.dispatchEvent(newFileSelectionEvent); + } + //store last selected project type + var dataStore = window.sessionStorage; + try { + dataStore.setItem('lastSelectedProjectType',escape(""+selectedProjectTypeID)); + } + catch(e){ + if(e.code == 22){ + dataStore.clear(); + } + } + + this.cleanup();//clear up any unnecessary memory + + if(this.popup){ + this.popup.hide(); + } + }else{ + if(this.error.innerHTML !== ""){ + this.showError("! Project Template, Name and Directory should be valid."); + } + //disable ok + if(!this.okButton.hasAttribute("disabled")){ + this.okButton.setAttribute("disabled", "true"); + } + } + } + }, + + handleNewFileDirectorySet:{ + value:function(evt){ + if(!!evt._event.newFileDirectory){ + this.newFileDirectory = evt._event.newFileDirectory; + if(this.isValidUri(this.newFileDirectory)){ + this.enableOk(); + } + } + } + }, + + handleNewFileNameSet:{ + value:function(evt){ + if(!!evt._event.newFileName){ + this.newFileName = evt._event.newFileName; + if(this.isValidFileName(this.newFileName)){ + this.enableOk(); + } + } + } + }, + + highlightSelection:{ + value: function(el, selectionType, uri){ + var elem; + //clear previous selection + if(selectionType === "projectType"){ + if((!!this.selectedProjectType) && (uri !== this.selectedProjectType.uri)){ + if(!!this.selectedProjectType.element){ + this.selectedProjectType.element.classList.remove("selected"); + }else{ + //find the selected element + elem = document.querySelector(".projectTypeTree").querySelector(".selected"); + if(!!elem){ + elem.classList.remove("selected"); + } + } + el.classList.add("selected"); + }else if(this.selectedProjectType === null){ + el.classList.add("selected"); + } + }else if(selectionType === "template"){ + if((!!this.selectedTemplate) && (uri !== this.selectedTemplate.element)){ + if(!!this.selectedTemplate.element){this.selectedTemplate.element.classList.remove("selected");} + el.classList.add("selected"); + }else if(this.selectedTemplate === null){ + el.classList.add("selected"); + } + } + + } + }, + + enableOk:{ + value: function(){ + var status = false; + + if(!!this.selectedProjectType && !!this.selectedTemplate + && this.isValidFileName(this.newFileName) && this.isValidUri(this.newFileDirectory) + && !this.checkFileExists(this.newFileName, this.newFileDirectory, this.selectedProjectType) + ){ + status = true; + this.okButton.removeAttribute("disabled"); + this.error.innerHTML=""; + } + return status; + } + }, + + cleanup:{ + value:function(){ + var that = this; + + this.newFileName = ""; + this.newFileDirectory = ""; + this.selectedProjectType = null; + this.selectedTemplate = null; + + //remove event listeners + this.element.removeEventListener("drawTree", function(evt){that.handleNewFileNavDrawTree(evt);}, false); + this.element.removeEventListener("selectedItem", function(evt){that.handleNewFileNavSelectedItem(evt);}, false);//for single selection only + this.eventManager.removeEventListener("newFileDirectorySet", function(evt){that.handleNewFileDirectorySet(evt);}, fa