stylus/msgbox/confirm.js

54 lines
1.9 KiB
JavaScript
Raw Normal View History

function confirmDelete(event, {float = false} = {}) {
const id = getClickedStyleId(event);
const box = $('#confirm');
box.dataset.id = id;
box.dataset.display = true;
box.style.cssText = '';
$('b', box).textContent = ((cachedStyles.byId.get(id) || {}).style || {}).name;
if (float) {
const GAP = 50;
const {width:W, height:H} = box.firstElementChild.getBoundingClientRect();
const {left:L, top:T, right:R, bottom:B} = event.target.getBoundingClientRect();
Object.assign(box.style, {
paddingTop: (Math.min(T - H/2, innerHeight - H) - GAP) + 'px',
paddingLeft: (Math.min(L - W/2, innerWidth - W) - GAP) + 'px',
paddingRight: (innerWidth - Math.max(R + W/2, W) - GAP) + 'px',
paddingBottom: (innerHeight - Math.max(B + H/2, H) - GAP) + 'px',
});
}
let resolveMe;
$('[data-cmd="ok"]', box).onclick = event => doDelete(true);
$('[data-cmd="cancel"]', box).onclick = event => doDelete(false);
window.addEventListener('keydown', onKey);
const stopScroll = {x: scrollX, y: scrollY};
window.addEventListener('scroll', preventScroll);
return new Promise(resolve => resolveMe = resolve);
function doDelete(confirmed) {
window.removeEventListener('keydown', onKey);
window.removeEventListener('scroll', preventScroll);
box.classList.add('lights-on');
box.addEventListener('animationend', function _() {
box.removeEventListener('animationend', _);
box.dataset.display = false;
box.classList.remove('lights-on');
});
Promise.resolve(confirmed && deleteStyle(id))
.then(resolveMe);
}
function onKey(event) {
if (!event.shiftKey && !event.ctrlKey && !event.altKey && !event.metaKey
&& (event.keyCode == 13 || event.keyCode == 27)) {
event.preventDefault();
doDelete(event.keyCode == 13);
}
}
function preventScroll() {
window.scrollTo(stopScroll.x, stopScroll.y);
}
}