ynerant
/
tgvmax
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Better display with accordions

This commit is contained in:
Emmy D'Anello 2023-02-13 13:02:34 +01:00
parent c2b7664375
commit 4f326626bf
Signed by: ynerant
GPG Key ID: 3A75C55819C8CF85
1 changed files with 43 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
templates/index.html
View File

@ -82,18 +82,55 @@
.then(resp => resp.json()) .then(resp => resp.json())
.then(routes => { .then(routes => {
result_elem.innerHTML = '' result_elem.innerHTML = ''
let city_elem = document.createElement('ul')
result_elem.appendChild(city_elem) let cities_number = Object.keys(routes).length
let accordion = document.createElement('div')
accordion.classList.add('accordion')
accordion.setAttribute('id', 'result-accordion')
result_elem.appendChild(accordion)
for (let city in routes) { for (let city in routes) {
let city_routes = routes[city] let city_routes = routes[city]
let city_name_elem = document.createElement('li') let city_id = city.replaceAll(' ', '_')
city_name_elem.textContent = city + " :"
city_elem.appendChild(city_name_elem) let city_elem = document.createElement('div')
city_elem.classList.add('accordion-item')
accordion.appendChild(city_elem)
let city_header = document.createElement('h2')
city_header.classList.add('accordion-header')
city_header.setAttribute('id', 'collapse-header-' + city_id)
city_elem.appendChild(city_header)
let city_name_button = document.createElement('button')
city_name_button.classList.add('accordion-button')
if (cities_number > 1)
city_name_button.classList.add('collapsed')
city_name_button.setAttribute('type', 'button')
city_name_button.setAttribute('data-bs-toggle', 'collapse')
city_name_button.setAttribute('data-bs-target', '#collapse-' + city_id)
city_name_button.setAttribute('aria-expanded', cities_number > 1 ? 'false' : 'true')
city_name_button.setAttribute('aria-controls', 'collapse-' + city_id)
city_name_button.textContent = city
city_header.appendChild(city_name_button)
let collapse = document.createElement('div')
collapse.setAttribute('id', 'collapse-' + city_id)
collapse.classList.add('accordion-collapse')
if (cities_number > 1)
collapse.classList.add('collapse')
collapse.setAttribute('aria-labelled-by', 'collapse-header-' + city_id)
collapse.setAttribute('data-bs-parent', '#result-accordion')
city_elem.appendChild(collapse)
let collapse_body = document.createElement('div')
collapse_body.classList.add('accordion-body')
collapse.appendChild(collapse_body)
let routes_elem = document.createElement('ul') let routes_elem = document.createElement('ul')
city_elem.appendChild(routes_elem) collapse_body.appendChild(routes_elem)
for (let route of city_routes) { for (let route of city_routes) {
let route_elem = document.createElement('li') let route_elem = document.createElement('li')