Selaa lähdekoodia

Add clear sorting button for recipes

Lee Morgan 6 vuotta sitten
vanhempi
sitoutus
8e28948f08
2 muutettua tiedostoa jossa 13 lisäystä ja 8 poistoa
  1. 1 8
      views/dashboardPage/dashboard.ejs
  2. 12 0
      views/dashboardPage/recipeBook.js

+ 1 - 8
views/dashboardPage/dashboard.ejs

@@ -155,20 +155,13 @@
                         <input id="recipeSearch" type="text" placeholder="FILTER" oninput="recipeBookStrandObj.search()">
                     </div>
 
-                    <button id="recipeClearButton" class="clearButton" onclick="ingredientsStrandObj.clearSorting()" style="display: none;">
+                    <button id="recipeClearButton" class="clearButton" onclick="recipeBookStrandObj.clearSorting()" style="display: none;">
                         <svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                             <circle cx="12" cy="12" r="10"></circle>
                             <line x1="15" y1="9" x2="9" y2="15"></line>
                             <line x1="9" y1="9" x2="15" y2="15"></line>
                         </svg>
                     </button>
-
-                    <select id="recipeSelect" onchange="ingredientsStrandObj.sort(this.value)">Sort Bys:
-                        <option value="" selected disabled>Sort By:</option>
-                        <option value="_name">Ingredient</option>
-                        <option value="category">Category</option>
-                        <option value="unit">Unit of Measurement</option>
-                    </select>
                 </div>
 
                 <div id="recipeList"></div>

+ 12 - 0
views/dashboardPage/recipeBook.js

@@ -131,6 +131,7 @@ window.recipeBookStrandObj = {
     search: function(){
         let input = document.getElementById("recipeSearch").value.toLowerCase();
         let recipeList = document.getElementById("recipeList");
+        let clearButton = document.getElementById("recipeClearButton");
 
         let matchingRecipes = [];
         for(let i = 0; i < this.recipeDivList.length; i++){
@@ -145,5 +146,16 @@ window.recipeBookStrandObj = {
         for(let i = 0; i < matchingRecipes.length; i++){
             recipeList.appendChild(matchingRecipes[i]);
         }
+
+        if(input === ""){
+            clearButton.style.display = "none";
+        }else{
+            clearButton.style.display = "inline";
+        }
+    },
+
+    clearSorting: function(){
+        document.getElementById("recipeSearch").value = "";
+        this.search();
     }
 }