nothing here...trying to get mic recording

app/components/controls/music-control.js

@@ -15,7 +15,12 @@ export default Em.Component.extend(musicControlMixin, visualizerMixin, {
 
   actions: {
     useMic: function() {
-      this.changePlayerControl('usingMic', !this.get('usingMic'));
+      var usingMic = this.get('usingMic');
+      this.changePlayerControl('usingMic', !usingMic);
+
+      if(!usingMic){
+        Em.$('#micInput').click();
+      }
     },
     slideTogglePlayerBottom: function(){
       this.changePlayerControl('playerBottomDisplayed', !this.get('playerBottomDisplayed'));

app/components/mixins/music-control.js

@@ -49,7 +49,7 @@ export default Em.Mixin.create({
     transitionTime: {
       range:  {min: 0, max: 0.5},
       step: 0.1,
-      defaultValue: 0,
+      defaultValue: 0.1,
       pips: {
         mode: 'positions',
         values: [0,20,40,60,80,100],
@@ -62,7 +62,7 @@ export default Em.Mixin.create({
     }
   },
 
-  transitionTime: 0,
+  transitionTime: 0.1,
   threshold: 0.3,
   decay: 0.02,
   frequency: [0,4],

app/styles/app.scss

@@ -399,9 +399,16 @@ md-toolbar {
 }
 
 #slideToggle {
-  color: white;
+  color: $playerDefaultIconColor;
   background-color: $playerBottomBackground;
-  padding: 5px;
+  div md-icon {
+   font-size: 40px;
+    color: inherit !important;
+  }
+}
+
+#slideToggle:hover{
+  color: lighten($playerDefaultIconColor, 30%) !important;;
 }
 
 md-switch.md-default-theme.md-checked .md-bar {
@@ -612,7 +619,7 @@ md-switch.md-default-theme.md-checked .md-thumb {
   box-shadow: inset 0 0 20px 0 rgba(0, 0, 0, 1);
 }
 
-#fileInput {
+#fileInput, #micInput {
   width: 1px;
   height: 1px;
   visibility: hidden;

app/templates/components/controls/music-control.hbs

@@ -17,7 +17,7 @@
                          data-title="Next" {{action "next"}}>{{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=volumeClass  class="playerControllIcon volumeButton"}}</span><!--
+                   data-title={{volumeMutedTooltipTxt}} {{action "volumeMutedChanged"}}>{{paper-icon icon=volumeClass class="playerControllIcon volumeButton"}}</span><!--
                   -->{{range-slider start=volume min=0 max=100 slide="volumeChanged" id="volumeBar"}}
 
       <div id="playerTimeControls">{{timeElapsedTxt}} / {{timeTotalTxt}}</div>
@@ -34,7 +34,8 @@
   </div>
 
   <div id="playlist" class="col-sm-4 col-xs-12">
-    <input id="fileInput" type="file" accept="audio/*" multiple="true"/>
+    <input id="fileInput" type="file" accept="audio/*" multiple="true" />
+    <input id="micInput" type="file" accept="audio/*" capture />
 
     <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>
@@ -76,10 +77,13 @@
   </div>
 </div>
 
-<div class="text-center cursorPointer row" {{action "slideTogglePlayerBottom"}}>
+<div id="slideToggle" class="text-center cursorPointer row" {{action "slideTogglePlayerBottom"}}>
-  <div id="slideToggle" class="col-xs-12">
+  <div class="col-xs-offset-3 col-xs-3">
-    {{paper-icon icon=beatDetectionArrowIcon}} Beat Detection Settings {{paper-icon icon=beatDetectionArrowIcon}}
+    {{paper-icon icon=beatDetectionArrowIcon}}
   </div>
+    <div class="col-xs-3">
+      {{paper-icon icon=beatDetectionArrowIcon}}
+    </div>
 </div>
 
 {{#if playerBottomDisplayed}}
@@ -125,15 +129,11 @@
 
       <div id="beatOptionButtonGroup" class="row">
         <div class="beatOption col-xs-6">
-          {{#paper-switch checked=sequentialTransition  disabled=trial}}<span data-toggle="tooltip"
+          {{#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"
-                                                                              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"
+          {{#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}}
-                                                                      data-title="The properties of the lights to change on beat"
-                                                                      class="optionDescription bootstrapTooltip"> {{onBeatBriOnlyLabel}}</span>{{/paper-switch}}
         </div>
       </div>