diff --git a/static/fedilove-no-react.js b/static/fedilove-no-react.js index de276be7..acfac1e4 100644 --- a/static/fedilove-no-react.js +++ b/static/fedilove-no-react.js @@ -60,25 +60,60 @@ function api_send_message() { } var fediloveUI = { + registerSwipeOnElementEvents: { + elements: [], + vars: { + startX: null, startY: null, dist: null, + threshold: 30, allowedTime: 200, + elapsedTime: 0, startTime: null + }, + touchstart: function(e) { + const vars = fediloveUI.registerSwipeOnElementEvents.vars; + const touchobj = e.changedTouches[0]; + + vars.dist = 0; vars.startX = touchobj.pageX; vars.startY = touchobj.pageY; + vars.startTime = new Date().getTime(); e.preventDefault(); + }, + touchmove: function(e) { e.preventDefault() }, + touchend: function(e) { + if (fediloveUI.registerSwipeOnElementEvents.touchendCallback != null) { + const vars = fediloveUI.registerSwipeOnElementEvents.vars; + const touchobj = e.changedTouches[0]; + vars.dist = touchobj.pageX - vars.startX; + vars.elapsedTime = new Date().getTime() - vars.startTime; + + if (Math.abs(vars.dist) < 20) { return e.preventDefault(); } + + const swiperightBol = (vars.elapsedTime <= vars.allowedTime && vars.dist >= vars.threshold); + + fediloveUI.registerSwipeOnElementEvents.touchendCallback(swiperightBol); + e.preventDefault(); + } + }, + touchendCallback: null + }, + unregisterSwipeOnElement: function(selector) { + const element = document.querySelector(selector); + if (element === null || element === undefined) return; + + fediloveUI.registerSwipeOnElementEvents.elements = fediloveUI.registerSwipeOnElementEvents.elements.filter( + function(item) { return item !== selector }); + element.removeEventListener('touchstart', fediloveUI.registerSwipeOnElementEvents.touchstart); + element.removeEventListener('touchmove', fediloveUI.registerSwipeOnElementEvents.touchmove); + element.removeEventListener('touchend', fediloveUI.registerSwipeOnElementEvents.touchend); + }, registerSwipeOnElement: function(selector, cbackFunc) { - var touchsurface; - if (typeof selector == "string") - touchsurface = document.querySelector(selector); - else if (typeof selector == "object") - touchsurface = selector; - else return true; - var startX,startY,dist,threshold = 30,allowedTime = 200,elapsedTime,startTime; - touchsurface.addEventListener('touchstart', function(e){ - const touchobj = e.changedTouches[0]; dist = 0; startX = touchobj.pageX; startY = touchobj.pageY; - startTime = new Date().getTime(); e.preventDefault(); - }, false); - touchsurface.addEventListener('touchmove', function(e){ e.preventDefault() }, false); - touchsurface.addEventListener('touchend', function(e){ - const touchobj = e.changedTouches[0]; dist = touchobj.pageX - startX; elapsedTime = new Date().getTime() - startTime; - if (Math.abs(dist) < 20) { return e.preventDefault(); } - const swiperightBol = (elapsedTime <= allowedTime && dist >= threshold); - cbackFunc(swiperightBol); e.preventDefault(); - }, false); + const element = document.querySelector(selector); + if (element === null || element === undefined) return; + + if (fediloveUI.registerSwipeOnElementEvents.elements.includes(selector)) + return true; + + fediloveUI.registerSwipeOnElementEvents.elements.push(selector); + fediloveUI.registerSwipeOnElementEvents.touchendCallback = cbackFunc; + element.addEventListener('touchstart', fediloveUI.registerSwipeOnElementEvents.touchstart, false); + element.addEventListener('touchmove', fediloveUI.registerSwipeOnElementEvents.touchmove, false); + element.addEventListener('touchend', fediloveUI.registerSwipeOnElementEvents.touchend, false); }, meetAccountImageDirection: function(direction) { if (!window.location.pathname.startsWith('/accounts') || @@ -314,6 +349,8 @@ function fedilove_customization() { document.querySelector('#chat-compose-global').style = 'visibility: collapse'; document.querySelector('#chat-party-hide').style = 'display: none !important'; document.querySelector('nav#main-nav > ul.main-nav-ul').style = ''; + fediloveUI.unregisterSwipeOnElement('main.infinite-scroll-page'); + fediloveUI.unregisterSwipeOnElement('#meet-navigation #anim-swipe'); fediloveData.currentAccountIsEmpty = false; $('nav#main-nav li.main-nav-li svg').each(function() {