import { fetchAttractions, findParent, dutchCurrencyFormat, dutchCurrencyFormatWithSign, displayNumberOfItemsInShoppingBasketWithBadge } from "./utils.js" export function disableButton(name, button) { return function receiver(payload) { console.log('checking if button should be disabled'); const inputs = button.parentNode.querySelectorAll("input"); var inputTickets = 0; for (let i = 0; i < inputs.length; i++) { if (inputs[i].value > 0) { inputTickets = inputTickets + Number.parseInt(inputs[i].value); } } const shoppingBasketArray = JSON.parse(localStorage.getItem("shoppingBasketArray")); // console.log(shoppingBasketArray); var shoppingBasketTickets = 0; if (shoppingBasketArray) { for (let i = 0; i < shoppingBasketArray.length; i++) { if (shoppingBasketArray[i].name === name) { shoppingBasketTickets = shoppingBasketTickets + shoppingBasketArray[i].numberOfKids + shoppingBasketArray[i].numberOfAdults; } } } const totalTickets = inputTickets + shoppingBasketTickets; function disablerHelper(payload) { var attraction; if (Array.isArray(payload)) { for (let i = 0; i < payload.length; i++) { if (payload[i].name === name) { attraction = payload[i]; } } } else attraction = payload; var front = button.querySelector(".front"); if (attraction.available < totalTickets || attraction.available === 0 || attraction.available === shoppingBasketTickets) { console.log("---> disabling " + attraction.name + " button since the available tickets are " + attraction.available + " and tickets among current order is " + totalTickets); front.classList.add("disabled"); button.removeEventListener("click", orderButtonClicked); } else { console.log("---> enabling " + attraction.name + " button since the available tickets are " + attraction.available + " and tickets among current order is " + totalTickets); front.classList.remove("disabled"); button.addEventListener("click", orderButtonClicked); } } // console.log(payload) if (payload && payload.name) { if (payload.name) { // console.log("prevented unnecesary fetch") disablerHelper(payload); } } else { // console.log("unnecesary fetch") fetchAttractions() .then(disablerHelper) .catch(error => {console.error(error)}); } } } export function orderButtonClicked(event) { console.log("button click"); var button; if (event.target.classList.contains("orderbutton")) { button = event.target; } else { button = event.target.parentNode; } const order = button.parentNode; const parkArticle = order.parentNode; const orderClientSideInfo = { name: parkArticle.querySelector(".parkname").textContent, numberOfKids: Number(order.querySelector(".numberofkids").value), numberOfAdults: Number(order.querySelector(".numberofadults").value), } console.log("---> found this info on the client side:") console.log(orderClientSideInfo); if ((orderClientSideInfo.numberOfKids > 0 && orderClientSideInfo.numberOfAdults >= 0) || (orderClientSideInfo.numberOfAdults > 0 && orderClientSideInfo.numberOfKids >= 0)) { fetchAttractions() .then(checkTicketAvailability(button, orderClientSideInfo)) .then(saveOrderInShoppingBasket(orderClientSideInfo)) .then(disableButton(orderClientSideInfo.name, button)) .catch((error) => {console.error(error)}) } } class TicketsNotAvailableError extends Error { constructor(message) { super(message); this.name = "TicketsNotAvailableError"; } } export function checkTicketAvailability(button, orderClientSideInfo) { return function serverAttractionsAccepter(serverAttractionsArray) { var attraction; for (let i = 0; i < serverAttractionsArray.length; i++) { if (serverAttractionsArray[i].name === orderClientSideInfo.name) { attraction = serverAttractionsArray[i] } } if (attraction.available < orderClientSideInfo.numberOfKids + orderClientSideInfo.numberOfAdults) { throw new TicketsNotAvailableError("The tickets of the order exceed the available tickets!"); } return serverAttractionsArray; } } export function saveOrderInShoppingBasket(orderClientSideInfo) { console.log("---> ---> saving info in shopping basket"); return function serverAttractionsAccepter(serverAttractionsArray) { // const orderClientSideInfo = this; var price; var attraction; for (let i = 0; i < serverAttractionsArray.length; i++) { if (serverAttractionsArray[i].name === orderClientSideInfo.name) { price = calulateTotal( orderClientSideInfo.numberOfKids, orderClientSideInfo.numberOfAdults, serverAttractionsArray[i] ); attraction = serverAttractionsArray[i]; } } orderClientSideInfo.price = price; console.log("---> ---> price is saved in the shopping basket order"); console.log(orderClientSideInfo); var shoppingBasketArray; if (localStorage.getItem("shoppingBasketArray") === null) { shoppingBasketArray = []; shoppingBasketArray.push(orderClientSideInfo); } else { shoppingBasketArray = JSON.parse(localStorage.getItem("shoppingBasketArray")); shoppingBasketArray.push(orderClientSideInfo); } localStorage.setItem("shoppingBasketArray", JSON.stringify(shoppingBasketArray)); console.log("---> ---> order is saved in array in localstorage"); console.log(localStorage); displayNumberOfItemsInShoppingBasketWithBadge(); return attraction; } } export function calulateTotal(numberOfKids, numberOfAdults, serverSideAttraction) { console.log("---> calculating total of order in shoppingbasket!"); console.log("---> ---> fetched this attraction to calculate actual prices!"); console.log(serverSideAttraction); const adultPrice = serverSideAttraction.adultPrice; const kidsPrice = serverSideAttraction.kidsPrice; const discountPercentage = serverSideAttraction.discount; const minNumberkids = serverSideAttraction.minimumNumberOfKids; const minNumberAdults = serverSideAttraction.minimumNumberOfAdults; var totalPrice = 0; if (numberOfKids > 0) { totalPrice = totalPrice + numberOfKids * kidsPrice; } if (numberOfAdults > 0) { totalPrice = totalPrice + numberOfAdults * adultPrice; } if (numberOfKids >= minNumberkids && numberOfAdults >= minNumberAdults) { var discount = totalPrice * discountPercentage / 100; totalPrice = totalPrice - discount; } if (discount) { return {total:totalPrice, discount: discount} } else { return {total: totalPrice}; } } export function displayTotal(event) { console.log("displaying a total price based on client side info"); var order = findParent(parent => {return parent.classList.contains("order")})(event.target) console.log(order) var total = order.querySelector(".total"); var kids = order.querySelector(".numberofkids").value; var adults = order.querySelector(".numberofadults").value; if (kids === "") kids = 0; if (adults === "") adults = 0; let re = /\d+/; var kidsPrice = order.querySelector(".kidsprice") .textContent .match(re)[0]; var adultPrice = order.querySelector(".adultprice") .textContent .match(re)[0]; var discountReq = order.querySelector(".discountrequirement") var minNumberkids = discountReq.querySelector(".child") .textContent .match(re)[0] var minNumberadults = discountReq.querySelector(".adults") .textContent .match(re)[0] var discountPercentage = discountReq.querySelector(".percentage") .textContent .match(re)[0]; // console.log(discountPercentage); var value = 0; if (kids > 0) { value = value + Number.parseInt(kids) * Number.parseFloat(kidsPrice); } if (adults > 0) { value = value + Number.parseInt(adults) * Number.parseFloat(adultPrice); } var discount; if (Number.parseInt(kids) >= Number.parseInt(minNumberkids) && Number.parseInt(adults) >= Number.parseInt(minNumberadults)) { discount = value * Number.parseFloat(discountPercentage) / 100 value = value - discount; console.log("---> applying the discount of " + discountPercentage + "%, resulting in " + discount + " discount") } // console.log(value); var priceString = dutchCurrencyFormat(value); if (!(discount === undefined)) { priceString = priceString + " discount: " + dutchCurrencyFormatWithSign(discount); } total.querySelector(".price").textContent = priceString; }