new controls

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

@@ -233,6 +233,7 @@ export default Em.Component.extend(helperMixin, visualizerMixin, {
           dancer.play();
         }
 
+        this.onColorloopModeChange();
         this.toggleProperty('playing');
       }
     },
@@ -581,13 +582,17 @@ export default Em.Component.extend(helperMixin, visualizerMixin, {
     console.log(mag + ',' + ratioKick);
 
     var activeLights = this.get('activeLights'),
-      transitionTime = 100,
-      onBeatBriAndColor = this.get('onBeatBriAndColor'),
       lightsData = this.get('lightsData'),
       color = null,
       beatInterval = 1,
       stimulateLight = (light, brightness, hue) => {
-        var options = {'bri': brightness, 'transitiontime': transitionTime};
+        var options = {'bri': brightness};
+
+        if(this.get('blinkingTransitions')) {
+          options['transitiontime'] = 0;
+        } else {
+          options['transitiontime'] = 1;
+        }
 
         if(!Em.isNone(hue)) {
           options.hue = hue;
@@ -621,12 +626,12 @@ export default Em.Component.extend(helperMixin, visualizerMixin, {
       light = activeLights[lightBopIndex];
       this.set('lastLightBopIndex', lightBopIndex);
 
-      if(onBeatBriAndColor) {
+      if(!this.get('colorloopMode')) {
         color = Math.floor(Math.random() * 65535);
       }
 
       stimulateLight(light, 254, color);
-      setTimeout(stimulateLight, transitionTime + 50, light, 1);
+      setTimeout(stimulateLight, 100, light, 1);
     }
 
     this.set('paused', true);
@@ -669,7 +674,7 @@ export default Em.Component.extend(helperMixin, visualizerMixin, {
       this.set('usingMicSupported', false);
     }
 
-    ['volume', 'shuffle', 'repeat', 'volumeMuted', 'threshold', 'playerBottomDisplayed', 'onBeatBriAndColor', 'audioMode', 'songBeatPreferences', 'firstVisit', 'currentVisName', 'playQueue', 'playQueuePointer', 'micBoost'].forEach((item)=>{
+    ['volume', 'shuffle', 'repeat', 'volumeMuted', 'threshold', 'playerBottomDisplayed', 'audioMode', 'songBeatPreferences', 'firstVisit', 'currentVisName', 'playQueue', 'playQueuePointer', 'micBoost', 'blinkingTransitions'].forEach((item)=>{
       if (!Em.isNone(storage.get('huegasm.' + item))) {
         var itemVal = storage.get('huegasm.' + item);
 

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

@@ -43,6 +43,7 @@ export default Em.Mixin.create({
   threshold: 0.3,
   micBoost: 5,
   oldThreshold: null,
+  blinkingTransitions: false,
 
   playQueuePointer: -1,
   playQueue: Em.A(),
@@ -131,15 +132,6 @@ export default Em.Mixin.create({
     return this.get('playing');
   }.property('playing'),
 
-  onBeatBriAndColor: true,
-  onBeatBriAndColorLabel: function() {
-    if(this.get('onBeatBriAndColor')){
-      return 'Brightness & Color';
-    } else {
-      return 'Brightness';
-    }
-  }.property('onBeatBriAndColor'),
-
   micIcon: function () {
     if (this.get('usingMicAudio')) {
       return 'mic';
@@ -228,10 +220,20 @@ export default Em.Mixin.create({
     }
   }.property('volumeMuted', 'volume'),
 
+  onColorloopModeChange: function(){
+    this.get('activeLights').forEach((light) => {
+      Em.$.ajax(this.get('apiURL') + '/lights/' + light + '/state', {
+        data: JSON.stringify({'effect': (this.get('playing') && this.get('colorloopMode')) ? 'colorloop' : 'none'}),
+        contentType: 'application/json',
+        type: 'PUT'
+      });
+    });
+  }.observes('colorloopMode'),
+
   onOptionChange: function(self, option){
     option = option.replace('.[]', '');
     this.get('storage').set('huegasm.' + option, this.get(option));
-  }.observes('onBeatBriAndColor', 'playQueue.[]', 'playQueuePointer'),
+  }.observes('blinkingTransitions', 'playQueue.[]', 'playQueuePointer', 'colorloopMode'),
 
   onRepeatChange: function () {
     var tooltipTxt = 'Repeat all', type = 'repeat';

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

@@ -85,11 +85,7 @@
 
 {{#if usingMicAudio}}
   <div id="playAreaMic" class="{{if dimmerOn "dimmerOn"}}">
-  <div id="micBoost" class="beatOption">
-      <span data-toggle="tooltip" data-placement="bottom auto" data-title="The coefficient to boost the microphone signal by" class="optionDescription bootstrapTooltip">Microphone Boost</span>
-    {{range-slider start=micBoost orientation="vertical" step=beatOptions.micBoost.step range=beatOptions.micBoost.range slide="micBoostChanged" pips=beatOptions.micBoost.pips}}
-      <div class="text-center">{{micBoost}}</div>
-  </div>
+    {{paper-icon icon="mic" class=dimmerOnClass}}
   </div>
 {{else}}
   {{#if usingLocalAudio}}
@@ -152,17 +148,22 @@
 {{/if}}
 
 <div class="row" id="beatOptionRow">
-  <div class="beatOption col-xs-8">
+  <div class="beatOption {{if usingMicAudio "col-xs-4" "col-xs-8"}}">
     <span data-toggle="tooltip" data-placement="bottom auto" data-title="The minimum sound intensity for the beat to register" class="optionDescription bootstrapTooltip">Sensitivity</span>
   {{range-slider start=threshold orientation="vertical" step=beatOptions.threshold.step range=beatOptions.threshold.range slide="thresholdChanged" pips=beatOptions.threshold.pips}}
   </div>
 
+  {{#if usingMicAudio}}
       <div class="beatOption col-xs-4">
-    {{#paper-switch checked=onBeatBriAndColor disabled=trial}}<span data-toggle="tooltip"
-                                                                    data-placement="bottom auto"
-                                                                    data-title="The properties of the lights to change on beat"
-                                                                    class="optionDescription bootstrapTooltip">
-      {{onBeatBriAndColorLabel}}</span>{{/paper-switch}}
+          <span data-toggle="tooltip" data-placement="bottom auto" data-title="The coefficient to boost the microphone signal by" class="optionDescription bootstrapTooltip">Microphone Boost</span>
+        {{range-slider start=micBoost orientation="vertical" step=beatOptions.micBoost.step range=beatOptions.micBoost.range slide="micBoostChanged" pips=beatOptions.micBoost.pips}}
+          <div class="text-center">{{micBoost}}</div>
+      </div>
+  {{/if}}
+
+  <div class="beatOption col-xs-4 text-left">
+    {{#paper-checkbox checked=blinkingTransitions}}Blinking transitions{{/paper-checkbox}}
+    {{#paper-checkbox checked=colorloopMode}}Colorloop Mode{{/paper-checkbox}}
   </div>
 </div>
 

app/styles/app.scss

@@ -50,6 +50,19 @@ body {
   background: black;
 }
 
+md-checkbox.md-default-theme .md-icon {
+  border-color: inherit !important;
+}
+
+md-checkbox.md-default-theme.md-checked .md-icon {
+  background: $secondaryThemeColor;
+
+}
+
+.text-left {
+  text-align: left !important;
+}
+
 .goButton:hover {
   background: darken(#3f51b5, 10%) !important;
 }
@@ -694,7 +707,7 @@ md-switch.md-default-theme.md-checked .md-thumb {
     text-align: center;
     width: 100%;
   }
-  .library-music {
+  .library-music, .mic {
     position: absolute;
     top: 40%;
     font-size: 100px;
@@ -926,6 +939,7 @@ body.dimmerOn {
 .loop.dimmerOn,
 .group.dimmerOn,
 .settings.dimmerOn,
+.mic.dimmerOn,
 .library-music.dimmerOn {
   color: inherit !important;
   text-shadow: $glowingText;
@@ -1077,7 +1091,3 @@ div.ember-modal-dialog {
   width: 10px;
   top: -2px;
 }
-
-#micBoost {
-  margin-top: 50px;
-}