Compare commits

..

2 Commits

Author SHA1 Message Date
0385f7911f Temp fix 2025-09-05 11:51:03 +02:00
7ea1c8d5dd First implementation of a new search filter for Ravenna. Hidden. 2025-09-05 11:47:17 +02:00
4 changed files with 59 additions and 1 deletions

View File

@@ -68,5 +68,6 @@
<div><a href="chisiamo.html" class="link">Chi siamo</a> - <span id="email"><button class="bottone" onclick="mostraemail()">Contattaci</button></span></div> <div><a href="chisiamo.html" class="link">Chi siamo</a> - <span id="email"><button class="bottone" onclick="mostraemail()">Contattaci</button></span></div>
</div> </div>
</footer> </footer>
<script src="/scripts/ertpl.js"></script>
</body> </body>
</html> </html>

View File

@@ -127,4 +127,17 @@ footer {
list-style-type: disc; list-style-type: disc;
list-style-position: inside; list-style-position: inside;
margin-bottom: 10px; margin-bottom: 10px;
}
#radios{
margin-top: 15px;
margin-bottom: 15px;
display: flex;
justify-content: center ;
}
form#radios div{
width: auto;
margin-left: 10px;
padding: 8px;
border: 2px #404040 solid;
border-radius: 8px;
} }

View File

@@ -2,7 +2,7 @@
<html lang="it"> <html lang="it">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="filtroport" 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">
@@ -30,6 +30,24 @@
<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>
<label for="text">Nome fermata</label>
<input type="radio" name="filtro" id="text" autocomplete="off" checked>
</div>
<div>
<label for="lungo">Cod. fermata lungo</label>
<input type="radio" name="filtro" id="lungo" autocomplete="off">
</div>
<div>
<label for="breve">Cod. fermata breve</label>
<input type="radio" name="filtro" id="breve" autocomplete="off">
</div>
<div>
<label for="tid">Target ID</label>
<input type="radio" name="filtro" id="tid" autocomplete="off">
</div>
</form>-->
<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>

View File

@@ -26,6 +26,11 @@ function populateSearchResults(results, selectedOption) {
}); });
} }
function getFermatadaBreve(codbreve){
const middle = String(codbreve).padStart(4, "0");
return `7${middle}0`;
}
function filterOptions(query, data) { function filterOptions(query, data) {
const q = query.toLowerCase(); const q = query.toLowerCase();
return data.filter(item => return data.filter(item =>
@@ -46,10 +51,27 @@ searchBar.addEventListener('input', function() {
populateSearchResults(filteredOptions, currentSelectedOption); populateSearchResults(filteredOptions, currentSelectedOption);
}); });
searchBar.addEventListener('input', function() {
const query = searchBar.value;
let filteredOptions;
if (currentSelectedOption !== "ra") {
filteredOptions = filterOptions(query, allOptions);
} else {
//placeholder: qui metteremo il filtro dettagliato per "ra"
filteredOptions = filterOptions(query, allOptions);
//TODO: implementare filtro "ra" custom
}
populateSearchResults(filteredOptions, currentSelectedOption);
});
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 ricerca = document.getElementById('ricerca'); const ricerca = document.getElementById('ricerca');
ricerca.removeAttribute('style'); ricerca.removeAttribute('style');
@@ -57,10 +79,14 @@ 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;");
allOptions = []; allOptions = [];
document.getElementById('searchResults').innerHTML = ''; document.getElementById('searchResults').innerHTML = '';
return; return;
} }
/*else if(selectedOption == "ra"){
radiobuttons.removeAttribute('style')
}*/
if(selectedOption != "n"){ if(selectedOption != "n"){
const resultsContainer = document.getElementById('searchResults'); const resultsContainer = document.getElementById('searchResults');