-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
131 lines (123 loc) · 5.92 KB
/
index.html
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
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=off" />
<title>Ruta del agua</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.12/esri/themes/light/main.css" />
<link href="https://fonts.googleapis.com/css?family=Abril+Fatface&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<link rel="icon" type="icon/png" href="assets/sea.png">
<script src="https://js.arcgis.com/4.12/"></script>
<!-- <script src="https://unpkg.com/sweetalert@2.1.2/dist/sweetalert.min.js"></script> -->
<link rel="stylesheet" href="css/style.css" type="text/css">
<script src="js/alertas.js"></script>
<script src="js/preguntas.js"></script>
<script src="js/map.js"></script>
</head>
<body>
<header>
<audio id="audio" src="https://www.soundjay.com/button/button-10.wav" autoplay="false"></audio>
<div id="random-div">
<figure>
<h1>Vidas</h1>
</figure>
<div class="vidass">
<img id="vidas_0" class="vidas" src="assets/life.png" alt="">
<img id="vidas_1" class="vidas" src="assets/life.png" alt="">
<img id="vidas_2" class="vidas" src="assets/life.png" alt="">
<img id="vidas_3" class="vidas" src="assets/life.png" alt="">
</div>
<div id="titulo">
<h1 id="">Busca:</h1>
<h1 id="municipio-random"></h1>
</div>
</div>
</header>
<div id="viewDiv"></div>
<<<<<<< HEAD
<div id="nombre-div" class="esri-widget">
<center>
<h1 id="nombre-municipio">Instrucciones</h1>
</center>
</div>
<div id="instrucciones-div" class="esri-widget">
<b>
<p style="font-size: 20px; font-family: 'Roboto', sans-serif;"id="instrucciones">Sigue estos pasos para disfrutar de la Ruta del Agua:
</b>
<br>
<br>
<ul>
<li>Mira el nombre del municipio que sale en la parte superior de la pantalla.</li>
<br>
<li>Haz clic en el municipio correspondiente al nombre que te salió.</li>
<br>
<li>Tienes 4 intentos para acertar. Fíjate en las vidas que tienes en la parte superior izquierda.</li>
<br>
<li>Si aciertas, te saldrá un cuestionario que probará tu conocimiento sobre el municipio, y te llevará a conocer más sobre este.</li>
<br>
<li>¡Sigue así hasta descubrir todos los municipios!</li>
<br>
</ul>
</p>
</div>
<div id="preguntas-div" class="esri-widget">
=======
<div id="nombre-div" class="esri-widget">
<center>
<h1 id="nombre-municipio">Instrucciones</h1>
</center>
</div>
<div id="instrucciones-div" class="esri-widget">
<p id="instrucciones">Sigue estos pasos para disfrutar de la ruta del agua:
<ul>
<li>Debes mirar el nombre del municipio que sale en la parte superior de la pantalla.</li>
<li>Ahora indica, dando click, qué municipio corresponde al nombre que te salió.</li>
<li>Tienes 4 intentos de acertar, fíjate en las vidas que tienes las cuales estan en la parte superior izquierda.</li>
<li>Si aciertas te saldrá un cuestionario que probrará tu conocimiento.</li>
<li>Al terminar el cuestionario ¡No te vayas! ahora sigue hasta completar todos los municipios.</li>
</ul>
</p>
</div>
<div id="preguntas-div" class="esri-widget">
>>>>>>> b85dc818fb3a7d3f2a3b239969587bd4db772a3f
<form id="form" action="">
<div id="pregunta"></div>
<center>
<br>
<button class="button button2" type='button' id="enviar" style="visibility: hidden;">Enviar</button>
<br>
<button class="button button1" type='button' id="reiniciar" style="visibility: hidden;">¡Volver a jugar!</button>
</center>
</form>
</form>
</div>
<div id="myModal" class="modal">
<div class="modal-content">
<span class="close">×</span>
<img id="ficha" src="" alt="ficha">
</div>
</div>
<div id="modalInicio" class="modal-inicio">
<div class="modal-content-inicio">
<<<<<<< HEAD
<center>
<h1>Siguiendo el camino de la Ruta del Agua</h1>
<p id="text">Bienvenido a la 'Ruta del agua'. Un recorrido para disfrutar de las maravillas de la naturaleza y el encanto singular de los páramos, frágiles ecosistemas, fuentes de agua, que en Cundinamarca ocupan alrededor de 386.000 hectáreas. Embalses como San Rafael y Chingaza, lagunas sagradas que fueron centro de adoración muisca, pantanos como el de Martos, fuentes termales e imponentes caídas de agua hacen parte de este viaje a través de ocho municipios.
</p>
<p id="text">
Pero, ¿qué tanto sabes sobre esta ruta?. Descúbrela mientras la recorres en nuestro mapa interactivo
</p>
</center>
<button class="button button3" type='button' id="jugar" ">¡Jugar!</button>
=======
<h1>Siguiendo el camino de la Ruta del Agua</h1>
<p>Bienvenido a la 'Ruta del agua'. Un recorrido para disfrutar de las maravillas de la naturaleza y el encanto singular de los páramos, frágiles ecosistemas, fuentes de agua, que en Cundinamarca ocupan alrededor de 386.000 hectáreas. Embalses como San Rafael y Chingaza, lagunas sagradas que fueron centro de adoración muisca, pantanos como el de Martos, fuentes termales e imponentes caídas de agua hacen parte de este viaje a través de ocho municipios.
<br>Pero, qué tanto sabes sobre esta ruta? Descúbrela mientras la recorres en nuestro mapa interactivo:</p>
<button class="button button3" type='button' id="jugar" ">Jugar!</button>
>>>>>>> b85dc818fb3a7d3f2a3b239969587bd4db772a3f
</div>
</div>
</body>
</html>