daniele/ER-TPL
1
0
Fork 0
mirror of https://github.com/Daniongithub/ER-TPL.git synced 2025-10-02 12:10:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

New search system in Visualizzatore fermate service.

Browse Source
This commit is contained in:
Curry141
2025-09-05 21:22:28 +02:00
parent 0385f7911f
commit c549034e88
4 changed files with 78 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
index.html
View File

@@ -50,8 +50,9 @@
<div class="riga"> <div class="riga">
<h2 class="piccolospazio">Ravenna:</h2> <h2 class="piccolospazio">Ravenna:</h2>
<p class="piccolospazio"> <p class="piccolospazio">
<a class="novita" href="/start_menu/servizi/start-fermatebus/index.html">Visualizzatore fermate</a>: MEGA-UPDATE, il bacino di Ravenna possiede 4 filtri diversi, che poi verranno spiegati nelle <a class="novita" href="/start_menu/servizi/start-fermatebus/info.html">info</a>. <br>I risultati vengono anche ordinati in base al criterio di ricerca.
Migliorie generali.<br> Migliorie generali.<br>
<a class="novita" href="/start_menu/servizi/start-fermatebus/index.html">Visualizzatore fermate</a>: aggiunte <a class="novita" href="/start_menu/servizi/start-fermatebus/info.html">informazioni</a> e cambiato titolo scheda fermata.<br> Visualizzatore fermate: aggiunte <a class="novita" href="/start_menu/servizi/start-fermatebus/info.html">informazioni</a> e cambiato titolo scheda fermata.<br>
Visualizzatore fermate: versione mobile migliorata, rimosso parametro "Soppressa"<br>poichè ridondante con "Stato attuale" quando accade.<br> Visualizzatore fermate: versione mobile migliorata, rimosso parametro "Soppressa"<br>poichè ridondante con "Stato attuale" quando accade.<br>
In arrivo: "37251-37258 MAN Lion's City 12E". In arrivo: "37251-37258 MAN Lion's City 12E".
</p> </p>

16
start_menu/servizi/start-fermatebus/css/style.css
View File

@@ -3,7 +3,14 @@
display: block !important; display: block !important;
width: 95.5% !important; width: 95.5% !important;
} }
#radios{
display: table !important;
margin-left: auto;
margin-right: auto;
}
#radios div{
margin-top: 8px;
}
#tabella-container{ #tabella-container{
overflow-x: scroll; overflow-x: scroll;
} }
@@ -30,6 +37,7 @@ input{
margin-top: 10px; margin-top: 10px;
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
padding: 2px;
} }
table { table {
@@ -112,6 +120,10 @@ a {
border: 1px solid #727070; border: 1px solid #727070;
} }
#bacino{
margin-top: 10px;
}
footer { footer {
position: relative; position: relative;
bottom: 0; bottom: 0;
@@ -134,7 +146,7 @@ footer {
display: flex; display: flex;
justify-content: center ; justify-content: center ;
} }
form#radios div{ div#radios div{
width: auto; width: auto;
margin-left: 10px; margin-left: 10px;
padding: 8px; padding: 8px;

9
start_menu/servizi/start-fermatebus/index.html
View File

@@ -2,7 +2,7 @@
<html lang="it"> <html lang="it">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="filtroport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>START Romagna - Visualizza fermata</title> <title>START Romagna - Visualizza fermata</title>
<link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/style.css">
<link rel="shortcut icon" href="img/favicon.ico"> <link rel="shortcut icon" href="img/favicon.ico">
@@ -23,14 +23,15 @@
<h1>Visualizzatore fermate START Romagna</h1> <h1>Visualizzatore fermate START Romagna</h1>
<a class="info" href="info.html">Informazioni sul servizio</a><br> <a class="info" href="info.html">Informazioni sul servizio</a><br>
<label for="bacino">Bacino:</label> <label for="bacino">Bacino:</label>
<select id="bacino"> <select id="bacino" autocomplete="off">
<option value="n" selected>--Scegli un'opzione--</option> <option value="n" selected>--Scegli un'opzione--</option>
<option value="ra">Ravenna</option> <option value="ra">Ravenna</option>
<option value="rn">Rimini</option> <option value="rn">Rimini</option>
<option value="fc">Forlì-Cesena</option> <option value="fc">Forlì-Cesena</option>
</select> </select>
<div id="ricerca" style="display: none;"> <div id="ricerca" style="display: none;">
<!--<form id="radios" style="display: none;"> <div id="radios" style="display: none;">
<p>Seleziona un filtro:</p>
<div> <div>
<label for="text">Nome fermata</label> <label for="text">Nome fermata</label>
<input type="radio" name="filtro" id="text" autocomplete="off" checked> <input type="radio" name="filtro" id="text" autocomplete="off" checked>
@@ -47,7 +48,7 @@
<label for="tid">Target ID</label> <label for="tid">Target ID</label>
<input type="radio" name="filtro" id="tid" autocomplete="off"> <input type="radio" name="filtro" id="tid" autocomplete="off">
</div> </div>
</form>--> </div>
<label for="searchBar">Cerca fermata:</label> <label for="searchBar">Cerca fermata:</label>
<input type="text" id="searchBar" placeholder="Cerca una fermata..."> <input type="text" id="searchBar" placeholder="Cerca una fermata...">
</div> </div>

70
start_menu/servizi/start-fermatebus/js/cercafermata.js
View File

@@ -13,7 +13,7 @@ function populateSearchResults(results, selectedOption) {
div.innerHTML = ` div.innerHTML = `
<div> <div>
<h3>${item.nome}</h3> <h3>${item.nome}</h3>
<p>Palina: ${item.palina}, Target ID: ${item.targetID}</p> <p>Fermata: ${item.palina}, Target ID: ${item.targetID}</p>
</div> </div>
`; `;
@@ -26,8 +26,8 @@ function populateSearchResults(results, selectedOption) {
}); });
} }
function getFermatadaBreve(codbreve){ function getFermatadaBreve(codice){
const middle = String(codbreve).padStart(4, "0"); const middle = String(codice).padStart(4, "0");
return `7${middle}0`; return `7${middle}0`;
} }
@@ -40,6 +40,31 @@ function filterOptions(query, data) {
); );
} }
function filtraTesto(query, data){
const q = query.toLowerCase();
return data
.filter(item => (item.nome || '').toLowerCase().includes(q))
.sort((a, b) => (a.nome || '').localeCompare(b.nome || ''));
}
function filtraLungo(query, data){
const q = query.toLowerCase();
return data
.filter(item => (item.palina || '').toLowerCase().includes(q))
.sort((a, b) => (a.palina || '').localeCompare(b.palina || ''));
}
function filtraBreve(query, data){
const cod = getFermatadaBreve(query);
return filtraLungo(cod, data);
}
function filtraTID(query, data){
const q = query.toLowerCase();
return data
.filter(item => (item.targetID || '').toLowerCase().includes(q))
.sort((a, b) => (a.targetID || '').localeCompare(b.targetID || ''));
}
let allOptions = []; let allOptions = [];
let currentSelectedOption = ''; let currentSelectedOption = '';
@@ -58,20 +83,37 @@ searchBar.addEventListener('input', function() {
if (currentSelectedOption !== "ra") { if (currentSelectedOption !== "ra") {
filteredOptions = filterOptions(query, allOptions); filteredOptions = filterOptions(query, allOptions);
} else { } else {
//placeholder: qui metteremo il filtro dettagliato per "ra" if (document.getElementById('text').checked){
filteredOptions = filterOptions(query, allOptions); filteredOptions = filtraTesto(query, allOptions);
//TODO: implementare filtro "ra" custom }
else if (document.getElementById('lungo').checked){
filteredOptions = filtraLungo(query, allOptions);
}
else if (document.getElementById('breve').checked){
filteredOptions = filtraBreve(query, allOptions);
}
else if(document.getElementById('tid').checked){
filteredOptions = filtraTID(query, allOptions);
}
} }
populateSearchResults(filteredOptions, currentSelectedOption); populateSearchResults(filteredOptions, currentSelectedOption);
}); });
const radios = document.querySelectorAll('#radios input[type="radio"]');
radios.forEach(radio => {
radio.addEventListener('change', () => {
searchBar.value = '';
document.getElementById('searchResults').innerHTML = '';
});
});
document.getElementById('bacino').addEventListener('change', function(event) { document.getElementById('bacino').addEventListener('change', function(event) {
const selectedOption = event.target.value; const selectedOption = event.target.value;
currentSelectedOption = selectedOption; currentSelectedOption = selectedOption;
//const radiobuttons = document.getElementById('radios'); const urlFermate = `https://api.vichingo455.freeddns.org/fermateapi/bacino?selectedOption=${selectedOption}`;
const radiobuttons = document.getElementById('radios');
const ricerca = document.getElementById('ricerca'); const ricerca = document.getElementById('ricerca');
ricerca.removeAttribute('style'); ricerca.removeAttribute('style');
@@ -79,20 +121,22 @@ document.getElementById('bacino').addEventListener('change', function(event) {
if(selectedOption == "n"){ if(selectedOption == "n"){
ricerca.setAttribute("style", "display: none;"); ricerca.setAttribute("style", "display: none;");
//radiobuttons.setAttribute("style", "display: none;"); radiobuttons.setAttribute("style", "display: none;");
allOptions = []; allOptions = [];
document.getElementById('searchResults').innerHTML = ''; document.getElementById('searchResults').innerHTML = '';
return; return;
} }
/*else if(selectedOption == "ra"){ else if(selectedOption == "ra"){
radiobuttons.removeAttribute('style') radiobuttons.removeAttribute('style')
}*/ }
if(selectedOption != "n"){ if(selectedOption != "n"){
const resultsContainer = document.getElementById('searchResults'); const resultsContainer = document.getElementById('searchResults');
resultsContainer.innerHTML = '<p>Caricamento lista fermate in corso...</p>'; resultsContainer.innerHTML = '<p>Caricamento lista fermate in corso...</p>';
if(selectedOption != "ra"){
fetch(`https://api.vichingo455.freeddns.org/fermateapi/bacino?selectedOption=${selectedOption}`) radiobuttons.setAttribute("style", "display: none;");
}
fetch(urlFermate)
.then(res => res.json()) .then(res => res.json())
.then(data => { .then(data => {
allOptions = data; allOptions = data;