Initial Commit
This commit is contained in:
209
src/JS/jquery.ui.touch.js
vendored
Normal file
209
src/JS/jquery.ui.touch.js
vendored
Normal file
@@ -0,0 +1,209 @@
|
||||
/**
|
||||
* jQuery.UI.iPad plugin
|
||||
* Copyright (c) 2010 Stephen von Takach
|
||||
* licensed under MIT.
|
||||
* Date: 27/8/2010
|
||||
*
|
||||
* Project Home:
|
||||
* http://code.google.com/p/jquery-ui-for-ipad-and-iphone/
|
||||
*
|
||||
* Modified: 19/01/2012
|
||||
* Organized as a proper plugin and added addTouch()
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(['jquery'], factory);
|
||||
} else if (typeof module === 'object' && module.exports) {
|
||||
// Node/CommonJS
|
||||
module.exports = factory(require('jquery'));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
}(function ($) {
|
||||
|
||||
var lastTap = null; // Holds last tapped element (so we can compare for double tap)
|
||||
var tapValid = false; // Are we still in the .6 second window where a double tap can occur
|
||||
var tapTimeout = null; // The timeout reference
|
||||
var rightClickPending = false; // Is a right click still feasible
|
||||
var rightClickEvent = null; // the original event
|
||||
var holdTimeout = null; // timeout reference
|
||||
var cancelMouseUp = false; // prevents a click from occuring as we want the context menu
|
||||
|
||||
function cancelTap() {
|
||||
tapValid = false;
|
||||
};
|
||||
|
||||
function cancelHold() {
|
||||
if (rightClickPending) {
|
||||
window.clearTimeout(holdTimeout);
|
||||
rightClickPending = false;
|
||||
rightClickEvent = null;
|
||||
}
|
||||
};
|
||||
|
||||
function startHold(event) {
|
||||
if (rightClickPending)
|
||||
return;
|
||||
|
||||
rightClickPending = true; // We could be performing a right click
|
||||
rightClickEvent = (event.changedTouches)[0];
|
||||
holdTimeout = window.setTimeout(doRightClick, 800);
|
||||
};
|
||||
|
||||
function doRightClick() {
|
||||
rightClickPending = false;
|
||||
|
||||
// We need to mouse up (as we were down)
|
||||
var first = rightClickEvent,
|
||||
simulatedEvent = document.createEvent("MouseEvent");
|
||||
simulatedEvent.initMouseEvent("mouseup", true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY,
|
||||
false, false, false, false, 0, null);
|
||||
first.target.dispatchEvent(simulatedEvent);
|
||||
|
||||
// Emulate a right click
|
||||
simulatedEvent = document.createEvent("MouseEvent");
|
||||
simulatedEvent.initMouseEvent("mousedown", true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY,
|
||||
false, false, false, false, 2, null);
|
||||
first.target.dispatchEvent(simulatedEvent);
|
||||
|
||||
// Show a context menu
|
||||
simulatedEvent = document.createEvent("MouseEvent");
|
||||
simulatedEvent.initMouseEvent("contextmenu", true, true, window, 1, first.screenX + 50, first.screenY + 5, first.clientX + 50, first.clientY + 5,
|
||||
false, false, false, false, 2, null);
|
||||
first.target.dispatchEvent(simulatedEvent);
|
||||
|
||||
// Note: I don't mouse up the right click here however feel free to add if required
|
||||
cancelMouseUp = true;
|
||||
rightClickEvent = null; // Release memory
|
||||
};
|
||||
|
||||
// mouse over event then mouse down
|
||||
function iPadTouchStart(event) {
|
||||
var touches = event.changedTouches,
|
||||
first = touches[0],
|
||||
type = "mouseover",
|
||||
simulatedEvent = document.createEvent("MouseEvent");
|
||||
|
||||
// Mouse over first - I have live events attached on mouse over
|
||||
simulatedEvent.initMouseEvent(type, true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY,
|
||||
false, false, false, false, 0, null);
|
||||
first.target.dispatchEvent(simulatedEvent);
|
||||
|
||||
type = "mousedown";
|
||||
simulatedEvent = document.createEvent("MouseEvent");
|
||||
|
||||
simulatedEvent.initMouseEvent(type, true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY,
|
||||
false, false, false, false, 0, null);
|
||||
first.target.dispatchEvent(simulatedEvent);
|
||||
|
||||
|
||||
if (!tapValid) {
|
||||
lastTap = first.target;
|
||||
tapValid = true;
|
||||
tapTimeout = window.setTimeout(cancelTap, 600);
|
||||
startHold(event);
|
||||
}
|
||||
else {
|
||||
window.clearTimeout(tapTimeout);
|
||||
|
||||
// If a double tap is still a possibility and the elements are the same then perform a double click
|
||||
if (first.target == lastTap) {
|
||||
lastTap = null;
|
||||
tapValid = false;
|
||||
|
||||
type = "click";
|
||||
simulatedEvent = document.createEvent("MouseEvent");
|
||||
|
||||
simulatedEvent.initMouseEvent(type, true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY,
|
||||
false, false, false, false, 0/*left*/, null);
|
||||
first.target.dispatchEvent(simulatedEvent);
|
||||
|
||||
type = "dblclick";
|
||||
simulatedEvent = document.createEvent("MouseEvent");
|
||||
|
||||
simulatedEvent.initMouseEvent(type, true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY,
|
||||
false, false, false, false, 0/*left*/, null);
|
||||
first.target.dispatchEvent(simulatedEvent);
|
||||
}
|
||||
else {
|
||||
lastTap = first.target;
|
||||
tapValid = true;
|
||||
tapTimeout = window.setTimeout(cancelTap, 600);
|
||||
startHold(event);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function iPadTouchHandler(event) {
|
||||
var type = "",
|
||||
button = 0; /*left*/
|
||||
|
||||
if (event.touches.length > 1)
|
||||
return;
|
||||
|
||||
switch (event.type) {
|
||||
case "touchstart":
|
||||
if ($(event.changedTouches[0].target).is("select")) {
|
||||
return;
|
||||
}
|
||||
iPadTouchStart(event); /*We need to trigger two events here to support one touch drag and drop*/
|
||||
event.preventDefault();
|
||||
return false;
|
||||
break;
|
||||
|
||||
case "touchmove":
|
||||
cancelHold();
|
||||
type = "mousemove";
|
||||
event.preventDefault();
|
||||
break;
|
||||
|
||||
case "touchend":
|
||||
if (cancelMouseUp) {
|
||||
cancelMouseUp = false;
|
||||
event.preventDefault();
|
||||
return false;
|
||||
}
|
||||
cancelHold();
|
||||
type = "mouseup";
|
||||
break;
|
||||
|
||||
default:
|
||||
return;
|
||||
}
|
||||
|
||||
var touches = event.changedTouches,
|
||||
first = touches[0],
|
||||
simulatedEvent = document.createEvent("MouseEvent");
|
||||
|
||||
simulatedEvent.initMouseEvent(type, true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY,
|
||||
false, false, false, false, button, null);
|
||||
|
||||
first.target.dispatchEvent(simulatedEvent);
|
||||
|
||||
if (type == "mouseup" && tapValid && first.target == lastTap) { // This actually emulates the ipads default behaviour (which we prevented)
|
||||
simulatedEvent = document.createEvent("MouseEvent"); // This check avoids click being emulated on a double tap
|
||||
|
||||
simulatedEvent.initMouseEvent("click", true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY,
|
||||
false, false, false, false, button, null);
|
||||
|
||||
first.target.dispatchEvent(simulatedEvent);
|
||||
}
|
||||
};
|
||||
|
||||
var touchAvailable = ("ontouchend" in document);
|
||||
|
||||
$.fn.addTouch = function() {
|
||||
if (touchAvailable) {
|
||||
this.each(function(i,el){
|
||||
el.addEventListener("touchstart", iPadTouchHandler, false);
|
||||
el.addEventListener("touchmove", iPadTouchHandler, false);
|
||||
el.addEventListener("touchend", iPadTouchHandler, false);
|
||||
el.addEventListener("touchcancel", iPadTouchHandler, false);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
}));
|
||||
Reference in New Issue
Block a user