WMDE-Fisch has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/351642 )
Change subject: [WIP] Convert touch events to mouse events on pointers
......................................................................
[WIP] Convert touch events to mouse events on pointers
This will make the pointers work on touch devices. The events responsible
for the touch drag and move are converted to mouse actions that will trigger
the draggable.
WIP so it is tested extensively before it gets merged.
Bug: T164249
Change-Id: I245f77eb836afded249f3b5ebb7129dab08d0017
---
M modules/ext.RevisionSlider.SliderView.js
M modules/ext.RevisionSlider.SliderViewTwo.js
2 files changed, 61 insertions(+), 0 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/RevisionSlider
refs/changes/42/351642/1
diff --git a/modules/ext.RevisionSlider.SliderView.js
b/modules/ext.RevisionSlider.SliderView.js
index 28fedd3..f707005 100644
--- a/modules/ext.RevisionSlider.SliderView.js
+++ b/modules/ext.RevisionSlider.SliderView.js
@@ -196,6 +196,10 @@
} );
$pointers.draggable( this.buildDraggableOptions(
escapePressed, $revisions, '.mw-revslider-pointer-container' ) );
+ $pointers.on(
+ 'touchstart touchmove touchend',
+ mw.libs.revisionSlider.touchEventConverter
+ );
},
/**
@@ -906,6 +910,53 @@
mw.libs.revisionSlider = mw.libs.revisionSlider || {};
mw.libs.revisionSlider.SliderView = SliderView;
+ // originally taken from
https://stackoverflow.com/questions/1517924/javascript-mapping-touch-events-to-mouse-events
+ mw.libs.revisionSlider.touchEventConverter = function ( event ) {
+ var first = event.changedTouches[ 0 ],
+ type, simulatedEvent;
+
+ switch ( event.type ) {
+ case 'touchstart':
+ type = 'mousedown';
+ break;
+ case 'touchmove':
+ type = 'mousemove';
+ break;
+ case 'touchend':
+ type = 'mouseup';
+ break;
+ default:
+ return;
+ }
+
+ if ( typeof MouseEvent !== 'undefined' ) {
+ simulatedEvent = new MouseEvent( type, {
+ bubbles: true,
+ cancelable: true,
+ view: window,
+ detail: 1,
+ screenX: first.screenX,
+ screenY: first.screenY,
+ clientX: first.clientX,
+ clientY: first.clientY,
+ button: 0,
+ relatedTarget: null
+ } );
+ } else {
+ 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 );
+ event.preventDefault();
+ };
+
mw.libs.revisionSlider.calculateRevisionsPerWindow = function ( margin,
revisionWidth ) {
return Math.floor( ( $( '#mw-content-text' ).width() - margin )
/ revisionWidth );
};
diff --git a/modules/ext.RevisionSlider.SliderViewTwo.js
b/modules/ext.RevisionSlider.SliderViewTwo.js
index aa055b8..3f07a37 100644
--- a/modules/ext.RevisionSlider.SliderViewTwo.js
+++ b/modules/ext.RevisionSlider.SliderViewTwo.js
@@ -103,6 +103,16 @@
'.mw-revslider-pointer-container-newer'
) );
+ $pointerNewer.on(
+ 'touchstart touchmove touchend',
+ mw.libs.revisionSlider.touchEventConverter
+ );
+
+ $pointerOlder.on(
+ 'touchstart touchmove touchend',
+ mw.libs.revisionSlider.touchEventConverter
+ );
+
SliderViewTwo.super.prototype.resetPointerStylesBasedOnPosition.call( this );
},
--
To view, visit https://gerrit.wikimedia.org/r/351642
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I245f77eb836afded249f3b5ebb7129dab08d0017
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/RevisionSlider
Gerrit-Branch: master
Gerrit-Owner: WMDE-Fisch <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
