Sindbad~EG File Manager

	function scrollElement(elmnt)   
		// Make elemnt scrollable,  by setting a handler for pointerdown, 
		// which when executed will set handlers for pointermove and pointerup.
	{
		var x1 = 0, y1 = 0, x0 = 0, y0 = 0;

		if (elmnt)  
			{
				elmnt.onpointerdown = scrollMouseDown;
			}

		function scrollMouseDown(e) {
			e = e || window.event;
			e.preventDefault();    // Prevents default action (e.g., text selection)
			e.stopPropagation();   // Prevents event from bubbling up to parent elements
			// Get the mouse cursor position at startup:
			x1 = e.clientX;
			y1 = e.clientY;
			x0 = x1;
			y0 = y1;
			document.onpointerup = closeScrollElement;
			document.onpointermove = elementScroll; 
			const transform = `translate(0,0)`;
			elmnt.setAttribute('transform', transform); 
			isSelecting = false;   // prevent selection rectangle
			console.log("set isSelecting to false");
		}

		function elementScroll(e) {
			e = e || window.event;
			e.preventDefault();    // Prevents default action (e.g., text selection)
			e.stopPropagation();   // Prevents event from bubbling up to parent elements
			// Calculate the new cursor position:
			var dx = e.clientX - x0;
			var dy = e.clientY - y0;
			const transform = `translate(${dx}, ${dy})`;
			elmnt.setAttribute('transform', transform); 
			// console.log(transform);
		}

		function closeScrollElement(e) {
			// Stop scrolling when mouse button is released:
			document.onpointerup = null;
			document.onpointermove = null; 

			// Get the element's ID and extract the index
			var id = elmnt.id;
			var index = id.match(/\d+$/)[0];  // Extract the number at the end of the ID 

			// How much did it scroll?
			let deltax = e.clientX - x0;
			let deltay = e.clientY - y0;  
			if(deltax == 0 && deltay == 0) 
			  return;  // don't bother telling the Engine nothing happened.

			// Form the parameter in the required format
			var param = `[${index},${deltax},${deltay}]`; 
			// Prepare the data string with the required parameter name

			// submit a hidden form so param will become $_POST['graphMovedParam'] 
			let form = document.createElement('form');
			           form.method = 'POST';
			           form.action = ''; // Set the action to the desired URL

			           // Create a hidden input to hold the param value
			           let input = document.createElement('input');
			           input.type = 'hidden';
			           input.name = 'graphMovedParam';
			           input.value = param;

			           // Append the input to the form
			           form.appendChild(input);

			           // Append the form to the body
			           document.body.appendChild(form);
			           // Submit the form
			           console.log("submitting", param);
			           form.submit();       
		}
	}		// end of scrollElement