bluesaxman/blue.js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added window resize and drag functions

Browse Source
This commit is contained in:
bluesaxman 2022-04-07 16:46:44 -06:00
parent 02270091eb
commit a4d3afd265
1 changed files with 61 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
libs/blueui.js
View File

@ -36,9 +36,68 @@ class buiButton {
} }
} }
function makeDraggable (targetNode, handleNode) {} function makeDraggable (targetNode, handleNode) {
var x_offset = 0;
var y_offset = 0;
targetNode.style.top = "0px";
targetNode.style.left = "0px"
handleNode.addEventListener("mousedown",initDrag,false);
function makeResizeable (targetNode, handleNode) {} function doDrag (e) {
var newX = e.clientX - x_offset;
var newY = e.clientY - y_offset;
x_offset = e.clientX;
y_offset = e.clientY;
if (targetNode.class == "dragging") {
targetNode.style.top = (parseInt(targetNode.style.top)+newY)+"px";
targetNode.style.left = (parseInt(targetNode.style.left)+newX)+"px";
}
}
function stopDrag (e) {
targetNode.class = "";
doc.removeEventListener("mousemove",doDrag);
doc.removeEventListener("mousemove",stopDrag);
}
function initDrag (e) {
targetNode.class = "dragging";
x_offset = e.clientX;
y_offset = e.clientY;
doc.addEventListener("mousemove",doDrag,false);
doc.addEventListener("mouseup",stopDrag,false);
}
}
function makeResizeable (targetNode, handleNode) {
targetNode.className = targetNode.className + ' resizable';
if (undefined == handleNode) {
handleNode = doc.createElement('div');
handleNode.setAttribute("style","width: 10px; height: 10px; background: red; position:absolute; right: 0; bottom: 0; cursor: se-resize; z-index: 55000;");
targetNode.appendChild(handleNode);
}
handleNode.addEventListener('mousedown', initResize, false);
var startX, startY, startWidth, startHeight;
function initResize(e) {
startX = e.clientX;
startY = e.clientY;
startWidth = parseInt(doc.defaultView.getComputedStyle(target).width, 10);
startHeight = parseInt(doc.defaultView.getComputedStyle(target).height, 10);
doc.documentElement.addEventListener('mousemove', doResize, false);
doc.documentElement.addEventListener('mouseup', stopResize, false);
}
function doResize(e) {
targetNode.style.width = (startWidth + e.clientX - startX) + 'px';
targetNode.style.height = (startHeight + e.clientY - startY) + 'px';
}
function stopResize(e) {
doc.documentElement.removeEventListener('mousemove', doResize, false);
doc.documentElement.removeEventListener('mouseup', stopResize, false);
}
}
class buiWindow { class buiWindow {