script changes

html/js/script.js

@@ -4,45 +4,43 @@ const inputBox = searchWrapper.querySelector("input");
 const suggBox = searchWrapper.querySelector(".autocom-box");
 let linkTag = searchWrapper.querySelector("a");
 let webLink;
-
-// if user press any key and release
+// if user presses any key and releases
 inputBox.onkeyup = (e)=>{
-    let userData = e.target.value; //user enetered data
+    let userData = e.target.value; // user entered data
     let emptyArray = [];
     if(userData){
         emptyArray = suggestions.filter((data)=>{
-            //filtering array value and user characters to lowercase and return only those words which are start with user enetered chars
+            // filtering array value and user characters to lowercase and return only those words which start with user entered chars
             return data.toLocaleLowerCase().startsWith(userData.toLocaleLowerCase());
         });
+        emptyArray = emptyArray.slice(0, 5); // Limit the suggestions to the top 5
         emptyArray = emptyArray.map((data)=>{
             // passing return data inside li tag
             return data = `<li>${data}</li>`;
         });
-        searchWrapper.classList.add("active"); //show autocomplete box
+        searchWrapper.classList.add("active"); // show autocomplete box
         showSuggestions(emptyArray);
         let allList = suggBox.querySelectorAll("li");
         for (let i = 0; i < allList.length; i++) {
-            //adding onclick attribute in all li tag
+            // adding onclick attribute in all li tag
             allList[i].setAttribute("onclick", "select(this)");
         }
     }else{
-        searchWrapper.classList.remove("active"); //hide autocomplete box
+        searchWrapper.classList.remove("active"); // hide autocomplete box
     }
 }
-
 function select(element){
     let selectData = element.textContent;
     inputBox.value = selectData;
     searchWrapper.classList.remove("active");
 }
-
 function showSuggestions(list){
     let listData;
     if(!list.length){
         userValue = inputBox.value;
         listData = `<li>${userValue}</li>`;
     }else{
-      listData = list.join('');
+        listData = list.join('');
     }
     suggBox.innerHTML = listData;
 }