onUserInputChange
Runs the callback whenever the user input type changes (mouse or touch).
- Use two event listeners.
- Assume
mouseinput initially and bind a'touchstart'event listener to the document. - On
'touchstart', add a'mousemove'event listener to listen for two consecutive'mousemove'events firing within 20ms, usingperformance.now(). - Run the callback with the input type as an argument in either of these situations.
const onUserInputChange = callback => {
let type = 'mouse',
lastTime = 0;
const mousemoveHandler = () => {
const now = performance.now();
if (now - lastTime < 20)
(type = 'mouse'),
callback(type),
document.removeEventListener('mousemove', mousemoveHandler);
lastTime = now;
};
document.addEventListener('touchstart', () => {
if (type === 'touch') return;
(type = 'touch'),
callback(type),
document.addEventListener('mousemove', mousemoveHandler);
});
};