removing interval, hopefully better beat detection, bug fixes

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

@@ -31,7 +31,7 @@ export default Em.Component.extend({
     },
 
     findBridgeByIp() {
-      var manualBridgeIp = this.get('manualBridgeIp'), self = this;
+      var manualBridgeIp = this.get('manualBridgeIp');
 
       if (manualBridgeIp.toLowerCase() === 'trial' || manualBridgeIp.toLowerCase() === 'offline') {
         this.setProperties({
@@ -44,11 +44,11 @@ export default Em.Component.extend({
           data: JSON.stringify({"devicetype": "huegasm"}),
           contentType: 'application/json',
           type: 'POST'
-        }).fail(function () {
+        }).fail(() => {
-          self.set('manualBridgeIpNotFound', true);
+          this.set('manualBridgeIpNotFound', true);
-          setTimeout(function(){ self.set('manualBridgeIpNotFound', false); }, 5000);
+          setTimeout(() => { this.set('manualBridgeIpNotFound', false); }, 5000);
-        }).then(function () {
+        }).then(() => {
-          self.set('bridgeIp', manualBridgeIp);
+          this.set('bridgeIp', manualBridgeIp);
         });
       }
     }

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

@@ -63,7 +63,7 @@ export default Em.Component.extend({
             '<b>Beat Interval</b> - The minimum amount of time between each registered beat <br>' +
             '<b>Frequency Range</b> - The frequency range of the sound to listen on for the beat<br>' +
             '<b>Transition Time</b> - The time it takes for a light to change color or brightness<br><br>' +
-            '<i><b>TIP</b>: Beat settings are saved per song as indicated by the red star icon in the top left corner. These settings they will be restored if you ever listen to the same song again.</i>',
+            '<i><b>TIP</b>: Beat detection settings are saved per song as indicated by the red star icon in the top left corner. These settings they will be restored if you ever listen to the same song again.</i>',
             position: 'top'
           },
           {
@@ -109,8 +109,6 @@ export default Em.Component.extend({
 
       // it's VERY ugly but it works
       intro.onchange((element) => {
-        this.set('dimmerOn', false);
-
         if(element.id === 'musicTab' || element.id === 'playlist' || element.id === 'playerArea' || element.id === 'beatOptionRow' || element.id === 'beatOptionButtonGroup' || element.id === 'beatContainer' || element.id === 'usingMicAudioTooltip'){
           Em.$('#musicTab').removeClass('hidden');
           Em.$('#lightsTab').addClass('hidden');
@@ -156,7 +154,8 @@ export default Em.Component.extend({
 
       // skip hidden/missing elements
       intro.onafterchange((element)=>{
-        if(Em.$(element).hasClass('introjsFloatingElement')){
+        var elem = Em.$(element);
+        if(elem.hasClass('introjsFloatingElement') || elem.html() === '<!---->'){
           Em.$('.introjs-nextbutton').click();
         }
       }).onexit(onFinish).oncomplete(onFinish).start();

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

@@ -357,9 +357,6 @@ export default Em.Component.extend(helperMixin, visualizerMixin, {
     repeatChanged(value) {
       this.changePlayerControl('repeat', Em.isNone(value) ? (this.get('repeat') + 1) % 3 : value);
     },
-    transitionTimeChanged(value) {
-      this.changePlayerControl('transitionTime', value);
-    },
     playerBottomDisplayedChanged(value) {
       this.changePlayerControl('playerBottomDisplayed', value);
     },
@@ -580,9 +577,11 @@ export default Em.Component.extend(helperMixin, visualizerMixin, {
     this.set('dragLeaveTimeoutHandle', setTimeout(function(){ self.set('dragging', false); }, 500));
   },
 
-  simulateKick() {
+  simulateKick(mag, ratioKick) {
+    console.log(mag + ',' + ratioKick);
+
     var activeLights = this.get('activeLights'),
-      transitionTime = this.get('transitionTime') * 10,
+      transitionTime = 100,
       onBeatBriAndColor = this.get('onBeatBriAndColor'),
       lightsData = this.get('lightsData'),
       color = null,
@@ -651,11 +650,10 @@ export default Em.Component.extend(helperMixin, visualizerMixin, {
     var dancer = new Dancer(),
       storage = this.get('storage'),
       kick = dancer.createKick({
-        frequency: [0,100],
         threshold: this.get('threshold'),
-        onKick: (mag) => {
+        onKick: (mag, ratioKick) => {
           if (this.get('paused') === false) {
-            this.simulateKick(mag);
+            this.simulateKick(mag, ratioKick);
           }
         }
       });
@@ -671,7 +669,7 @@ export default Em.Component.extend(helperMixin, visualizerMixin, {
       this.set('usingMicSupported', false);
     }
 
-    ['volume', 'shuffle', 'repeat', 'volumeMuted', 'threshold', 'transitionTime', 'playerBottomDisplayed', 'onBeatBriAndColor', 'audioMode', 'songBeatPreferences', 'firstVisit', 'currentVisName', 'playQueue', 'playQueuePointer', 'micBoost'].forEach((item)=>{
+    ['volume', 'shuffle', 'repeat', 'volumeMuted', 'threshold', 'playerBottomDisplayed', 'onBeatBriAndColor', 'audioMode', 'songBeatPreferences', 'firstVisit', 'currentVisName', 'playQueue', 'playQueuePointer', 'micBoost'].forEach((item)=>{
       if (!Em.isNone(storage.get('huegasm.' + item))) {
         var itemVal = storage.get('huegasm.' + item);
 

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

@@ -11,7 +11,7 @@ export default Em.Mixin.create({
 
   beatOptions: {
     threshold: {
-      range: {min: 0, max: 1.0},
+      range: {min: 0, max: 0.6},
       step: 0.01,
       defaultValue: 0.3,
       pips: {
@@ -24,20 +24,6 @@ export default Em.Mixin.create({
         }
       }
     },
-    transitionTime: {
-      range:  {min: 0, max: 0.5},
-      step: 0.1,
-      defaultValue: 0.1,
-      pips: {
-        mode: 'positions',
-        values: [0,20,40,60,80,100],
-        density: 10,
-        format: {
-          to: function ( value ) {return value;},
-          from: function ( value ) { return value; }
-        }
-      }
-    },
     micBoost: {
       range:  {min: 1, max: 11},
       step: 0.5,
@@ -54,7 +40,6 @@ export default Em.Mixin.create({
     }
   },
 
-  transitionTime: 0.1,
   threshold: 0.3,
   micBoost: 5,
   oldThreshold: null,

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

@@ -41,9 +41,11 @@ export default Em.Mixin.create({
 
     dancer.bind('update', () => {
       var currentVisName = this.get('currentVisName'),
-        gradient = ctx.createLinearGradient(0, 0, 0, h);
+        gradient = ctx.createLinearGradient(0, 0, 0, h),
+        pageHidden = document.hidden || document.msHidden || document.webkitHidden || document.mozHidden;
 
-      if(currentVisName === 'None'){
+      // dont do anything if the page is hidden or no visualization
+      if(currentVisName === 'None' || pageHidden){
         return;
       }
 

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

@@ -152,16 +152,11 @@
 {{/if}}
 
 <div class="row" id="beatOptionRow">
-  <div class="beatOption col-xs-4">
+  <div class="beatOption 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>
 
-  <div class="beatOption col-xs-4">
-    <span data-toggle="tooltip" data-placement="bottom auto" data-title="The time it takes for a light to change color or brightness" class="optionDescription bootstrapTooltip">Transition Time</span>
-    {{range-slider start=transitionTime orientation="vertical" step=beatOptions.transitionTime.step range=beatOptions.transitionTime.range slide="transitionTimeChanged" pips=beatOptions.transitionTime.pips}}
-  </div>
-
   <div class="beatOption col-xs-4">
     {{#paper-switch checked=onBeatBriAndColor disabled=trial}}<span data-toggle="tooltip"
                                                                     data-placement="bottom auto"

app/styles/app.scss

@@ -2,7 +2,7 @@
 @import 'bower_components/bootstrap-sass/assets/stylesheets/_bootstrap';
 @import 'ember-modal-dialog/ember-modal-structure';
 @import 'ember-modal-dialog/ember-modal-appearance';
-@import "fancy-speaker";
+@import 'fancy-speaker';
 
 $playerHeight: 400px;
 $playerDefaultIconColor: #BBBBBB;

config/environment.js

@@ -24,7 +24,7 @@ module.exports = function(environment) {
       'script-src': "'self' 'unsafe-inline' connect.soundcloud.com www.google-analytics.com",
       'font-src': "'self' fonts.gstatic.com",
       'connect-src': "'self' *",
-      'img-src': "'self' *.sndcdn.com  data:",
+      'img-src': "'self' *.sndcdn.com  www.google-analytics.com data:",
       'media-src': "'self' api.soundcloud.com *.sndcdn.com blob:",
       'style-src': "'self' 'unsafe-inline' fonts.googleapis.com",
       'object-src': "'self' connect.soundcloud.com",

vendor/dancer.js

@@ -288,13 +288,16 @@
   var Kick = function ( dancer, o ) {
     o = o || {};
     this.dancer    = dancer;
-    this.frequency = o.frequency !== undefined ? o.frequency : [ 0, 10 ];
+    this.frequency = o.frequency !== undefined ? o.frequency : [ 0, 5 ];
     this.threshold = o.threshold !== undefined ? o.threshold :  0.3;
     this.decay     = o.decay     !== undefined ? o.decay     :  0.02;
     this.onKick    = o.onKick;
     this.offKick   = o.offKick;
     this.isOn      = false;
     this.currentThreshold = this.threshold;
+    this.previousMag = 0;
+    this.canUseRatio = true;
+    this.canUseRatioHandle = null;
 
     var _this = this;
     this.dancer.bind( 'update', function () {
@@ -323,16 +326,32 @@
 
     onUpdate : function () {
       if ( !this.isOn ) { return; }
-      var magnitude = this.maxAmplitude( this.frequency );
 
-      if ( magnitude >= this.currentThreshold &&
+      var magnitude = this.maxAmplitude(this.frequency);
-          magnitude >= this.threshold ) {
+
+      if (magnitude >= this.currentThreshold && magnitude >= this.threshold) {
         this.currentThreshold = magnitude;
-        this.onKick && this.onKick.call( this.dancer, magnitude );
+        this.onKick && this.onKick.call(this.dancer, magnitude);
-        console.log('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxKICK:' + magnitude);
+        this.canUseRatio = false;
+
+        if(this.canUseRatioHandle) {
+          clearTimeout(this.canUseRatioHandle);
+          this.canUseRatioHandle = null;
+        }
+
+        var self = this;
+        this.canUseRatioHandle = setTimeout(function(){
+          self.canUseRatio = true;
+        }, 2000);
       } else {
-        this.offKick && this.offKick.call( this.dancer, magnitude );
+        if(magnitude/this.previousMag > this.threshold*5 && magnitude>0.1 && this.canUseRatio) {
+          this.onKick && this.onKick.call(this.dancer, magnitude, magnitude/this.previousMag);
+        } else {
+          this.offKick && this.offKick.call(this.dancer, magnitude);
+        }
+
         this.currentThreshold -= this.decay;
+        this.previousMag = (magnitude > 0) ? magnitude : 0.0001;
       }
     },
     maxAmplitude : function ( frequency ) {
@@ -361,15 +380,11 @@
     SAMPLE_RATE = 44100;
 
   var adapter = function ( dancer ) {
-    var context = new AudioContext();//, filter = context.createBiquadFilter();
+    var context = new AudioContext();
-
-    //filter.type = "lowpass";
-    //filter.frequency.value = 440;
 
     this.dancer = dancer;
     this.audio = new Audio();
     this.context = context;
-    //this.filter = filter;
   };
 
   adapter.prototype = {
@@ -498,10 +513,8 @@
 
     this.source.connect(this.proc);
     this.source.connect(this.gain);
-    //this.source.connect( this.filter );
     this.gain.connect(this.context.destination);
     this.proc.connect(this.context.destination);
-    //this.filter.connect( this.context.destination );
 
     this.isLoaded = true;
     this.progress = 1;