From 11ad26fdbdea7190e43c9d6e58fddbafccec0a0c Mon Sep 17 00:00:00 2001
From: Egor <hoboman313@gmail.com>
Date: Sat, 26 Nov 2016 21:14:40 -0800
Subject: [PATCH] minor improvements

---
 README.md                                     |  5 +--
 .../pods/components/hue-controls/component.js |  5 ++-
 .../pods/components/hue-controls/template.hbs |  6 +++-
 .../pods/components/music-tab/component.js    | 16 ----------
 mobile/app/styles/dimmer.scss                 | 31 ++++++++++--------
 mobile/app/styles/hue-controls.scss           |  7 ++++
 mobile/bower.json                             |  1 -
 mobile/config/environment.js                  |  2 +-
 mobile/ember-cli-build.js                     |  4 ---
 mobile/ember-cordova/cordova/config.xml       |  1 -
 .../pods/components/hue-controls/component.js |  4 ++-
 .../pods/components/hue-controls/template.hbs |  8 +++--
 web/app/styles/bootstrap.scss                 |  2 +-
 web/app/styles/dimmer.scss                    | 32 ++++++++++---------
 web/app/styles/hue-controls.scss              |  7 ++++
 web/bower.json                                |  1 -
 web/ember-cli-build.js                        |  3 --
 17 files changed, 71 insertions(+), 64 deletions(-)

diff --git a/README.md b/README.md
index 402b8b1..752863c 100644
--- a/README.md
+++ b/README.md
@@ -7,8 +7,9 @@ It lives at http://www.huegasm.com
 ## Current priorities
 - create a hybrid app with Cardova
 
-## Bugs
-- HackTimer not working? Slowness when switching to another browser tab, etc...
+## WTF
+Cordova disables the volume buttons for some reason. Monkey patching that shit ( must be a better way :( ).
+Comment out: webView.setButtonPlumbedToJs lines from its source code.
 
 ## POSSIBLE FUTURE FEATURES
 - decode the hue color better
diff --git a/mobile/app/pods/components/hue-controls/component.js b/mobile/app/pods/components/hue-controls/component.js
index d4c6dce..bd72712 100644
--- a/mobile/app/pods/components/hue-controls/component.js
+++ b/mobile/app/pods/components/hue-controls/component.js
@@ -83,6 +83,7 @@ export default Component.extend({
 
     if (!isNone(storage.get('huegasm.dimmerOn'))) {
       this.set('dimmerOn', storage.get('huegasm.dimmerOn'));
+      this.get('dimmerOnClass');
     }
 
     if (!isNone(this.get('storage').get('huegasm.selectedTab'))) {
@@ -106,7 +107,9 @@ export default Component.extend({
 
   updateLightData(){
     let fail = ()=>{
-      if(this.get('displayFailure')){
+      if(isNone(this.get('lightsData'))) {
+        this.send('clearBridge');
+      } else if(this.get('displayFailure')) {
         this.get('notify').warning({html: '<div class="alert alert-warning" role="alert">Error retrieving data from your lights. Yikes.</div>'});
         this.set('displayFailure', false);
 
diff --git a/mobile/app/pods/components/hue-controls/template.hbs b/mobile/app/pods/components/hue-controls/template.hbs
index e301a39..aab6af7 100644
--- a/mobile/app/pods/components/hue-controls/template.hbs
+++ b/mobile/app/pods/components/hue-controls/template.hbs
@@ -1,7 +1,9 @@
 {{#if ready}}
   <div id="navigation">
-    <div id="dimmer" class={{dimmerOnClass}} {{action "toggleDimmer"}}>
+    <div id="dimmer-container" {{action "toggleDimmer"}}>
+      <div id="dimmer" class={{dimmerOnClass}} >
         <div id="dimmer-switch"></div>
+      </div>
     </div>
 
     {{#each tabData as |tab|}}
@@ -35,6 +37,8 @@
   {{lights-tab apiURL=apiURL lightsData=lightsData activeLights=activeLights syncLight=syncLight trial=trial active=lightsTabSelected colorLoopOn=colorLoopOn dimmerOn=dimmerOn playing=playing pauseLightUpdates=pauseLightUpdates}}
 
   {{music-tab apiURL=apiURL lightsData=lightsData activeLights=activeLights active=musicTabSelected pauseLightUpdates=pauseLightUpdates dimmerOn=dimmerOn playing=playing storage=storage colorLoopOn=colorLoopOn action="startIntro"}}
+{{else}}
+  {{paper-progress-circular diameter=100}}
 {{/if}}
 
 {{ember-notify messageStyle='bootstrap' closeAfter=5000}}
\ No newline at end of file
diff --git a/mobile/app/pods/components/music-tab/component.js b/mobile/app/pods/components/music-tab/component.js
index a9ce776..db233d2 100644
--- a/mobile/app/pods/components/music-tab/component.js
+++ b/mobile/app/pods/components/music-tab/component.js
@@ -304,22 +304,6 @@ export default Component.extend(helperMixin, visualizerMixin, {
       client_id: this.get('SC_CLIENT_ID')
     });
 
-    document.addEventListener('volumedownbutton', () => {
-      let volume = this.get('volume') - 5;
-      volume = volume < 0 ? 0 : volume;
-      this.set('volume', volume);
-
-      window.system.setSystemVolume(volume/100);
-    }, false);
-
-    document.addEventListener('volumeupbutton', () => {
-      let volume = this.get('volume') + 5;
-      volume = volume > 100 ? 100 : volume;
-      this.set('volume', volume);
-
-      window.system.setSystemVolume(volume/100);
-    }, false);
-
     document.addEventListener('pause', () => {
       this.get('dancer').pause();
     }, false);
diff --git a/mobile/app/styles/dimmer.scss b/mobile/app/styles/dimmer.scss
index a24ede1..011267f 100644
--- a/mobile/app/styles/dimmer.scss
+++ b/mobile/app/styles/dimmer.scss
@@ -50,9 +50,6 @@ body.dimmerOn {
   .add-new-music:hover {
     background: darken($dimmerOnButtonColor, 5%);
   }
-  .popover-content {
-    color: $blackish !important;
-  }
   .md-bar {
     background-color: darken(white, 60%) !important;
   }
@@ -63,22 +60,28 @@ body.dimmerOn {
   opacity: 0.9 !important;
 }
 
+#dimmer-container {
+  float: left;
+  cursor: pointer;
+  padding: 5px 10px;
+  position: relative;
+  bottom: 5px;
+}
+
 #dimmer {
   background: url(images/lightswitch.png) !important;
   width: 14px;
   height: 34px;
-  display: inline-block;
-  float: left;
-  margin-left: 15px;
   &.dimmerOn #dimmer-switch {
     opacity: 0;
   }
-  #dimmer-switch {
-    background: url(images/lightswitch.png) -14px 0px;
-    width: 14px;
-    height: 34px;
-    transition: opacity 0.4s;
-    float: left;
-    opacity: 1;
-  }
+}
+
+#dimmer-switch {
+  background: url(images/lightswitch.png) -14px 0px;
+  width: 14px;
+  height: 34px;
+  transition: opacity 0.4s;
+  float: left;
+  opacity: 1;
 }
diff --git a/mobile/app/styles/hue-controls.scss b/mobile/app/styles/hue-controls.scss
index 2406df9..19e4d5f 100644
--- a/mobile/app/styles/hue-controls.scss
+++ b/mobile/app/styles/hue-controls.scss
@@ -12,6 +12,13 @@
 #hue-controls {
   max-width: 1200px;
   position: relative;
+  min-height: 100vh;
+  md-progress-circular {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
 }
 
 // preload images
diff --git a/mobile/bower.json b/mobile/bower.json
index 0b8c3a4..838c0f0 100644
--- a/mobile/bower.json
+++ b/mobile/bower.json
@@ -1,7 +1,6 @@
 {
   "name": "huegasm",
   "dependencies": {
-    "HackTimer": "https://github.com/turuslan/HackTimer.git#~1.1.0",
     "JavaScript-ID3-Reader": "https://github.com/aadsm/JavaScript-ID3-Reader.git",
     "bootstrap-sass": "^3.3.5",
     "ember": "beta",
diff --git a/mobile/config/environment.js b/mobile/config/environment.js
index d613704..c5aa305 100644
--- a/mobile/config/environment.js
+++ b/mobile/config/environment.js
@@ -5,7 +5,7 @@ module.exports = function(environment) {
     modulePrefix: 'huegasm_mobile',
     podModulePrefix: 'huegasm_mobile/pods',
     environment: environment,
-    rootURL: '/',
+    rootURL: '',
     locationType: 'hash',
     EmberENV: {
       FEATURES: {
diff --git a/mobile/ember-cli-build.js b/mobile/ember-cli-build.js
index 68f22c4..1523eaf 100644
--- a/mobile/ember-cli-build.js
+++ b/mobile/ember-cli-build.js
@@ -4,12 +4,8 @@ var EmberApp = require('ember-cli/lib/broccoli/ember-app');
 module.exports = function(defaults) {
   var app = new EmberApp(defaults);
 
-  app.import('bower_components/HackTimer/HackTimer.js');
-
   app.import('vendor/dancer.js');
 
-  app.import('bower_components/bootstrap-sass/assets/javascripts/bootstrap/tooltip.js');
-  app.import('bower_components/bootstrap-sass/assets/javascripts/bootstrap/popover.js');
   app.import('bower_components/intro.js/intro.js');
   app.import('bower_components/intro.js/introjs.css');
   app.import('bower_components/JavaScript-ID3-Reader/dist/id3-minimized.js');
diff --git a/mobile/ember-cordova/cordova/config.xml b/mobile/ember-cordova/cordova/config.xml
index 711c5c9..c93266a 100644
--- a/mobile/ember-cordova/cordova/config.xml
+++ b/mobile/ember-cordova/cordova/config.xml
@@ -89,5 +89,4 @@
     </platform>
     <engine name="android" spec="~5.2.2" />
     <preference name="ShowSplashScreenSpinner" value="false" />
-    <plugin name="com.jiliac.systemvolume" spec="https://github.com/hoboman313/phonegap-plugin-systemvolume" />
 </widget>
diff --git a/web/app/pods/components/hue-controls/component.js b/web/app/pods/components/hue-controls/component.js
index 8aff3a5..01fb48b 100644
--- a/web/app/pods/components/hue-controls/component.js
+++ b/web/app/pods/components/hue-controls/component.js
@@ -89,7 +89,9 @@ export default Component.extend({
 
   updateLightData(){
     let fail = ()=>{
-      if(this.get('displayFailure')){
+      if(isNone(this.get('lightsData'))) {
+        this.send('clearBridge');
+      } else if(this.get('displayFailure')){
         this.get('notify').warning({html: '<div class="alert alert-warning" role="alert">Error retrieving data from your lights. Yikes.</div>'});
         this.set('displayFailure', false);
 
diff --git a/web/app/pods/components/hue-controls/template.hbs b/web/app/pods/components/hue-controls/template.hbs
index 52e8ae3..44a66ed 100644
--- a/web/app/pods/components/hue-controls/template.hbs
+++ b/web/app/pods/components/hue-controls/template.hbs
@@ -1,7 +1,9 @@
 {{#if ready}}
   <div id="navigation">
-      <div id="dimmer" class={{dimmerOnClass}} {{action "toggleDimmer"}}>
-        <div id="dimmer-switch"></div>
+      <div id="dimmer-container" {{action "toggleDimmer"}}>
+        <div id="dimmer" class={{dimmerOnClass}} >
+          <div id="dimmer-switch"></div>
+        </div>
       </div>
 
     {{#each tabData as |tab|}}
@@ -36,6 +38,8 @@
 
     {{music-tab apiURL=apiURL lightsData=lightsData activeLights=activeLights active=musicTabSelected pauseLightUpdates=pauseLightUpdates dimmerOn=dimmerOn storage=storage colorLoopOn=colorLoopOn playing=playing action="startIntro"}}
   </div>
+{{else}}
+  {{paper-progress-circular diameter=100}}
 {{/if}}
 
 {{ember-notify messageStyle='bootstrap' closeAfter=5000}}
\ No newline at end of file
diff --git a/web/app/styles/bootstrap.scss b/web/app/styles/bootstrap.scss
index 6d071e4..627522b 100644
--- a/web/app/styles/bootstrap.scss
+++ b/web/app/styles/bootstrap.scss
@@ -48,7 +48,7 @@
 // Components w/ JavaScript
 //@import "bower_components/bootstrap-sass/assets/stylesheets/bootstrap/modals";
 @import "bower_components/bootstrap-sass/assets/stylesheets/bootstrap/tooltip";
-@import "bower_components/bootstrap-sass/assets/stylesheets/bootstrap/popovers";
+//@import "bower_components/bootstrap-sass/assets/stylesheets/bootstrap/popovers";
 //@import "bower_components/bootstrap-sass/assets/stylesheets/bootstrap/carousel";
 
 // Utility classes
diff --git a/web/app/styles/dimmer.scss b/web/app/styles/dimmer.scss
index 71356d6..0e172e1 100644
--- a/web/app/styles/dimmer.scss
+++ b/web/app/styles/dimmer.scss
@@ -56,9 +56,6 @@ body.dimmerOn {
   .add-new-music:hover {
     background: darken($dimmerOnButtonColor, 5%);
   }
-  .popover-content {
-    color: $blackish !important;
-  }
   .md-bar {
     background-color: darken(white, 60%) !important;
   }
@@ -78,23 +75,28 @@ body.dimmerOn {
   background-size: 40px 40px;
 }
 
+#dimmer-container {
+  float: left;
+  cursor: pointer;
+  padding: 5px 10px;
+  position: relative;
+  bottom: 5px;
+}
+
 #dimmer {
   background: url(images/lightswitch.png) !important;
   width: 14px;
   height: 34px;
-  display: inline-block;
-  float: left;
-  margin-left: 15px;
-  cursor: pointer;
   &.dimmerOn #dimmer-switch {
     opacity: 0;
   }
-  #dimmer-switch {
-    background: url(images/lightswitch.png) -14px 0px;
-    width: 14px;
-    height: 34px;
-    transition: opacity 0.4s;
-    float: left;
-    opacity: 1;
-  }
+}
+
+#dimmer-switch {
+  background: url(images/lightswitch.png) -14px 0px;
+  width: 14px;
+  height: 34px;
+  transition: opacity 0.4s;
+  float: left;
+  opacity: 1;
 }
diff --git a/web/app/styles/hue-controls.scss b/web/app/styles/hue-controls.scss
index 11e0d7c..f8c0024 100644
--- a/web/app/styles/hue-controls.scss
+++ b/web/app/styles/hue-controls.scss
@@ -24,6 +24,13 @@
   max-width: 1200px;
   position: relative;
   flex: 1;
+  min-height: 100vh;
+  md-progress-circular {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
 }
 
 // preload images
diff --git a/web/bower.json b/web/bower.json
index 297b45f..449599e 100644
--- a/web/bower.json
+++ b/web/bower.json
@@ -1,7 +1,6 @@
 {
   "name": "huegasm",
   "dependencies": {
-    "HackTimer": "https://github.com/turuslan/HackTimer.git#~1.1.0",
     "JavaScript-ID3-Reader": "https://github.com/aadsm/JavaScript-ID3-Reader.git",
     "bootstrap-sass": "^3.3.5",
     "ember": "beta",
diff --git a/web/ember-cli-build.js b/web/ember-cli-build.js
index df9f83b..1545640 100644
--- a/web/ember-cli-build.js
+++ b/web/ember-cli-build.js
@@ -4,12 +4,9 @@ var EmberApp = require('ember-cli/lib/broccoli/ember-app');
 module.exports = function(defaults) {
   var app = new EmberApp(defaults);
 
-  app.import('bower_components/HackTimer/HackTimer.js');
-
   app.import('vendor/dancer.js');
 
   app.import('bower_components/bootstrap-sass/assets/javascripts/bootstrap/tooltip.js');
-  app.import('bower_components/bootstrap-sass/assets/javascripts/bootstrap/popover.js');
   app.import('bower_components/intro.js/intro.js');
   app.import('bower_components/intro.js/introjs.css');
   app.import('bower_components/JavaScript-ID3-Reader/dist/id3-minimized.js');