Prevent the browser to refresh the page on mobile when moving overlay

This commit is contained in:
nicofrand 2018-09-03 08:46:00 +02:00 committed by Nicolas Frandeboeuf
parent c6ec5beed5
commit 4b85679471

View file

@ -90,9 +90,14 @@ Element.toggleClass = function(element, className) {
/* Add Event /* Add Event
https://github.com/Darklg/JavaScriptUtilities/blob/master/assets/js/vanilla-js/libs/vanilla-events.js https://github.com/Darklg/JavaScriptUtilities/blob/master/assets/js/vanilla-js/libs/vanilla-events.js
-------------------------- */ -------------------------- */
window.addEvent = function(el, eventName, callback) { window.addEvent = function(el, eventName, callback, options) {
if (el.addEventListener) { if (el.addEventListener) {
el.addEventListener(eventName, callback, false); if (!options || typeof(options) !== "object") {
options = {};
}
options.capture = false;
el.addEventListener(eventName, callback, options);
} }
else if (el.attachEvent) { else if (el.attachEvent) {
el.attachEvent("on" + eventName, function(e) { el.attachEvent("on" + eventName, function(e) {
@ -142,12 +147,15 @@ var dragg = function(id) {
x_pos = document.all ? window.event: e.pageX; x_pos = document.all ? window.event: e.pageX;
y_pos = document.all ? window.event : e.pageY; y_pos = document.all ? window.event : e.pageY;
if (e.type === "touchmove"){ if (e.type === "touchmove") {
x_pos = e.touches[0].clientX; x_pos = e.touches[0].clientX;
y_pos = e.touches[0].clientY; y_pos = e.touches[0].clientY;
} }
if (selected !== null) { if (selected !== null) {
if (e.type === "touchmove"){
event.preventDefault();
}
dragged = true; dragged = true;
selected.style.left = (x_pos - x_elem) + 'px'; selected.style.left = (x_pos - x_elem) + 'px';
selected.style.top = (y_pos - y_elem) + 'px'; selected.style.top = (y_pos - y_elem) + 'px';
@ -165,7 +173,7 @@ var dragg = function(id) {
// Will be called when user dragging an element // Will be called when user dragging an element
window.addEvent(window, 'mousemove', _onMove); window.addEvent(window, 'mousemove', _onMove);
window.addEvent(window, 'touchmove', _onMove); window.addEvent(window, 'touchmove', _onMove, {passive: false});
// Destroy the object when we are done // Destroy the object when we are done
window.addEvent(window, 'mouseup', _shutDrag); window.addEvent(window, 'mouseup', _shutDrag);