Core: add pointer event options. Fixes #885

Add pointerUp, pointerDown, pointerClick options

dist/js/jquery.tablesorter.combined.js

@@ -1,4 +1,4 @@
-/*! tablesorter (FORK) - updated 04-16-2015 (v2.21.5)*/
+/*! tablesorter (FORK) - updated 04-25-2015 (v2.21.5)*/
 /* Includes widgets ( storage,uitheme,columns,filter,stickyHeaders,resizable,saveSort ) */
 (function(factory) {
 	if (typeof define === 'function' && define.amd) {
@@ -113,6 +113,11 @@
 				cssNoSort        : 'tablesorter-noSort',      // class name added to element inside header; clicking on it won't cause a sort
 				cssIgnoreRow     : 'tablesorter-ignoreRow',   // header row to ignore; cells within this row will not be added to c.$headers
 
+				// *** events
+				pointerClick     : 'click',
+				pointerDown      : 'mousedown',
+				pointerUp        : 'mouseup',
+
 				// *** selectors
 				selectorHeaders  : '> thead th, > thead td',
 				selectorSort     : 'th, td',   // jQuery selector of content within selectorHeaders that is clickable to trigger a sort
@@ -1349,28 +1354,35 @@
 						$(t).addClass( c.namespace.slice(1) + '_extra_table' );
 					}
 				}
+				t = ( c.pointerDown + ' ' + c.pointerUp + ' ' + c.pointerClick + ' sort keyup ' )
+					.replace(/\s+/g, ' ')
+					.split(' ')
+					.join(c.namespace + ' ');
 				// apply event handling to headers and/or additional headers (stickyheaders, scroller, etc)
 				$headers
 				// http://stackoverflow.com/questions/5312849/jquery-find-self;
 				.find(c.selectorSort).add( $headers.filter(c.selectorSort) )
-				.unbind( ('mousedown mouseup click sort keyup '.split(' ').join(c.namespace + ' ')).replace(/\s+/g, ' ') )
+				.unbind(t)
-				.bind( 'mousedown mouseup click sort keyup '.split(' ').join(c.namespace + ' '), function(e, external) {
+				.bind(t, function(e, external) {
 					var cell,
 						$target = $(e.target),
-						type = e.type;
+						// wrap event type in spaces, so the match doesn't trigger on inner words
+						type = ' ' + e.type + ' ';
 					// only recognize left clicks
-					if ( ( ( e.which || e.button ) !== 1 && !/sort|keyup|click/.test(type) ) ||
+					if ( ( ( e.which || e.button ) !== 1 && !type.match( ' ' + c.pointerClick + ' | sort | keyup ' ) ) ||
 						// allow pressing enter
 						( type === ' keyup ' && e.which !== 13 ) ||
 						// allow triggering a click event (e.which is undefined) & ignore physical clicks
-						( type === 'click' && typeof e.which !== 'undefined' ) ) {
+						( type.match(' ' + c.pointerClick + ' ') && typeof e.which !== 'undefined' ) ) {
 						return;
 					}
 					// ignore mouseup if mousedown wasn't on the same target
-					if ( type === 'mouseup' && downTarget !== e.target && external !== true ) { return; }
+					if ( type.match(' ' + c.pointerUp + ' ') && downTarget !== e.target && external !== true ) { return; }
 					// set timer on mousedown
-					if ( type === 'mousedown' ) {
+					if ( type.match(' ' + c.pointerDown + ' ') ) {
 						downTarget = e.target;
+						// needed or jQuery v1.2.6 throws an error
+						e.preventDefault();
 						return;
 					}
 					downTarget = null;

dist/js/jquery.tablesorter.js

@@ -111,6 +111,11 @@
 				cssNoSort        : 'tablesorter-noSort',      // class name added to element inside header; clicking on it won't cause a sort
 				cssIgnoreRow     : 'tablesorter-ignoreRow',   // header row to ignore; cells within this row will not be added to c.$headers
 
+				// *** events
+				pointerClick     : 'click',
+				pointerDown      : 'mousedown',
+				pointerUp        : 'mouseup',
+
 				// *** selectors
 				selectorHeaders  : '> thead th, > thead td',
 				selectorSort     : 'th, td',   // jQuery selector of content within selectorHeaders that is clickable to trigger a sort
@@ -1347,28 +1352,35 @@
 						$(t).addClass( c.namespace.slice(1) + '_extra_table' );
 					}
 				}
+				t = ( c.pointerDown + ' ' + c.pointerUp + ' ' + c.pointerClick + ' sort keyup ' )
+					.replace(/\s+/g, ' ')
+					.split(' ')
+					.join(c.namespace + ' ');
 				// apply event handling to headers and/or additional headers (stickyheaders, scroller, etc)
 				$headers
 				// http://stackoverflow.com/questions/5312849/jquery-find-self;
 				.find(c.selectorSort).add( $headers.filter(c.selectorSort) )
-				.unbind( ('mousedown mouseup click sort keyup '.split(' ').join(c.namespace + ' ')).replace(/\s+/g, ' ') )
+				.unbind(t)
-				.bind( 'mousedown mouseup click sort keyup '.split(' ').join(c.namespace + ' '), function(e, external) {
+				.bind(t, function(e, external) {
 					var cell,
 						$target = $(e.target),
-						type = e.type;
+						// wrap event type in spaces, so the match doesn't trigger on inner words
+						type = ' ' + e.type + ' ';
 					// only recognize left clicks
-					if ( ( ( e.which || e.button ) !== 1 && !/sort|keyup|click/.test(type) ) ||
+					if ( ( ( e.which || e.button ) !== 1 && !type.match( ' ' + c.pointerClick + ' | sort | keyup ' ) ) ||
 						// allow pressing enter
 						( type === ' keyup ' && e.which !== 13 ) ||
 						// allow triggering a click event (e.which is undefined) & ignore physical clicks
-						( type === 'click' && typeof e.which !== 'undefined' ) ) {
+						( type.match(' ' + c.pointerClick + ' ') && typeof e.which !== 'undefined' ) ) {
 						return;
 					}
 					// ignore mouseup if mousedown wasn't on the same target
-					if ( type === 'mouseup' && downTarget !== e.target && external !== true ) { return; }
+					if ( type.match(' ' + c.pointerUp + ' ') && downTarget !== e.target && external !== true ) { return; }
 					// set timer on mousedown
-					if ( type === 'mousedown' ) {
+					if ( type.match(' ' + c.pointerDown + ' ') ) {
 						downTarget = e.target;
+						// needed or jQuery v1.2.6 throws an error
+						e.preventDefault();
 						return;
 					}
 					downTarget = null;

docs/index.html

@@ -1692,6 +1692,43 @@ $(function(){
 				<td></td>
 			</tr>
 
+			<tr id="pointerclick">
+				<td><a href="#" class="permalink">pointerClick</a></td>
+				<td>String</td>
+				<td>&quot;click&quot;</td>
+				<td>Use this option to change the click event (<span class="version">v2.21.6</span>)
+					<div class="collapsible">
+						<p>Change this option if want to change the click event that is bound to the table headers. Add multiple events separated by spaces.</p>
+						<span class="label label-warning">Warning</span> If this option is set to fire multiple events (e.g. <code>'mouseup pointerup'</code>), sorting may be initialized twice in rapid succession and make it appear that nothing changed.
+					</div>
+				</td>
+				<td></td>
+			</tr>
+			<tr id="pointerdown">
+				<td><a href="#" class="permalink">pointerDown</a></td>
+				<td>String</td>
+				<td>&quot;mousedown&quot;</td>
+				<td>Use this option to change the pointer down event (<span class="version">v2.21.6</span>)
+					<div class="collapsible">
+						<p>Change this option if you're using pointer events (or the <a href="https://github.com/jquery/PEP">pointer events polyfill</a>). Add multiple events separated by spaces.</p>
+						<span class="label label-warning">Warning</span> If this option is set to fire multiple events (e.g. <code>'mousedown pointerdown'</code>), sorting may be initialized twice in rapid succession and make it appear that nothing changed.
+					</div>
+				</td>
+				<td></td>
+			</tr>
+			<tr id="pointerup">
+				<td><a href="#" class="permalink">pointerUp</a></td>
+				<td>String</td>
+				<td>&quot;mouseup&quot;</td>
+				<td>Use this option to change the pointer up event (<span class="version">v2.21.6</span>)
+					<div class="collapsible">
+						<p>Change this option if you're using pointer events (or the <a href="https://github.com/jquery/PEP">pointer events polyfill</a>). Add multiple events separated by spaces.</p>
+						<span class="label label-warning">Warning</span> If this option is set to fire multiple events (e.g. <code>'mouseup pointerup'</code>), sorting may be initialized twice in rapid succession and make it appear that nothing changed.
+					</div>
+				</td>
+				<td></td>
+			</tr>
+
 			<tr id="textsorter">
 				<td><a href="#" class="permalink">textSorter</a></td>
 				<td>Function</td>

js/jquery.tablesorter.combined.js

@@ -4,7 +4,7 @@
 ██  ██ ██  ██   ██  ██ ██  ██   ██     ██ ██ ██ ██  ██ ██  ██ ██ ██▀▀   ▀▀▀▀██
 █████▀ ▀████▀   ██  ██ ▀████▀   ██     ██ ██ ██ ▀████▀ █████▀ ██ ██     █████▀
 */
-/*! tablesorter (FORK) - updated 04-16-2015 (v2.21.5)*/
+/*! tablesorter (FORK) - updated 04-25-2015 (v2.21.5)*/
 /* Includes widgets ( storage,uitheme,columns,filter,stickyHeaders,resizable,saveSort ) */
 (function(factory) {
 	if (typeof define === 'function' && define.amd) {
@@ -119,6 +119,11 @@
 				cssNoSort        : 'tablesorter-noSort',      // class name added to element inside header; clicking on it won't cause a sort
 				cssIgnoreRow     : 'tablesorter-ignoreRow',   // header row to ignore; cells within this row will not be added to c.$headers
 
+				// *** events
+				pointerClick     : 'click',
+				pointerDown      : 'mousedown',
+				pointerUp        : 'mouseup',
+
 				// *** selectors
 				selectorHeaders  : '> thead th, > thead td',
 				selectorSort     : 'th, td',   // jQuery selector of content within selectorHeaders that is clickable to trigger a sort
@@ -1355,28 +1360,35 @@
 						$(t).addClass( c.namespace.slice(1) + '_extra_table' );
 					}
 				}
+				t = ( c.pointerDown + ' ' + c.pointerUp + ' ' + c.pointerClick + ' sort keyup ' )
+					.replace(/\s+/g, ' ')
+					.split(' ')
+					.join(c.namespace + ' ');
 				// apply event handling to headers and/or additional headers (stickyheaders, scroller, etc)
 				$headers
 				// http://stackoverflow.com/questions/5312849/jquery-find-self;
 				.find(c.selectorSort).add( $headers.filter(c.selectorSort) )
-				.unbind( ('mousedown mouseup click sort keyup '.split(' ').join(c.namespace + ' ')).replace(/\s+/g, ' ') )
+				.unbind(t)
-				.bind( 'mousedown mouseup click sort keyup '.split(' ').join(c.namespace + ' '), function(e, external) {
+				.bind(t, function(e, external) {
 					var cell,
 						$target = $(e.target),
-						type = e.type;
+						// wrap event type in spaces, so the match doesn't trigger on inner words
+						type = ' ' + e.type + ' ';
 					// only recognize left clicks
-					if ( ( ( e.which || e.button ) !== 1 && !/sort|keyup|click/.test(type) ) ||
+					if ( ( ( e.which || e.button ) !== 1 && !type.match( ' ' + c.pointerClick + ' | sort | keyup ' ) ) ||
 						// allow pressing enter
 						( type === ' keyup ' && e.which !== 13 ) ||
 						// allow triggering a click event (e.which is undefined) & ignore physical clicks
-						( type === 'click' && typeof e.which !== 'undefined' ) ) {
+						( type.match(' ' + c.pointerClick + ' ') && typeof e.which !== 'undefined' ) ) {
 						return;
 					}
 					// ignore mouseup if mousedown wasn't on the same target
-					if ( type === 'mouseup' && downTarget !== e.target && external !== true ) { return; }
+					if ( type.match(' ' + c.pointerUp + ' ') && downTarget !== e.target && external !== true ) { return; }
 					// set timer on mousedown
-					if ( type === 'mousedown' ) {
+					if ( type.match(' ' + c.pointerDown + ' ') ) {
 						downTarget = e.target;
+						// needed or jQuery v1.2.6 throws an error
+						e.preventDefault();
 						return;
 					}
 					downTarget = null;

js/jquery.tablesorter.js

@@ -101,6 +101,11 @@
 				cssNoSort        : 'tablesorter-noSort',      // class name added to element inside header; clicking on it won't cause a sort
 				cssIgnoreRow     : 'tablesorter-ignoreRow',   // header row to ignore; cells within this row will not be added to c.$headers
 
+				// *** events
+				pointerClick     : 'click',
+				pointerDown      : 'mousedown',
+				pointerUp        : 'mouseup',
+
 				// *** selectors
 				selectorHeaders  : '> thead th, > thead td',
 				selectorSort     : 'th, td',   // jQuery selector of content within selectorHeaders that is clickable to trigger a sort
@@ -1337,28 +1342,35 @@
 						$(t).addClass( c.namespace.slice(1) + '_extra_table' );
 					}
 				}
+				t = ( c.pointerDown + ' ' + c.pointerUp + ' ' + c.pointerClick + ' sort keyup ' )
+					.replace(/\s+/g, ' ')
+					.split(' ')
+					.join(c.namespace + ' ');
 				// apply event handling to headers and/or additional headers (stickyheaders, scroller, etc)
 				$headers
 				// http://stackoverflow.com/questions/5312849/jquery-find-self;
 				.find(c.selectorSort).add( $headers.filter(c.selectorSort) )
-				.unbind( ('mousedown mouseup click sort keyup '.split(' ').join(c.namespace + ' ')).replace(/\s+/g, ' ') )
+				.unbind(t)
-				.bind( 'mousedown mouseup click sort keyup '.split(' ').join(c.namespace + ' '), function(e, external) {
+				.bind(t, function(e, external) {
 					var cell,
 						$target = $(e.target),
-						type = e.type;
+						// wrap event type in spaces, so the match doesn't trigger on inner words
+						type = ' ' + e.type + ' ';
 					// only recognize left clicks
-					if ( ( ( e.which || e.button ) !== 1 && !/sort|keyup|click/.test(type) ) ||
+					if ( ( ( e.which || e.button ) !== 1 && !type.match( ' ' + c.pointerClick + ' | sort | keyup ' ) ) ||
 						// allow pressing enter
 						( type === ' keyup ' && e.which !== 13 ) ||
 						// allow triggering a click event (e.which is undefined) & ignore physical clicks
-						( type === 'click' && typeof e.which !== 'undefined' ) ) {
+						( type.match(' ' + c.pointerClick + ' ') && typeof e.which !== 'undefined' ) ) {
 						return;
 					}
 					// ignore mouseup if mousedown wasn't on the same target
-					if ( type === 'mouseup' && downTarget !== e.target && external !== true ) { return; }
+					if ( type.match(' ' + c.pointerUp + ' ') && downTarget !== e.target && external !== true ) { return; }
 					// set timer on mousedown
-					if ( type === 'mousedown' ) {
+					if ( type.match(' ' + c.pointerDown + ' ') ) {
 						downTarget = e.target;
+						// needed or jQuery v1.2.6 throws an error
+						e.preventDefault();
 						return;
 					}
 					downTarget = null;