|
|
@ -68,8 +68,8 @@ makeDragable('#shell_03header', '#shell_03')
|
|
|
|
let xOffset2 = 0; //used to prevent dragged object jumping to mouse location
|
|
|
|
let xOffset2 = 0; //used to prevent dragged object jumping to mouse location
|
|
|
|
let yOffset2 = 0;
|
|
|
|
let yOffset2 = 0;
|
|
|
|
|
|
|
|
|
|
|
|
document.querySelector(dragHandle2).addEventListener("mousedown", startDrag2, true);
|
|
|
|
document.querySelector(dragHandle2).addEventListener("mousedown2", startDrag2, true);
|
|
|
|
document.querySelector(dragHandle2).addEventListener("touchstart", startDrag2, true);
|
|
|
|
document.querySelector(dragHandle2).addEventListener("touchstart2", startDrag2, true);
|
|
|
|
|
|
|
|
|
|
|
|
/*sets offset parameters and starts listening for mouse-move*/
|
|
|
|
/*sets offset parameters and starts listening for mouse-move*/
|
|
|
|
function startDrag2(x) {
|
|
|
|
function startDrag2(x) {
|
|
|
@ -79,14 +79,14 @@ makeDragable('#shell_03header', '#shell_03')
|
|
|
|
dragObj2.style.position = "absolute";
|
|
|
|
dragObj2.style.position = "absolute";
|
|
|
|
let rect = dragObj2.getBoundingClientRect();
|
|
|
|
let rect = dragObj2.getBoundingClientRect();
|
|
|
|
|
|
|
|
|
|
|
|
if (x.type=="mousedown") {
|
|
|
|
if (x.type=="mousedown2") {
|
|
|
|
xOffset2 = x.clientX - rect.left; //clientX and getBoundingClientRect() both use viewable area adjusted when scrolling aka 'viewport'
|
|
|
|
xOffset2 = x.clientX - rect.left; //clientX and getBoundingClientRect() both use viewable area adjusted when scrolling aka 'viewport'
|
|
|
|
yOffset2 = x.clientY - rect.top;
|
|
|
|
yOffset2 = x.clientY - rect.top;
|
|
|
|
window.addEventListener('mousemove', dragObject2, true);
|
|
|
|
window.addEventListener('mousemove2', dragObject2, true);
|
|
|
|
} else if(e.type=="touchstart") {
|
|
|
|
} else if(e.type=="touchstart2") {
|
|
|
|
xOffset2 = x.targetTouches[0].clientX - rect.left;
|
|
|
|
xOffset2 = x.targetTouches[0].clientX - rect.left;
|
|
|
|
yOffset2 = x.targetTouches[0].clientY - rect.top;
|
|
|
|
yOffset2 = x.targetTouches[0].clientY - rect.top;
|
|
|
|
window.addEventListener('touchmove', dragObject2, true);
|
|
|
|
window.addEventListener('touchmove2', dragObject2, true);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
@ -97,21 +97,21 @@ makeDragable('#shell_03header', '#shell_03')
|
|
|
|
|
|
|
|
|
|
|
|
if(dragObj2 == null) {
|
|
|
|
if(dragObj2 == null) {
|
|
|
|
return; // if there is no object being dragged then do nothing
|
|
|
|
return; // if there is no object being dragged then do nothing
|
|
|
|
} else if(x.type=="mousemove") {
|
|
|
|
} else if(x.type=="mousemove2") {
|
|
|
|
dragObj2.style.left = x.clientX-xOffset2 +"px"; // adjust location of dragged object so doesn't jump to mouse position
|
|
|
|
dragObj2.style.left = x.clientX-xOffset2 +"px"; // adjust location of dragged object so doesn't jump to mouse position
|
|
|
|
dragObj2.style.top = x.clientY-yOffset2 +"px";
|
|
|
|
dragObj2.style.top = x.clientY-yOffset2 +"px";
|
|
|
|
} else if(x.type=="touchmove") {
|
|
|
|
} else if(x.type=="touchmove2") {
|
|
|
|
dragObj2.style.left = x.targetTouches[0].clientX-xOffset2 +"px"; // adjust location of dragged object so doesn't jump to mouse position
|
|
|
|
dragObj2.style.left = x.targetTouches[0].clientX-xOffset2 +"px"; // adjust location of dragged object so doesn't jump to mouse position
|
|
|
|
dragObj2.style.top = x.targetTouches[0].clientY-yOffset2 +"px";
|
|
|
|
dragObj2.style.top = x.targetTouches[0].clientY-yOffset2 +"px";
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*End dragging*/
|
|
|
|
/*End dragging*/
|
|
|
|
document.onmouseup = function(x) {
|
|
|
|
document.onmouseup2 = function(x) {
|
|
|
|
if (dragObj2) {
|
|
|
|
if (dragObj2) {
|
|
|
|
dragObj2 = null;
|
|
|
|
dragObj2 = null;
|
|
|
|
window.removeEventListener('mousemove', dragObject2, true);
|
|
|
|
window.removeEventListener('mousemove2', dragObject2, true);
|
|
|
|
window.removeEventListener('touchmove', dragObject2, true);
|
|
|
|
window.removeEventListener('touchmove2', dragObject2, true);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|