diff --git a/eltiempo/servidor/api-weather-reverse.php b/eltiempo/servidor/api-weather-reverse.php old mode 100755 new mode 100644 diff --git a/eltiempo/servidor/api-weather.php b/eltiempo/servidor/api-weather.php old mode 100755 new mode 100644 diff --git a/formula1/css/estilos.css b/formula1/css/estilos.css new file mode 100644 index 0000000..3fe582a --- /dev/null +++ b/formula1/css/estilos.css @@ -0,0 +1,74 @@ +:root { + --f1-red: #a00000; + --dark-bg: #15151e; + --card-bg: #1f1f27; + --text: #ffffff; + --border-color: #38383f; + --titulo-color: #ff4c4c; + } + + body { + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + background-color: var(--dark-bg); + color: var(--text); + margin: 0; + padding: 20px; + } + + header { + padding-bottom: 10px; + margin-bottom: 30px; + text-align: center; + color: var(--titulo-color); + } + + .dashboard { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 20px; + } + + .stat-card { + background-color: var(--card-bg); + padding: 20px; + border-radius: 10px; + border-left: 4px solid var(--f1-red); + } + + table { + width: 100%; + border-collapse: collapse; + margin-top: 10px; + } + + th, td { + text-align: left; + padding: 8px; + border-bottom: 1px solid var(--border-color); + } + + th { + color: var(--titulo-color); + font-size: 0.8rem; + text-transform: uppercase; + } + + .pos { + font-weight: bold; + color: var(--f1-red); + } + + .cuenta-atras { + margin-bottom: 15px; + text-align: center; + border-bottom: 4px solid var(--f1-red); + } + + #countdown { + font-size: 2rem; + font-weight: bold; + letter-spacing: 2px; + } + + + \ No newline at end of file diff --git a/formula1/index.html b/formula1/index.html new file mode 100644 index 0000000..de52460 --- /dev/null +++ b/formula1/index.html @@ -0,0 +1,48 @@ + + + + + + Estadísticas F1 + + + + +
+

Estadísticas F1

+

PÁGINA EN CONSTRUCCIÓN

+
+ +
+

Cuenta atrás para el GP de Australia 2026

+
+ 00d 00h 00m 00s +
+
+ +
+
+

Pilotos

+ + + + + + + + + + + + + + + +
#CódigoNombreApellidoEscuderiaNacionalidad
+
+ +
+ + + + \ No newline at end of file diff --git a/formula1/js/codigo.js b/formula1/js/codigo.js new file mode 100644 index 0000000..8390e0e --- /dev/null +++ b/formula1/js/codigo.js @@ -0,0 +1,126 @@ +// =============================== +// FUNCIONES DE CONSULTA API +// =============================== + +// Obtener calendario completo de la temporada actual +async function obtenerCalendario() { + try { + const response = await fetch("https://api.jolpi.ca/ergast/f1/current.json"); + const data = await response.json(); + const carreras = data.MRData.RaceTable.Races; + return carreras; + } catch (error) { + console.error("Error al obtener calendario:", error); + return []; + } +} + +// Encontrar la siguiente carrera +function encontrarSiguienteCarrera(carreras) { + const ahora = new Date(); + for (let carrera of carreras) { + const fecha = new Date(`${carrera.date}T${carrera.time || '00:00:00Z'}`); + if (fecha > ahora) { + return { ...carrera, fecha }; + } + } + return null; +} + +// =============================== +// CUENTA ATRÁS DINÁMICA +// =============================== +function iniciarCuentaAtras(fechaCarrera) { + const countdown = document.getElementById("countdown"); + + function actualizar() { + const ahora = new Date(); + const diff = fechaCarrera - ahora; + + if (diff <= 0) { + countdown.textContent = "🏁 ¡La carrera empezó!"; + return; + } + + const dias = Math.floor(diff / (1000 * 60 * 60 * 24)); + const horas = Math.floor((diff / (1000 * 60 * 60)) % 24); + const minutos = Math.floor((diff / (1000 * 60)) % 60); + const segundos = Math.floor((diff / 1000) % 60); + + countdown.textContent = `${dias}d ${horas}h ${minutos}m ${segundos}s`; + } + + actualizar(); + setInterval(actualizar, 1000); +} + +// =============================== +// PILOTOS +// =============================== +async function cargarPilotos() { + try { + const response = await fetch('/f1/api/pilotos'); + const pilotos = await response.json(); + const tbody = document.querySelector('#pilotos-table tbody'); + + tbody.innerHTML = ''; // Limpiamos antes de rellenar + + pilotos.forEach(p => { + const fila = document.createElement('tr'); + fila.innerHTML = ` + ${p.numero} + ${p.codigo} + ${p.nombre} + ${p.apellido} + ${p.escuderia || '-'} + ${p.nacionalidad} + `; + tbody.appendChild(fila); + }); + } catch (error) { + console.error('Error cargando pilotos:', error); + const tbody = document.querySelector('#pilotos-table tbody'); + tbody.innerHTML = `No se pudieron cargar los pilotos`; + } +} + +// =============================== +// INIT PRINCIPAL +// =============================== +async function init() { + // 1) Obtener calendario + const carreras = await obtenerCalendario(); + + // 2) Calcular siguiente evento + const proxima = encontrarSiguienteCarrera(carreras); + + if (!proxima) { + document.getElementById("countdown").textContent = + "No hay próximos Grandes Premios este año"; + return; + } + + // 3) Mostrar nombre de la próxima carrera + document.querySelector(".cuenta-atras h3").textContent = + `Cuenta atrás para el GP de ${proxima.raceName}`; + + // 4) Iniciar cuenta atrás + iniciarCuentaAtras(proxima.fecha); + + // 5) Indicar modo carrera o pronóstico + const ahora = new Date(); + if (ahora >= proxima.fecha) { + document.getElementById("session-info").textContent = + "Modo carrera — datos en vivo o resultados"; + } else { + document.getElementById("session-info").textContent = + `Próxima sesión de ${proxima.raceName}`; + } + +// Cargar pilotos al inicio y cada minuto +cargarPilotos(); +setInterval(() => { cargarPilotos(); }, 60000); +} + +// Arrancar todo al cargar la página +document.addEventListener("DOMContentLoaded", init); \ No newline at end of file diff --git a/proyectos.html b/proyectos.html index 8e5276e..1c1f4f6 100644 --- a/proyectos.html +++ b/proyectos.html @@ -79,7 +79,6 @@
-
El Tiempo

Guardo los datos del tiempo de 3 ciudades españolas que me interesan (Madrid, L'Ampolla (Tarragona), L'Alfas del Pi (Alicante)) con fines estadísticos.

@@ -89,6 +88,19 @@
+
+
+ +
+
Formula 1
+

Web de estadísticas de Fórmula 1.

+

Java, Spring, Hibernate, JPA, MySQL, HTML, CSS, JavaScript.

+ Saber más → +
+
+
+ +