Fix js code and comment formatting

This commit is contained in:
2026-07-06 23:26:43 +02:00
parent 159b4b340f
commit 30c80e6e2e

View File

@@ -3,12 +3,14 @@
import "@hotwired/turbo-rails" import "@hotwired/turbo-rails"
/* Hide page before loaded for testing purposes */ // Show page if hidden for testing purposes.
function showPage(event) { function showPage(event) {
document.documentElement.style.visibility="visible" document.documentElement.style.visibility="visible"
} }
document.addEventListener('turbo:load', showPage) document.addEventListener('turbo:load', showPage)
// <details> event handlers.
function detailsChange(event) { function detailsChange(event) {
var target = event.currentTarget var target = event.currentTarget
var count = target.querySelectorAll('input:checked:not([disabled])').length var count = target.querySelectorAll('input:checked:not([disabled])').length
@@ -24,7 +26,7 @@ function detailsChange(event) {
} }
window.detailsChange = detailsChange window.detailsChange = detailsChange
/* Close open <details> when focus lost */ // Close open <details> when focus lost.
function detailsClose(event) { function detailsClose(event) {
if (!event.relatedTarget || if (!event.relatedTarget ||
event.relatedTarget.closest("details") != event.currentTarget) { event.relatedTarget.closest("details") != event.currentTarget) {
@@ -37,6 +39,8 @@ window.detailsObserver = new MutationObserver((mutations) => {
mutations[0].target.dispatchEvent(new Event('change', {bubbles: true})) mutations[0].target.dispatchEvent(new Event('change', {bubbles: true}))
}); });
// Validation of multiple-submit forms with different field requirements.
function formValidate(event) { function formValidate(event) {
var id = event.submitter.getAttribute("data-validate") var id = event.submitter.getAttribute("data-validate")
if (!id) return; if (!id) return;
@@ -79,7 +83,7 @@ Turbo.StreamActions.enable = function() {
this.targetElements.forEach((e) => { this.enableElement(e) }) this.targetElements.forEach((e) => { this.enableElement(e) })
} }
/* TODO: change to visibility = collapse to avoid width change? */ // TODO: change to visibility = collapse to avoid width change?
Turbo.StreamActions.hide = function() { Turbo.StreamActions.hide = function() {
this.targetElements.forEach((e) => { e.style.display = "none" }) this.targetElements.forEach((e) => { e.style.display = "none" })
} }
@@ -96,7 +100,7 @@ Turbo.StreamActions.collapse = function() {
Turbo.StreamActions.close_form = function() { Turbo.StreamActions.close_form = function() {
this.targetElements.forEach((e) => { this.targetElements.forEach((e) => {
/* Move focus if there's no focus or focus inside form being closed */ // Move focus if there's no focus or focus inside form being closed.
const focused = document.activeElement const focused = document.activeElement
if (!focused || (focused == document.body) || e.contains(focused)) { if (!focused || (focused == document.body) || e.contains(focused)) {
let nextForm = e.parentElement.querySelector(`#${e.id} ~ tr:has([autofocus])`) let nextForm = e.parentElement.querySelector(`#${e.id} ~ tr:has([autofocus])`)
@@ -121,6 +125,8 @@ Turbo.StreamActions.unselect = function() {
}) })
} }
// Keyboard event processing handlers.
function formProcessKey(event) { function formProcessKey(event) {
switch (event.key) { switch (event.key) {
case "Escape": case "Escape":
@@ -147,7 +153,7 @@ function detailsProcessKey(event) {
var button = event.currentTarget.querySelector("button:not([disabled])") var button = event.currentTarget.querySelector("button:not([disabled])")
if (button) { if (button) {
button.click() button.click()
// Autofocus won't be respected unless target is blurred // Autofocus won't be respected unless target is blurred.
event.target.blur() event.target.blur()
event.preventDefault() event.preventDefault()
event.stopPropagation() event.stopPropagation()
@@ -157,7 +163,8 @@ function detailsProcessKey(event) {
} }
window.detailsProcessKey = detailsProcessKey; window.detailsProcessKey = detailsProcessKey;
/* Items table drag and drop support */
// Items table drag and drop support.
var lastEnterTime var lastEnterTime
function dragStart(event) { function dragStart(event) {
lastEnterTime = event.timeStamp lastEnterTime = event.timeStamp
@@ -167,7 +174,8 @@ function dragStart(event) {
}) })
event.dataTransfer.setData("text/plain", row.getAttribute("data-drag-path")) event.dataTransfer.setData("text/plain", row.getAttribute("data-drag-path"))
var rowRectangle = row.getBoundingClientRect() var rowRectangle = row.getBoundingClientRect()
event.dataTransfer.setDragImage(row, event.x - rowRectangle.left, event.y - rowRectangle.top) event.dataTransfer.setDragImage(row, event.x - rowRectangle.left,
event.y - rowRectangle.top)
event.dataTransfer.dropEffect = "move" event.dataTransfer.dropEffect = "move"
} }
window.dragStart = dragStart window.dragStart = dragStart
@@ -177,7 +185,7 @@ window.dragStart = dragStart
* * Enter/Leave events at the same timeStamp may not be logically ordered * * Enter/Leave events at the same timeStamp may not be logically ordered
* (e.g. E -> E -> L, not E -> L -> E), * (e.g. E -> E -> L, not E -> L -> E),
* * not every Enter event has corresponding Leave event, especially during * * not every Enter event has corresponding Leave event, especially during
* rapid pointer moves * rapid pointer moves.
* NOTE: sometimes Leave is not emitted when pointer goes fast over table * NOTE: sometimes Leave is not emitted when pointer goes fast over table
* and outside. This should probably be fixed in browser, than patched here. * and outside. This should probably be fixed in browser, than patched here.
*/ */
@@ -197,7 +205,7 @@ window.dragOver = dragOver
function dragLeave(event) { function dragLeave(event) {
//console.log(event.timeStamp + " " + event.type + ": " + event.currentTarget.id) //console.log(event.timeStamp + " " + event.type + ": " + event.currentTarget.id)
// Leave has been accounted for by Enter at the same timestamp, processed earlier // Leave has been accounted for by Enter at the same timestamp, processed earlier.
if (event.timeStamp <= lastEnterTime) return if (event.timeStamp <= lastEnterTime) return
event.currentTarget.closest("table").querySelectorAll(".dropzone").forEach((tr) => { event.currentTarget.closest("table").querySelectorAll(".dropzone").forEach((tr) => {
tr.classList.remove("dropzone") tr.classList.remove("dropzone")