From 43d86d7d5d3f3b34b0500f6d5d3afe7bd86b0060 Mon Sep 17 00:00:00 2001 From: Haocen Xu Date: Fri, 6 Jul 2018 12:48:46 -0400 Subject: Hotfix for mobile device --- client/lib/utils.js | 46 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) (limited to 'client/lib') diff --git a/client/lib/utils.js b/client/lib/utils.js index 1f44c60d..7e2651d2 100644 --- a/client/lib/utils.js +++ b/client/lib/utils.js @@ -95,6 +95,52 @@ Utils = { increment, }; }, + + // Detect touch device + isTouchDevice() { + const isTouchable = (() => { + const prefixes = ' -webkit- -moz- -o- -ms- '.split(' '); + const mq = function(query) { + return window.matchMedia(query).matches; + }; + + if (('ontouchstart' in window) || window.DocumentTouch && document instanceof window.DocumentTouch) { + return true; + } + + // include the 'heartz' as a way to have a non matching MQ to help terminate the join + // https://git.io/vznFH + const query = ['(', prefixes.join('touch-enabled),('), 'heartz', ')'].join(''); + return mq(query); + })(); + return isTouchable; + }, + + calculateTouchDistance(touchA, touchB) { + return Math.sqrt( + Math.pow(touchA.screenX - touchB.screenX, 2) + + Math.pow(touchA.screenY - touchB.screenY, 2) + ); + }, + + enableClickOnTouch(element) { + let touchStart = null; + let lastTouch = null; + element.addEventListener('touchstart', function(e) { + touchStart = e.touches[0]; + }, false); + element.addEventListener('touchmove', function(e) { + const touches = e.touches; + lastTouch = touches[touches.length - 1]; + }, true); + element.addEventListener('touchend', function() { + if (touchStart && lastTouch && Utils.calculateTouchDistance(touchStart, lastTouch) <= 20) { + const clickEvent = document.createEvent('MouseEvents'); + clickEvent.initEvent('click', true, true); + this.dispatchEvent(clickEvent); + } + }, false); + }, }; // A simple tracker dependency that we invalidate every time the window is -- cgit v1.2.3-1-g7c22