Created
February 13, 2020 10:25
-
-
Save galek/3bd65abccd9ba4a0e55091bff7236fe9 to your computer and use it in GitHub Desktop.
swapper.js for cordova
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Copyright (C) 2009-2020, Nick Galko. All rights reserved. | |
* | |
* This file is part of the Nick Galko source-code | |
* (https://galek.github.io/portfolio/). | |
* | |
* Your use and or redistribution of this software in source and / or | |
* binary form, with or without modification, is subject to: (i) your | |
* ongoing acceptance of and compliance with the terms and conditions of | |
* the Nick Galko License Agreement; and (ii) your inclusion of this notice | |
* in any version of this software that you use or redistribute. | |
* A copy of the NGTech License Agreement is available by contacting | |
* Nick Galko. at https://galek.github.io/portfolio/ | |
*/ | |
/** | |
* Функция свайпа | |
* @param {any} el | |
* @param {any} callback | |
*/ | |
function SwipeDetect(el, callback) { | |
var touchsurface = el, | |
swipedir, | |
startX, | |
startY, | |
distX, | |
distY, | |
threshold = 150, //required min distance traveled to be considered swipe | |
restraint = 100, // maximum distance allowed at the same time in perpendicular direction | |
allowedTime = 300, // maximum time allowed to travel that distance | |
elapsedTime, | |
startTime, | |
handleswipe = callback || function (swipedir) { } | |
touchsurface.addEventListener('touchstart', function (e) { | |
var touchobj = e.changedTouches[0] | |
swipedir = 'none' | |
dist = 0 | |
startX = touchobj.pageX | |
startY = touchobj.pageY | |
startTime = new Date().getTime() // record time when finger first makes contact with surface | |
e.preventDefault() | |
}, false) | |
touchsurface.addEventListener('touchmove', function (e) { | |
e.preventDefault() // prevent scrolling when inside DIV | |
}, false) | |
touchsurface.addEventListener('touchend', function (e) { | |
var touchobj = e.changedTouches[0] | |
distX = touchobj.pageX - startX // get horizontal dist traveled by finger while in contact with surface | |
distY = touchobj.pageY - startY // get vertical dist traveled by finger while in contact with surface | |
elapsedTime = new Date().getTime() - startTime // get time elapsed | |
if (elapsedTime <= allowedTime) { // first condition for awipe met | |
if (Math.abs(distX) >= threshold && Math.abs(distY) <= restraint) { // 2nd condition for horizontal swipe met | |
swipedir = (distX < 0) ? 'left' : 'right' // if dist traveled is negative, it indicates left swipe | |
} | |
else if (Math.abs(distY) >= threshold && Math.abs(distX) <= restraint) { // 2nd condition for vertical swipe met | |
swipedir = (distY < 0) ? 'up' : 'down' // if dist traveled is negative, it indicates up swipe | |
} | |
} | |
handleswipe(swipedir) | |
e.preventDefault() | |
}, false) | |
} | |
/**USAGE**/ | |
/* | |
function InitTouchSurface() { | |
var el = document.getElementById('touchsurface'); | |
SwipeDetect(el, function (swipedir) { | |
if (swipedir == 'left') { | |
alert('You just swiped left!' + activatedNumber) | |
} | |
else if (swipedir == 'right') { | |
alert('You just swiped right!' + act | |
} | |
}) | |
*/ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment