Resource externalization

application/Controller.php

@@ -4,9 +4,6 @@
     require_once($path["helper"] . "db.php");
     require_once($path["helper"] . "text.php");
     require_once($path["helper"] . "net.php");
-    foreach (glob($path["page"] . "*.php") as $pagename){
-        require_once($pagename);
-    }
 
 
     /**
@@ -57,22 +54,27 @@
 
             // Select the model to load.
             if (sizeof($route) == 0){
+                require_once($path["page"] . "Home_Page.php");
                 $page = new Home_Page($db, $lang);
             }
             else{
                 if (strtoupper($route[0]) == "HELP"){
+                    require_once($path["page"] . "Help_Page.php");
                     $page = new Help_Page($db, $lang);
                 }
                 if (strtoupper($route[0]) == "PROFILE"){
+                    require_once($path["page"] . "Profile_Page.php");
                     $page = new Profile_Page($db, $lang);
                 }
                 elseif (strtoupper($route[0]) == "PROJECT"){
                     if (sizeof($route) > 1){
                         // Project page
+                        require_once($path["page"] . "Project_Page.php");
                         $page = new Project_Page($db, $lang, $route[1]);
                     }
                     else{
                         // Project list page
+                        require_once($path["page"] . "Projects_Page.php");
                         $page = new Projects_Page($db, $lang);
                     }
                 }
@@ -81,6 +83,7 @@
             // Load the view, or set an error code.
             if (!isset($page)){
                 http_response_code(404);
+                require_once($path["page"] . "Error_Page.php");
                 $page = new Error_Page($db, $lang);
             }
             require_once($page->view);

application/page/Page.php

@@ -1,5 +1,7 @@
 <?php
 
+    require_once($path["entity"] . "Lang.php");
+
     /**
      * Page superclass.
      *

application/page/Profile_Page.php

@@ -15,6 +15,16 @@
          */
         public $cv = [];
 
+        /**
+         * {@see CV} in the current languages.
+         */
+        public $main_cv;
+
+        /**
+         * List {@see CV}s in other languages.
+         */
+        public $other_cv = [];
+
         /**
          * Constructor.
          *
@@ -35,7 +45,14 @@
               "ORDER BY lang = '" . $this->lang . "' DESC;";
             $q = mysqli_query($this->db, $s);
             while($r = mysqli_fetch_array($q)){
-                array_push($this->cv, new Cv($this->db, $r["id"]));
+                $c = new Cv($this->db, $r["id"]);
+                array_push($this->cv, $c);
+                if ($c->lang == $this->lang){
+                    $this->main_cv = $c;
+                }
+                else{
+                     array_push($this->other_cv, $c);
+                }
             }
             $this->title = text($this, "USER_NAME");
             $this->description = text($this, "SECTION_ME") . " - " . text($this, "USER_NAME");

application/view/home.php

@@ -47,6 +47,10 @@
                         <p id='bio'><?=text($page, "USER_BIO");?></p>
                     </div>
                     <div class='buttons'>
+                        <a class='a_button' title='eMail' href='mailto:i@inigovalentin.com'>
+                            <?=text($page, "INDEX_PROFILE_MAIL");?>
+                            <img class='footer_social_icon' src='<?=$static["layout"]?>social/email.svg' alt='eMail' title='eMail'/>
+                        </a>
                         <a class='a_button' href='<?=$base_url?>/profile/'>
                             <?=text($page, "INDEX_PROFILE_MORE");?>
                         </a>

application/view/profile.php

@@ -63,18 +63,18 @@
                     <?=text($page, "USER_TEXT");?>
                 </p>
                 <div id='cv_download'>
-                    <a class='a_button' target='_blank' href='<?=$static["cv"] . $page->cv[0]->file?>'>
+                    <a class='a_button' target='_blank' href='<?=$static["cv"] . $page->main_cv->file?>'>
                         <?=text($page, "PROFILE_CV");?>
                     </a>
                     <details>
                         <summary class='pointer'><?=text($page, "PROFILE_CV_LANG");?></summary>
                         <ul>
 <?php
-                            for ($i = 1; $i < count($page->cv); $i ++) {
+                            for ($i = 1; $i < count($page->other_cv); $i ++) {
 ?>
                                 <li>
-                                    <a target='_blank' href='<?=$static["cv"] . $page->cv[$i]->file?>'>
-                                        <?=$page->cv[$i]->lang->name?>
+                                    <a target='_blank' href='<?=$static["cv"] . $page->other_cv[$i]->file?>'>
+                                        <?=$page->other_cv[$i]->lang->name?>
                                     </a>
                                 </li>
 <?php

application/view/projects.php

@@ -36,7 +36,7 @@
 ?>
         <main>
             <section>
-                <h3><?=$page->title?></h3>
+                <h3><?=text($page, "PROJECT_TITLE");?></h3>
 <?php
                     foreach ($page->project as $project){
 ?>

application/view/string/HELP_COOKIES_TEXT__EN

@@ -0,0 +1,3 @@
+Being consequent with the previous paragraph, I've got bad news.
+<br/><br/>No cookies on this site.
+<br/><br/>:(

application/view/string/HELP_COOKIES_TEXT__ES

@@ -0,0 +1,3 @@
+Being consequent with the previous paragraph, I've got bad news.
+<br/><br/>No cookies on this site.
+<br/><br/>:(

application/view/string/HELP_COOKIES_TEXT__EU

@@ -0,0 +1,3 @@
+Being consequent with the previous paragraph, I've got bad news.
+<br/><br/>No cookies on this site.
+<br/><br/>:(

application/view/string/HELP_LICENSE_TEXT__EN

@@ -0,0 +1,9 @@
+Bad news first: There are some icons (application stores, social networks, code repositories...) which, of course, are no work of mine, and are propery of their respective owners.
+<br/><br/>
+But as for everything else:
+<br/><br/>
+On most projects and code on this site you&#39;ll find it&#39;s license, usually a GPL one. For every thing else in this site a <a rel="license" target="_blank" href="http://creativecommons.org/licenses/by-sa/4.0/">Creative Commons Attribution-ShareAlike 4.0 International License</a> applies.
+<br/><br/>
+Wich means that you can use, modify, and share this work or its modifications, as long as you give credit to me (for example, by linking to this page) and you keep this license unchanged.
+<br/><br/>
+So, go on! Start copying and downloading as if there were no tomorrow.

application/view/string/HELP_LICENSE_TEXT__ES

@@ -0,0 +1,9 @@
+Bad news first: There are some icons (application stores, social networks, code repositories...) which, of course, are no work of mine, and are propery of their respective owners.
+<br/><br/>
+But as for everything else:
+<br/><br/>
+On most projects and code on this site you&#39;ll find it&#39;s license, usually a GPL one. For every thing else in this site a <a rel="license" target="_blank" href="http://creativecommons.org/licenses/by-sa/4.0/">Creative Commons Attribution-ShareAlike 4.0 International License</a> applies.
+<br/><br/>
+Wich means that you can use, modify, and share this work or its modifications, as long as you give credit to me (for example, by linking to this page) and you keep this license unchanged.
+<br/><br/>
+So, go on! Start copying and downloading as if there were no tomorrow.

application/view/string/HELP_LICENSE_TEXT__EU

@@ -0,0 +1,9 @@
+Bad news first: There are some icons (application stores, social networks, code repositories...) which, of course, are no work of mine, and are propery of their respective owners.
+<br/><br/>
+But as for everything else:
+<br/><br/>
+On most projects and code on this site you&#39;ll find it&#39;s license, usually a GPL one. For every thing else in this site a <a rel="license" target="_blank" href="http://creativecommons.org/licenses/by-sa/4.0/">Creative Commons Attribution-ShareAlike 4.0 International License</a> applies.
+<br/><br/>
+Wich means that you can use, modify, and share this work or its modifications, as long as you give credit to me (for example, by linking to this page) and you keep this license unchanged.
+<br/><br/>
+So, go on! Start copying and downloading as if there were no tomorrow.

application/view/string/HELP_PRIVACY_TEXT__EN

@@ -0,0 +1,7 @@
+Let's be honest. Nobody likes being tracked. At least I don't. That's why I don't track you.
+<br/><br/>
+I try to collect as few personal information about you as posible. There is no advertising, no registration is needed to download anything, no email subscription to see any content on the page, no third party code to track visits...
+<br/><br/>
+I like to keep a basic track of the visits on the site, it&#39;s good for my ego. To do so, I use hashed IP of the visitors (meaning I can&#39;t know the real IP address)
+<br/><br/>
+And that&#39;s pretty much it.

application/view/string/HELP_PRIVACY_TEXT__ES

@@ -0,0 +1,7 @@
+Let's be honest. Nobody likes being tracked. At least I don't. That's why I don't track you.
+<br/><br/>
+I try to collect as few personal information about you as posible. There is no advertising, no registration is needed to download anything, no email subscription to see any content on the page, no third party code to track visits...
+<br/><br/>
+I like to keep a basic track of the visits on the site, it&#39;s good for my ego. To do so, I use hashed IP of the visitors (meaning I can&#39;t know the real IP address)
+<br/><br/>
+And that&#39;s pretty much it.

application/view/string/HELP_PRIVACY_TEXT__EU

@@ -0,0 +1,7 @@
+Let's be honest. Nobody likes being tracked. At least I don't. That's why I don't track you.
+<br/><br/>
+I try to collect as few personal information about you as posible. There is no advertising, no registration is needed to download anything, no email subscription to see any content on the page, no third party code to track visits...
+<br/><br/>
+I like to keep a basic track of the visits on the site, it&#39;s good for my ego. To do so, I use hashed IP of the visitors (meaning I can&#39;t know the real IP address)
+<br/><br/>
+And that&#39;s pretty much it.

application/view/string/PROJECT_GM_TEXT__EN

@@ -0,0 +1,12 @@
+Gasteizko Margolariak is a Cultural Association and a Cuadrilla de Blusas y Neskas in Vitoria-Gasteiz.
+<br/><br/>
+The app suite includes:
+<p style="margin:0.7em 1.5em; text-indent: 1em;">
+    <span style="font-weight: bold;">Public website</span> with information for it&lsquo;s members. During the Festivals it allows them to check the planning, the activities around the city and the rela time location of the Cuadrilla. During the rest of the year it is uses to publish news and inteesting info to it &lsquo;s members.
+</p>
+<p style="margin:0.7em 1.5em; text-indent: 1em;">
+    <span style="font-weight: bold;">Private site</span> for internal management. It allows the association directors to handle calendars, schedules, member lists...
+</p>
+<p style="margin:0.7em 1.5em; text-indent: 1em;">
+    <span style="font-weight: bold;">Android and iOS</span> for the members. They sync the website contents in real time and use the geolocalization features to recomend events during the festivals, broadcast the realtime location of Gasteizko Margolariak and to receive notifications.
+</p>

application/view/string/PROJECT_GM_TEXT__ES

@@ -0,0 +1,12 @@
+Gasteizko Margolariak es una Asociación Cultural y una Cuadrilla de Blusas y Neskas en Vitoria-Gasteiz.
+<br/><br/>
+Este aplicativo incluye:
+<p style="margin:0.7em 1.5em; text-indent: 1em;">
+    <span style="font-weight: bold;">Sitio web p&uacute;blico</span> con informaci&ooacute;n para socios. Durante las fiestas permite consultar el programa, las actividades en la ciudad y conocer la localizaci&oacute; en tiempo real de la cuadrilla. Durante el resto del a&ntilde;o presenta informaci&oacute;n y noticias para socios. Adem&aacute;s incluye una API para las aplicaciones.
+</p>
+<p style="margin:0.7em 1.5em; text-indent: 1em;">
+    <span style="font-weight: bold;">Sitio web privado</span> para gesti&oacute;n interna. Permite a la direcci&oacute;n de la Asociaci&oacute;n configurar los calendarios, el programa de fiestas, el registro de socios...
+</p>
+<p style="margin:0.7em 1.5em; text-indent: 1em;">
+    <span style="font-weight: bold;">Aplicaci&oacute;nes para Android e iOS</span> para los socios. Permiten la sincronizaci&oacute;n en tiempo real con el contenido del sitio web, adem&aacute;s de hacer uso de la funci&oacute; de geolocalizaci&oacute;n para recomendar eeventos durante las fiestas, anunciar la ubicaci&oacute;n de la cuadrilla y recibir notificaciones.
+</p>

application/view/string/PROJECT_GM_TEXT__EU

@@ -0,0 +1,12 @@
+Gasteizko Margolariak es una Asociación Cultural y una Cuadrilla de Blusas y Neskas en Vitoria-Gasteiz.
+<br/><br/>
+Este aplicativo incluye:
+<p style="margin:1.5em;">
+    <span style="font-weight: bold;">Sitio web p&uacute;blico</span> con informaci&ooacute;n para socios. Durante las fiestas permite consultar el programa, las actividades en la ciudad y conocer la localizaci&oacute; en tiempo real de la cuadrilla. Durante el resto del a&ntilde;o presenta informaci&oacute;n y noticias para socios. Adem&aacute;s incluye una API para las aplicaciones.
+</p>
+<p style="margin:1.5em;">
+    <span style="font-weight: bold;">Sitio web privado</span> para gesti&oacute;n interna. Permite a la direcci&oacute;n de la Asociaci&oacute;n configurar los calendarios, el programa de fiestas, el registro de socios...
+</p>
+<p style="margin:1.5em;">
+    <span style="font-weight: bold;">Aplicaci&oacute;nes para Android e iOS</span> para los socios. Permiten la sincronizaci&oacute;n en tiempo real con el contenido del sitio web, adem&aacute;s de hacer uso de la funci&oacute; de geolocalizaci&oacute;n para recomendar eeventos durante las fiestas, anunciar la ubicaci&oacute;n de la cuadrilla y recibir notificaciones.
+</p>

application/view/string/USER_TEXT__EN

@@ -0,0 +1 @@
+Programador versátil, con 3 años de experiencia profesional, acostumbrado a trabajar tanto en equipos y proyectos grandes como en tareas individuales. Buena gestión del tiempo y gran capacidad de adaptación a nuevos entornos y tecnologías.

application/view/string/USER_TEXT__ES

@@ -0,0 +1 @@
+Programador versátil, con 3 años de experiencia profesional, acostumbrado a trabajar tanto en equipos y proyectos grandes como en tareas individuales. Buena gestión del tiempo y gran capacidad de adaptación a nuevos entornos y tecnologías.

application/view/string/USER_TEXT__EU

@@ -0,0 +1 @@
+Programador versátil, con 3 años de experiencia profesional, acostumbrado a trabajar tanto en equipos y proyectos grandes como en tareas individuales. Buena gestión del tiempo y gran capacidad de adaptación a nuevos entornos y tecnologías.

public/css/home.css

@@ -16,8 +16,8 @@ section#profile article img#profile_image{
     vertical-align: top;
     width: 25%;
     height: 25%;
-    border: 0.2em solid #446644;
-    border-radius: 1em 5em;
+    border-radius: 50%;
+    box-shadow: 0 0 0 0.1em #000000, 0 0 0 0.3em #66bf38, 0 0 0 0.4em #000000;
 }
 section#profile article div#profile_content{
     width: 60%;
@@ -25,6 +25,19 @@ section#profile article div#profile_content{
     display: inline-block;
     vertical-align: top;
 }
+
+section#profile article div.buttons{
+    text-align: right;
+    padding: 0.5em 2em 0 2em;
+}
+
+section#profile article div.buttons a.a_button img{
+    filter: invert(1) brightness(1.4);
+    vertical-align: middle;
+    margin-left: 0.5em;
+    width: 1.2em;
+}
+
 section#projects{
     display: inline-block;
     vertical-align: top;
@@ -48,17 +61,17 @@ section#projects article.project img.project_image{
     border-radius: 1em;
 }
 @media screen and (max-width : 800px){
-	section#projects article.project img.project_image{
-	    padding: 0.9em;
-	    width: 10em;
-	    height: 10em;
-	}
+    section#projects article.project img.project_image{
+        padding: 0.9em;
+        width: 10em;
+        height: 10em;
+    }
 }
 section#projects article.project td.project_details{
     vertical-align: top;
     padding-left: 1em;
 }
-section div.buttons{
+section#projects div.buttons{
     text-align: right;
     padding: 0.5em 2em 0 2em;
 }

public/css/profile.css

@@ -10,14 +10,14 @@ section#info{
     margin: auto 2em auto auto;
 }
 @media screen and (max-width : 800px){
-	section#info{
-	    width: 90%;
-	    margin: auto;
-	    text-align: center;
-	}
-	section#info h3{
-	    text-align: left;
-	}
+    section#info{
+        width: 90%;
+        margin: auto;
+        text-align: center;
+    }
+    section#info h3{
+        text-align: left;
+    }
 }
 
 section#info img#profile_image{
@@ -26,28 +26,28 @@ section#info img#profile_image{
     max-width: 10em;
     max-height: 10em;
     border-radius: 1.2em;
-    border: 0.3em solid #000000;
+    box-shadow: 0 0 0 0.1em #000000, 0 0 0 0.3em #66bf38, 0 0 0 0.4em #000000;
 }
 @media screen and (max-width : 800px){
-	section#info img#profile_image{
-	    display: inline-block;
-	    vertical-align: middle;
-	    width: 30%;
-	    max-width: 12em;
-	    max-height: 12em;
-	}
+    section#info img#profile_image{
+        display: inline-block;
+        vertical-align: middle;
+        width: 30%;
+        max-width: 12em;
+        max-height: 12em;
+    }
 }
 section#info div#social{
     text-align: center;
     margin: auto;
 }
 @media screen and (max-width : 800px){
-	section#info div#social{
-	    display: inline-block;
-	    vertical-align: middle;
-	    width: 40%;
-	    margin: auto;
-	}
+    section#info div#social{
+        display: inline-block;
+        vertical-align: middle;
+        width: 40%;
+        margin: auto;
+    }
 }
 section#info div#social img{
     width: 60px;
@@ -73,12 +73,13 @@ section#about{
     display: inline-block;
     vertical-align: top;
     width: 50%;
+    margin: auto;
 }
 @media screen and (max-width : 800px){
-	section#about{
-	    width: 90%;
-	    margin: 2em auto auto auto;
-	}
+    section#about{
+        width: 90%;
+        margin: 2em auto auto auto;
+    }
 }
 section#about p{
     font-style: italic;

public/css/project.css

@@ -1,5 +1,7 @@
 section{
 	text-align: center;
+	width: 90%;
+	margin: auto;
 }
 section h3{
 	text-align: left;

public/css/ui.css

@@ -329,7 +329,7 @@ section article h4{
     font-variant: small-caps;
     text-decoration: underline;
     text-decoration-color: #33553377;
-    font-size: 130%;
+    font-size: 140%;
     margin: 0.2em auto 1em auto;
 }
 
@@ -441,17 +441,16 @@ input[type=button]{
 	}
 }
 input[type=button]::first-letter{
-    color: #eeeeee;
+    color: #ffffff;
 }
 input[type=button]:hover{
     color: #ffffff;
     background-color: #34b94d;
     box-shadow: inset 0 0 0.1em #000;
-    border: 0.2em solid #285710;
+    border: 0.143em solid #285710;
 }
 input[type=button]:hover::first-letter{
-    color: #ffffff;
-}
+    color: #ccffcc;
 }
 
 /* Style for textboxes */
@@ -547,22 +546,22 @@ a.a_button{
     transition: all .3s ease-in-out;
 }
 @media screen and (max-width : 800px){
-	a.a_button{
-		font-size: 120%;	
-		padding: 0.9em 1.4em;
-	}
+    a.a_button{
+        font-size: 120%;
+        padding: 0.9em 1.4em;
+    }
 }
 a.a_button::first-letter{
-    color: #eeeeee;
+    color: #ffffff;
 }
 a.a_button:hover{
     color: #ffffff;
     background-color: #34b94d;
     box-shadow: inset 0 0 0.1em #000;
-    border: 0.2em solid #285710;
+    border: 0.143em solid #285710;
 }
 a.a_button:hover::first-letter{
-    color: #ffffff;
+    color: #ccffcc;
 }
 
 /**********************************