diff --git a/source/assets/images/Grouppink.png b/source/assets/images/Grouppink.png deleted file mode 100644 index d4f1d14..0000000 Binary files a/source/assets/images/Grouppink.png and /dev/null differ diff --git a/source/assets/images/create_button.png b/source/assets/images/create_button.png new file mode 100644 index 0000000..3a96529 Binary files /dev/null and b/source/assets/images/create_button.png differ diff --git a/source/assets/images/plate_with_chopsticks.png b/source/assets/images/plate_with_chopsticks.png deleted file mode 100644 index 023e43e..0000000 Binary files a/source/assets/images/plate_with_chopsticks.png and /dev/null differ diff --git a/source/assets/images/plate_with_cutlery.png b/source/assets/images/plate_with_cutlery.png deleted file mode 100644 index 6f7a938..0000000 Binary files a/source/assets/images/plate_with_cutlery.png and /dev/null differ diff --git a/source/assets/images/search_button.png b/source/assets/images/search_button.png new file mode 100644 index 0000000..66a1a85 Binary files /dev/null and b/source/assets/images/search_button.png differ diff --git a/source/assets/scripts/CreatePage.js b/source/assets/scripts/CreatePage.js index b60a016..a4e128d 100644 --- a/source/assets/scripts/CreatePage.js +++ b/source/assets/scripts/CreatePage.js @@ -97,10 +97,10 @@ function initFormHandler() { let tagLabel = document.createElement("label"); tagLabel.innerHTML = tagField.value; tagLabel.setAttribute("class","tag"); - tagSet.add(tagField.value.toLowerCase()); + tagSet.add(tagSetVal); tagLabel.addEventListener("click",()=> { tagContainer.removeChild(tagLabel); - tagSet.delete(tagField.value.toLowerCase()); + tagSet.delete(tagSetVal); }); tagContainer.append(tagLabel); diff --git a/source/assets/scripts/ReviewCard.js b/source/assets/scripts/ReviewCard.js index 3d4c97c..00093d8 100644 --- a/source/assets/scripts/ReviewCard.js +++ b/source/assets/scripts/ReviewCard.js @@ -17,6 +17,7 @@ class ReviewCard extends HTMLElement { margin: 0; padding: 0; overflow-wrap: anywhere; + cursor: pointer; } a { @@ -157,7 +158,7 @@ class ReviewCard extends HTMLElement { //image setup let mealImg = document.createElement("img"); - mealImg.setAttribute("id", "a-mealImg"); + mealImg.setAttribute("id", "a-meal-img"); mealImg.setAttribute("alt","Meal Photo Corrupted"); mealImg.setAttribute("src",data["mealImg"]); mealImg.addEventListener("error", function(e) { @@ -169,7 +170,7 @@ class ReviewCard extends HTMLElement { let meallabelDiv = document.createElement("div"); meallabelDiv.setAttribute("class", "meal-name-div"); let mealLabel = document.createElement("label"); - mealLabel.setAttribute("id", "a-mealName"); + mealLabel.setAttribute("id", "a-meal-name"); mealLabel.setAttribute("class","meal-name"); mealLabel.innerHTML = data["mealName"]; meallabelDiv.append(mealLabel); @@ -251,11 +252,11 @@ class ReviewCard extends HTMLElement { dataContainer["reviewID"] = this.reviewID; //get image - let mealImg = this.shadowEl.getElementById("a-mealImg"); + let mealImg = this.shadowEl.getElementById("a-meal-img"); dataContainer["mealImg"] = mealImg.getAttribute("src"); //get meal name - let mealLabel = this.shadowEl.getElementById("a-mealName"); + let mealLabel = this.shadowEl.getElementById("a-meal-name"); dataContainer["mealName"] = mealLabel.innerHTML; //get comment section diff --git a/source/assets/scripts/ReviewDetails.js b/source/assets/scripts/ReviewDetails.js index 7908fde..c28b722 100644 --- a/source/assets/scripts/ReviewDetails.js +++ b/source/assets/scripts/ReviewDetails.js @@ -99,8 +99,10 @@ function setupUpdate(){ while (tagContainer.firstChild) { tagContainer.removeChild(tagContainer.firstChild); } - let tagSetVal = currReview["tags"][i].toLowerCase(); + + let tagSetVal; for (let i = 0; i < currReview["tags"].length; i++) { + tagSetVal = currReview["tags"][i].toLowerCase() tagSet.add(tagSetVal); let newTag = document.createElement("label"); newTag.setAttribute("class","tag"); diff --git a/source/assets/scripts/appTestHelpers.js b/source/assets/scripts/appTestHelpers.js index 37e7cb4..aa4b1db 100644 --- a/source/assets/scripts/appTestHelpers.js +++ b/source/assets/scripts/appTestHelpers.js @@ -40,13 +40,13 @@ export async function setReviewForm(page, review) { */ export async function checkCorrectness(root, prefix, expected){ // Get the review image and check src - let img = await root.$(`#${prefix}-mealImg`); + let img = await root.$(`#${prefix}-meal-img`); let imgSrc = await img.getProperty("src"); // Check src assert.strictEqual(await imgSrc.jsonValue(), expected.imgSrc); // Get the title, comment, and restaurant - let title = await root.$(`#${prefix}-mealName`); + let title = await root.$(`#${prefix}-meal-name`); let title_text = await title.getProperty("innerText"); let comment = await root.$(`#${prefix}-comments`); let comment_text = await comment.getProperty("innerText"); diff --git a/source/assets/scripts/localStorage.js b/source/assets/scripts/localStorage.js index d0278e3..852d02c 100644 --- a/source/assets/scripts/localStorage.js +++ b/source/assets/scripts/localStorage.js @@ -13,6 +13,14 @@ export function newReviewToStorage(review){ // adding to the tag keys addTagsToStorage(nextReviewId, review["tags"]); + + //adding to the star storage + let starArr = JSON.parse(localStorage.getItem(`star${review["rating"]}`)); + if(!starArr){ + starArr = []; + } + starArr.push(nextReviewId); + localStorage.setItem(`star${review["rating"]}`, JSON.stringify(starArr)); //updating our activeIDS list let tempIdArr = JSON.parse(localStorage.getItem("activeIDS")); @@ -41,6 +49,70 @@ export function getReviewFromStorage(ID){ */ export function updateReviewToStorage(ID, review){ let oldReview = JSON.parse(localStorage.getItem(`review${ID}`)); + let starArr = JSON.parse(localStorage.getItem(`star${review["rating"]}`)); + + //activeID update recency + let activeIDS = JSON.parse(localStorage.getItem("activeIDS")); + for (let i in activeIDS){ + if(activeIDS[i] == ID){ + activeIDS.splice(i,1); + activeIDS.push(ID); + break; + } + } + localStorage.setItem("activeIDS", JSON.stringify(activeIDS)); + + //star local storage update + if(oldReview["rating"] !== review["rating"]){ + //first delete from previous rating array in storage + let oldStarArr = JSON.parse(localStorage.getItem(`star${oldReview["rating"]}`)); + for (let i in oldStarArr) { + if (oldStarArr[i] == ID) { + //removing from corresponding rating array and updating local Storage + oldStarArr.splice(i,1); + break; + } + } + if(oldStarArr.length != 0){ + localStorage.setItem(`star${oldReview["rating"]}`, JSON.stringify(oldStarArr)); + } else { + localStorage.removeItem(`star${oldReview["rating"]}`); + } + //then add ID to array corresponding to new review rating + let newStarArr = starArr; + if(!newStarArr){ + newStarArr = []; + } + newStarArr.push(ID); + localStorage.setItem(`star${review["rating"]}`, JSON.stringify(newStarArr)); + } else if(starArr.length !== 1) { + //stars update recency if unchanged + for (let i in starArr){ + if(starArr[i] == ID) { + starArr.splice(i,1) + starArr.push(ID); + break; + } + } + localStorage.setItem(`star${review["rating"]}`, JSON.stringify(starArr)); + } + + //specifically the unchanged tags update recency + let repeatedTags = review["tags"].filter(x => oldReview["tags"].includes(x)); + let tagArr = []; + for (let i in repeatedTags){ + tagArr = JSON.parse(localStorage.getItem(`!${repeatedTags[i]}`)); + if(tagArr.length == 1){ + for (let j in tagArr){ + if(tagArr[j] == ID){ + tagArr.splice(j,1); + tagArr.push(ID); + break; + } + } + localStorage.setItem(`!${repeatedTags[i]}`, JSON.stringify(tagArr)); + } + } //Get diff of tags and update storage let deletedTags = oldReview["tags"].filter(x => !review["tags"].includes(x)); @@ -57,12 +129,29 @@ export function updateReviewToStorage(ID, review){ * @param {string} ID of the review to delete */ export function deleteReviewFromStorage(ID){ + //removing id number from activeIDS and star{rating} let activeIDS = JSON.parse(localStorage.getItem("activeIDS")); - + let reviewRating = JSON.parse(localStorage.getItem(`review${ID}`))["rating"]; + let starArr = JSON.parse(localStorage.getItem(`star${reviewRating}`)); + + for (let i in starArr) { + if (starArr[i] == ID) { + //removing from corresponding rating array and updating local Storage + starArr.splice(i,1); + break; + } + } + if(starArr.length != 0){ + localStorage.setItem(`star${reviewRating}`, JSON.stringify(starArr)); + } else { + localStorage.removeItem(`star${reviewRating}`); + } + for (let i in activeIDS) { if (activeIDS[i] == ID) { activeIDS.splice(i,1); localStorage.setItem("activeIDS", JSON.stringify(activeIDS)); + let currReview = JSON.parse(localStorage.getItem(`review${ID}`)); deleteTagsFromStorage(ID, currReview["tags"]); localStorage.removeItem(`review${ID}`); @@ -115,24 +204,9 @@ function addTagsToStorage(ID, addedTags) { } /** - * Returns the top n reviews by ID. If there are less than n reviews, returns the most possible. - * @param {number} n number of reviews to return - * @returns {Object} list of n reviews that are the top rated + * Test Helper Function to get all reviews from local storage + * @returns {Object} all active reviews from local storage */ -export function getTopReviewsFromStorage(n) { - -} - -/** - * Returns all reviews which contain the same tag specified. - * @param {string} tag to filter by - * @returns {Object} list of reviews that all contain the specified tag - */ -export function getReviewsByTag(tag) { - -} - -// legacy function export function getAllReviewsFromStorage() { if (!(localStorage.getItem("activeIDS"))) { // we wanna init the active ID array and start the nextID count @@ -147,4 +221,47 @@ export function getAllReviewsFromStorage() { reviews.push(currReview); } return reviews; +} + +/** + * Get all IDs of active reviews (order: most recent) + * @returns {number[]} list of all active IDs by recency + */ +export function getIDsFromStorage() { + if (!(localStorage.getItem("activeIDS"))) { + // we wanna init the active ID array and start the nextID count + localStorage.setItem("activeIDS", JSON.stringify([])); + localStorage.setItem("nextID", JSON.stringify(0)); + } + let activeIDS = JSON.parse(localStorage.getItem("activeIDS")); + return activeIDS.reverse(); +} + +/** + * Returns all review IDs which contain the same tag specified (order: most recent) + * @param {string} tag to filter by + * @returns {number[]} list of IDs of reviews that all contain the specified tag by recency + */ +export function getIDsByTag(tag) { + let tagArr = JSON.parse(localStorage.getItem("!" + tag.toLowerCase())); + if(!tagArr){ + tagArr = []; + } + return tagArr.reverse(); +} + +/** + * Returns the top rated review IDs in order. + * @returns {number[]} list of IDs of reviews in order of top rating (most recent if equal rating) + */ +export function getTopIDsFromStorage() { + let resultArr = []; + for(let i = 5; i > 0; i--){ + let starArr = JSON.parse(localStorage.getItem(`star${i}`)); + if(!starArr){ + continue; + } + resultArr = resultArr.concat(starArr.reverse()); + } + return resultArr; } \ No newline at end of file diff --git a/source/assets/scripts/localStorage.test.js b/source/assets/scripts/localStorage.test.js index 3330ba0..a365c59 100644 --- a/source/assets/scripts/localStorage.test.js +++ b/source/assets/scripts/localStorage.test.js @@ -1,6 +1,6 @@ import {strict as assert} from "node:assert"; import {describe, it, before, after} from "mocha"; -import {newReviewToStorage, getReviewFromStorage, updateReviewToStorage, deleteReviewFromStorage, getAllReviewsFromStorage, getTopReviewsFromStorage, getReviewsByTag} from "./localStorage.js"; +import {newReviewToStorage, getReviewFromStorage, updateReviewToStorage, deleteReviewFromStorage, getAllReviewsFromStorage, getIDsByTag, getTopIDsFromStorage} from "./localStorage.js"; describe("test CRUD localStorage interaction", () => { @@ -58,26 +58,27 @@ describe("test CRUD localStorage interaction", () => { }).timeout(5000); it("test localStorage state during updating 1000 reviews", () => { - let reviews = getAllReviewsFromStorage(); - let ids = JSON.parse(localStorage.getItem("activeIDS")); - for(let i = 0; i < 1000; i++){ + let old_review = getReviewFromStorage(i); + let id = old_review.reviewID; + let new_review = { - "imgSrc": `updated sample src ${i}`, - "mealName": `updated sample name ${i}`, - "restaurant": `updated sample restaurant ${i}`, - "rating": i*2+i, - "tags": [`tag ${3*i}`, `tag ${3*i + 1}`, `tag ${3*i + 2}`] + "imgSrc": `updated sample src ${id}`, + "mealName": `updated sample name ${id}`, + "restaurant": `updated sample restaurant ${id}`, + "reviewID": id, + "rating": (id % 5) + 1, + "tags": [`tag ${3*id}`, `tag ${3*id + 1}`, `tag ${3*id + 2}`] }; - new_review.reviewID = i; - reviews[i] = new_review; + updateReviewToStorage(id, new_review); - updateReviewToStorage(i, new_review); + let all_reviews = getAllReviewsFromStorage(); + let active_ids = JSON.parse(localStorage.getItem("activeIDS")); - assert.deepEqual(getAllReviewsFromStorage(), reviews); + assert.deepEqual(all_reviews[999], new_review); + assert.strictEqual(active_ids[999], id); assert.deepEqual(getReviewFromStorage(i), new_review); - assert.deepEqual(JSON.parse(localStorage.getItem("activeIDS")), ids); assert.strictEqual(JSON.parse(localStorage.getItem("nextID")), 1000); } }).timeout(5000); @@ -108,6 +109,7 @@ describe("test sort/filter localStorage interaction", () => { before(() => { localStorage.clear(); + getAllReviewsFromStorage(); }); it("add sample data for sort and filter", () => { @@ -116,7 +118,7 @@ describe("test sort/filter localStorage interaction", () => { "imgSrc": `sample src ${i}`, "mealName": `sample name ${i}`, "restaurant": `sample restaurant ${i}`, - "rating": i, + "rating": (i % 5) + 1, "tags": [`tag ${i%3}`, `tag ${i < 50}`, "tag x"] }; @@ -124,134 +126,145 @@ describe("test sort/filter localStorage interaction", () => { } }); - it("test getTopReviewsFromStorage end behavior after create", () =>{ - for(let i = 0; i <= 100; i++){ - let top_reviews = getTopReviewsFromStorage(i); - for(let j = 0; j < i; j++){ - assert.strictEqual(top_reviews[j].rating, 99 - j); - assert.strictEqual(top_reviews[j].reviewID, 99 - j); - } + it("test getTopIDsFromStorage end behavior after create", () =>{ + let top_reviews = getTopIDsFromStorage(); + let prev = Infinity; + for(let i = 0; i < top_reviews.length; i++){ + let review = getReviewFromStorage(top_reviews[i]); + assert.strictEqual(review.rating <= prev, true); } }); - it("test getReviewsByTag end behavior after create", () => { + it("test getIDsByTag end behavior after create", () => { let specific_tagged_reviews = []; - specific_tagged_reviews = getReviewsByTag("tag 0"); + specific_tagged_reviews = getIDsByTag("tag 0"); assert.strictEqual(specific_tagged_reviews.length, 34); for(let i = 0; i < specific_tagged_reviews.length; i++){ - assert.strictEqual(specific_tagged_reviews[i].tags.includes("tag 0"), true); - assert.strictEqual(specific_tagged_reviews[i].reviewID % 3, 0); + let review = getReviewFromStorage(specific_tagged_reviews[i]); + assert.strictEqual(review.tags.includes("tag 0"), true); + assert.strictEqual(review.reviewID % 3, 0); } - specific_tagged_reviews = getReviewsByTag("tag 1"); + specific_tagged_reviews = getIDsByTag("tag 1"); assert.strictEqual(specific_tagged_reviews.length, 33); for(let i = 0; i < specific_tagged_reviews.length; i++){ - assert.strictEqual(specific_tagged_reviews[i].tags.includes("tag 1"), true); - assert.strictEqual(specific_tagged_reviews[i].reviewID % 3, 1); + let review = getReviewFromStorage(specific_tagged_reviews[i]); + assert.strictEqual(review.tags.includes("tag 1"), true); + assert.strictEqual(review.reviewID % 3, 1); } - specific_tagged_reviews = getReviewsByTag("tag 2"); + specific_tagged_reviews = getIDsByTag("tag 2"); assert.strictEqual(specific_tagged_reviews.length, 33); for(let i = 0; i < specific_tagged_reviews.length; i++){ - assert.strictEqual(specific_tagged_reviews[i].tags.includes("tag 2"), true); - assert.strictEqual(specific_tagged_reviews[i].reviewID % 3, 2); + let review = getReviewFromStorage(specific_tagged_reviews[i]); + assert.strictEqual(review.tags.includes("tag 2"), true); + assert.strictEqual(review.reviewID % 3, 2); } - specific_tagged_reviews = getReviewsByTag("tag true"); + specific_tagged_reviews = getIDsByTag("tag true"); assert.strictEqual(specific_tagged_reviews.length, 50); for(let i = 0; i < specific_tagged_reviews.length; i++){ - assert.strictEqual(specific_tagged_reviews[i].tags.includes("tag true"), true); - assert.strictEqual(specific_tagged_reviews[i].reviewID < 50, true); + let review = getReviewFromStorage(specific_tagged_reviews[i]); + assert.strictEqual(review.tags.includes("tag true"), true); + assert.strictEqual(review.reviewID < 50, true); } - specific_tagged_reviews = getReviewsByTag("tag false"); + specific_tagged_reviews = getIDsByTag("tag false"); assert.strictEqual(specific_tagged_reviews.length, 50); for(let i = 0; i < specific_tagged_reviews.length; i++){ - assert.strictEqual(specific_tagged_reviews[i].tags.includes("tag false"), true); - assert.strictEqual(specific_tagged_reviews[i].reviewID >= 50, true); + let review = getReviewFromStorage(specific_tagged_reviews[i]); + assert.strictEqual(review.tags.includes("tag false"), true); + assert.strictEqual(review.reviewID >= 50, true); } - specific_tagged_reviews = getReviewsByTag("tag x"); + specific_tagged_reviews = getIDsByTag("tag x"); assert.strictEqual(specific_tagged_reviews.length, 100); - specific_tagged_reviews = getReviewsByTag("tag y"); + specific_tagged_reviews = getIDsByTag("tag y"); assert.deepEqual(specific_tagged_reviews, []); }); it("update sample data for sort and filter", () => { for(let i = 0; i < 100; i++){ + let old_review = getReviewFromStorage(i); let new_review = { "imgSrc": `sample src ${i}`, "mealName": `sample name ${i}`, "restaurant": `sample restaurant ${i}`, - "rating": 99-i, - "tags": [`tag ${i%4}`, `tag ${i < 37}`, "tag y"] + "reviewID": old_review.reviewID, + "rating": (i % 5) + 1, + "tags": [`tag ${i % 4}`, `tag ${i < 37}`, "tag y"] }; - updateReviewToStorage(i, new_review); + updateReviewToStorage(old_review.reviewID, new_review); } }); - it("test getTopReviewsFromStorage end behavior after create", () =>{ - for(let i = 0; i <= 100; i++){ - let top_reviews = getTopReviewsFromStorage(i); - for(let j = 0; j < i; j++){ - assert.strictEqual(top_reviews[j].rating, 99 - j); - assert.strictEqual(top_reviews[j].reviewID, j); - } + it("test getTopIDsFromStorage end behavior after create", () =>{ + let top_reviews = getTopIDsFromStorage(); + let prev = Infinity; + for(let i = 0; i < top_reviews.length; i++){ + let review = getReviewFromStorage(top_reviews[i]); + assert.strictEqual(review.rating <= prev, true); } }); - it("test getReviewsByTag end behavior after update", () => { + it("test getIDsByTag end behavior after update", () => { let specific_tagged_reviews = []; - specific_tagged_reviews = getReviewsByTag("tag 0"); + specific_tagged_reviews = getIDsByTag("tag 0"); assert.strictEqual(specific_tagged_reviews.length, 25); for(let i = 0; i < specific_tagged_reviews.length; i++){ - assert.strictEqual(specific_tagged_reviews[i].tags.includes("tag 0"), true); - assert.strictEqual(specific_tagged_reviews[i].reviewID % 4, 0); + let review = getReviewFromStorage(specific_tagged_reviews[i]); + assert.strictEqual(review.tags.includes("tag 0"), true); + assert.strictEqual(review.reviewID % 4, 0); } - specific_tagged_reviews = getReviewsByTag("tag 1"); + specific_tagged_reviews = getIDsByTag("tag 1"); assert.strictEqual(specific_tagged_reviews.length, 25); for(let i = 0; i < specific_tagged_reviews.length; i++){ - assert.strictEqual(specific_tagged_reviews[i].tags.includes("tag 1"), true); - assert.strictEqual(specific_tagged_reviews[i].reviewID % 4, 1); + let review = getReviewFromStorage(specific_tagged_reviews[i]); + assert.strictEqual(review.tags.includes("tag 1"), true); + assert.strictEqual(review.reviewID % 4, 1); } - specific_tagged_reviews = getReviewsByTag("tag 2"); + specific_tagged_reviews = getIDsByTag("tag 2"); assert.strictEqual(specific_tagged_reviews.length, 25); for(let i = 0; i < specific_tagged_reviews.length; i++){ - assert.strictEqual(specific_tagged_reviews[i].tags.includes("tag 2"), true); - assert.strictEqual(specific_tagged_reviews[i].reviewID % 4, 2); + let review = getReviewFromStorage(specific_tagged_reviews[i]); + assert.strictEqual(review.tags.includes("tag 2"), true); + assert.strictEqual(review.reviewID % 4, 2); } - specific_tagged_reviews = getReviewsByTag("tag 3"); + specific_tagged_reviews = getIDsByTag("tag 3"); assert.strictEqual(specific_tagged_reviews.length, 25); for(let i = 0; i < specific_tagged_reviews.length; i++){ - assert.strictEqual(specific_tagged_reviews[i].tags.includes("tag 3"), true); - assert.strictEqual(specific_tagged_reviews[i].reviewID % 4, 3); + let review = getReviewFromStorage(specific_tagged_reviews[i]); + assert.strictEqual(review.tags.includes("tag 3"), true); + assert.strictEqual(review.reviewID % 4, 3); } - specific_tagged_reviews = getReviewsByTag("tag true"); + specific_tagged_reviews = getIDsByTag("tag true"); assert.strictEqual(specific_tagged_reviews.length, 37); for(let i = 0; i < specific_tagged_reviews.length; i++){ - assert.strictEqual(specific_tagged_reviews[i].tags.includes("tag true"), true); - assert.strictEqual(specific_tagged_reviews[i].reviewID < 37, true); + let review = getReviewFromStorage(specific_tagged_reviews[i]); + assert.strictEqual(review.tags.includes("tag true"), true); + assert.strictEqual(review.reviewID < 37, true); } - specific_tagged_reviews = getReviewsByTag("tag false"); + specific_tagged_reviews = getIDsByTag("tag false"); assert.strictEqual(specific_tagged_reviews.length, 63); for(let i = 0; i < specific_tagged_reviews.length; i++){ - assert.strictEqual(specific_tagged_reviews[i].tags.includes("tag false"), true); - assert.strictEqual(specific_tagged_reviews[i].reviewID >= 37, true); + let review = getReviewFromStorage(specific_tagged_reviews[i]); + assert.strictEqual(review.tags.includes("tag false"), true); + assert.strictEqual(review.reviewID >= 37, true); } - specific_tagged_reviews = getReviewsByTag("tag x"); + specific_tagged_reviews = getIDsByTag("tag x"); assert.deepEqual(specific_tagged_reviews, []); - specific_tagged_reviews = getReviewsByTag("tag y"); + specific_tagged_reviews = getIDsByTag("tag y"); assert.strictEqual(specific_tagged_reviews.length, 100); }); @@ -261,38 +274,38 @@ describe("test sort/filter localStorage interaction", () => { } }); - it("test getTopReviewsFromStorage end behavior after delete", () =>{ + it("test getTopIDsFromStorage end behavior after delete", () =>{ for(let i = 0; i <= 100; i++){ - let top_reviews = getTopReviewsFromStorage(i); + let top_reviews = getTopIDsFromStorage(i); assert.deepEqual(top_reviews, []); } }); - it("test getReviewsByTag end behavior after delete", () => { + it("test getIDsByTag end behavior after delete", () => { let specific_tagged_reviews = []; - specific_tagged_reviews = getReviewsByTag("tag 0"); + specific_tagged_reviews = getIDsByTag("tag 0"); assert.deepEqual(specific_tagged_reviews, []); - specific_tagged_reviews = getReviewsByTag("tag 1"); + specific_tagged_reviews = getIDsByTag("tag 1"); assert.deepEqual(specific_tagged_reviews, []); - specific_tagged_reviews = getReviewsByTag("tag 2"); + specific_tagged_reviews = getIDsByTag("tag 2"); assert.deepEqual(specific_tagged_reviews, []); - specific_tagged_reviews = getReviewsByTag("tag 3"); + specific_tagged_reviews = getIDsByTag("tag 3"); assert.deepEqual(specific_tagged_reviews, []); - specific_tagged_reviews = getReviewsByTag("tag true"); + specific_tagged_reviews = getIDsByTag("tag true"); assert.deepEqual(specific_tagged_reviews, []); - specific_tagged_reviews = getReviewsByTag("tag false"); + specific_tagged_reviews = getIDsByTag("tag false"); assert.deepEqual(specific_tagged_reviews, []); - specific_tagged_reviews = getReviewsByTag("tag x"); + specific_tagged_reviews = getIDsByTag("tag x"); assert.deepEqual(specific_tagged_reviews, []); - specific_tagged_reviews = getReviewsByTag("tag y"); + specific_tagged_reviews = getIDsByTag("tag y"); assert.deepEqual(specific_tagged_reviews, []); }); diff --git a/source/assets/scripts/main.js b/source/assets/scripts/main.js index 955da0a..f746d6e 100644 --- a/source/assets/scripts/main.js +++ b/source/assets/scripts/main.js @@ -1,15 +1,13 @@ // main.js -import {getAllReviewsFromStorage} from "./localStorage.js"; +import {getIDsByTag, getIDsFromStorage, getReviewFromStorage, getTopIDsFromStorage} from "./localStorage.js"; // Run the init() function when the page has loaded window.addEventListener("DOMContentLoaded", init); function init() { - // Get the reviews from localStorage - let reviews = getAllReviewsFromStorage(); - // Add each reviews to the
element - addReviewsToDocument(reviews); - // Add the event listeners to the form elements + //initial population of review container + sortAndFilter(false, null); + //Add the event listeners to dropdown and search bar initFormHandler(); } @@ -22,23 +20,132 @@ function addReviewsToDocument(reviews) { reviews.forEach(review => { let newReview = document.createElement("review-card"); newReview.data = review; - //TODO: want to append it to whatever the box is in layout reviewBox.append(newReview); }); } /** - * Adds the necessary event handlers to
and the clear storage - * -
- -
-
- -
- CREATE -

Recent Reviews

- - -
+ + -
+ + + + + + + + +
+
+ logo +

Food Journal

+ logo +
+
+
+
+
+
+ +
+ +
+ + + + +
+ SEARCH BTN
-
+ +
+ CREATE +

Recent Reviews

+
+ +
-
- - +
+
+ +
+ + + \ No newline at end of file diff --git a/source/static/homepage.css b/source/static/homepage.css index ff575b4..1daf72f 100644 --- a/source/static/homepage.css +++ b/source/static/homepage.css @@ -52,18 +52,33 @@ body { .search-bar { display: flex; justify-content: center; + font-family: 'Century Gothic'; + font-weight: bold; + color: #516754; +} + +#sort{ + margin-right: 1em; } .search-bar > form { float: right; padding: 6px 10px; - margin-top: 8px; + /* + margin-top: 8px; margin-right: 16px; + */ background: rgb(239 183 183); font-size: 17px; border: none; border-radius: 12px; - cursor: pointer; +} + +#search-btn { + position: relative; + align-self: center; + width: 30px; + height: 30px; } #recent-reviews-text { @@ -78,6 +93,17 @@ img#create-btn { align-self: center; padding-left: 2.5%; padding-right: 2.5%; + cursor: pointer; + width: 10%; + height: 10%; +} + +img#create-btn-invis { + opacity: 0%; + padding-left: 2.5%; + padding-right: 2.5%; + width: 10%; + height: 10%; } .review-container {