Support fadeOut on drag animation

This commit is contained in:
Niko 2022-02-14 17:08:53 +01:00
parent b9bded862e
commit 24d7e087fe
2 changed files with 12 additions and 5 deletions

View File

@ -11,8 +11,8 @@ function dragElement(elmnt, options, onStopDrag) {
e = e || window.event; e = e || window.event;
e.preventDefault(); e.preventDefault();
const isMobile = e.touches !== undefined; const isMobile = e.touches !== undefined;
const cx = !isMobile ? e.clientX : e.touches[0].clientX * 2; const cx = !isMobile ? e.clientX : e.touches[0].clientX * 1.3;
const cy = !isMobile ? e.clientY : e.touches[0].clientY * 2; const cy = !isMobile ? e.clientY : e.touches[0].clientY * 1.3;
// get the mouse cursor position at startup: // get the mouse cursor position at startup:
if (options.x === undefined || options.x === true) if (options.x === undefined || options.x === true)
pos3 = cx; pos3 = cx;
@ -31,8 +31,8 @@ function dragElement(elmnt, options, onStopDrag) {
e = e || window.event; e = e || window.event;
e.preventDefault(); e.preventDefault();
const isMobile = e.touches !== undefined; const isMobile = e.touches !== undefined;
const cx = !isMobile ? e.clientX : e.touches[0].clientX * 2; const cx = !isMobile ? e.clientX : e.touches[0].clientX * 1.3;
const cy = !isMobile ? e.clientY : e.touches[0].clientY * 2; const cy = !isMobile ? e.clientY : e.touches[0].clientY * 1.3;
if (options.x === undefined || options.x === true) if (options.x === undefined || options.x === true)
pos1 = pos3 - cx; pos1 = pos3 - cx;
if (options.y === undefined || options.y === true) if (options.y === undefined || options.y === true)
@ -53,6 +53,13 @@ function dragElement(elmnt, options, onStopDrag) {
const mu = !isMobile ? 8 : 4; const mu = !isMobile ? 8 : 4;
elmnt.style.top = parseInt(Math.abs(n)*mu) + "px" elmnt.style.top = parseInt(Math.abs(n)*mu) + "px"
} }
if (options.fadeOut) {
const d = (ipos3 - pos3);
var n = d < 0 ? Math.abs(d) : Math.abs(d) - Math.abs(d)*2;
n = parseInt(Math.abs(n / 7)) / 100;
if (n > 1) n = 1; n = 1 - n;
elmnt.style.opacity = n;
}
} }
function closeDragElement() { function closeDragElement() {

View File

@ -57,7 +57,7 @@ app.pages.meet = {
setDragEvent: function() { setDragEvent: function() {
const current = app.pages.meet.carousel._elements()[ const current = app.pages.meet.carousel._elements()[
app.pages.meet.carousel._current]; app.pages.meet.carousel._current];
var options = { y: false, return2start: true }; var options = { y: false, return2start: true, fadeOut: true };
if (!app.carousel.hasPrev(app.pages.meet.carousel)) if (!app.carousel.hasPrev(app.pages.meet.carousel))
options.right = false; options.right = false;
if (!app.carousel.hasNext(app.pages.meet.carousel)) if (!app.carousel.hasNext(app.pages.meet.carousel))