ticket #64 attempt 1

Browse Source
This commit is contained in:
Typosaurus 2026-07-19 20:03:49 +00:00
parent 43c5a948e8
commit df5aa7580a
4 changed files with 34 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
devplacepy/static/js/ModalManager.js
View File

@ -29,6 +29,7 @@ export class ModalManager {
const modal = document.getElementById(modalId);
if (modal) {
modal.classList.add("visible");
window.history.pushState({__overlay: true}, "");
}
});
});
@ -37,11 +38,13 @@ export class ModalManager {
modal.addEventListener("click", (e) => {
if (e.target === modal) {
modal.classList.remove("visible");
window.history.back();
}
});
modal.querySelectorAll(".modal-close").forEach((closeBtn) => {
closeBtn.addEventListener("click", () => {
modal.classList.remove("visible");
window.history.back();
});
});
this.enhanceModal(modal);
@ -50,6 +53,14 @@ export class ModalManager {
document.addEventListener("keydown", (e) => {
if (e.key !== "Escape") return;
const open = [...document.querySelectorAll(".modal-overlay.visible")].pop();
if (open) {
open.classList.remove("visible");
window.history.back();
}
});
window.addEventListener("popstate", () => {
const open = document.querySelector(".modal-overlay.visible");
if (open) open.classList.remove("visible");
});
}

7
devplacepy/static/js/components/AppContextMenu.js
View File

@ -51,6 +51,11 @@ export class AppContextMenu extends Component {
document.addEventListener("keydown", (e) => {
if (e.key === "Escape") this.close();
});
window.addEventListener("popstate", () => {
if (this.menu.classList.contains("visible")) {
this.menu.classList.remove("visible");
}
});
}
render(items) {
@ -93,6 +98,7 @@ export class AppContextMenu extends Component {
if (!items || !items.length) return;
this.render(items);
this.menu.classList.add("visible");
window.history.pushState({__overlay: true}, "");
const rect = this.menu.getBoundingClientRect();
const vv = window.visualViewport;
const safeW = vv ? vv.width : window.innerWidth;
@ -111,6 +117,7 @@ export class AppContextMenu extends Component {
close() {
this.menu.classList.remove("visible");
window.history.back();
}
suppressNextClick() {

7
devplacepy/static/js/components/AppDialog.js
View File

@ -64,6 +64,11 @@ export class AppDialog extends Component {
this.dismiss();
}
});
window.addEventListener("popstate", () => {
if (this.overlay.classList.contains("visible")) {
this.overlay.classList.remove("visible");
}
});
overlay.addEventListener("keydown", (e) => {
if (e.key !== "Tab") return;
const items = [
@ -107,6 +112,7 @@ export class AppDialog extends Component {
this.lastFocus = document.activeElement;
this.overlay.classList.add("visible");
window.history.pushState({__overlay: true}, "");
const focusTarget = mode === "prompt" ? this.input : this.confirmBtn;
setTimeout(() => {
focusTarget.focus();
@ -127,6 +133,7 @@ export class AppDialog extends Component {
close(value) {
this.overlay.classList.remove("visible");
window.history.back();
if (this.lastFocus && this.lastFocus.focus) this.lastFocus.focus();
const resolve = this.resolver;
this.resolver = null;

9
devplacepy/static/js/components/AppLightbox.js
View File

@ -54,6 +54,7 @@ export class AppLightbox extends Component {
this.close();
}
});
window.addEventListener("popstate", () => this._onPopstate());
this.overlay.addEventListener("keydown", (e) => {
if (e.key === "Tab" && this.overlay.classList.contains("visible")) {
e.preventDefault();
@ -77,15 +78,23 @@ export class AppLightbox extends Component {
this.bodyOverflow = document.body.style.overflow;
document.body.style.overflow = "hidden";
this.overlay.classList.add("visible");
window.history.pushState({__overlay: true}, "");
setTimeout(() => this.closeBtn.focus(), 20);
}
close() {
this.overlay.classList.remove("visible");
window.history.back();
this.image.src = "";
document.body.style.overflow = this.bodyOverflow;
if (this.lastFocus && this.lastFocus.focus) this.lastFocus.focus();
}
_onPopstate() {
if (this.overlay.classList.contains("visible")) {
this.overlay.classList.remove("visible");
}
}
}
customElements.define("dp-lightbox", AppLightbox);