fixing some bugs

app/pods/components/bridge-finder/component.js

@@ -96,13 +96,13 @@ export default Em.Component.extend({
 
   // try to authenticate against the bridge here
   onBridgeIpChange: function () {
-    if(!this.get('trial')) {
+    if(!this.get('trial') && !this.get('isAuthenticating')) {
       this.setProperties({
         bridgePingIntervalHandle: setInterval(this.pingBridgeUser.bind(this), this.get('bridgeUsernamePingIntervalTime')),
         bridgeUserNamePingIntervalProgress: 0
       });
     }
-  }.observes('bridgeIp'),
+  }.observes('bridgeIp').on('init'),
 
   pingBridgeUser() {
     var bridgeIp = this.get('bridgeIp'), self = this, bridgeUserNamePingIntervalProgress = this.get('bridgeUserNamePingIntervalProgress'),

app/pods/components/hue-controls/component.js

@@ -105,6 +105,8 @@ export default Em.Component.extend({
   lightsTabSelected: Em.computed.equal('selectedTab', 0),
   musicTabSelected: Em.computed.equal('selectedTab', 1),
 
+  pauseLightUpdates: false,
+
   updateLightData(){
     var self = this, fail = function() {
       clearInterval(self.get('lightsDataIntervalHandle'));
@@ -114,13 +116,15 @@ export default Em.Component.extend({
       });
     };
 
-    Em.$.get(this.get('apiURL') + '/lights', function (result, status) {
+    if(!this.get('pauseLightUpdates')){
-      if (status === 'success' && Em.isNone(result[0])) {
+      Em.$.get(this.get('apiURL') + '/lights', function (result, status) {
-        self.set('lightsData', result);
+        if(!Em.isNone(result[0]) && !Em.isNone(result[0].error)){
-      } else {
+          fail();
-        fail();
+        } else if (status === 'success' && JSON.stringify(self.get('lightsData')) !== JSON.stringify(result)) {
-      }
+          self.set('lightsData', result);
-    }).fail(fail);
+        }
+      }).fail(fail);
+    }
   },
 
   ready: function() {

app/pods/components/hue-controls/template.hbs

@@ -33,5 +33,5 @@
   </div>
 
   {{lights-tab apiURL=apiURL lightsData=lightsData activeLights=activeLights trial=trial active=lightsTabSelected}}
-  {{music-tab apiURL=apiURL lightsData=lightsData activeLights=activeLights active=musicTabSelected}}
+  {{music-tab apiURL=apiURL lightsData=lightsData activeLights=activeLights active=musicTabSelected pauseLightUpdates=pauseLightUpdates}}
 {{/if}}

app/pods/components/music-tab/component.js

@@ -83,10 +83,10 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
     defaultControls(){
       var beatOptions = this.get('beatOptions');
 
-      this.changePlayerControl('threshold', beatOptions.threshold.defaultValue, true);
+      this.changePlayerControl('threshold', beatOptions.threshold.defaultValue, true, true);
-      this.changePlayerControl('decay', beatOptions.decay.defaultValue, true);
+      this.changePlayerControl('decay', beatOptions.decay.defaultValue, true, true);
-      this.changePlayerControl('frequency', beatOptions.frequency.defaultValue, true);
+      this.changePlayerControl('frequency', beatOptions.frequency.defaultValue, true, true);
-      this.changePlayerControl('transitionTime', beatOptions.transitionTime.defaultValue, true);
+      this.changePlayerControl('transitionTime', beatOptions.transitionTime.defaultValue, true, true);
     },
     playerAreaPlay(){
       if(Em.isEmpty(Em.$('#playerControls:hover')) && this.get('playQueuePointer') !== -1 ){
@@ -142,7 +142,7 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
         this.changePlayerControl('volumeMuted', false);
       }
     },
-    next() {
+    next(userTriggered) {
       var playQueuePointer = this.get('playQueuePointer'), playQueueLength = this.get('playQueue.length');
       var nextSong = (playQueuePointer + 1), repeat = this.get('repeat');
 
@@ -151,7 +151,7 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
       if(repeat === 2){
         this.send('goToSong', playQueuePointer, true);
       } else if(nextSong > playQueueLength-1){
-        if(repeat === 1){
+        if(repeat === 1 || userTriggered){
           nextSong = nextSong % playQueueLength;
         } else {
           this.send('play', true);
@@ -311,7 +311,7 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
     songBeatPreferences[title] = {threshold: this.get('threshold'), decay: this.get('decay'), frequency: this.get('frequency') };
 
     this.set('usingBeatPreferences', true);
-    this.get('storage').set('huegasm.songBeatPreferences', songBeatPreferences);
+    this.get('storage').set('huegasm.songBeatPreferences', songBeatPreferences, { compress: true });
   },
 
   loadSongBeatPreferences() {
@@ -503,7 +503,7 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
     this._super();
 
     var dancer = new Dancer(),
-      storage = new window.Locally.Store({compress: true}),
+      storage = new window.Locally.Store(),
       self = this,
       threshold = this.get('threshold'),
       decay = this.get('decay'),
@@ -554,7 +554,7 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
     }
 
     ['volume', 'shuffle', 'repeat', 'volumeMuted', 'threshold', 'decay', 'frequency', 'speakerViewed', 'transitionTime', 'randomTransition', 'playerBottomDisplayed', 'onBeatBriAndColor', 'audioMode', 'dimmerEnabled', 'songBeatPreferences'].forEach(function (item) {
-      if (storage.get('huegasm.' + item)) {
+      if (!Em.isNone(storage.get('huegasm.' + item))) {
         var itemVal = storage.get('huegasm.' + item);
 
         if(Em.isNone(self.actions[item+'Changed'])){

app/pods/components/music-tab/mixins/music-tab.js

@@ -126,6 +126,10 @@ export default Em.Mixin.create({
   oldBeatPrefCache: null,
   storage: null,
 
+  pauseLightUpdates: function(){
+    return this.get('playing');
+  }.property('playing'),
+
   speakerViewed: true,
   speakerLabel: function() {
     if(this.get('speakerViewed')){

app/pods/components/music-tab/template.hbs

@@ -13,7 +13,7 @@
                              data-title={{playingTooltipTxt}} {{action "play"}}>{{paper-icon icon=playingIcon class="playerControllIcon"}}</span><!--
                   -->{{#if playQueueMultiple}}<!--
                 --><span data-toggle="tooltip" data-placement="top" class="bootstrapTooltip"
-                         data-title="Next" {{action "next"}}>{{paper-icon icon="skip-next" action="" class="playerControllIcon"}}</span><!--
+                         data-title="Next" {{action "next" true}}>{{paper-icon icon="skip-next" action="" class="playerControllIcon"}}</span><!--
                   -->{{/if}}<!--
           --><span data-toggle="tooltip" data-placement="top" class="bootstrapTooltip" id="volumeMutedTooltip"
                    data-title={{volumeMutedTooltipTxt}} {{action "volumeMutedChanged"}}>{{paper-icon icon=volumeIcon class=volumeMutedClass}}</span><!--

app/styles/app.scss

@@ -201,6 +201,7 @@ md-list-item .md-no-style {
   height: 275px;
   right: 6px;
   top: -9px;
+  z-index: 3;
 }
 
 #picker {
@@ -252,11 +253,7 @@ md-slider.md-default-theme .md-thumb:after {
   }
 }
 
-.hueLight {
+.hueLight {}
-  margin-right: 10px;
-  border-radius: 20px;
-  background-color: white;
-}
 
 .lightInactive {
   cursor: pointer;
@@ -281,12 +278,12 @@ md-slider.md-default-theme .md-thumb:after {
   }
   .tooltip.top {
     margin-top: 2px;
-    margin-left: -2px;
+    margin-left: 0;
   }
 }
 
 .lightUnreachable {
-  background-color: rgba(255, 0, 0, 0.7);
+  display: none;
 }
 
 .lightActive {
@@ -438,13 +435,6 @@ md-switch.md-default-theme.md-checked .md-thumb {
   }
 }
 
-.pull-right.bootstrapTooltip {
-  .playerControllIcon {
-    margin-right: 0;
-    margin-left: 5px;
-  }
-}
-
 #playerTimeControls {
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-size: 14px;
@@ -745,11 +735,11 @@ md-switch.md-default-theme.md-checked .md-thumb {
 #beatHistory {
   border: 1px solid #C5C5C5;
   color: black;
-  height: 90%;
+  height: 85%;
   background-color: white;
   border-radius: 10px;
   width: 285px;
-  margin: 10px auto 20px auto;
+  margin: 40px auto 0 auto;
   overflow: auto;
   padding: 10px;
   box-shadow: 5px 10px 15px 5px rgba(0, 0, 0, 0.1);
@@ -959,13 +949,13 @@ $vibrateblurouter: 2px;
 
 #saveBeatPreferencesStar {
   position: absolute;
-  top: 2px;
+  top: 5px;
-  left: 3px;
+  left: 5px;
   color: #F12B24 !important;
-  font-size: 30px;
+  font-size: 35px;
 }
 
-.md-warn {
+button.md-warn {
   background: $secondaryThemeColor;
 }