mirror of
https://github.com/Daniongithub/ER-TPL.git
synced 2025-10-02 12:10:48 +00:00
Improving search sytem.
This commit is contained in:
@@ -16,6 +16,10 @@ body {
|
||||
font-family: Titillium Web;
|
||||
}
|
||||
|
||||
input{
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.search-result {
|
||||
border: 2px solid white;
|
||||
border-radius: 8px;
|
||||
|
@@ -23,12 +23,12 @@
|
||||
<h1>Visualizzatore fermate START Romagna</h1>
|
||||
<label for="bacino">Bacino:</label>
|
||||
<select id="bacino">
|
||||
<option value="" selected>--Scegli un'opzione--</option>
|
||||
<option value="n" selected>--Scegli un'opzione--</option>
|
||||
<option value="ra">Ravenna</option>
|
||||
<option value="rn">Rimini</option>
|
||||
<option value="fc">Forlì-Cesena</option>
|
||||
</select>
|
||||
<div>
|
||||
<div id="ricerca" style="display: none;">
|
||||
<label for="searchBar">Cerca fermata:</label>
|
||||
<input type="text" id="searchBar" placeholder="Cerca una fermata...">
|
||||
</div>
|
||||
|
@@ -50,12 +50,19 @@ document.getElementById('bacino').addEventListener('change', function(event) {
|
||||
const selectedOption = event.target.value;
|
||||
currentSelectedOption = selectedOption;
|
||||
|
||||
if (!selectedOption) {
|
||||
const ricerca = document.getElementById('ricerca');
|
||||
ricerca.removeAttribute('style');
|
||||
|
||||
document.getElementById('searchBar').value = "";
|
||||
|
||||
if(selectedOption == "n"){
|
||||
ricerca.setAttribute("style", "display: none;");
|
||||
allOptions = [];
|
||||
document.getElementById('searchResults').innerHTML = '';
|
||||
return;
|
||||
}
|
||||
|
||||
if(selectedOption != "n"){
|
||||
const resultsContainer = document.getElementById('searchResults');
|
||||
resultsContainer.innerHTML = '<p>Caricamento lista fermate in corso...</p>';
|
||||
|
||||
@@ -69,4 +76,5 @@ document.getElementById('bacino').addEventListener('change', function(event) {
|
||||
resultsContainer.innerHTML = '<p>Errore nel caricamento delle fermate.</p>';
|
||||
console.error('Errore:', err);
|
||||
});
|
||||
}
|
||||
});
|
@@ -1,76 +0,0 @@
|
||||
function populateSearchResults(results, selectedOption) {
|
||||
const searchResultsContainer = document.getElementById('searchResults');
|
||||
searchResultsContainer.innerHTML = '';
|
||||
|
||||
if (results.length === 0) {
|
||||
searchResultsContainer.innerHTML = '<p>Nessun risultato trovato</p>';
|
||||
return;
|
||||
}
|
||||
var w = 900;
|
||||
var h = 600;
|
||||
var l = Math.floor((screen.width-w)/2);
|
||||
var t = Math.floor((screen.height-h)/2);
|
||||
|
||||
results.forEach(item => {
|
||||
const div = document.createElement('div');
|
||||
div.className = 'search-result';
|
||||
div.innerHTML = `
|
||||
<div>
|
||||
<h3>${item.nome}</h3>
|
||||
<p>Palina: ${item.palina}, Target ID: ${item.targetID}</p>
|
||||
</div>
|
||||
`;
|
||||
|
||||
div.addEventListener('click', () => {
|
||||
const url = `fermata.html?palina=${encodeURIComponent(item.palina)}&targetID=${encodeURIComponent(item.targetID)}&selectedOption=${encodeURIComponent(selectedOption)}`;
|
||||
window.open(url, "","top=" + t + ",left=" + l + ",width=" + w + ",height=" + h + ",status=no,menubar=no,toolbar=no scrollbars=yes");
|
||||
});
|
||||
|
||||
searchResultsContainer.appendChild(div);
|
||||
});
|
||||
}
|
||||
|
||||
function filterOptions(query, data) {
|
||||
const q = query.toLowerCase();
|
||||
return data.filter(item =>
|
||||
(item.nome || '').toLowerCase().includes(q) ||
|
||||
(item.palina || '').toLowerCase().includes(q) ||
|
||||
(item.targetID || '').toLowerCase().includes(q)
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
let allOptions = [];
|
||||
let currentSelectedOption = '';
|
||||
|
||||
const searchBar = document.getElementById('searchBar');
|
||||
searchBar.addEventListener('input', function() {
|
||||
const query = searchBar.value;
|
||||
const filteredOptions = filterOptions(query, allOptions);
|
||||
populateSearchResults(filteredOptions, currentSelectedOption);
|
||||
});
|
||||
|
||||
document.getElementById('bacino').addEventListener('change', function(event) {
|
||||
const selectedOption = event.target.value;
|
||||
currentSelectedOption = selectedOption;
|
||||
|
||||
if (!selectedOption) {
|
||||
allOptions = [];
|
||||
document.getElementById('searchResults').innerHTML = '';
|
||||
return;
|
||||
}
|
||||
|
||||
const resultsContainer = document.getElementById('searchResults');
|
||||
resultsContainer.innerHTML = '<p>Caricamento lista fermate in corso...</p>';
|
||||
|
||||
fetch(`https://api.vichingo455.freeddns.org/fermateapi/bacino?selectedOption=${selectedOption}`)
|
||||
.then(res => res.json())
|
||||
.then(data => {
|
||||
allOptions = data;
|
||||
populateSearchResults(allOptions, selectedOption);
|
||||
})
|
||||
.catch(err => {
|
||||
resultsContainer.innerHTML = '<p>Errore nel caricamento delle fermate.</p>';
|
||||
console.error('Errore:', err);
|
||||
});
|
||||
});
|
Reference in New Issue
Block a user