From 1484a882b290f5fb7a083fbccdebd0190c63929c Mon Sep 17 00:00:00 2001 From: Kara Hoagland Date: Sun, 27 Nov 2022 15:48:00 -0800 Subject: [PATCH 1/5] tag storage --- source/assets/scripts/ReviewDetails.js | 25 ++++++++++++-- source/assets/scripts/localStorage.js | 45 ++++++++++++++++++++++++++ 2 files changed, 68 insertions(+), 2 deletions(-) diff --git a/source/assets/scripts/ReviewDetails.js b/source/assets/scripts/ReviewDetails.js index 7c4b109..2fa27a0 100644 --- a/source/assets/scripts/ReviewDetails.js +++ b/source/assets/scripts/ReviewDetails.js @@ -1,5 +1,5 @@ //reviewDetails.js -import {deleteReviewFromStorage, getReviewFromStorage, updateReviewToStorage} from "./localStorage.js"; +import {addTagsToStorage, deleteReviewFromStorage, deleteTagsFromStorage, getReviewFromStorage, updateReviewToStorage} from "./localStorage.js"; // Run the init() function when the page has loaded window.addEventListener("DOMContentLoaded", init); @@ -10,6 +10,9 @@ function init(){ setupUpdate(); } +/** + * Populates the relevant data to the details from local storage review + */ function setupInfo(){ let currID = JSON.parse(sessionStorage.getItem("currID")); let currReview = getReviewFromStorage(currID); @@ -51,6 +54,9 @@ function setupInfo(){ } } +/** + * Sets up delete button to delete review from storage and switch to homepage + */ function setupDelete(){ let deleteBtn = document.getElementById("delete-btn"); let currID = JSON.parse(sessionStorage.getItem("currID")); @@ -63,6 +69,9 @@ function setupDelete(){ }); } +/** + * Sets up update button to reveal form and update info in storage and the current page + */ function setupUpdate(){ let updateBtn = document.getElementById("update-btn"); let currID = JSON.parse(sessionStorage.getItem("currID")); @@ -141,10 +150,11 @@ function setupUpdate(){ form.addEventListener("submit", function(){ /* * User submits the form for their review. - * We create reviewCard and put in storage + * We create reviewCard data, replace in storage, and update tags */ let formData = new FormData(form); let newData = {}; + //iterate through formData and add to newData for (let [key, value] of formData) { console.log(`${key}`); console.log(`${value}`); @@ -169,12 +179,23 @@ function setupUpdate(){ newData["reviewID"] = currID; + //Get diff of tags and update storage + //Note: we can either get the difference twice or keep track when we delete and add + //if keep track also need to make sure that a tag doesn't end up on both list + let deletedTags = currReview["tags"].filter(x => !newData["tags"].includes(x)); + let addedTags = newData["tags"].filter(x => !currReview["tags"].includes(x)); + + deleteTagsFromStorage(currID, deletedTags); + addTagsToStorage(currID, addedTags); + updateReviewToStorage(currID, newData); updateDiv.classList.add("hidden"); }); + //adding tag to form functionality + //TODO: disable duplicate tags (use set?) let tagAddBtn = document.getElementById("tag-add-btn"); tagAddBtn.addEventListener("click", ()=> { let tagField = document.getElementById("tag-form"); diff --git a/source/assets/scripts/localStorage.js b/source/assets/scripts/localStorage.js index cab6447..35b95c6 100644 --- a/source/assets/scripts/localStorage.js +++ b/source/assets/scripts/localStorage.js @@ -10,6 +10,9 @@ export function newReviewToStorage(review){ // set the review entry to the review object localStorage.setItem(`review${nextReviewId}`, JSON.stringify(review)); + + // adding to the tag keys + addTagsToStorage(nextReviewId, review["tags"]); //updating our activeIDS list let tempIdArr = JSON.parse(localStorage.getItem("activeIDS")); @@ -52,6 +55,9 @@ export function deleteReviewFromStorage(ID){ if (activeIDS[i] == ID) { activeIDS.splice(i,1); localStorage.setItem("activeIDS", JSON.stringify(activeIDS)); + //get review to delete all the tags(may wanna just add ID to a different list that will delete review and tag list in background)(also don't wanna linear search) + let currReview = JSON.parse(localStorage.getItem(`review${ID}`)); + deleteTagsFromStorage(ID, currReview["tags"]); localStorage.removeItem(`review${ID}`); return; } @@ -60,6 +66,45 @@ export function deleteReviewFromStorage(ID){ console.error(`could not find review${ID} in localStorage`); } +/** + * Delete ID from the specified tags' storage + * @param {string} ID to delete from lists + * @param {string[]} deletedTags to modify storage of + */ +export function deleteTagsFromStorage(ID, deletedTags) { + for(let i in deletedTags){ + //get local storage of each tag and remove id from tag list + let tagArr = JSON.parse(localStorage.getItem("!"+ deletedTags[i])); + for(let j in tagArr){ + if(tagArr[j] == ID){ + tagArr.splice(j,1); + } + break; + } + if(tagArr.length != 0){ + localStorage.setItem("!" + deletedTags[i], JSON.stringify(tagArr)); + } else { + localStorage.removeItem("!" + deletedTags[i]); + } + } +} + +/** + * Add ID from the specified tags' storage + * @param {string} ID to add to lists + * @param {string[]} addedTags to modify storage of + */ +export function addTagsToStorage(ID, addedTags) { + for(let i in addedTags){ + let tagArr = JSON.parse(localStorage.getItem("!" + addedTags[i])); + if(!tagArr){ + tagArr = []; + } + tagArr.push(ID); + localStorage.setItem("!" + addedTags[i], JSON.stringify(tagArr)); + } +} + // legacy function export function getAllReviewsFromStorage() { if (!(localStorage.getItem("activeIDS"))) { From dd0bcbe57dfb26419d2e610b5cc67e01cca3fb91 Mon Sep 17 00:00:00 2001 From: Kara Hoagland Date: Sun, 27 Nov 2022 17:31:13 -0800 Subject: [PATCH 2/5] moved from details to localStorage --- source/assets/scripts/ReviewDetails.js | 11 +---------- source/assets/scripts/localStorage.js | 8 ++++++++ 2 files changed, 9 insertions(+), 10 deletions(-) diff --git a/source/assets/scripts/ReviewDetails.js b/source/assets/scripts/ReviewDetails.js index 2fa27a0..89483c2 100644 --- a/source/assets/scripts/ReviewDetails.js +++ b/source/assets/scripts/ReviewDetails.js @@ -178,16 +178,7 @@ function setupUpdate(){ } newData["reviewID"] = currID; - - //Get diff of tags and update storage - //Note: we can either get the difference twice or keep track when we delete and add - //if keep track also need to make sure that a tag doesn't end up on both list - let deletedTags = currReview["tags"].filter(x => !newData["tags"].includes(x)); - let addedTags = newData["tags"].filter(x => !currReview["tags"].includes(x)); - - deleteTagsFromStorage(currID, deletedTags); - addTagsToStorage(currID, addedTags); - + updateReviewToStorage(currID, newData); updateDiv.classList.add("hidden"); diff --git a/source/assets/scripts/localStorage.js b/source/assets/scripts/localStorage.js index 35b95c6..2aaf914 100644 --- a/source/assets/scripts/localStorage.js +++ b/source/assets/scripts/localStorage.js @@ -40,6 +40,14 @@ export function getReviewFromStorage(ID){ * @param {Object} review to store */ export function updateReviewToStorage(ID, review){ + let oldReview = JSON.parse(localStorage.getItem(`review${ID}`)); + + //Get diff of tags and update storage + let deletedTags = oldReview["tags"].filter(x => !review["tags"].includes(x)); + let addedTags = review["tags"].filter(x => !oldReview["tags"].includes(x)); + deleteTagsFromStorage(currID, deletedTags); + addTagsToStorage(currID, addedTags); + // set the review entry with ID to the review object localStorage.setItem(`review${ID}`, JSON.stringify(review)); } From 847e8a1aa1f0e3594a6d2063fe45643aae8ad4d3 Mon Sep 17 00:00:00 2001 From: Kara Hoagland Date: Mon, 28 Nov 2022 18:48:55 -0800 Subject: [PATCH 3/5] No tag duplicates --- source/assets/scripts/CreatePage.js | 29 ++++++++------ source/assets/scripts/ReviewDetails.js | 28 ++++++++----- source/assets/scripts/localStorage.js | 55 +++++++++++++------------- 3 files changed, 63 insertions(+), 49 deletions(-) diff --git a/source/assets/scripts/CreatePage.js b/source/assets/scripts/CreatePage.js index fab6409..e1850f5 100644 --- a/source/assets/scripts/CreatePage.js +++ b/source/assets/scripts/CreatePage.js @@ -3,11 +3,7 @@ import { newReviewToStorage } from "./localStorage.js"; window.addEventListener("DOMContentLoaded", init); function init() { - // get next id - - // creates the key initFormHandler(); - } function initFormHandler() { @@ -91,19 +87,26 @@ function initFormHandler() { }); let tagAddBtn = document.getElementById("tag-add-btn"); + //Set used to track tags and ensure no duplicates + let tagSet = new Set(); tagAddBtn.addEventListener("click", ()=> { let tagField = document.getElementById("tag-form"); if (tagField.value.length > 0) { - let tagLabel = document.createElement("label"); - tagLabel.innerHTML = tagField.value; - tagLabel.setAttribute("class","tag"); - tagLabel.addEventListener("click",()=> { - tagContainer.removeChild(tagLabel); - }); - - tagContainer.append(tagLabel); + if (!tagSet.has(tagField.value.toLowerCase())){ + let tagLabel = document.createElement("label"); + tagLabel.innerHTML = tagField.value; + tagLabel.setAttribute("class","tag"); + tagSet.add(tagField.value.toLowerCase()); + tagLabel.addEventListener("click",()=> { + tagContainer.removeChild(tagLabel); + tagSet.delete(tagField.value.toLowerCase()); + }); + + tagContainer.append(tagLabel); + } else { + window.alert("No duplicate tags allowed"); + } tagField.value = ""; - } }); diff --git a/source/assets/scripts/ReviewDetails.js b/source/assets/scripts/ReviewDetails.js index 7f22679..1f83c82 100644 --- a/source/assets/scripts/ReviewDetails.js +++ b/source/assets/scripts/ReviewDetails.js @@ -1,5 +1,5 @@ //reviewDetails.js -import {addTagsToStorage, deleteReviewFromStorage, deleteTagsFromStorage, getReviewFromStorage, updateReviewToStorage} from "./localStorage.js"; +import {deleteReviewFromStorage, getReviewFromStorage, updateReviewToStorage} from "./localStorage.js"; // Run the init() function when the page has loaded window.addEventListener("DOMContentLoaded", init); @@ -92,16 +92,21 @@ function setupUpdate(){ document.getElementById("s" + `${currReview["rating"]}`).checked = true; document.getElementById("restaurant").defaultValue = currReview["restaurant"]; + //Set used to track tags and ensure no duplicates + let tagSet = new Set(); + if(currReview["tags"]){ while (tagContainer.firstChild) { tagContainer.removeChild(tagContainer.firstChild); } for (let i = 0; i < currReview["tags"].length; i++) { + tagSet.add(currReview["tags"][i].toLowerCase()); let newTag = document.createElement("label"); newTag.setAttribute("class","tag"); newTag.innerHTML = currReview["tags"][i]; newTag.addEventListener("click",()=> { tagContainer.removeChild(newTag); + tagSet.delete(currReview["tags"][i].toLowerCase()); }); tagContainer.append(newTag); } @@ -186,19 +191,24 @@ function setupUpdate(){ }); //adding tag to form functionality - //TODO: disable duplicate tags (use set?) let tagAddBtn = document.getElementById("tag-add-btn"); tagAddBtn.addEventListener("click", ()=> { let tagField = document.getElementById("tag-form"); if (tagField.value.length > 0) { - let tagLabel = document.createElement("label"); - tagLabel.innerHTML = tagField.value; - tagLabel.setAttribute("class","tag"); - tagLabel.addEventListener("click",()=> { - tagContainer.removeChild(tagLabel); - }); + if (!tagSet.has(tagField.value.toLowerCase())){ + let tagLabel = document.createElement("label"); + tagLabel.innerHTML = tagField.value; + tagLabel.setAttribute("class","tag"); + tagSet.add(tagField.value.toLowerCase()); + tagLabel.addEventListener("click",()=> { + tagContainer.removeChild(tagLabel); + tagSet.delete(tagField.value.toLowerCase()); + }); - tagContainer.append(tagLabel); + tagContainer.append(tagLabel); + } else { + window.alert("No duplicate tags allowed"); + } tagField.value = ""; } }); diff --git a/source/assets/scripts/localStorage.js b/source/assets/scripts/localStorage.js index 545f6d5..8ccfe4e 100644 --- a/source/assets/scripts/localStorage.js +++ b/source/assets/scripts/localStorage.js @@ -45,8 +45,8 @@ export function updateReviewToStorage(ID, review){ //Get diff of tags and update storage let deletedTags = oldReview["tags"].filter(x => !review["tags"].includes(x)); let addedTags = review["tags"].filter(x => !oldReview["tags"].includes(x)); - deleteTagsFromStorage(currID, deletedTags); - addTagsToStorage(currID, addedTags); + deleteTagsFromStorage(ID, deletedTags); + addTagsToStorage(ID, addedTags); // set the review entry with ID to the review object localStorage.setItem(`review${ID}`, JSON.stringify(review)); @@ -63,7 +63,6 @@ export function deleteReviewFromStorage(ID){ if (activeIDS[i] == ID) { activeIDS.splice(i,1); localStorage.setItem("activeIDS", JSON.stringify(activeIDS)); - //get review to delete all the tags(may wanna just add ID to a different list that will delete review and tag list in background)(also don't wanna linear search) let currReview = JSON.parse(localStorage.getItem(`review${ID}`)); deleteTagsFromStorage(ID, currReview["tags"]); localStorage.removeItem(`review${ID}`); @@ -79,10 +78,11 @@ export function deleteReviewFromStorage(ID){ * @param {string} ID to delete from lists * @param {string[]} deletedTags to modify storage of */ -export function deleteTagsFromStorage(ID, deletedTags) { +function deleteTagsFromStorage(ID, deletedTags) { for(let i in deletedTags){ //get local storage of each tag and remove id from tag list - let tagArr = JSON.parse(localStorage.getItem("!"+ deletedTags[i])); + let tagName = "!"+ deletedTags[i]; + let tagArr = JSON.parse(localStorage.getItem(tagName.toLowerCase())); for(let j in tagArr){ if(tagArr[j] == ID){ tagArr.splice(j,1); @@ -90,9 +90,9 @@ export function deleteTagsFromStorage(ID, deletedTags) { break; } if(tagArr.length != 0){ - localStorage.setItem("!" + deletedTags[i], JSON.stringify(tagArr)); + localStorage.setItem(tagName.toLowerCase(), JSON.stringify(tagArr)); } else { - localStorage.removeItem("!" + deletedTags[i]); + localStorage.removeItem(tagName.toLowerCase()); } } } @@ -102,34 +102,18 @@ export function deleteTagsFromStorage(ID, deletedTags) { * @param {string} ID to add to lists * @param {string[]} addedTags to modify storage of */ -export function addTagsToStorage(ID, addedTags) { +function addTagsToStorage(ID, addedTags) { for(let i in addedTags){ - let tagArr = JSON.parse(localStorage.getItem("!" + addedTags[i])); + let tagName = "!" + addedTags[i]; + let tagArr = JSON.parse(localStorage.getItem(tagName.toLowerCase())); if(!tagArr){ tagArr = []; } tagArr.push(ID); - localStorage.setItem("!" + addedTags[i], JSON.stringify(tagArr)); + localStorage.setItem(tagName.toLowerCase(), JSON.stringify(tagArr)); } } -// legacy function -export function getAllReviewsFromStorage() { - 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)); - } - //iterate thru activeIDS - let activeIDS = JSON.parse(localStorage.getItem("activeIDS")); - let reviews = []; - for (let i = 0; i < activeIDS.length; i++) { - let currReview = JSON.parse(localStorage.getItem(`review${activeIDS[i]}`)); - reviews.push(currReview); - } - return reviews; -} - /** * 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 @@ -146,4 +130,21 @@ export function getTopReviewsFromStorage(n) { */ 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 + localStorage.setItem("activeIDS", JSON.stringify([])); + localStorage.setItem("nextID", JSON.stringify(0)); + } + //iterate thru activeIDS + let activeIDS = JSON.parse(localStorage.getItem("activeIDS")); + let reviews = []; + for (let i = 0; i < activeIDS.length; i++) { + let currReview = JSON.parse(localStorage.getItem(`review${activeIDS[i]}`)); + reviews.push(currReview); + } + return reviews; } \ No newline at end of file From 1cdaa63935d3f70bc3a8e56ed4e52170ddaf1f56 Mon Sep 17 00:00:00 2001 From: Kara Hoagland Date: Tue, 29 Nov 2022 14:16:17 -0800 Subject: [PATCH 4/5] delete tag bug --- source/assets/scripts/CreatePage.js | 3 ++- source/assets/scripts/ReviewDetails.js | 12 +++++++----- source/assets/scripts/localStorage.js | 14 +++++++------- 3 files changed, 16 insertions(+), 13 deletions(-) diff --git a/source/assets/scripts/CreatePage.js b/source/assets/scripts/CreatePage.js index e1850f5..b60a016 100644 --- a/source/assets/scripts/CreatePage.js +++ b/source/assets/scripts/CreatePage.js @@ -92,7 +92,8 @@ function initFormHandler() { tagAddBtn.addEventListener("click", ()=> { let tagField = document.getElementById("tag-form"); if (tagField.value.length > 0) { - if (!tagSet.has(tagField.value.toLowerCase())){ + let tagSetVal = tagField.value.toLowerCase(); + if (!tagSet.has(tagSetVal)){ let tagLabel = document.createElement("label"); tagLabel.innerHTML = tagField.value; tagLabel.setAttribute("class","tag"); diff --git a/source/assets/scripts/ReviewDetails.js b/source/assets/scripts/ReviewDetails.js index 1f83c82..c9e05a0 100644 --- a/source/assets/scripts/ReviewDetails.js +++ b/source/assets/scripts/ReviewDetails.js @@ -99,14 +99,15 @@ function setupUpdate(){ while (tagContainer.firstChild) { tagContainer.removeChild(tagContainer.firstChild); } + let tagSetVal = currReview["tags"][i].toLowerCase() for (let i = 0; i < currReview["tags"].length; i++) { - tagSet.add(currReview["tags"][i].toLowerCase()); + tagSet.add(tagSetVal); let newTag = document.createElement("label"); newTag.setAttribute("class","tag"); newTag.innerHTML = currReview["tags"][i]; newTag.addEventListener("click",()=> { tagContainer.removeChild(newTag); - tagSet.delete(currReview["tags"][i].toLowerCase()); + tagSet.delete(tagSetVal); }); tagContainer.append(newTag); } @@ -195,14 +196,15 @@ function setupUpdate(){ tagAddBtn.addEventListener("click", ()=> { let tagField = document.getElementById("tag-form"); if (tagField.value.length > 0) { - if (!tagSet.has(tagField.value.toLowerCase())){ + let tagSetVal = tagField.value.toLowerCase(); + if (!tagSet.has(tagSetVal)){ 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/localStorage.js b/source/assets/scripts/localStorage.js index 8ccfe4e..80709d2 100644 --- a/source/assets/scripts/localStorage.js +++ b/source/assets/scripts/localStorage.js @@ -81,8 +81,8 @@ export function deleteReviewFromStorage(ID){ function deleteTagsFromStorage(ID, deletedTags) { for(let i in deletedTags){ //get local storage of each tag and remove id from tag list - let tagName = "!"+ deletedTags[i]; - let tagArr = JSON.parse(localStorage.getItem(tagName.toLowerCase())); + let tagName = "!"+ deletedTags[i].toLowerCase(); + let tagArr = JSON.parse(localStorage.getItem(tagName)); for(let j in tagArr){ if(tagArr[j] == ID){ tagArr.splice(j,1); @@ -90,9 +90,9 @@ function deleteTagsFromStorage(ID, deletedTags) { break; } if(tagArr.length != 0){ - localStorage.setItem(tagName.toLowerCase(), JSON.stringify(tagArr)); + localStorage.setItem(tagName, JSON.stringify(tagArr)); } else { - localStorage.removeItem(tagName.toLowerCase()); + localStorage.removeItem(tagName); } } } @@ -104,13 +104,13 @@ function deleteTagsFromStorage(ID, deletedTags) { */ function addTagsToStorage(ID, addedTags) { for(let i in addedTags){ - let tagName = "!" + addedTags[i]; - let tagArr = JSON.parse(localStorage.getItem(tagName.toLowerCase())); + let tagName = "!" + addedTags[i].toLowerCase(); + let tagArr = JSON.parse(localStorage.getItem(tagName)); if(!tagArr){ tagArr = []; } tagArr.push(ID); - localStorage.setItem(tagName.toLowerCase(), JSON.stringify(tagArr)); + localStorage.setItem(tagName, JSON.stringify(tagArr)); } } From 6a0708a3f014a455b5191f34851f1e546805e113 Mon Sep 17 00:00:00 2001 From: Kara Hoagland Date: Tue, 29 Nov 2022 14:27:48 -0800 Subject: [PATCH 5/5] moved break for delete --- source/assets/scripts/localStorage.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source/assets/scripts/localStorage.js b/source/assets/scripts/localStorage.js index 80709d2..d0278e3 100644 --- a/source/assets/scripts/localStorage.js +++ b/source/assets/scripts/localStorage.js @@ -86,8 +86,8 @@ function deleteTagsFromStorage(ID, deletedTags) { for(let j in tagArr){ if(tagArr[j] == ID){ tagArr.splice(j,1); + break; } - break; } if(tagArr.length != 0){ localStorage.setItem(tagName, JSON.stringify(tagArr));