sew/meteorologia.html at main · Clubserg/sew · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<!DOCTYPE HTML>

<html lang="es">
<head>

	<meta name="author" content="Sergio Fernandez-Miranda Longo" />
	<meta name="description" content="Meteorologia de la pagina de MotoGP" />
	<meta name="keywords" content="MotoGP, meteorologia, meteorology" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <!-- Datos que describen el documento -->
    <meta charset="UTF-8" />
    <title>MotoGP-Meteorologia</title>
	<link rel="icon" type="image/x-icon" href="multimedia/favicon.ico" />
	<link rel="stylesheet" type="text/css" href="estilo/estilo.css" />
	<link rel="stylesheet" type="text/css" href="estilo/layout.css" />

	<!-- jQuery Core 3.7.1 (Tarea 2) -->
	<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
	<script src="js/ciudad.js"></script>
</head>

<body>
    <!-- Datos con el contenidos que aparece en el navegador -->
	<header>
    	<h1><a href="index.html">MotoGP Desktop</a></h1>
		<nav>
			<a href="index.html" title="Inicio de la pagina de MotoGP">Inicio</a>
			<a href="piloto.html" title="Información del piloto">Piloto</a>
			<a href="circuito.html" title="Información de los circuitos">Circuito</a>
			<a class="highlight" href="meteorologia.html" title="Información del tiempo">Meteorologia</a>
			<a href="clasificaciones.php" title="Información de la clasificacion">Clasificaciones</a>
			<a href="juegos.html" title="Información de los juegos">Juegos</a>
			<a href="ayuda.html" title="Ayuda">Ayuda</a>
		</nav>
	</header>

	<nav>
		<p>Estás en:
		<a href="index.html">Inicio</a> &gt;&gt;
		<span><strong>Meteorologia</strong></span>
		</p>
  	</nav>

	<main>
		<h2>Meteorologia de MotoGP Desktop</h2>

		<!-- Contenedor para información de la ciudad -->
		<section>
			<h3>Información del Circuito</h3>
		</section>

		<!-- Contenedor para datos meteorológicos de la carrera -->
		<section>
			<h3>Meteorología del Día de la Carrera</h3>
		</section>

		<!-- Contenedor para datos meteorológicos de entrenamientos -->
		<section>
			<h3>Meteorología de los Entrenamientos</h3>
		</section>
	</main>

	<script>
		const ciudad = new Ciudad("Austin", "Estados Unidos", "austinense");
		ciudad.establecerSecundarios(974000, 30.2672, -97.7431);

		// Crear la información de la ciudad usando jQuery
		const $article = $("<article></article>");

		const $h4 = $("<h4></h4>").text(ciudad.getNombre());
		$article.append($h4);

		const $pPais = $("<p></p>").html("País: " + ciudad.getPais());
		$article.append($pPais);

		$article.append(ciudad.infoSecundariaHTML());
		$article.append(ciudad.escribirCoordenadas());

		$("main > section:first-of-type").append($article);

		// Obtener datos meteorológicos de la carrera
		// Fecha de ejemplo: GP de las Américas 2024
		ciudad.getMeteorologiaCarrera();

		// Obtener datos meteorológicos de entrenamientos
		// 3 días previos a la carrera
		ciudad.getMeteorologiaEntrenos("2025-03-27", "2025-03-29");
	</script>

	<noscript>
		<p><em>Necesitas activar JavaScript para ver la información de la ciudad.</em></p>
	</noscript>


</body>
</html>