started review cards, form change

source/assets/scripts/main.js

@@ -3,28 +3,20 @@
 // Run the init() function when the page has loaded
 window.addEventListener('DOMContentLoaded', init);
 
-// Starts the program, all function calls trace back here
 function init() {
-  // Get the recipes from localStorage
-  let recipes = getRecipesFromStorage();
+  // Get the reviews from localStorage
+  let reviews = getReviewsFromStorage();
   // Add each recipe to the <main> element
-  addRecipesToDocument(recipes);
+  addReviewsToDocument(reviews);
   // Add the event listeners to the form elements
   initFormHandler();
 }
 
 /**
- * Reads 'recipes' from localStorage and returns an array of
- * all of the recipes found (parsed, not in string form). If
- * nothing is found in localStorage for 'recipes', an empty array
- * is returned.
- * @returns {Array<Object>} An array of recipes found in localStorage
+ * @returns {Array<Object>} An array of reviews found in localStorage
  */
-function getRecipesFromStorage() {
-  // A9. TODO - Complete the functionality as described in this function
-  //           header. It is possible in only a single line, but should
-  //           be no more than a few lines.
-  let result = JSON.parse(localStorage.getItem('recipes'))
+function getReviewsFromStorage() {
+  let result = JSON.parse(localStorage.getItem('reviews'))
   if (result) {
     return result;
   }
@@ -32,38 +24,25 @@ function getRecipesFromStorage() {
 }
 
 /**
- * Takes in an array of recipes and for each recipe creates a
- * new <recipe-card> element, adds the recipe data to that card
- * using element.data = {...}, and then appends that new recipe
- * to <main>
- * @param {Array<Object>} recipes An array of recipes
+ * @param {Array<Object>} reviews An array of reviews
  */
-function addRecipesToDocument(recipes) {
-  // A10. TODO - Get a reference to the <main> element
+function addReviewsToDocument(reviews) {
   let mainEl = document.querySelector('main')
-  recipes.forEach(recipe=> {
-    let newRecipe = document.createElement('recipe-card')
-    newRecipe.data = recipe
-    mainEl.append(newRecipe);
+  reviews.forEach(review=> {
+    let newReview = document.createElement('review-card')
+    newReview.data = review
+    mainEl.append(newReview);
   })
-  // A11. TODO - Loop through each of the recipes in the passed in array,
-  //            create a <recipe-card> element for each one, and populate
-  //            each <recipe-card> with that recipe data using element.data = ...
-  //            Append each element to <main>
 
 }
 
 /**
- * Takes in an array of recipes, converts it to a string, and then
- * saves that string to 'recipes' in localStorage
- * @param {Array<Object>} recipes An array of recipes
+ * 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
  */
-function saveRecipesToStorage(recipes) {
-  // EXPLORE - START (All explore numbers start with B)
-  // B1. TODO - Complete the functionality as described in this function
-  //            header. It is possible in only a single line, but should
-  //            be no more than a few lines.
-  localStorage.setItem('recipes', JSON.stringify(recipes));
+function saveRecipesToStorage(reviews) {
+  localStorage.setItem('reviews', JSON.stringify(reviews));
 }
 
 /**
@@ -72,11 +51,8 @@ function saveRecipesToStorage(recipes) {
  */
 function initFormHandler() {
 
-  // B2. TODO - Get a reference to the <form> element
   let theForm = document.querySelector('form')
   
-  // B3. TODO - Add an event listener for the 'submit' event, which fires when the
-  //            submit button is clicked
   let submitButt = document.querySelector('button[type="submit"]')
   submitButt.addEventListener('click', function(){
 
@@ -110,23 +86,4 @@ function initFormHandler() {
      }
   });
 
-  // Steps B4-B9 will occur inside the event listener from step B3
-  // B4. TODO - Create a new FormData object from the <form> element reference above
-  // B5. TODO - Create an empty object (I'll refer to this object as recipeObject to
-  //            make this easier to read), and then extract the keys and corresponding
-  //            values from the FormData object and insert them into recipeObject
-  
-  // B6. TODO - Create a new <recipe-card> element
-  // B7. TODO - Add the recipeObject data to <recipe-card> using element.data
-  // B8. TODO - Append this new <recipe-card> to <main>
-  // B9. TODO - Get the recipes array from localStorage, add this new recipe to it, and
-  //            then save the recipes array back to localStorage
-
-  // B10. TODO - Get a reference to the "Clear Local Storage" button
-  // B11. TODO - Add a click event listener to clear local storage button
-  
-  // Steps B12 & B13 will occur inside the event listener from step B11
-  // B12. TODO - Clear the local storage
-  // B13. TODO - Delete the contents of <main>
-
 }