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