Take duration into account when fading out event

js/detector.js

@@ -75,10 +75,18 @@ var detector =
         }
     ],
 
-    animate: function()
+    lastRender: 0,
+
+    animate: function(time)
     {
+        if (detector.lastRender == 0) {
+            detector.lastRender = typeof performance !== 'undefined' ? performance.now() : new Date().getTime();
+        }
+        var duration = typeof time !== 'undefined' ? time - detector.lastRender : 16;
+        detector.lastRender = typeof performance !== 'undefined' ? performance.now() : new Date().getTime();
+
         requestAnimFrame(detector.animate);
-        detector.draw();
+        detector.draw(duration);
     },
 
     init: function()
@@ -283,14 +291,14 @@ var detector =
         }
     },
 
-    draw: function()
+    draw: function(duration)
     {
         detector.events.ctx.clearRect(0, 0, 400, 400);
 
         var del = -1;
         for (var e in detector.events.list) {
             if (detector.events.list[e].alpha > 0) {
-                detector.events.list[e].draw();
+                detector.events.list[e].draw(duration);
             } else {
                 del = detector.events.list[e].count;
             }

js/event.js

@@ -28,10 +28,10 @@ function ParticleEvent(type, count, external)
             break;
     }
 
-    this.draw(true);
+    this.draw(16, true);
 };
 
-ParticleEvent.prototype.draw = function(init)
+ParticleEvent.prototype.draw = function(duration, init)
 {
     init = typeof init !== 'undefined' ? init : false;
 
@@ -57,6 +57,7 @@ ParticleEvent.prototype.draw = function(init)
     ctx.restore();
 
     if (!init) {
-        this.alpha -= 0.02;
+        this.alpha -= 0.02 / 16 * duration;
     }
 };
+