ABOUT & TRAINING pages available

Acedpol · Nov 15, 2021 · f21333d · f21333d
1 parent 45e73d2
commit f21333d
Show file tree

Hide file tree

Showing 7 changed files with 135 additions and 29 deletions.
diff --git a/about.html b/about.html
@@ -45,7 +45,7 @@ <h1 style="text-align: center;">Aves es un juego top down de acción y supervive
                         - Puntuación final basada en niveles completados y pájaros muertos.
                     </p>                    
                 </div>
-                <div class="image"><img src="./assets/images/cuervo.png"></div>
+                <div class="image"><a href="index.html"><img src="./assets/images/cuervo.png"></a></div>
             </div>
         </game_area>
         <!-- header section end -->

diff --git a/assets/css/aves-style.css b/assets/css/aves-style.css
@@ -100,16 +100,30 @@ game_area {
     background-color:rgba(0,0,0,0.92);
 }
 
-game_area img {
+game_area img, game_area a {
     width: 20%;
     height: 65%;
 
     margin-left: 30px;
     margin-right: 30px;
+}
+
+game_area img {
     border: 2px solid darkblue;
     border-radius: 25px;
 }
 
+game_area a {
+    background-color: unset;
+}
+
+game_area a img, .image a, .image2 a, .image3 a, .image4 a {
+    width: 100%;
+    height: 100%;
+    margin-left: 0;
+    margin-right: 0;
+}
+
 game_area object {
     width: 50%;
 }
@@ -396,8 +410,12 @@ p{
 .middle-title { grid-area: 5 / 2 / 7 / 10; }
 .desc { grid-area: 5 / 2 / 7 / 6; }
 .desc2 { grid-area: 5 / 6 / 7 / 10; }
+.desc3 { grid-area: 4 / 2 / 7 / 7; }
+.desc4 { grid-area: 1 / 6 / 4 / 10; }
 .collabs { grid-area: 1 / 5 / 4 / 9; }
 .image { grid-area: 1 / 3 / 5 / 5; }
+.image2 { grid-area: 3 / 7 / 8 / 10; }
+.image3 { grid-area: 1 / 2 / 4 / 6; }
 
 
 .collabs ol li {
@@ -407,15 +425,28 @@ p{
     list-style: none;
 }
 
-.collabs, .image {
+.collabs, .image, .image2, .image3, .image4 {
     display: flex;
     align-items: center;
     justify-content: center;
 }
 
-.image img {
+.image a, .image2 a, .image3 a, .image4 a {
     width: 80%;
-    height: 95%;
+    height: 90%;
+
+    margin-left: 30px;
+    margin-right: 30px;
+}
+
+.image img, .image2 img, .image3 img, .image4 img {
+    width: 80%;
+    height: 90%;
+}
+
+.image a img, .image2 a img, .image3 a img, .image4 a img {
+    width: 100%;
+    height: 100%;
 }
 
 /* DOWNLOAD WINDOW */

diff --git a/assets/images/Tecla_E.png b/assets/images/Tecla_E.png
diff --git a/assets/web_utils/overlay.js b/assets/web_utils/overlay.js
@@ -1,6 +1,7 @@
 // Open / Close overlay navigation:
 function openNav() {
     document.getElementById("myNav").style.width = "100%";
+    close_download();
 }
 
 function closeNav() {
@@ -26,6 +27,18 @@ function toggle_download()
 
     closeNav();
 }
+
+function close_download() 
+{
+    var obj = document.getElementById("download-link");
+    var btn = document.getElementById("package-btn");
+    if(obj.style.display == "flex") {
+        obj.style.display = "none";
+        btn.style.backgroundColor = "unset";
+        btn.style.textDecorationLine = "unset";
+    }
+}
+
 function download_project()
 {
     var obj = document.getElementById("download-link");

diff --git a/contac-us.html b/contac-us.html
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <script language="javascript" type="text/javascript" src="assets/web_utils/head-info.js"></script>
+    </head>
+
+    <body>
+        <!--header section start -->
+        <header_area>
+            <script language="javascript" type="text/javascript" src="assets/web_utils/cabecera.js"></script>
+        </header_area>
+        <!-- header section end -->    
+
+        <!--header section start -->
+        <game_area class="game_area">
+            <div class="container">
+                <div class="collabs">                    
+                    <ol>
+                        <h1 style="text-align: center;">Integrantes del Grupo</h1>  
+                        <br>                      
+                        <li>Pedro Pablo Cubells Talavera - pablocub@ucm.es</li>
+                        <li>Manuel Prada Mínguez - manuelpr@ucm.es</li>
+                        <li>Alejandro González Sánchez - Algonz39@ucm.es</li>
+                        <li>Jianuo Wen - Jwen@ucm.es</li>
+                        <br><hr>
+                    </ol>
+                </div>
+                <div class="middle-title">
+                    <h1 style="text-align: center;">Aves es un juego top down de acción y supervivencia</h1>
+                </div>
+                <div class="desc">
+                    <br><br>
+                    <p style="text-align: left;">
+                        Combina combate y sigilo, involucrando mecánicas de aggro y distancia a los enemigos.
+                        <br><br>
+                        El protagonista es un líder nato del pueblo, con una personalidad humanista ayudará a las gentes del pueblo a pasar la tormenta.
+                    </p>
+                </div>
+                <div class="desc2">
+                    <br><br>
+                    <p style="text-align: right;">
+                        La curva de dificultad avanza con cada nivel, las hordas de pájaros van aumentando y cada vez son más letales/agresivas.
+                    <br><br>                    
+                        - Rescatar a la gente del pueblo. Objetivo principal. <br>
+                        - Puntuación final basada en niveles completados y pájaros muertos.
+                    </p>                    
+                </div>
+                <div class="image"><a href="index.html"><img src="./assets/images/cuervo.png"></a></div>
+            </div>
+        </game_area>
+        <!-- header section end -->
+
+        <!-- footer section start -->
+        <footer_area>
+            <script language="javascript" type="text/javascript" src="assets/web_utils/footer.js"></script>
+        </footer_area>
+        <!-- footer section end -->
+
+        <script language="javascript" type="text/javascript" src="assets/web_utils/overlay.js"></script>
+    </body>
+</html>
diff --git a/index.html b/index.html
@@ -13,12 +13,12 @@
 
         <!--header section start -->
         <game_area class="game_area">
-            <img src="./assets/images/killer-time.png">
+            <a href="training.html"><img src="./assets/images/killer-time.png"></a>
             <object class="game_container" data="./videojuego/index.html">
                 <embed src="./videojuego/index.html">
                 </embed> ERROR, No pudo mostrarse la pagina. 
             </object>
-            <img src="./assets/images/cuervo.png">
+            <a href="about.html"><img src="./assets/images/cuervo.png"></a>
         </game_area>
         <!-- header section end -->
 

diff --git a/training.html b/training.html
@@ -14,35 +14,32 @@
         <!--header section start -->
         <game_area class="game_area">
             <div class="container">
-                <div class="collabs">                    
-                    <ol>
-                        <h1 style="text-align: center;">Integrantes del Grupo</h1>  
-                        <br>                      
-                        <li>Pedro Pablo Cubells Talavera - pablocub@ucm.es</li>
-                        <li>Manuel Prada Mínguez - manuelpr@ucm.es</li>
-                        <li>Alejandro González Sánchez - Algonz39@ucm.es</li>
-                        <li>Jianuo Wen - Jwen@ucm.es</li>
-                        <br><hr>
-                    </ol>
-                </div>
-                <div class="middle-title">
-                    <h1 style="text-align: center;">Aves es un juego top down de acción y supervivencia</h1>
+                <div class="desc3">
+                    <br><br>
+                    <h1>Mecánicas Principales:</h1>
+                    <p>
+                        - Cada nivel consta de un tiempo límite... Pasado ese tiempo, quedas eliminado! <br>
+                        - ¡El deber te llama! Salva a todos esos ciudadanos desesperados. <br>
+                        - Podrás interactuar con los ciudadanos y con el entorno, pulsando la 'E'. <br>
+                        - Los pájaros no están muy contentos, algo les preocupa y todos sois sus enemigos. <br>
+                        - Podrás defenderte usando el ratón con 'click izquierdo'. <br>
+                        - Hacia dónde se encuentre el ratón, serán dirigidos tus ataques. <br>
+                    </p>
                 </div>
-                <div class="desc">
+                <div class="desc4">
                     <br>
-                    <p>Combina combate y sigilo, involucrando mecánicas de aggro y distancia a los enemigos.</p>           
-                    <p>El protagonista es un líder nato del pueblo, con una personalidad humanista ayudará a las gentes del pueblo a pasar la tormenta.</p>
-                </div>
-                <div class="desc2">
+                    <h1>Puedes moverte en 8 direcciones usando las teclas 'WASD'</h1>
                     <p>
+                        - Se trata de un plano horizontal con vista cenital. <br>
+                        ¡Aprovecha tu movilidad! <br>
                         <br>
-                        La curva de dificultad avanza con cada nivel, las hordas de pájaros van aumentando y cada vez son más letales/agresivas. <br>
+                        - Interactúa con la tecla 'E'. <br>
                         <br>
-                        - Rescatar a la gente del pueblo. Objetivo principal. <br>
-                        - Puntuación final basada en niveles completados y pájaros muertos.
+                        ¡¡CUIDADO!! ¡¡EL TIEMPO ES ORO!!
                     </p>
                 </div>
-                <div class="image"><img src="./assets/images/cuervo.png"></div>
+                <div class="image2"><a href="index.html"><img src="./assets/images/killer-time.png"></a></div>
+                <div class="image3"><img src="./assets/images/wasd.png"></div>
             </div>
         </game_area>
         <!-- header section end -->
@@ -54,5 +51,9 @@ <h1 style="text-align: center;">Aves es un juego top down de acción y supervive
         <!-- footer section end -->
 
         <script language="javascript" type="text/javascript" src="assets/web_utils/overlay.js"></script>
+
+        <style>
+
+        </style>
     </body>
 </html>