MDL-51803 core: fix for touchstart

This commit is contained in:
Marina Glancy 2018-10-09 13:25:33 +02:00
parent e134ad7b38
commit e3c2a1bb3a
2 changed files with 20 additions and 3 deletions

File diff suppressed because one or more lines are too long

View file

@ -82,6 +82,23 @@ function($, log, autoScroll, str, ModalFactory, ModalEvents, Notification) {
overElementClass: 'sortable-list-over-element' overElementClass: 'sortable-list-over-element'
}; };
/**
* Allow to create non-passive touchstart listeners and prevent page scrolling when dragging
* From: https://stackoverflow.com/a/48098097
*
* @type {Object}
*/
$.event.special.touchstart = {
setup: function(_, ns, handle) {
if (ns.includes('notPassive')) {
this.addEventListener('touchstart', handle, {passive: false});
return true;
} else {
return false;
}
}
};
/** /**
* Initialise sortable list. * Initialise sortable list.
* *
@ -111,10 +128,10 @@ function($, log, autoScroll, str, ModalFactory, ModalEvents, Notification) {
} }
if (typeof this.config.listSelector === 'object') { if (typeof this.config.listSelector === 'object') {
// The root is an element on the page. Register a listener for this element. // The root is an element on the page. Register a listener for this element.
$(this.config.listSelector).on('mousedown touchstart', $.proxy(this.dragStartHandler, this)); $(this.config.listSelector).on('mousedown touchstart.notPassive', $.proxy(this.dragStartHandler, this));
} else { } else {
// The root is a CSS selector. Register a listener that picks up the element dynamically. // The root is a CSS selector. Register a listener that picks up the element dynamically.
$('body').on('mousedown touchstart', this.config.listSelector, $.proxy(this.dragStartHandler, this)); $('body').on('mousedown touchstart.notPassive', this.config.listSelector, $.proxy(this.dragStartHandler, this));
} }
if (this.config.moveHandlerSelector !== null) { if (this.config.moveHandlerSelector !== null) {
$('body').on('click keypress', this.config.moveHandlerSelector, $.proxy(this.clickHandler, this)); $('body').on('click keypress', this.config.moveHandlerSelector, $.proxy(this.clickHandler, this));