More deterministic DnD placeholder creation.

This commit is contained in:
hackademix 2022-02-28 09:30:35 +01:00
parent 4099f548be
commit e225332eee
1 changed files with 12 additions and 7 deletions

View File

@ -69,13 +69,18 @@
ev.preventDefault(); ev.preventDefault();
return; return;
} }
// work-around for Firefox unable to drag buttons, https://bugzilla.mozilla.org/show_bug.cgi?id=568313 // work-around for Firefox unable to drag buttons, https://bugzilla.mozilla.org/show_bug.cgi?id=568313
let placeHolder = document.createElement("a"); let placeHolder = document.createElement("div");
for (let attr of button.attributes) { let {style} = placeHolder;
placeHolder.setAttribute(attr.name, attr.value); style.backgroundImage = getComputedStyle(button).backgroundImage;
} style.backgroundSize = "contain";
placeHolder.style.position = "absolute"; let width = button.offsetWidth * 1.2;
placeHolder.style.top = "-2000px"; let height = button.offsetHeight * 1.2;
style.width =`${width}px`;
style.height = `${height}px`
style.position = "absolute";
style.top = "-2000px";
toolbar.appendChild(placeHolder); toolbar.appendChild(placeHolder);
setTimeout(() => placeHolder.remove(), 0); setTimeout(() => placeHolder.remove(), 0);
@ -83,7 +88,7 @@
dt.setData("text/plain", button.id); dt.setData("text/plain", button.id);
dt.dropEffect = "move"; dt.dropEffect = "move";
dt.setDragImage(placeHolder, button.offsetWidth / 2, button.offsetHeight / 2); dt.setDragImage(placeHolder, width / 2, height / 2);
toggleHider(true); toggleHider(true);
this.draggedElement = ev.target; // the draggable wrapper around the button this.draggedElement = ev.target; // the draggable wrapper around the button