Added username, company and country fields

20H-Talent · Oct 15, 2018 · c09e24c · c09e24c
1 parent c546d7d
commit c09e24c
Show file tree

Hide file tree

Showing 2 changed files with 55 additions and 20 deletions.
diff --git a/html/search.html b/html/search.html
@@ -47,13 +47,28 @@
       <!-- Name input-->
       <div class="form-group row w-100">
         <label class="col-4 control-label" for="name">Name</label>
-        <input name="name" class="form-control input-md col-8" id="name" type="text" placeholder="Por favor introduzca su nombre">
+        <input name="name" class="form-control input-md col-8" id="name" type="text" placeholder="Enter the name">
+      </div>
+      <!-- Username input -->
+      <div class="form-group row w-100">
+        <label class="col-4 control-label" for="name">Userame</label>
+        <input name="username" class="form-control input-md col-8" id="username" type="text" placeholder="Enter the username">
       </div>
       <!-- City input-->
       <div class="form-group row w-100">
         <label class="col-4 control-label" for="city">City</label>
         <input name="city" class="form-control input-md col-8" id="city" type="text" placeholder="Enter the city">
       </div>
+      <!-- Country input -->
+      <div class="form-group row w-100">
+        <label class="col-4 control-label" for="country">Country</label>
+        <input name="country" class="form-control input-md col-8" id="country" type="text" placeholder="Enter the country">
+      </div>
+      <!-- Company input -->
+      <div class="form-group row w-100">
+        <label class="col-4 control-label" for="company">Company</label>
+        <input name="company" class="form-control input-md col-8" id="company" type="text" placeholder="Enter the company">
+      </div>
       <!-- Experience select input-->
       <div class="form-group row w-100">
         <label class="col-4" for="exampleFormControlSelect1">Experience</label>

diff --git a/js/advanced_search.js b/js/advanced_search.js
@@ -1,6 +1,9 @@
 const inputName = document.getElementById("name");
+const inputUsername = document.getElementById("username");
 const inputCity = document.getElementById("city");
+const inputCountry = document.getElementById("country");
 const inputExperience = document.getElementById("experience");
+const inputCompany = document.getElementById("company");
 
 //Imprimir los checkboxes de lang que están checked
 function getLangFilterAdvancedSearch() {
@@ -10,20 +13,40 @@ function getLangFilterAdvancedSearch() {
     if (langChecks[i].checked == true) {
         langArr.push(langChecks[i].value);
     }
+  var checkUserLangs = [];
+  langArr.forEach(function(lang){
+    checkUserLangs.push(user.langs.includes(lang));
+    });
+    if(checkUserLangs.includes(false)){
+      console.log(checkUserLangs);
+      return false;
+    }else {
+      return true;
+    }
   }
-  console.log(langArr);
 }
 
 //Imprimir los checkboxes de skill que están checked
-function getSkillFilterAdvancedSearch() {
+function getSkillFilterAdvancedSearch(user) {
     var skillChecks = document.getElementsByClassName("check-skill");
     var skillArr = [];
     for (var i = 0; i < skillChecks.length; i++) {
       if (skillChecks[i].checked == true) {
           skillArr.push(skillChecks[i].value);
       }
+      //Comparar los lang que están en el array con los que el array del user
     }
-    console.log(skillArr);
+    var checkUserSkills = [];
+    skillArr.forEach(function(skill){
+        //Comprobar que el valor está en el array del usuario
+        checkUserSkills.push(user.skills.includes(skill));
+      });
+
+      if (checkUserSkills.includes(false)){
+        return false;
+      }else {
+        return true;
+      }
   }
 
 document.getElementById("searchbtn").addEventListener("click", function(e) {
@@ -33,16 +56,23 @@ document.getElementById("searchbtn").addEventListener("click", function(e) {
   $.ajax({
     url: "https://cv-mobile-api.herokuapp.com/api/users"
   }).done(function(data) {
-    getLangFilterAdvancedSearch();
-    getSkillFilterAdvancedSearch();
+    console.log(data)
     const filteredUser = data.filter(function(user) {
+      // console.log(getSkillFilterAdvancedSearch(user));
       return (
         inputName.value.toLowerCase() ===
           user.name.slice(0, inputName.value.length).toLowerCase() &&
+        inputUsername.value.toLowerCase() ===
+          user.username.slice(0, inputUsername.value.length).toLowerCase() &&
         inputCity.value.toLowerCase() ===
           user.location.city.slice(0, inputCity.value.length).toLowerCase() &&
-        inputExperience.value.toLowerCase() ===
-          user.experience.slice(0, inputExperience.value.length).toLowerCase()
+        inputCountry.value.toLowerCase() ===
+          user.location.country.slice(0, inputCountry.value.length).toLowerCase() &&
+        inputExperience.value.toLowerCase() === user.experience &&
+        inputCompany.value.toLowerCase() ===
+          user.company.slice(0, inputCompany.value.length).toLowerCase() &&
+        getSkillFilterAdvancedSearch(user) &&
+        getLangFilterAdvancedSearch(user)
       );
     });
     console.log(filteredUser);
@@ -82,13 +112,6 @@ $.ajax({
       langArr.push(lang.value);
     }
   });
-  //Necesitamos que nos enseñe cada valor que esté checked en la consola. Para ello necesitamos:
-  //Iterar con un forEach langArr
-  //Array.include
-
-  // langArr.forEach();
-  //     console.log(langArr.includes());
-  //console.log(langArr);
 });
 
 function renderLanguage(language) {
@@ -101,8 +124,5 @@ function renderLanguage(language) {
     "</div>";
   return languageTemplate;
 }
-/*
-<div class="form-check col-12">
-    <input class="form-check-input" type="checkbox" value="" id="defaultCheckGerman">
-    <label class="form-check-label" for="defaultCheckGerman">German</label>
-          </div> */
+
+