Stub out basic boundary detection

This commit is contained in:
Andy Smith
2025-08-14 14:42:08 -05:00
parent 6c2063d3ab
commit 3f5d070ae9
@@ -1,5 +1,7 @@
import { Controller } from "@hotwired/stimulus"
const BOTTOM_THRESHOLD = 90
export default class extends Controller {
static targets = [ "dialog" ]
static values = {
@@ -18,6 +20,7 @@ export default class extends Controller {
} else {
this.dialogTarget.show()
}
this.#orient()
this.dialogTarget.setAttribute('aria-hidden', 'false')
this.dispatch("show")
}
@@ -39,4 +42,25 @@ export default class extends Controller {
closeOnClickOutside({ target }) {
if (!this.element.contains(target)) this.close()
}
#orient() {
console.log("ORIENT")
console.log(`distanceToBottom = ${this.#distanceToBottom}`)
console.log(`maxWidth = ${this.#maxWidth}px`)
this.dialogTarget.classList.toggle("ANDYSMITH", this.#distanceToBottom < BOTTOM_THRESHOLD)
this.dialogTarget.style.setProperty("--max-width", this.#maxWidth + "px")
}
get #distanceToBottom() {
return window.innerHeight - this.#boundingClientRect.bottom
}
get #maxWidth() {
return window.innerWidth - this.#boundingClientRect.left
}
get #boundingClientRect() {
return this.dialogTarget.getBoundingClientRect()
}
}