From 824712c616219d72459c326f652686b38a16fe28 Mon Sep 17 00:00:00 2001
From: Fernando Galdames <galdamesvilchesf@gmail.com>
Date: Thu, 3 Oct 2024 11:28:39 +0000
Subject: [PATCH 1/2] Cambios en el perfil condicional

---
 src/index.html |  4 ++--
 src/js/app.js  | 49 +++++++++++++++++++++++++++++++++++++++----------
 2 files changed, 41 insertions(+), 12 deletions(-)

diff --git a/src/index.html b/src/index.html
index 5d4bfd86c..7e7ac5ba1 100644
--- a/src/index.html
+++ b/src/index.html
@@ -67,7 +67,7 @@
           <option value="">null</option>
           <option value="Miami">Miami</option>
           <option value="Munich">Munich</option>
-          <option value="Caracas">Caracas</option>
+          <option value="Santiago">Santiago</option>
           <option value="Toronto">Toronto</option>
         </select>
       </li>
@@ -78,7 +78,7 @@
           <option value="USA">USA</option>
           <option value="Germany">Germany</option>
           <option value="Canada">Canada</option>
-          <option value="Venezuela">Venezuela</option>
+          <option value="Chile">Chile</option>
         </select>
       </li>
     </ul>
diff --git a/src/js/app.js b/src/js/app.js
index 9ebc56351..a1bfecb3e 100644
--- a/src/js/app.js
+++ b/src/js/app.js
@@ -28,19 +28,47 @@ function render(variables = {}) {
   // if includeCover==false then we reset the cover code without the <img> tag to make the cover transparent.
   let cover = `<div class="cover"><img src="${variables.background}" /></div>`;
   if (variables.includeCover == false) cover = "<div class='cover'></div>";
+  let socialPosition =
+    variables.socialMediaPosition === "left" ||
+    variables.socialMediaPosition === "right"
+      ? variables.socialMediaPosition
+      : "right";
 
+  let socialMediaLinks = `
+    ${
+      variables.twitter
+        ? `<li><a href="https://twitter.com/${variables.twitter}"><i class="fab fa-twitter"></i></a></li>`
+        : ""
+    }
+    ${
+      variables.github
+        ? `<li><a href="https://github.com/${variables.github}"><i class="fab fa-github"></i></a></li>`
+        : ""
+    }
+    ${
+      variables.linkedin
+        ? `<li><a href="https://linkedin.com/in/${variables.linkedin}"><i class="fab fa-linkedin"></i></a></li>`
+        : ""
+    }
+    ${
+      variables.instagram
+        ? `<li><a href="https://instagram.com/${variables.instagram}"><i class="fab fa-instagram"></i></a></li>`
+        : ""
+    }
+  `;
   // reset the website body with the new html output
   document.querySelector("#widget_content").innerHTML = `<div class="widget">
             ${cover}
           <img src="${variables.avatarURL}" class="photo" />
-          <h1>Lucy Boilett</h1>
-          <h2>Web Developer</h2>
-          <h3>Miami, USA</h3>
-          <ul class="position-right">
-            <li><a href="https://twitter.com/4geeksacademy"><i class="fab fa-twitter"></i></a></li>
-            <li><a href="https://github.com/4geeksacademy"><i class="fab fa-github"></i></a></li>
-            <li><a href="https://linkedin.com/school/4geeksacademy"><i class="fab fa-linkedin"></i></a></li>
-            <li><a href="https://instagram.com/4geeksacademy"><i class="fab fa-instagram"></i></a></li>
+          <h1>${variables.name || "Nombre no disponible"}</h1>
+          <h2>${variables.role || "Rol no disponible"}</h2>
+          <h3>${
+            variables.city && variables.country
+              ? `${variables.city}, ${variables.country}`
+              : "Ubicacion no disponible"
+          }</h3>
+          <ul class="position-${variables.socialMediaPosition}">
+            ${socialMediaLinks || "No hay redes sociales disponibles"}
           </ul>
         </div>
     `;
@@ -56,9 +84,10 @@ window.onload = function() {
     // this is the image's url that will be used as a background for the profile cover
     background: "https://images.unsplash.com/photo-1511974035430-5de47d3b95da",
     // this is the url for the profile avatar
-    avatarURL: "https://randomuser.me/api/portraits/women/42.jpg",
+    avatarURL:
+      "https://z-p3-scontent.fscl27-1.fna.fbcdn.net/v/t39.30808-6/459954186_10229958902175416_3444878738620715119_n.jpg?_nc_cat=110&ccb=1-7&_nc_sid=6ee11a&_nc_eui2=AeGfWjHo3YLYWW6NLtPVDlUKLXstk17hq6ctey2TXuGrp-3weZJ_lSVAyWU3MoQgYx4&_nc_ohc=8yEqBTRFs_UQ7kNvgF9LSOg&_nc_zt=23&_nc_ht=z-p3-scontent.fscl27-1.fna&_nc_gid=A_rL7_oJtdwogLr2Gv27e_G&oh=00_AYCu7OPi2n7k4ASl_Rf_lt6M5AvVSJqKE0URZS8krH1PuQ&oe=6703E944",
     // social media bar position (left or right)
-    socialMediaPosition: "position-left",
+    socialMediaPosition: "right",
     // social media usernames
     twitter: null,
     github: null,

From 3cc38752d976c0552b6044631a55b14e7ada8597 Mon Sep 17 00:00:00 2001
From: Fernando Galdames <galdamesvilchesf@gmail.com>
Date: Thu, 3 Oct 2024 15:31:19 +0000
Subject: [PATCH 2/2] Se hizo una actualizacion en varible.lastName

---
 src/js/app.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/js/app.js b/src/js/app.js
index a1bfecb3e..4304aac3c 100644
--- a/src/js/app.js
+++ b/src/js/app.js
@@ -60,7 +60,11 @@ function render(variables = {}) {
   document.querySelector("#widget_content").innerHTML = `<div class="widget">
             ${cover}
           <img src="${variables.avatarURL}" class="photo" />
-          <h1>${variables.name || "Nombre no disponible"}</h1>
+          <h1>${
+            variables.name && variables.lastName
+              ? `${variables.name} ${variables.lastName}`
+              : "Nombre no disponible"
+          }</h1>
           <h2>${variables.role || "Rol no disponible"}</h2>
           <h3>${
             variables.city && variables.country