https://rondocoach.com/wp-content/plugins/formationTool/assets/js1/players.js?ver=12:29:10

1// TODO: update formation
2import loadFormationObject from "./loadFormation.js";
3
4function dragElement(elmnt) {
5    //console.log("dragElement" + elmnt.id);
6  var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
7  if (document.getElementById(elmnt.id + "header")) {
8    //console.log("dragElement_header");
9    // if present, the header is where you move the DIV from:
10    document.getElementById(elmnt.id + "header").onmousedown = dragMouseDown;
11  } else {
12    
13    console.log("dragElement_otherwise");
14    // otherwise, move the DIV from anywhere inside the DIV:
15    elmnt.onmousedown = dragMouseDown;
16  }
17  
18
19  function dragMouseDown(e) {
20    
21    //console.log("dragMouseDown");
22    e = e || window.event;
23    e.preventDefault();
24    // get the mouse cursor position at startup:
25    pos3 = e.clientX;
26    pos4 = e.clientY;
27    document.onmouseup = closeDragElement;
28    // call a function whenever the cursor moves:
29    document.onmousemove = elementDrag;
30  }
31
32  function elementDrag(e) {
33    
34    //console.log("elementDrag");
35    e = e || window.event;
36    e.preventDefault();
37    // calculate the new cursor position:
38    pos1 = pos3 - e.clientX;
39    pos2 = pos4 - e.clientY;
40    pos3 = e.clientX;
41    pos4 = e.clientY;
42    // set the element's new position:
43    elmnt.style.top = (elmnt.offsetTop - pos2) + "px";
44    elmnt.style.left = (elmnt.offsetLeft - pos1) + "px";
45    
46    //console.log("closeDragElement "+ elmnt.style.top + " "+elmnt.style.left);
47  }
48
49  function closeDragElement() {
50    //console.log("closeDragElement");
51    // stop moving when mouse button is released:
52    document.onmouseup = null;
53    document.onmousemove = null;
54    loadFormationObject.updateFormation();
55  }
56}
57
58export default dragElement