added left, right, up, down gestures to change slides. moved window edge slide triggers to a touchend event to prevent interference of gestures
This commit is contained in:
parent
eaca6465fa
commit
2e024b5b3e
55
js/reveal.js
55
js/reveal.js
@ -25,7 +25,8 @@ var Reveal = (function(){
|
|||||||
mouseWheel: true,
|
mouseWheel: true,
|
||||||
rollingLinks: true,
|
rollingLinks: true,
|
||||||
transition: 'default',
|
transition: 'default',
|
||||||
theme: 'default'
|
theme: 'default',
|
||||||
|
swipeDistance: 30
|
||||||
},
|
},
|
||||||
|
|
||||||
// Slides may hold a data-state attribute which we pick up and apply
|
// Slides may hold a data-state attribute which we pick up and apply
|
||||||
@ -82,6 +83,8 @@ var Reveal = (function(){
|
|||||||
// Bind all view events
|
// Bind all view events
|
||||||
document.addEventListener( 'keydown', onDocumentKeyDown, false );
|
document.addEventListener( 'keydown', onDocumentKeyDown, false );
|
||||||
document.addEventListener( 'touchstart', onDocumentTouchStart, false );
|
document.addEventListener( 'touchstart', onDocumentTouchStart, false );
|
||||||
|
document.addEventListener( 'touchmove', onDocumentTouchMove, false );
|
||||||
|
document.addEventListener( 'touchend', onDocumentTouchEnd, false );
|
||||||
window.addEventListener( 'hashchange', onWindowHashChange, false );
|
window.addEventListener( 'hashchange', onWindowHashChange, false );
|
||||||
dom.controlsLeft.addEventListener( 'click', preventAndForward( navigateLeft ), false );
|
dom.controlsLeft.addEventListener( 'click', preventAndForward( navigateLeft ), false );
|
||||||
dom.controlsRight.addEventListener( 'click', preventAndForward( navigateRight ), false );
|
dom.controlsRight.addEventListener( 'click', preventAndForward( navigateRight ), false );
|
||||||
@ -235,6 +238,8 @@ var Reveal = (function(){
|
|||||||
*
|
*
|
||||||
* @param {Object} event
|
* @param {Object} event
|
||||||
*/
|
*/
|
||||||
|
var touchStart = {}
|
||||||
|
var gesture = false;
|
||||||
function onDocumentTouchStart( event ) {
|
function onDocumentTouchStart( event ) {
|
||||||
// We're only interested in one point taps
|
// We're only interested in one point taps
|
||||||
if (event.touches.length === 1) {
|
if (event.touches.length === 1) {
|
||||||
@ -245,34 +250,66 @@ var Reveal = (function(){
|
|||||||
|
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
|
||||||
var point = {
|
touchStart = {
|
||||||
x: event.touches[0].clientX,
|
x: event.touches[0].clientX,
|
||||||
y: event.touches[0].clientY
|
y: event.touches[0].clientY
|
||||||
};
|
};
|
||||||
|
|
||||||
|
slide();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function onDocumentTouchMove( event ) {
|
||||||
|
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
if(!gesture) {
|
||||||
|
var touch = {
|
||||||
|
x: event.touches[0].clientX,
|
||||||
|
y: event.touches[0].clientY
|
||||||
|
};
|
||||||
|
if((touch.x - touchStart.x) > config.swipeDistance){
|
||||||
|
gesture = true;
|
||||||
|
navigateLeft();
|
||||||
|
} else if((touch.x - touchStart.x) < -config.swipeDistance){
|
||||||
|
gesture = true;
|
||||||
|
navigateRight();
|
||||||
|
} else if((touch.y - touchStart.y) > config.swipeDistance){
|
||||||
|
gesture = true;
|
||||||
|
navigateUp();
|
||||||
|
} else if((touch.y - touchStart.y) < -config.swipeDistance){
|
||||||
|
gesture = true;
|
||||||
|
navigateDown();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function onDocumentTouchEnd( event ) {
|
||||||
|
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
if(!gesture){//only check for control tap if no gesture is performed
|
||||||
|
|
||||||
// Define the extent of the areas that may be tapped
|
// Define the extent of the areas that may be tapped
|
||||||
// to navigate
|
// to navigate
|
||||||
var wt = window.innerWidth * 0.3;
|
var wt = window.innerWidth * 0.3;
|
||||||
var ht = window.innerHeight * 0.3;
|
var ht = window.innerHeight * 0.3;
|
||||||
|
|
||||||
if( point.x < wt ) {
|
if( touchStart.x < wt ) {
|
||||||
navigateLeft();
|
navigateLeft();
|
||||||
}
|
}
|
||||||
else if( point.x > window.innerWidth - wt ) {
|
else if( touchStart.x > window.innerWidth - wt ) {
|
||||||
navigateRight();
|
navigateRight();
|
||||||
}
|
}
|
||||||
else if( point.y < ht ) {
|
else if( touchStart.y < ht ) {
|
||||||
navigateUp();
|
navigateUp();
|
||||||
}
|
}
|
||||||
else if( point.y > window.innerHeight - ht ) {
|
else if( touchStart.y > window.innerHeight - ht ) {
|
||||||
navigateDown();
|
navigateDown();
|
||||||
}
|
}
|
||||||
|
|
||||||
slide();
|
|
||||||
}
|
}
|
||||||
|
gesture = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Handles mouse wheel scrolling, throttled to avoid
|
* Handles mouse wheel scrolling, throttled to avoid
|
||||||
* skipping multiple slides.
|
* skipping multiple slides.
|
||||||
|
Loading…
Reference in New Issue
Block a user