ViewController

class ViewController {
    constructor() {
      window.addEventListener("hashchange", this.handleHashChange);
      window.addEventListener("load", this.handleHashChange);
      this.receiptManager = new ReceiptManager();
      this.cartManager = new CartManager();
    }

    handleHashChange = () => {

      let hash = window.location.hash.slice(1) || "all";

      const pageIds = ["all", "fav", "create", "profile", "error"];

      pageIds.forEach((id) => {
        let page = document.getElementById(id);

        if (hash === id) {
          page.style.display = "block";
        } else {
          page.style.display = "none";
        }
      });

      switch (hash) {

        case "all":
            this.renderAllPage();
        case "cart":
            this.renderCartPage();
        case "order":
            this.renderOrderPage();
    }

    }
  }

  renderReceipts = (receiptList, container) => {
    container.innerHTML = "";

    receiptList.forEach(receipt => {

        let card = createElement('div');
        card.classList.add('card');


        let img = createElement('img');
        img.src = receipt.thumbnail;
        img.width = 200;

        let title = createElement('div');
        title.innerText = receipt.title;
        title.classList.add('title');


        let ingredients = createElement('div');
        ingredients.innerText = receipt.ingredients;
        ingredients.classList.add('ingredients');

        let inputCount = createElement('input');
        inputCount.type = "number";
        inputCount.value = 1;

        let addToCartBtn = createElement('button');
        addToCartBtn.addEventListener('click', () => {
            this.cartManager.addToCart(receipt, Number(inputCount.value));
        })
        addToCartBtn.innerText = "Add to cart";

        card.append(
            img,
            title,
            weight,
            ingredients,
            inputCount,
            addToCartBtn
        );

        container.appendChild(card);
    });
}

renderAllPage = () => {
    let searchInput = document.getElementById('searchInput');

    searchInput.addEventListener('input',(event)=> {

        let result = this.receiptManager.search(event.target.value);

        console.log(result);
        this.renderReceipts(result,renderContainer);

    } )

    let receiptContainer = document.querySelector('#all .container');

    this.renderReceipts(this.receiptManager.receiptList,receiptContainer);
}



  let viewController = new ViewController();