Grocery list

Grocery list test file

by Jon Blackey

HTML

<h1>List Heading</h1>
    Aisle: <input type="text" id="aislenum"/> <br/>Item: <input type="text" id="input"/><br/><button id="button">Add</button>
    <button id="clearStuff">Clear All</button><button id="sortFood">Sort</button><button id="standardStuff">Standard Items</button><button id="reduceFood">reduce</button>
    <div id="stuff"></div>

JavaScript

var myGroceries = JSON.parse(localStorage.getItem('myGroceries')) || [];
    
    function standardingStuff() {
        myGroceries = [
        {aisle: '1', item: 'milk'},
        {aisle: '1', item: 'yogurt'},
        {aisle: '1', item: 'eggs'},
        {aisle: '8', item: 'peanuts'},
        {aisle: '6', item: 'apples'},
        {aisle: '4', item: 'canned vegies'},
        {aisle: '2', item: 'tuna'},
        {aisle: '2', item: 'pickles'},
        {aisle: '1', item: 'milk'}
    ];
      localStorage.setItem('myGroceries', JSON.stringify(myGroceries));
        addStructure();
        
    }
    
    function reducingFood() {
       var reducedFood = myGroceries.reduce(function(obj, item) {
           var itemName = item['item'];
           if(!obj[itemName]) {
               obj[itemName] = 0;
           }
           obj[itemName]++;
           return obj;
           
       }, {}) 
       
        addStructure();
    }
    
    
    

    function sortingFood() {
    var ordered = myGroceries.sort(function(a, b) {
        var Aisle1 = a['aisle'];
        var Aisle2 = b['aisle'];
            
          if(Aisle1 != Aisle2) {
             return (Aisle1 - Aisle2);
          }
          else{
            return (a.item.localeCompare(b.item));
          }
          });
        
      addStructure();
      
      console.table(ordered);
    }
    
    
    function addStuff(){
        var aisleNumber = document.getElementById('aislenum').value;
        var moreStuff = document.getElementById('input').value;
	    var obj = {};
        obj["aisle"] = aisleNumber;
        obj["item"] = moreStuff;
	    myGroceries.push(obj);
        console.table(myGroceries);
        addStructure();
        localStorage.setItem('myGroceries', JSON.stringify(myGroceries));
        document.getElementById('input').value = '';
        
    }
    
    function removeStuff() {
	    var item = this.getAttribute('id');
	    myGroceries.splice(item, 1);
	    addStructure();
       ...