TouchSwipe-Jquery-Plugin icon indicating copy to clipboard operation
TouchSwipe-Jquery-Plugin copied to clipboard

No dragging on Mozilla FireFox (48.0)

Open koenpopma opened this issue 7 years ago • 5 comments

Trying to create a draggable slider with swipe functionalities attached;

On Safari (536.25), Chrome (44.0.2403.89 Safari/537.36) dragging works, with this setup:

$(document).swipe({
	swipeStatus:function(event, phase, direction, distance, duration, fingers, fingerData, currentDirection){
		console.log("DRAGGING: " + direction +", "+ distance );
		dragging( direction, distance );
	},
	swipeLeft:function(event, distance, duration, fingerCount, fingerData, currentDirection) {
		console.log("LEFT");
		next();
	},
        swipeRight:function(event, distance, duration, fingerCount, fingerData, currentDirection) {
		console.log("RIGHT");
		prev();
	},
	threshold:			10,
	fingers:			"all",
	allowPageScroll:	"auto",
});

function dragging( direction, distance ){
	// handle the dragging
	if( direction == "left" ){
		drag = 0-distance;
	}else if( direction == "right" ){
		drag = distance;
	}else{
//		drag = drag;
	}
	
	// simplified for this example
	$(".swipe-content").css({
		left:	drag+"px" // moves the content with the dragging
	});
}
function prev( ){
	// go to prev
	// ...
}
function next( ){
	// go to next
	// ...
}

... and on Mozilla FireFox (48.0) it —the dragging— does not work?!?

This event is not even listed in the console... ?!?

console.log("DRAGGING: " + direction +", "+ distance );

Is there a bug at the cursor-event? Can someone help me to fix this?

PS: Even this is not in the console at Mozilla FireFox 48.0 (while it is in the other browsers):

$(document).swipe({
	swipeStatus:function(event, phase, direction, distance, duration, fingers, fingerData, currentDirection){
		console.log(
			"SwipeStatus:"						+
			"event: "		+	event			+ ", " +
			"phase: "		+	phase			+ ", " +
			"direction: "		+	direction		+ ", " +
			"distance: "		+	distance		+ ", " +
			"duration: "		+	duration		+ ", " +
			"fingers: "		+	fingers			+ ", " +
			"fingerData: "		+	fingerData		+ ", " +
			"currentDirection: "	+	currentDirection
		);
	},
	threshold:			0,
	fingers:			"all",
});

Like this isn't even triggered ?!?

koenpopma avatar May 03 '17 19:05 koenpopma

@koenpopma I've the same problem here. Looking into it, it turned out that Firefox returns true for 'ontouchstart' in window, at least in Windows 10 X64, while other desktop browsers return false, so that SUPPORTS_TOUCH is somehow faked enabled. Hence touch simulation is disabled in Firefox from line 461 of current jquery.touchSwipe.js.

bic-ed avatar Feb 05 '18 21:02 bic-ed

BTW, determining if user device has touch ability is not that simple. May be refining SUPPORTS_TOUCH detection with something like: SUPPORTS_TOUCH = 'ontouchstart' in window & navigator.maxTouchPoints could be a more reliable approach, even if it returns 1/0 instead of true/false.

bic-ed avatar Feb 05 '18 22:02 bic-ed

Hi @mattbryson, this is very interesting I suppose: https://codeburst.io/the-only-way-to-detect-touch-with-javascript-7791a3346685

In my application, swipe is initialized only after an user action, so the onFirstTouch event described in the link above works like a charm for me. I've no idea if there could be a way to delay initialization after first interaction for every possible use of the script (probably not).

bic-ed avatar Feb 08 '18 09:02 bic-ed

Ill look at this as part of the next release that re works the event model

mattbryson avatar Sep 17 '18 11:09 mattbryson

Hi, I'm back here just to say that in a newer version of Firefox dragging works as expected. Tested on Firefox 78.0.2 (64 bits).

bic-ed avatar Jul 25 '20 12:07 bic-ed