From 8cc9f8702250c8f854115756857df96214b0273e Mon Sep 17 00:00:00 2001
From: lone-cloud <lonecloud604@pm.me>
Date: Wed, 30 Sep 2015 17:09:05 -0700
Subject: [PATCH] adding useMic control

---
 app/components/controls/music-control.js      |  8 ++++-
 app/components/mixins/music-control.js        | 23 ++++++++++++
 app/styles/app.scss                           |  2 +-
 .../components/controls/music-control.hbs     | 36 ++++++++++++-------
 4 files changed, 55 insertions(+), 14 deletions(-)

diff --git a/app/components/controls/music-control.js b/app/components/controls/music-control.js
index 309bb2e..5fc8c58 100644
--- a/app/components/controls/music-control.js
+++ b/app/components/controls/music-control.js
@@ -14,6 +14,9 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
   }.observes('active'),
 
   actions: {
+    useMic: function() {
+      this.changePlayerControl('usingMic', !this.get('usingMic'));
+    },
     slideTogglePlayerBottom: function(){
       this.changePlayerControl('playerBottomDisplayed', !this.get('playerBottomDisplayed'));
     },
@@ -172,6 +175,9 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
     onBeatBriOnlyChanged: function(value){
       this.set('onBeatBriOnly', value);
     },
+    usingMicChanged: function(value){
+      this.set('usingMic', value);
+    },
     clickSpeaker: function(){
       this.simulateKick(1);
     },
@@ -352,7 +358,7 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
       kick: kick
     });
 
-    ['volume', 'shuffle', 'repeat', 'volumeMuted', 'threshold', 'decay', 'frequency', 'speakerViewed', 'transitionTime', 'sequentialTransition', 'playerBottomDisplayed', 'onBeatBriOnly'].forEach(function (item) {
+    ['volume', 'shuffle', 'repeat', 'volumeMuted', 'threshold', 'decay', 'frequency', 'speakerViewed', 'transitionTime', 'sequentialTransition', 'playerBottomDisplayed', 'onBeatBriOnly', 'usingMic'].forEach(function (item) {
       if (localStorage.getItem('huegasm.' + item)) {
         var itemVal = localStorage.getItem('huegasm.' + item);
         if (item === 'repeat' || item === 'volume' || item === 'decay' || item === 'threshold' || item === 'transitionTime') {
diff --git a/app/components/mixins/music-control.js b/app/components/mixins/music-control.js
index c5bf3ed..1f59d94 100644
--- a/app/components/mixins/music-control.js
+++ b/app/components/mixins/music-control.js
@@ -75,6 +75,7 @@ export default Em.Mixin.create({
   timeTotal: 0,
   lastLightBopIndex: 0,
 
+  usingMic: false,
   playerBottomDisplayed: false,
   dragging: false,
   draggingOverPlayListArea: false,
@@ -155,6 +156,14 @@ export default Em.Mixin.create({
     }
   },
 
+  micIcon: function() {
+    if (this.get('usingMic')) {
+      return 'mic';
+    }
+
+    return 'mic-off';
+  }.property('usingMic'),
+
   repeatIcon: function () {
     if (this.get('repeat') === 2) {
       return 'repeat-one';
@@ -185,6 +194,10 @@ export default Em.Mixin.create({
     return classes;
   }.property('dragging', 'draggingOverPlayListArea'),
 
+  usingMicClass: function() {
+    return this.get('usingMic') ? 'playerControllIcon active' : 'playerControllIcon';
+  }.property('usingMic'),
+
   repeatClass: function () {
     return this.get('repeat') !== 0 ? 'playerControllIcon active' : 'playerControllIcon';
   }.property('repeat'),
@@ -238,6 +251,16 @@ export default Em.Mixin.create({
     this.changeTooltipText(type, tooltipTxt);
   }.observes('shuffle').on('init'),
 
+  onUsingMicChange: function () {
+    var tooltipTxt = 'Listen to Mic', type = 'usingMic';
+
+    if (this.get(type)) {
+      tooltipTxt = 'Don\'t Listen to Mic';
+    }
+
+    this.changeTooltipText(type, tooltipTxt);
+  }.observes('usingMic').on('init'),
+
   onVolumeMutedChange: function () {
     var tooltipTxt = 'Mute', type = 'volumeMuted',
       volumeMuted = this.get(type), dancer = this.get('dancer'),
diff --git a/app/styles/app.scss b/app/styles/app.scss
index 6e969e5..676b008 100644
--- a/app/styles/app.scss
+++ b/app/styles/app.scss
@@ -447,7 +447,7 @@ md-switch.md-default-theme.md-checked .md-thumb {
 }
 
 .playerControllIcon.active {
-  color: lighten($playerDefaultIconColor, 20%) !important;
+  color: lighten($playerDefaultIconColor, 30%) !important;
 }
 
 .playerControllIcon:hover {
diff --git a/app/templates/components/controls/music-control.hbs b/app/templates/components/controls/music-control.hbs
index ca18ac4..a4c7d9a 100644
--- a/app/templates/components/controls/music-control.hbs
+++ b/app/templates/components/controls/music-control.hbs
@@ -37,14 +37,13 @@
     <input id="fileInput" type="file" accept="audio/*" multiple="true"/>
 
     <div id="playListControls">
-            <span data-toggle="tooltip" data-placement="bottom auto" class="bootstrapTooltip" id="shuffleTooltip"
-                  data-title={{shuffleTooltipTxt}} {{action "shuffleChanged"}}>{{paper-icon icon="shuffle" class=shuffleClass}}</span>
+      <span data-toggle="tooltip" data-placement="bottom auto" class="bootstrapTooltip" id="shuffleTooltip" data-title={{shuffleTooltipTxt}} {{action "shuffleChanged"}}>{{paper-icon icon="shuffle" class=shuffleClass}}</span>
 
-            <span data-toggle="tooltip" data-placement="bottom auto" class="bootstrapTooltip" id="repeatTooltip"
-                  data-title={{repeatTooltipTxt}} {{action "repeatChanged"}}>{{paper-icon icon=repeatIcon class=repeatClass}}</span>
+      <span data-toggle="tooltip" data-placement="bottom auto" class="bootstrapTooltip" id="repeatTooltip" data-title={{repeatTooltipTxt}} {{action "repeatChanged"}}>{{paper-icon icon=repeatIcon class=repeatClass}}</span>
 
-            <span data-toggle="tooltip" data-placement="bottom" data-title="Add new music"
-                  class="pull-right bootstrapTooltip" {{action "addAudio"}}>{{paper-icon icon="add" class="playerControllIcon" }}</span>
+      <span data-toggle="tooltip" data-placement="bottom auto" data-title="Add new music" class="pull-right bootstrapTooltip" {{action "addAudio"}}>{{paper-icon icon="add" class="playerControllIcon"}}</span>
+
+      <span data-toggle="tooltip" data-placement="bottom auto" class="pull-right bootstrapTooltip" id="usingMicTooltip" data-title={{usingMicTooltipTxt}} {{action "useMic"}}>{{paper-icon icon=micIcon class=usingMicClass}}</span>
     </div>
 
     <div id="playListArea"
@@ -92,13 +91,17 @@
         <div class="beatOption col-xs-3">
           <div class="text-center">{{threshold}}</div>
           {{range-slider start=threshold orientation="vertical" step=beatOptions.threshold.step range=beatOptions.threshold.range slide="thresholdChanged" pips=beatOptions.threshold.pips}}
-          <span data-toggle="tooltip" data-placement="bottom auto" data-title="Maximum intensity of the sound that may be registered as a beat" class="optionDescription bootstrapTooltip">Max. Intensity</span>
+          <span data-toggle="tooltip" data-placement="bottom auto"
+                data-title="Maximum intensity of the sound that may be registered as a beat"
+                class="optionDescription bootstrapTooltip">Max. Intensity</span>
         </div>
 
         <div class="beatOption col-xs-3">
           <div class="text-center">{{decay}}</div>
           {{range-slider start=decay orientation="vertical" step=beatOptions.decay.step range=beatOptions.decay.range slide="decayChanged" pips=beatOptions.decay.pips}}
-          <span data-toggle="tooltip" data-placement="bottom auto" data-title="The rate at which the previously registered beat's intensity is reduced to find the next beat" class="optionDescription bootstrapTooltip">Decay Rate</span>
+          <span data-toggle="tooltip" data-placement="bottom auto"
+                data-title="The rate at which the previously registered beat's intensity is reduced to find the next beat"
+                class="optionDescription bootstrapTooltip">Decay Rate</span>
         </div>
 
         <div class="beatOption col-xs-3">
@@ -106,22 +109,31 @@
             ]
           </div>
           {{range-slider start=frequency orientation="vertical" step=beatOptions.frequency.step range=beatOptions.frequency.range connect=true slide="frequencyChanged" pips=beatOptions.frequency.pips}}
-          <span data-toggle="tooltip" data-placement="bottom auto" data-title="The frequency range of sound to listen on for the beat" class="optionDescription bootstrapTooltip">Frequency Range</span>
+          <span data-toggle="tooltip" data-placement="bottom auto"
+                data-title="The frequency range of sound to listen on for the beat"
+                class="optionDescription bootstrapTooltip">Frequency Range</span>
         </div>
 
         <div class="beatOption col-xs-3">
           <div class="text-center">{{transitionTime}} sec</div>
           {{range-slider start=transitionTime orientation="vertical" step=beatOptions.transitionTime.step range=beatOptions.transitionTime.range slide="transitionTimeChanged" pips=beatOptions.transitionTime.pips}}
-          <span data-toggle="tooltip" data-placement="bottom auto" data-title="Transition time to change the lights on, on beat" class="optionDescription bootstrapTooltip">Transition Time</span>
+          <span data-toggle="tooltip" data-placement="bottom auto"
+                data-title="Transition time to change the lights on, on beat"
+                class="optionDescription bootstrapTooltip">Transition Time</span>
         </div>
       </div>
 
       <div id="beatOptionButtonGroup" class="row">
         <div class="beatOption col-xs-6">
-          {{#paper-switch checked=sequentialTransition  disabled=trial}}<span data-toggle="tooltip" data-placement="bottom auto" data-title="The order in which the active lights are transitioned to on beat" class="optionDescription bootstrapTooltip">{{sequentialTransitionLabel}}</span>{{/paper-switch}}
+          {{#paper-switch checked=sequentialTransition  disabled=trial}}<span data-toggle="tooltip"
+                                                                              data-placement="bottom auto"
+                                                                              data-title="The order in which the active lights are transitioned to on beat"
+                                                                              class="optionDescription bootstrapTooltip">{{sequentialTransitionLabel}}</span>{{/paper-switch}}
         </div>
         <div class="beatOption col-xs-6">
-          {{#paper-switch checked=onBeatBriOnly disabled=trial}}<span data-toggle="tooltip" data-placement="bottom auto" data-title="The properties of the lights to change on beat" class="optionDescription bootstrapTooltip"> {{onBeatBriOnlyLabel}}</span>{{/paper-switch}}
+          {{#paper-switch checked=onBeatBriOnly disabled=trial}}<span data-toggle="tooltip" data-placement="bottom auto"
+                                                                      data-title="The properties of the lights to change on beat"
+                                                                      class="optionDescription bootstrapTooltip"> {{onBeatBriOnlyLabel}}</span>{{/paper-switch}}
         </div>
       </div>