js-draw
Version:
Draw pictures using a pen, touchscreen, or mouse! JS-draw is a drawing library for JavaScript and TypeScript.
59 lines (58 loc) • 2.39 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const createButton_1 = __importDefault(require("../util/dom/createButton"));
const waitForTimeout_1 = __importDefault(require("../util/waitForTimeout"));
const makeAboutDialog = (editor, options) => {
const overlay = document.createElement('div');
const { remove: removeOverlay } = editor.createHTMLOverlay(overlay);
overlay.classList.add('dialog-container', 'message-dialog-container', ...(options.classNames ?? []));
const dialog = document.createElement('dialog');
const contentWrapper = document.createElement('div');
contentWrapper.classList.add('message-dialog-content', ...(options.contentClassNames ?? []));
const heading = document.createElement('h1');
heading.textContent = options.title;
heading.setAttribute('autofocus', 'true');
const closeButton = (0, createButton_1.default)({
text: editor.localization.closeDialog,
classList: ['close'],
});
const scrollRegion = document.createElement('div');
scrollRegion.classList.add('scroll');
// Allow scrolling in the scrollable container -- don't forward wheel events.
scrollRegion.onwheel = (evt) => evt.stopPropagation();
contentWrapper.replaceChildren(heading, scrollRegion, closeButton);
dialog.replaceChildren(contentWrapper);
overlay.replaceChildren(dialog);
const closeTimeout = 300;
dialog.style.setProperty('--close-delay', `${closeTimeout}ms`);
const closeDialog = async () => {
dialog.classList.add('-closing');
await (0, waitForTimeout_1.default)(closeTimeout);
dialog.close();
};
const addCloseListeners = () => {
dialog.addEventListener('pointerdown', (event) => {
if (event.target === dialog) {
void closeDialog();
}
});
dialog.onclose = () => {
removeOverlay();
};
closeButton.onclick = () => closeDialog();
};
addCloseListeners();
dialog.showModal();
return {
close: () => {
return closeDialog();
},
appendChild: (child) => {
scrollRegion.appendChild(child);
},
};
};
exports.default = makeAboutDialog;