// This was taken from //webclient. /** * jQuery plug-in. */ (function($) { /** * IE9 does not support touch events, only mouse events. We need to adjust appropriately. * Also, some methods for getting the right target and right coordinates of the event. */ var touch = ("ontouchstart" in document.body); $.touchEvents = { isTouch: touch, start: (touch) ? "touchstart" : "mousedown", move: (touch) ? "touchmove" : "mousemove", end: (touch) ? "touchend" : "mouseup mouseout", endOnly:(touch) ? "touchend touchcancel" : "mouseup", cancel: (touch) ? "touchend touchcancel touchmove" : "mouseup mousemove mouseout", getTarget: function(e) { return touch ? $(e.originalEvent.touches[0].target) : $(e.target); }, getCoord: function(e) { // e.originalEvent is necessary because you are using jQuery. return touch ? {x: e.originalEvent.touches[0].pageX, y: e.originalEvent.touches[0].pageY} : {x: e.pageX, y: e.pageY}; } }; /** * Make the provided elements "pressable" (give them a press state when touched). If * the element has a class token of "disabled", then the press effect will not * be applied. * * DO NOT use pressable() to emulate list selection behavior. It won't work when * you then try and embed an actionable control within the list (e.g. a play button * for a video, or a favoriting star). Instead, use the List mixin behavior. * */ // Modified from //webclient version. Simplified. $.fn.pressable = function() { var HL_CLASS = 'hl'; return this .on($.touchEvents.start, function(e) { var $this = $(this); if (!$this.hasClass("disabled")) { $this.addClass(HL_CLASS); } }) .on($.touchEvents.cancel, function(e) { $(this).removeClass(HL_CLASS); }); }; }(Zepto));