Skip to content

Commit 84eea7b

Browse files
committed
Delete BinarySearch and instead use a new linear search algorithm inside random chunks
1 parent 68373ee commit 84eea7b

File tree

4 files changed

+76
-146
lines changed

4 files changed

+76
-146
lines changed

index.html

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -243,8 +243,7 @@ <h1 class="d-flex flex-column align-items-center font-monospace text-uppercase t
243243
<script src="js/pages/RecipesPage.js"></script>
244244
<!-- components -->
245245
<script src="/js/components/MainSearchBar.js"></script>
246-
<script src="/js/components/BinarySearch.js"></script>
247-
<script src="/js/components/V2.js"></script>
246+
<script src="/js/components/MainSearchBarMatches.js"></script>
248247
<script src="/js/components/DropdownSearchFilter.js"></script>
249248
<script src="/js/components/DataDropdownList.js"></script>
250249
<!-- utils -->

js/RecipesApp.js

Lines changed: 5 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ class RecipesApp {
7272
isUserInputValueMatchesOnMainSearchBar() {
7373

7474
this.$userInput.addEventListener('input', (e) => {
75-
const userInputValue = e.target.value;
75+
const userInputValue = e.target.value.toLowerCase();
7676

7777
this.displayMatchingRecipeBySearchBar(e);
7878

@@ -95,26 +95,14 @@ class RecipesApp {
9595
*/
9696
displayMatchingRecipeBySearchBar(e) {
9797

98-
const binarySearch = new BinarySearch();
98+
const mainSearchBarMatches = new MainSearchBarMatches();
9999
const userInputValue = e.target.value;
100100

101-
// const isInputValid = binarySearch.inputValidation(userInputValue);
102-
103-
const v2 = new V2();
104-
const isInputValid = v2.inputValidation(userInputValue);
105-
106-
// if (isInputValidByV2) {
107-
108-
// const userInputMatchingDataV2 = v2.isUserValueMatchesByV2(userInputValue, this.recipesData, 10);
109-
// console.log(userInputMatchingDataV2)
110-
// }
101+
const isInputValid = mainSearchBarMatches.inputValidation(userInputValue);
111102

112103
if (isInputValid) {
113104

114-
// const userInputMatchingData = binarySearch.isUserValueMatches(userInputValue, this.recipesData, 0, this.recipesData.length - 1);
115-
116-
const userInputMatchingData = v2.isUserValueMatchesByV2(userInputValue, this.recipesData, 10);
117-
console.log(userInputMatchingData)
105+
const userInputMatchingData = mainSearchBarMatches.isDataSearchMatches(userInputValue, this.recipesData, 10);
118106

119107
this.$recipeCards.innerHTML = '';
120108

@@ -217,7 +205,7 @@ class RecipesApp {
217205
dataDropdownList.displayMatchingItemsOnSelectBoxes(
218206
this.matchingIngredients,
219207
this.matchingAppliances,
220-
this.matchingUstensils);
208+
this.matchingUstensils);
221209
}
222210

223211
isUserInputValueMatchesOnSearchFilter() {

js/components/BinarySearch.js

Lines changed: 0 additions & 86 deletions
This file was deleted.
Lines changed: 70 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,69 +1,48 @@
11
/**
22
* ------------------------------------------------------------
3-
* Les Petits Plats components/V2.js
3+
* Les Petits Plats components/MainSearchBarMatches.js
44
* ------------------------------------------------------------
55
*/
66

7-
class V2 extends MainSearchBar {
7+
class MainSearchBarMatches extends MainSearchBar {
88
constructor() {
99
super();
1010
}
1111

1212
/**
13-
* Slices main array into chunks
14-
* Returns matching data of all trunks
13+
* Returns matching data in a specific order
14+
* By slicing main array into chunks
1515
* @param {Event & {eventTargetValue: HTMLInputElement}} eventTargetValue
1616
* @param {Array} mainArray - Data array from API
17-
* @param {number} size - size of mainArray trunks
17+
* @param {number} size - size of mainArray chunks
1818
* @returns matchingDataArray
1919
*/
20-
isUserValueMatchesByV2(eventTargetValue, mainArray, size) {
20+
isDataSearchMatches(eventTargetValue, mainArray, size) {
2121

2222
let chunks = [];
23+
let isMatches = [];
2324

25+
// List of chunks
2426
this.sliceMainArrayIntoChunks(mainArray, size, chunks);
2527

28+
// Array of specific order
2629
const searchOrder = this.updateIndexesOrder(chunks);
2730

28-
// console.log(chunks)
29-
// console.log(searchOrder)
30-
31-
let isMatches = [];
32-
33-
isMatches.push(
34-
this.searchMatchingData(chunks, 0, searchOrder, eventTargetValue),
35-
this.searchMatchingData(chunks, 1, searchOrder, eventTargetValue),
36-
this.searchMatchingData(chunks, 2, searchOrder, eventTargetValue),
37-
this.searchMatchingData(chunks, 3, searchOrder, eventTargetValue),
38-
this.searchMatchingData(chunks, 4, searchOrder, eventTargetValue));
31+
// Searchs matching data inside each current chunk in specific order
32+
for (let i = 0; i < chunks.length; i++) {
33+
isMatches.push(this.searchMatchingData(chunks, i, searchOrder, eventTargetValue));
34+
}
3935

4036
return isMatches.flat();
4137
}
4238

43-
searchMatchingData(array, index, order, eventTargetValue) {
44-
let isMatches;
45-
46-
const indexArray = order[index];
47-
48-
const currentArray = array[indexArray];
49-
50-
isMatches = this.isChunkMatches(eventTargetValue, currentArray);
51-
52-
return isMatches;
53-
}
54-
55-
isChunkMatches(expression, array) {
56-
57-
const result = array.filter(el => {
58-
59-
const regExp = new RegExp(expression, 'gmi');
60-
61-
return el.search.match(regExp);
62-
});
63-
64-
return result;
65-
}
66-
39+
/**
40+
* Returns chunks of mainArray
41+
* @param {Array} mainArray - Data array from API
42+
* @param {number} size - size of mainArray chunks
43+
* @param {Array} chunks Chunks of mainArray
44+
* @returns chunks
45+
*/
6746
sliceMainArrayIntoChunks(mainArray, size, chunks) {
6847

6948
for (let i = 0; i < mainArray.length; i += size) {
@@ -74,6 +53,12 @@ class V2 extends MainSearchBar {
7453
return chunks;
7554
}
7655

56+
/**
57+
* Returns a specific search order
58+
* Based on chunks length
59+
* @param {Array} chunks Chunks of mainArray
60+
* @returns {Array | number} searchOrder
61+
*/
7762
updateIndexesOrder(chunks) {
7863

7964
let searchOrder = [];
@@ -90,6 +75,11 @@ class V2 extends MainSearchBar {
9075
return searchOrder;
9176
}
9277

78+
/**
79+
* Returns a specific search order
80+
* @param {Array} array
81+
* @returns {Array | number} result
82+
*/
9383
moveSearchOrderIndex(array) {
9484
let result = [];
9585
const middle = Math.floor(array.length / 2);
@@ -106,4 +96,43 @@ class V2 extends MainSearchBar {
10696

10797
return result;
10898
}
99+
100+
/**
101+
* Returns matching data inside current chunk
102+
* @param {Array} array Chunks of main array
103+
* @param {number} index Index of order
104+
* @returns {Array | number} order
105+
* @param {Event & {eventTargetValue: HTMLInputElement}} eventTargetValue
106+
* @returns isMatches
107+
*/
108+
searchMatchingData(array, index, order, eventTargetValue) {
109+
110+
let isMatches;
111+
112+
const indexArray = order[index];
113+
114+
const currentChunk = array[indexArray];
115+
116+
isMatches = this.isChunkMatches(eventTargetValue, currentChunk);
117+
118+
return isMatches;
119+
}
120+
121+
/**
122+
* Returns matching data of a main array chunk
123+
* @param {string} expression
124+
* @param {Array} array Current chunk
125+
* @returns result
126+
*/
127+
isChunkMatches(expression, array) {
128+
129+
const result = array.filter(el => {
130+
131+
const regExp = new RegExp(expression, 'gmi');
132+
133+
return el.search.match(regExp);
134+
});
135+
136+
return result;
137+
}
109138
}

0 commit comments

Comments
 (0)