modularize localStorage calls into localStorage.js in preparation for unit testing

This commit is contained in:
Arthur Lu 2022-11-18 07:13:53 +00:00
parent 35f44049a2
commit 6493fbd171
4 changed files with 139 additions and 108 deletions

View File

@ -1,3 +1,5 @@
import { newReviewToStorage } from "./localStorage.js";
window.addEventListener("DOMContentLoaded", init); window.addEventListener("DOMContentLoaded", init);
function init() { function init() {
@ -37,23 +39,9 @@ function initFormHandler() {
tagContainer.removeChild(tags[i]); tagContainer.removeChild(tags[i]);
} }
//grabbing the nextID, and putting our review object in storage associated with the ID let nextReviewId = newReviewToStorage(reviewObject);
let nextReviewId = JSON.parse(localStorage.getItem("nextID"));
reviewObject["reviewID"] = nextReviewId;
localStorage.setItem("review"+nextReviewId, JSON.stringify(reviewObject));
sessionStorage.setItem("currID", JSON.stringify(nextReviewId)); sessionStorage.setItem("currID", JSON.stringify(nextReviewId));
//updating our activeIDS list
let tempIdArr = JSON.parse(localStorage.getItem("activeIDS"));
tempIdArr.push(nextReviewId);
localStorage.setItem("activeIDS", JSON.stringify(tempIdArr));
//increment nextID for next review creation
nextReviewId++;
localStorage.setItem("nextID", JSON.stringify(nextReviewId));
window.location.assign('./ReviewDetails.html'); window.location.assign('./ReviewDetails.html');
}); });

View File

@ -1,5 +1,5 @@
//reviewDetails.js //reviewDetails.js
import {getReviewsFromStorage, saveReviewsToStorage} from "./localStorage.js"; import {deleteReviewFromStorage, getReviewFromStorage, updateReviewToStorage} from "./localStorage.js";
// Run the init() function when the page has loaded // Run the init() function when the page has loaded
window.addEventListener("DOMContentLoaded", init); window.addEventListener("DOMContentLoaded", init);
@ -12,19 +12,11 @@ function init(){
function setupDelete(){ function setupDelete(){
let deleteBtn = document.getElementById("delete-btn"); let deleteBtn = document.getElementById("delete-btn");
let currID = JSON.parse(sessionStorage.getItem("currID")); let currID = JSON.parse(sessionStorage.getItem("currID"));
let activeIDS = JSON.parse(localStorage.getItem("activeIDS"));
deleteBtn.addEventListener("click", function(){ deleteBtn.addEventListener("click", function(){
if(window.confirm("Are you sure you want to delete this entry?")){ if(window.confirm("Are you sure you want to delete this entry?")){
for (let i in activeIDS) { deleteReviewFromStorage(currID);
if (activeIDS[i] == currID) {
activeIDS.splice(i,1);
localStorage.setItem('activeIDS', JSON.stringify(activeIDS));
sessionStorage.removeItem('currID'); sessionStorage.removeItem('currID');
localStorage.removeItem(`review${currID}`);
window.location.assign("./index.html"); window.location.assign("./index.html");
break;
}
}
} }
}); });
} }
@ -32,12 +24,13 @@ function setupDelete(){
function setupUpdate(){ function setupUpdate(){
let updateBtn = document.getElementById("update-btn"); let updateBtn = document.getElementById("update-btn");
let currID = JSON.parse(sessionStorage.getItem("currID")); let currID = JSON.parse(sessionStorage.getItem("currID"));
let currReview = JSON.parse(localStorage.getItem(`review${currID}`)); let currReview = getReviewFromStorage(currID);
let form = document.getElementById("update-food-entry"); let form = document.getElementById("update-food-entry");
updateBtn.addEventListener("click", function(){ updateBtn.addEventListener("click", function(){
//update function //update function
if(currReview){
form.style.display = "block"; form.style.display = "block";
form.classList.remove("hidden");
let tagContainer = document.getElementById("tag-container-form"); let tagContainer = document.getElementById("tag-container-form");
//Set value of each input element to current's values //Set value of each input element to current's values
@ -87,8 +80,7 @@ function setupUpdate(){
newData["reviewID"] = currID; newData["reviewID"] = currID;
updateReviewToStorage(currID, newData);
localStorage.setItem("review"+currID, JSON.stringify(newData));
form.style.display = "none"; form.style.display = "none";
@ -109,6 +101,5 @@ function setupUpdate(){
tagField.value = ""; tagField.value = "";
} }
}); });
}
}); });
} }

View File

@ -1,7 +1,68 @@
/** /**
* @returns {Array<Object>} An array of reviews found in localStorage * Creates a new review to storage and performs related meta tasks
* @param {Object} review to store
* @return {number} ID of the newly added review
*/ */
export function getReviewsFromStorage() { export function newReviewToStorage(review){
//grabbing the nextID, and putting our review object in storage associated with the ID
let nextReviewId = JSON.parse(localStorage.getItem("nextID"));
review["reviewID"] = nextReviewId;
// set the review entry to the review object
localStorage.setItem(`review${nextReviewId}`, JSON.stringify(review));
//updating our activeIDS list
let tempIdArr = JSON.parse(localStorage.getItem("activeIDS"));
tempIdArr.push(nextReviewId);
localStorage.setItem("activeIDS", JSON.stringify(tempIdArr));
//increment nextID for next review creation
nextReviewId++;
localStorage.setItem("nextID", JSON.stringify(nextReviewId));
return nextReviewId;
}
/**
* Gets a single review by ID from storage
* @param {string} ID of the review to get
* @returns {Object} review object corresponding to param ID
*/
export function getReviewFromStorage(ID){
return JSON.parse(localStorage.getItem(`review${ID}`));
}
/**
* Updates a single review by ID to storage
* @param {string} ID of review to update
* @param {Object} review to store
*/
export function updateReviewToStorage(ID, review){
// set the review entry with ID to the review object
localStorage.setItem(`review${ID}`, JSON.stringify(review));
}
/**
* Deletes a review by ID from storage
* @param {string} ID of the review to delete
*/
export function deleteReviewFromStorage(ID){
let activeIDS = JSON.parse(localStorage.getItem("activeIDS"));
for (let i in activeIDS) {
if (activeIDS[i] == ID) {
activeIDS.splice(i,1);
localStorage.setItem('activeIDS', JSON.stringify(activeIDS));
localStorage.removeItem(`review${ID}`)
return;
}
}
console.error(`could not find review${ID} in localStorage`);
}
// legacy function
export function getAllReviewsFromStorage() {
if (!(localStorage.getItem("activeIDS"))) { if (!(localStorage.getItem("activeIDS"))) {
// we wanna init the active ID array and start the nextID count // we wanna init the active ID array and start the nextID count
localStorage.setItem("activeIDS", JSON.stringify([])); localStorage.setItem("activeIDS", JSON.stringify([]));
@ -11,17 +72,8 @@ export function getReviewsFromStorage() {
let activeIDS = JSON.parse(localStorage.getItem("activeIDS")); let activeIDS = JSON.parse(localStorage.getItem("activeIDS"));
let reviews = [] let reviews = []
for (let i = 0; i < activeIDS.length; i++) { for (let i = 0; i < activeIDS.length; i++) {
let currReview = JSON.parse(localStorage.getItem('review'+activeIDS[i])); let currReview = JSON.parse(localStorage.getItem(`review${activeIDS[i]}`));
reviews.push(currReview); reviews.push(currReview);
} }
return reviews; return reviews;
} }
/**
* Takes in an array of reviews, converts it to a string, and then
* saves that string to 'reviews' in localStorage
* @param {Array<Object>} reviews An array of reviews
*/
export function saveReviewsToStorage(reviews) {
localStorage.setItem(`review${reviewId}`, JSON.stringify(reviews));
}

View File

@ -1,12 +1,12 @@
// main.js // main.js
import {getReviewsFromStorage, saveReviewsToStorage} from "./localStorage.js"; import {getAllReviewsFromStorage} from "./localStorage.js";
// Run the init() function when the page has loaded // Run the init() function when the page has loaded
window.addEventListener("DOMContentLoaded", init); window.addEventListener("DOMContentLoaded", init);
function init() { function init() {
// Get the reviews from localStorage // Get the reviews from localStorage
let reviews = getReviewsFromStorage(); let reviews = getAllReviewsFromStorage();
// Add each reviews to the <main> element // Add each reviews to the <main> element
addReviewsToDocument(reviews); addReviewsToDocument(reviews);
// Add the event listeners to the form elements // Add the event listeners to the form elements