Beta cerca fermate seta + fix warning size
This commit is contained in:
parent
6023aac224
commit
e887c57348
|
@ -18,10 +18,10 @@
|
||||||
<nav class="index">
|
<nav class="index">
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
<h1 style="color:red;">ATTENZIONE! Essendo periodo di vacanza è stato necessario spegnere il server script, dunque non è possibile usare i servizi di Start Romagna. Ci scusiamo per il disagio.</a>
|
<h1 class="warning">ATTENZIONE! Essendo periodo di vacanza è stato necessario spegnere il server script, dunque non è possibile usare i servizi di Start Romagna. Ci scusiamo per il disagio.</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<ul style="justify-content: right;">
|
<ul style="flex:1;justify-content: right;">
|
||||||
<li><a href="/altri_menu/altri.html"><h1 style="font-size: 100%;font-weight: 500;">Altre Regioni</h1></a></li>
|
<li><a href="/altri_menu/altri.html"><h1 style="font-size: 100%;font-weight: 500;">Altre Regioni</h1></a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
|
@ -0,0 +1,122 @@
|
||||||
|
:root {
|
||||||
|
--primary-color: #afafaf;
|
||||||
|
--accent-color: #0074d9;
|
||||||
|
--bg-color: #2e2d2d;
|
||||||
|
--white: #ffffff;
|
||||||
|
--light-gray: #848991;
|
||||||
|
--border-color: #727070;
|
||||||
|
--text-color: #ffffff;
|
||||||
|
--black: #000000;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
background-color: #282828;
|
||||||
|
text-align: center;
|
||||||
|
color: white;
|
||||||
|
font-family: Titillium Web;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search-result {
|
||||||
|
border: 2px solid white;
|
||||||
|
border-radius: 8px;
|
||||||
|
width: 15%;
|
||||||
|
margin: auto;
|
||||||
|
margin-left: 5px;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-top: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
border-collapse: collapse;
|
||||||
|
border-radius: 8px;
|
||||||
|
width: 85%;
|
||||||
|
margin: auto;
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
th {
|
||||||
|
background-color: lightslategray;
|
||||||
|
}
|
||||||
|
|
||||||
|
th,
|
||||||
|
td {
|
||||||
|
border: 2px solid #444;
|
||||||
|
padding: 8px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
tr:nth-child(even) {
|
||||||
|
background-color: dimgray;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bus-card-red {
|
||||||
|
background-color: rgb(241, 120, 120) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
font-size: 67%;
|
||||||
|
background-color: #333;
|
||||||
|
height: auto;
|
||||||
|
padding: 0px 0px;
|
||||||
|
align-items: start;
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav ul {
|
||||||
|
list-style-type: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav {
|
||||||
|
text-align: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav.index {
|
||||||
|
display: flex;
|
||||||
|
min-height: 51px;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav ul li {
|
||||||
|
margin-left: 20px;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav ul li a {
|
||||||
|
color: #fff;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav ul li a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: orange;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.search-result {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
#bacino,
|
||||||
|
#searchBar {
|
||||||
|
padding: 10px;
|
||||||
|
font-size: 16px;
|
||||||
|
border-radius: 6px;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
position: relative;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
|
@ -0,0 +1,30 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<title>SETA Modena - Orario fermate</title>
|
||||||
|
<link rel="stylesheet" href="css/style.css">
|
||||||
|
<link rel="shortcut icon" href="https://www.setaweb.it/images/favicon/android-icon-192x192.png">
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700&display=swap" rel="stylesheet">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html"><p>Home</p></a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<h2>Informazioni fermata <span id="fermata-span"></span></h2>
|
||||||
|
<div id="tabella-container">Caricamento dati...</div>
|
||||||
|
<footer>
|
||||||
|
<div>
|
||||||
|
<p>Copyright (C) 2025 ER-TPL Team - <a href="https://ertpl.pages.dev" target="_blank">ertpl.pages.dev</a> - code by Il Dani & SetaModenaFanpage <a href="about:blank" target="_blank">Codice Sorgente (Inserire link)</a></p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<script src="js/fermata.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
Binary file not shown.
After Width: | Height: | Size: 1.1 KiB |
|
@ -0,0 +1,44 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="it">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>SETA Modena - Cerca fermata</title>
|
||||||
|
<link rel="stylesheet" href="css/style.css">
|
||||||
|
<link rel="shortcut icon" href="https://www.setaweb.it/images/favicon/android-icon-192x192.png">
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700&display=swap" rel="stylesheet">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><a href="/index.html"><h1 style="font-size: 100%;font-weight: 500;">Home</h1></a></li>
|
||||||
|
<li><a href="/"><h1 style="font-size: 100%;font-weight: 500;">Ravenna</h1></a></li>
|
||||||
|
<li><a href="/start_menu/start.html"><h1 style="font-size: 100%;font-weight: 500;">START Romagna</h1></a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<h1>Visualizzatore orari di arrivo SETA Modena</h1>
|
||||||
|
<!--
|
||||||
|
<label for="bacino">Bacino:</label>
|
||||||
|
<select id="bacino">
|
||||||
|
<option value="" selected>--Scegli un'opzione--</option>
|
||||||
|
<option value="ra">Ravenna</option>
|
||||||
|
<option value="rn">Rimini</option>
|
||||||
|
<option value="fc">Forlì-Cesena</option>
|
||||||
|
</select>
|
||||||
|
-->
|
||||||
|
<div>
|
||||||
|
<label for="searchBar">Cerca fermata:</label>
|
||||||
|
<input type="text" id="searchBar" placeholder="Cerca una fermata...">
|
||||||
|
</div>
|
||||||
|
<div id="searchResults"></div>
|
||||||
|
<footer>
|
||||||
|
<div>
|
||||||
|
<p>Copyright (C) 2025 ER-TPL Team - <a href="https://ertpl.pages.dev" target="_blank">ertpl.pages.dev</a> - code by Il Dani & SetaModenaFanpage <a href="about:blank" target="_blank">Codice Sorgente (Inserire link)</a></p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<script src="js/cercafermata.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,52 @@
|
||||||
|
const searchBar = document.getElementById('searchBar');
|
||||||
|
const resultsContainer = document.getElementById('searchResults');
|
||||||
|
|
||||||
|
let allresults = [];
|
||||||
|
window.onbeforeunload=searchBar.value="";
|
||||||
|
|
||||||
|
const url = 'http://setaapi.serverissimo.freeddns.org/stoplist';
|
||||||
|
fetch(url)
|
||||||
|
.then(response => {
|
||||||
|
if (!response.ok) throw new Error("Errore nel caricamento dei dati.");
|
||||||
|
return response.json();
|
||||||
|
})
|
||||||
|
.then(data => {
|
||||||
|
allresults = data;
|
||||||
|
})
|
||||||
|
.catch(error => console.error('Errore nel caricamento dei dati:', error));
|
||||||
|
|
||||||
|
searchBar.addEventListener('input', () => {
|
||||||
|
const searchTerm = searchBar.value.toLowerCase();
|
||||||
|
const filtered = allresults.filter(item =>
|
||||||
|
item.fermata.toLowerCase().includes(searchTerm)
|
||||||
|
);
|
||||||
|
renderresults(filtered);
|
||||||
|
});
|
||||||
|
|
||||||
|
function renderresults(results) {
|
||||||
|
const searchResultsContainer = document.getElementById('searchResults');
|
||||||
|
searchResultsContainer.innerHTML = '';
|
||||||
|
|
||||||
|
if (results.length === 0) {
|
||||||
|
searchResultsContainer.innerHTML = '<p>Nessun risultato trovato</p>';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
results.forEach(item => {
|
||||||
|
const div = document.createElement('div');
|
||||||
|
div.className = 'search-result';
|
||||||
|
div.innerHTML = `
|
||||||
|
<div>
|
||||||
|
<h3>${item.fermata}</h3>
|
||||||
|
<p>Codice fermata: ${item.valore}</p>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
div.addEventListener('click', () => {
|
||||||
|
const url = `fermata.html?code=${encodeURIComponent(item.valore)}&name=${encodeURIComponent(item.fermata)}`;
|
||||||
|
window.open(url, '_blank');
|
||||||
|
});
|
||||||
|
|
||||||
|
searchResultsContainer.appendChild(div);
|
||||||
|
});
|
||||||
|
}
|
|
@ -0,0 +1,80 @@
|
||||||
|
const params = new URLSearchParams(window.location.search);
|
||||||
|
const nome = params.get('name');
|
||||||
|
const codice = params.get('code');
|
||||||
|
|
||||||
|
//Sets stop name
|
||||||
|
const fermata_span = document.getElementById('fermata-span');
|
||||||
|
fermata_span.innerHTML = `"${nome}"`;
|
||||||
|
|
||||||
|
const urlBackend = `http://setaapi.serverissimo.freeddns.org/arrivals/${codice}`;
|
||||||
|
function caricadati(){
|
||||||
|
fetch(urlBackend)
|
||||||
|
.then(response => {
|
||||||
|
if (!response.ok) throw new Error("Errore nel caricamento dei dati.");
|
||||||
|
return response.json();
|
||||||
|
})
|
||||||
|
.then(data => {
|
||||||
|
item = data.arrival;
|
||||||
|
})
|
||||||
|
.then(data => {
|
||||||
|
|
||||||
|
const container = document.getElementById('tabella-container');
|
||||||
|
container.innerHTML = '';
|
||||||
|
|
||||||
|
if (item.error=="no arrivals scheduled in next 90 minutes") {
|
||||||
|
container.innerHTML = '<h3>Nessuna corsa programmata nei prossimi 90 minuti.</h3>';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// Creo tabella
|
||||||
|
const table = document.createElement('table');
|
||||||
|
|
||||||
|
// Intestazione
|
||||||
|
const thead = document.createElement('thead');
|
||||||
|
thead.innerHTML = `
|
||||||
|
<tr>
|
||||||
|
<th>Linea</th>
|
||||||
|
<th>Direzione</th>
|
||||||
|
<th>Orario</th>
|
||||||
|
<th>Stato corsa</th>
|
||||||
|
<th>Veicolo</th>
|
||||||
|
<th>Ora si trova a:</th>
|
||||||
|
</tr>
|
||||||
|
`;
|
||||||
|
table.appendChild(thead);
|
||||||
|
|
||||||
|
// Corpo tabella
|
||||||
|
const tbody = document.createElement('tbody');
|
||||||
|
item.services.forEach(item => {
|
||||||
|
const tr = document.createElement('tr');
|
||||||
|
if(item.type=="planned"){
|
||||||
|
var stato="Prevista";
|
||||||
|
}else{
|
||||||
|
var stato="In tempo reale";
|
||||||
|
}if(item.next_stop==null){
|
||||||
|
var posizione="";
|
||||||
|
}else{
|
||||||
|
var posizione=item.next_stop;
|
||||||
|
}
|
||||||
|
tr.innerHTML = `
|
||||||
|
<td>${item.service}</td>
|
||||||
|
<td>${item.destination}</td>
|
||||||
|
<td>${item.arrival}</td>
|
||||||
|
<td>${stato}</td>
|
||||||
|
<td>${item.busnum}</td>
|
||||||
|
<td>${posizione}</td>
|
||||||
|
`;
|
||||||
|
tbody.appendChild(tr);
|
||||||
|
});
|
||||||
|
table.appendChild(tbody);
|
||||||
|
|
||||||
|
container.appendChild(table);
|
||||||
|
})
|
||||||
|
.catch(err => {
|
||||||
|
console.error('Errore nel caricamento dati:', err);
|
||||||
|
document.getElementById('tabella-container').textContent = 'Errore nel caricamento dati.';
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
caricadati();
|
||||||
|
|
||||||
|
setInterval(caricadati, 60000);
|
|
@ -3,7 +3,7 @@
|
||||||
<url>
|
<url>
|
||||||
<loc>https://www.ertpl.pages.dev</loc>
|
<loc>https://www.ertpl.pages.dev</loc>
|
||||||
<priority>1.00</priority>
|
<priority>1.00</priority>
|
||||||
<lastmod>2025-06-15</lastmod>
|
<lastmod>2025-07-25</lastmod>
|
||||||
</url>
|
</url>
|
||||||
<url>
|
<url>
|
||||||
<loc>https://www.ertpl.pages.dev/pagenotavailable.html</loc>
|
<loc>https://www.ertpl.pages.dev/pagenotavailable.html</loc>
|
||||||
|
|
|
@ -142,6 +142,12 @@ nav ul li a {
|
||||||
nav ul li a:hover {
|
nav ul li a:hover {
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
nav ul li h1.warning {
|
||||||
|
color:red;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
.bus{
|
.bus{
|
||||||
border: 2px solid;
|
border: 2px solid;
|
||||||
border-style: hidden;
|
border-style: hidden;
|
||||||
|
|
Loading…
Reference in New Issue