add Spinner#stop()

Readme.md

@@ -43,6 +43,12 @@ document.body.appendChild(spinner.el);
 
   Change the speed to `n` rpm, defaults to 60.
 
+### Spinner#stop()
+
+  Stop the animation. This is important when removing
+  the spinner, otherwise the requestAnimationFrame cycle
+  will continue.
+
 ## License
 
   MIT

index.js

@@ -17,22 +17,34 @@ module.exports = Spinner;
  */
 
 function Spinner() {
+  var self = this;
   this.percent = 0;
   this.el = document.createElement('canvas');
   this.ctx = this.el.getContext('2d');
   this.size(50);
   this.fontSize(11);
   this.speed(60);
   this.font('helvetica, arial, sans-serif');
+  this.stopped = false;
 
-  var self = this;
   (function animate() {
+    if (self.stopped) return;
     raf(animate);
     self.percent = (self.percent + self._speed / 36) % 100;
     self.draw(self.ctx);
   })();
 }
 
+/**
+ * Stop the animation.
+ *
+ * @api public
+ */
+
+Spinner.prototype.stop = function(){
+  this.stopped = true;
+};
+
 /**
  * Set spinner size to `n`.
  *

test/index.html

@@ -57,6 +57,9 @@
       var spinner = new Spinner;
       spinner.size(25).speed(30).light();
       document.querySelector('.dark').appendChild(spinner.el);
+      setTimeout(function(){
+        spinner.stop();
+      }, 2000);
     })();
 
     </script>