Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/improsocial/impro
An extensible Bluesky client for web impro.social
Something went wrong. Try again.
JavaScript
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110import { render } from "/js/lib/lit-html.js";import { scrollLocks } from "/js/scrollLocks.js";import { closeWithAnimation } from "/js/dialogHelpers.js";import { enableDragToDismiss } from "/js/dragHelpers.js";
export class Modal { static async open(...args) { const instance = new this(...args); return instance.open(); }
constructor(options = {}) { this.options = options; }
get className() { return "bottom-sheet text-modal"; }
get attributes() { return {}; }
get dragToDismiss() { return true; }
canDismiss() { return true; }
ignoreTouchTarget(element) { return element.closest("button") !== null; }
get scrollContainerSelector() { return null; }
get closing() { if (!this.dialog) return false; return !this.dialog.open || this.dialog.hasAttribute("data-closing"); }
render() { throw new Error(`${this.constructor.name} must implement render()`); }
open() { return new Promise((resolve) => { const dialog = document.createElement("dialog"); dialog.className = this.className; for (const [key, value] of Object.entries(this.attributes)) { dialog.setAttribute(key, value); } this.dialog = dialog;
let scrollLock = null; let resolved = false; let dismissValue; let cleanedUp = false; const cleanup = () => { if (cleanedUp) return; cleanedUp = true; scrollLock?.release(); dialog.remove(); resolve(dismissValue); }; const dismiss = (value) => { if (resolved) return; resolved = true; dismissValue = value; return closeWithAnimation(dialog); }; this.dismiss = dismiss; const dismissIfAllowed = () => { if (this.canDismiss()) dismiss(); }; const update = () => { render(this.render({ dismiss, update, props: this.options }), dialog); };
update();
dialog.addEventListener("click", (event) => { if (event.target === event.currentTarget) dismissIfAllowed(); }); document.body.appendChild(dialog); scrollLock = scrollLocks.acquire({ target: dialog }); dialog.showModal(); dialog.addEventListener("close", cleanup); dialog.addEventListener("cancel", (event) => { event.preventDefault(); dismissIfAllowed(); });
if (this.dragToDismiss) { const selector = this.scrollContainerSelector; enableDragToDismiss(dialog, { onDismiss: () => dismiss(), confirmDismiss: () => this.canDismiss(), ignoreTouchTarget: (element) => this.ignoreTouchTarget(element), scrollContainer: selector ? dialog.querySelector(selector) : null, disableWhenKeyboardOpen: true, }); } }); }}