style & scroll into view

This commit is contained in:
Zhora Shalyapin 2025-03-19 15:32:04 +00:00
parent 76e46bd9b6
commit cadb4b5fbd

33
main.js
View File

@ -1849,6 +1849,10 @@
[...document.querySelector(select).selectedOptions].forEach(el => el.selected = false) [...document.querySelector(select).selectedOptions].forEach(el => el.selected = false)
} }
function scrollSelectToBottom(select) {
document.querySelector(`${select} option:last-child`).scrollIntoView()
}
function prettifyRouteEditPage() { function prettifyRouteEditPage() {
document.querySelectorAll(`textarea:is([name="track[comment_int]"], [name="track[comment_ext]"])`).forEach(el => { document.querySelectorAll(`textarea:is([name="track[comment_int]"], [name="track[comment_ext]"])`).forEach(el => {
el.rows = 1 el.rows = 1
@ -1858,15 +1862,18 @@
let addPointsContainer = document.createElement("div") let addPointsContainer = document.createElement("div")
let input = document.createElement("input") let pointInput = document.createElement("input")
input.id = "add-point" pointInput.id = "add-point"
input.type = "text" pointInput.type = "text"
pointInput.addEventListener("focus", () => {
pointInput.classList.remove("success")
})
let addButton = document.createElement("button") let addButton = document.createElement("button")
addButton.type = "button" addButton.type = "button"
addButton.textContent = "Добавить" addButton.textContent = "Добавить"
addButton.addEventListener("click", () => { addButton.addEventListener("click", () => {
let point = document.querySelector("#add-point").value let point = pointInput.value
if (point == "") return if (point == "") return
let availablePoints = matchNumberFromSelect("#cps_avail") let availablePoints = matchNumberFromSelect("#cps_avail")
@ -1886,14 +1893,17 @@
let option = document.querySelector(`#cps_avail option[value="${availablePoints[point]}"]`) let option = document.querySelector(`#cps_avail option[value="${availablePoints[point]}"]`)
option.selected = true option.selected = true
document.querySelector(`#cps_add`).click() document.querySelector(`#cps_add`).click()
pointInput.classList.add("success")
pointInput.value = ""
option.selected = false option.selected = false
scrollSelectToBottom("#cps_in")
}) })
let removeButton = document.createElement("button") let removeButton = document.createElement("button")
removeButton.type = "button" removeButton.type = "button"
removeButton.textContent = "Убрать" removeButton.textContent = "Убрать"
removeButton.addEventListener("click", () => { removeButton.addEventListener("click", () => {
let point = document.querySelector("#add-point").value let point = pointInput.value
if (point == "") return if (point == "") return
let addedPoints = matchNumberFromSelect("#cps_in") let addedPoints = matchNumberFromSelect("#cps_in")
@ -1904,16 +1914,27 @@
let option = document.querySelector(`#cps_in option[value="${addedPoints[point]}"]`) let option = document.querySelector(`#cps_in option[value="${addedPoints[point]}"]`)
option.selected = true option.selected = true
document.querySelector(`#cps_delete`).click() document.querySelector(`#cps_delete`).click()
pointInput.classList.add("success")
pointInput.value = ""
option.selected = false option.selected = false
scrollSelectToBottom("#cps_in")
}) })
addPointsContainer.append(addButton) addPointsContainer.append(addButton)
addPointsContainer.append(input) addPointsContainer.append(pointInput)
addPointsContainer.append(removeButton) addPointsContainer.append(removeButton)
document.querySelector("table tr:nth-child(16) td").prepend(addPointsContainer) document.querySelector("table tr:nth-child(16) td").prepend(addPointsContainer)
addStylesToHead(` addStylesToHead(`
select {
height: 15em;
}
.success {
border-color: green;
}
#add-point { #add-point {
width: 5em; width: 5em;
} }