Make initial values of topic and sortby be set by API content

jzamora5 · Oct 1, 2020 · 32e8e1b · 32e8e1b
1 parent 8354b05
commit 32e8e1b
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 8 deletions.
diff --git a/courses.html b/courses.html
@@ -148,7 +148,7 @@ <h1 class="my-0">
                   aria-haspopup="true"
                   aria-expanded="false"
                 >
-                  <span id="topic">All</span>
+                  <span id="topic">&nbsp;</span>
                 </a>
 
                 <div
@@ -172,7 +172,7 @@ <h1 class="my-0">
                   aria-haspopup="true"
                   aria-expanded="false"
                 >
-                  <span id="sort-by">Most popular</span>
+                  <span id="sort-by">&nbsp;</span>
                 </a>
 
                 <div

diff --git a/scripts.js b/scripts.js
@@ -171,11 +171,17 @@ $(document).ready(function () {
     }
   }
 
+  function parseTitle(title) {
+    if (title) {
+      title = title.charAt(0).toUpperCase() + title.slice(1).replace("_", " ");
+    }
+    return title;
+  }
+
   function displayDropdown(list, $DOMElement, $titleElement) {
     if (list.length) {
       for (let l of list) {
-        let s = l.charAt(0).toUpperCase() + l.slice(1);
-        s = s.replace("_", " ");
+        let s = parseTitle(l);
         let $item = $(`
           <a class="dropdown-item" href="#">${s}</a>
         `);
@@ -189,15 +195,20 @@ $(document).ready(function () {
   }
 
   function displaySearch(data) {
+    let title;
     let topics = data.topics;
     let sorts = data.sorts;
 
     let $TopicDropdown = $("#topic-dropdown");
     let $TopicTitle = $("#topic");
+    title = parseTitle(data.topic);
+    $TopicTitle.text(title);
     displayDropdown(topics, $TopicDropdown, $TopicTitle);
 
     let $SortDropdown = $("#sort-dropdown");
     let $SortTitle = $("#sort-by");
+    title = parseTitle(data.sort);
+    $SortTitle.text(title);
     displayDropdown(sorts, $SortDropdown, $SortTitle);
 
     let $KeywordsInput = $("#keywords-input");
@@ -229,6 +240,7 @@ $(document).ready(function () {
   }
 
   function displaySearchAndResults(data) {
+    console.log(data);
     displayResults(data);
     displaySearch(data);
     // END OF displayResults

diff --git a/xml-courses.html b/xml-courses.html
@@ -148,7 +148,7 @@ <h1 class="my-0">
                   aria-haspopup="true"
                   aria-expanded="false"
                 >
-                  <span id="topic">All</span>
+                  <span id="topic">&nbsp;</span>
                 </a>
 
                 <div
@@ -172,7 +172,7 @@ <h1 class="my-0">
                   aria-haspopup="true"
                   aria-expanded="false"
                 >
-                  <span id="sort-by">Most popular</span>
+                  <span id="sort-by">&nbsp;</span>
                 </a>
 
                 <div

diff --git a/xml-scripts.js b/xml-scripts.js
@@ -216,11 +216,17 @@ $(document).ready(function () {
     }
   }
 
+  function parseTitle(title) {
+    if (title) {
+      title = title.charAt(0).toUpperCase() + title.slice(1).replace("_", " ");
+    }
+    return title;
+  }
+
   function displayDropdown(list, $DOMElement, $titleElement) {
     if (list.length) {
       for (let l of list) {
-        let s = l.charAt(0).toUpperCase() + l.slice(1);
-        s = s.replace("_", " ");
+        let s = parseTitle(l);
         let $item = $(`
           <a class="dropdown-item" href="#">${s}</a>
         `);
@@ -233,16 +239,31 @@ $(document).ready(function () {
     }
   }
 
+  function cleanXML(data) {
+    $(data).find("topics").remove();
+    $(data).find("sorts").remove();
+    $(data).find("courses").remove();
+
+    return data;
+  }
+
   function displaySearch(data) {
+    let title;
     let topics = XMLtoObjList(data, "topic");
     let sorts = XMLtoObjList(data, "sort");
 
+    data = cleanXML(data);
+
     let $TopicDropdown = $("#topic-dropdown");
     let $TopicTitle = $("#topic");
+    title = parseTitle($(data).find("topic").text());
+    $TopicTitle.text(title);
     displayDropdown(topics, $TopicDropdown, $TopicTitle);
 
     let $SortDropdown = $("#sort-dropdown");
     let $SortTitle = $("#sort-by");
+    title = parseTitle($(data).find("sort").text());
+    $SortTitle.text(title);
     displayDropdown(sorts, $SortDropdown, $SortTitle);
 
     let $KeywordsInput = $("#keywords-input");