YunoHost/SSOwat
1
0
Fork 0
mirror of https://github.com/YunoHost/SSOwat.git synced 2024-09-03 20:06:27 +02:00
Code Issues Projects Releases Packages Wiki Activity

Make tile dragging work on mobile devices

Browse source
This commit is contained in:
nicofrand 2018-05-09 18:34:00 +02:00
parent fe267ba93d
commit a41b76c251
1 changed files with 31 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
portal/assets/js/ynhpanel.js
View file

@ -122,33 +122,53 @@ var dragg = function(id) {
this.x_pos = 0, this.y_pos = 0, // Stores x & y coordinates of the mouse pointer this.x_pos = 0, this.y_pos = 0, // Stores x & y coordinates of the mouse pointer
this.x_elem = 0, this.y_elem = 0; // Stores top, left values (edge) of the element this.x_elem = 0, this.y_elem = 0; // Stores top, left values (edge) of the element
// Start dragging var _initDrag = function(e){
window.addEvent(elem, 'mousedown', function(e){
// Prevent firefox native D'n'D behavior // Prevent firefox native D'n'D behavior
window.eventPreventDefault(e); window.eventPreventDefault(e);
if (e.type === "touchstart"){
x_pos = e.touches[0].clientX;
y_pos = e.touches[0].clientY;
}
selected = elem; selected = elem;
x_elem = x_pos - selected.offsetLeft; x_elem = x_pos - selected.offsetLeft;
y_elem = y_pos - selected.offsetTop; y_elem = y_pos - selected.offsetTop;
}); };
// Will be called when user dragging an element var _shutDrag = function(e){
window.addEvent(window, 'mousemove', function(e){ selected = null;
};
var _onMove = function(e){
// Get position // Get position
x_pos = document.all ? window.event.clientX : e.pageX; x_pos = document.all ? window.event: e.pageX;
y_pos = document.all ? window.event.clientY : e.pageY; y_pos = document.all ? window.event : e.pageY;
if (e.type === "touchmove"){
x_pos = e.touches[0].clientX;
y_pos = e.touches[0].clientY;
}
if (selected !== null) { if (selected !== null) {
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';
} }
}); };
// Start dragging
window.addEvent(elem, 'mousedown', _initDrag);
window.addEvent(elem, 'touchstart', _initDrag);
// Will be called when user dragging an element
window.addEvent(window, 'mousemove', _onMove);
window.addEvent(window, 'touchmove', _onMove);
// Destroy the object when we are done // Destroy the object when we are done
window.addEvent(window, 'mouseup', function(e){ window.addEvent(window, 'mouseup', _shutDrag);
selected = null; window.addEvent(window, 'touchend', _shutDrag);
}); window.addEvent(window, 'touchcancel', _shutDrag);
// Handle click event // Handle click event
window.addEvent(elem, 'click', function(e){ window.addEvent(elem, 'click', function(e){