Merge branch 'dev'

dist/v-button.css

@@ -1,6 +1,6 @@
 /**
  * vButton - AngularJS pressable button with a busy indicator
- * @version v0.0.2
+ * @version v0.0.3
  * @link http://lukaszwatroba.github.io/v-button
  * @author Łukasz Wątroba <[email protected]>
  * @license MIT License, http://www.opensource.org/licenses/MIT

dist/v-button.js

@@ -1,6 +1,6 @@
 /**
  * vButton - AngularJS pressable button with a busy indicator
- * @version v0.0.2
+ * @version v0.0.3
  * @link http://lukaszwatroba.github.io/v-button
  * @author Łukasz Wątroba <[email protected]>
  * @license MIT License, http://www.opensource.org/licenses/MIT
@@ -72,6 +72,11 @@ function vButtonDirective ($document, buttonConfig) {
       tElement.addClass(buttonConfig.classes.buttonPressableModifier);
 
       return function postLink (scope, iElement, iAttrs) {
+        var isTouch = !!('undefined' !== typeof $document[0].documentElement.ontouchstart);
+
+        var pressEvent = (isTouch) ? 'touchstart' : 'mousedown',
+            releaseEvent = (isTouch) ? 'touchend' : 'mouseup';
+
         var idleLabelHtml = buttonLabelElement.html(),
             busyLabelHtml = scope.busyLabel || buttonConfig.busyLabel;
 
@@ -95,16 +100,19 @@ function vButtonDirective ($document, buttonConfig) {
           ripple.style.top = top + 'px';
         }
 
-        iElement.bind('mousedown touchstart', function (event) {
+        function pressButton (event) {
           makeRipple(event.pageX, event.pageY);
-
           iElement.addClass(buttonConfig.classes.isPressedState);
 
-          bodyElement.bind('mouseup touchend', function (event) {
-            iElement.removeClass(buttonConfig.classes.isPressedState);
-            bodyElement.unbind('mouseup touchend');
-          });
-        });
+          bodyElement.bind(releaseEvent, releaseButton);
+        }
+
+        function releaseButton (event) {
+          iElement.removeClass(buttonConfig.classes.isPressedState);
+          bodyElement.unbind(releaseEvent, releaseButton);
+        }
+
+        iElement.bind(pressEvent, pressButton);
 
         scope.$watch('isBusy', function (value) {
           if (value) {

karma.conf.js

@@ -56,7 +56,7 @@ module.exports = function(config) {
 
     // level of logging
     // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_DEBUG,
+    logLevel: config.LOG_INFO,
 
 
     // enable / disable watching file and executing tests whenever any file changes

package.json

@@ -1,7 +1,7 @@
 {
   "name": "v-button",
   "description": "vButton - AngularJS pressable button with a busy indicator",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "author": "Łukasz Wątroba <[email protected]>",
   "license": "MIT",
   "keywords": [

src/vButton/directives/v-button.js

@@ -31,6 +31,11 @@ function vButtonDirective ($document, buttonConfig) {
       tElement.addClass(buttonConfig.classes.buttonPressableModifier);
 
       return function postLink (scope, iElement, iAttrs) {
+        var isTouch = !!('undefined' !== typeof $document[0].documentElement.ontouchstart);
+
+        var pressEvent = (isTouch) ? 'touchstart' : 'mousedown',
+            releaseEvent = (isTouch) ? 'touchend' : 'mouseup';
+
         var idleLabelHtml = buttonLabelElement.html(),
             busyLabelHtml = scope.busyLabel || buttonConfig.busyLabel;
 
@@ -54,16 +59,19 @@ function vButtonDirective ($document, buttonConfig) {
           ripple.style.top = top + 'px';
         }
 
-        iElement.bind('mousedown touchstart', function (event) {
+        function pressButton (event) {
           makeRipple(event.pageX, event.pageY);
-
           iElement.addClass(buttonConfig.classes.isPressedState);
 
-          bodyElement.bind('mouseup touchend', function (event) {
-            iElement.removeClass(buttonConfig.classes.isPressedState);
-            bodyElement.unbind('mouseup touchend');
-          });
-        });
+          bodyElement.bind(releaseEvent, releaseButton);
+        }
+
+        function releaseButton (event) {
+          iElement.removeClass(buttonConfig.classes.isPressedState);
+          bodyElement.unbind(releaseEvent, releaseButton);
+        }
+
+        iElement.bind(pressEvent, pressButton);
 
         scope.$watch('isBusy', function (value) {
           if (value) {

test/unit/vButton/directives/v-button.spec.js

@@ -58,7 +58,7 @@ describe('v-button directive', function () {
   });
 
 
-  it('should add a ripple and `is-pressed` class on `mousedown` event', function () {
+  it('should add a ripple and `is-pressed` class on `touchstart` event', function () {
     var ripleClass = buttonConfig.classes.ripple;
     var pressedClass = buttonConfig.classes.isPressedState;
 
@@ -68,23 +68,23 @@ describe('v-button directive', function () {
 
     expect(riple[0]).not.toBeDefined();
 
-    button.mousedown();
+    button.trigger('touchstart');
     riple = button.find( 'span.' + ripleClass );
 
     expect(riple[0]).toBeDefined();
     expect(button.hasClass( pressedClass )).toBe(true);
   });
 
 
-  it('should remove `is-pressed` class on `mouseup` event', inject(function ($document) {
+  it('should remove `is-pressed` class on `touchend` event', inject(function ($document) {
     var template = generateTemplate();
     var button = $compile(template)(scope);
     var pressedClass = buttonConfig.classes.isPressedState;
     var body = $($document[0].body);
 
-    button.mousedown();
+    button.trigger('touchstart');
     expect(button.hasClass( pressedClass )).toBe(true);
-    body.mouseup();
+    body.trigger('touchend');
     expect(button.hasClass( pressedClass )).toBe(false);
   }));