From 225e1f6934046385a69287bf55a481ba59f14f54 Mon Sep 17 00:00:00 2001
From: Vivere Discere <vivescere@gmail.com>
Date: Mon, 13 Feb 2017 03:04:41 +0100
Subject: [PATCH] fix ripple effect on touchscreen desktops (#479)

---
 .../components/mdInkRipple/mdInkRipple.vue    | 37 ++++++++++++++-----
 1 file changed, 27 insertions(+), 10 deletions(-)

diff --git a/src/core/components/mdInkRipple/mdInkRipple.vue b/src/core/components/mdInkRipple/mdInkRipple.vue
index 516aa7d..15f88bd 100644
--- a/src/core/components/mdInkRipple/mdInkRipple.vue
+++ b/src/core/components/mdInkRipple/mdInkRipple.vue
@@ -7,19 +7,23 @@
 <style lang="scss" src="./mdInkRipple.scss"></style>
 
 <script>
-  const hasTouch = 'ontouchstart' in document;
-  const getEventName = (type) => {
-    if (type === 'start') {
-      return hasTouch ? 'touchstart' : 'mousedown';
-    }
-
-    return hasTouch ? 'touchend' : 'mouseup';
-  };
   const addEvent = (target, type, handler) => {
-    target.addEventListener(getEventName(type), handler);
+    if (type === 'start') {
+      target.addEventListener('mousedown', handler);
+      target.addEventListener('touchstart', handler);
+    } else {
+      target.addEventListener('mouseup', handler);
+      target.addEventListener('touchend', handler);
+    }
   };
   const removeEvent = (target, type, handler) => {
-    target.removeEventListener(getEventName(type), handler);
+    if (type === 'start') {
+      target.removeEventListener('mousedown', handler);
+      target.removeEventListener('touchstart', handler);
+    } else {
+      target.removeEventListener('mouseup', handler);
+      target.removeEventListener('touchend', handler);
+    }
   };
 
   export default {
@@ -135,6 +139,18 @@
         removeEvent(document.body, 'end', this.endRipple);
       },
       startRipple(event) {
+        if (event.type === 'touchstart') {
+          this.previous.push('touch');
+        } else {
+          this.previous.push('mouse');
+        }
+
+        this.previous = this.previous.splice(this.previous.length - 2, this.previous.length);
+
+        if (this.previous.length >= 2 && this.previous[1] === 'touch' && this.previous[0] === 'mouse') {
+          return;
+        }
+
         this.clearState();
         this.awaitingComplete = window.setTimeout(() => {
           this.hasCompleted = true;
@@ -169,6 +185,7 @@
       init() {
         this.rippleElement = this.$el;
         this.parentElement = this.getClosestPositionedParent(this.$el.parentNode);
+        this.previous = ['mouse'];
 
         if (!this.parentElement) {
           this.$destroy();