From 6a59421c8a83e4dcf2c6fb6bb65dca1a9689471b Mon Sep 17 00:00:00 2001 From: zino Date: Sun, 16 May 2021 00:57:20 +0200 Subject: [PATCH] revised cart --- client/src/modules/cart.ts | 160 +++++++++++----------------- client/src/modules/communication.ts | 27 +++-- client/src/modules/xmlhelper.ts | 36 ++++++- client/src/types/types.d.ts | 5 +- 4 files changed, 119 insertions(+), 109 deletions(-) diff --git a/client/src/modules/cart.ts b/client/src/modules/cart.ts index d177d1a..a35c2f5 100644 --- a/client/src/modules/cart.ts +++ b/client/src/modules/cart.ts @@ -4,9 +4,6 @@ import * as I from "../types/types"; import * as UI from "./ui"; import * as Events from "./events"; -type buyerType = (string | undefined)[][] | undefined; -type buyerTypeArr = (string | undefined)[]; - export function addItem(inSeatObj: I.JSCSelectedSeat): void { const color: string = `#${XMLHelper.getVenuePricescalePropertyByPricescaleID("color", inSeatObj.data.seatsObj.id[0])}`; const category: string | undefined = XMLHelper.getVenuePricescalePropertyByPricescaleID("desc", inSeatObj.data.seatsObj.id[0]); @@ -15,7 +12,7 @@ export function addItem(inSeatObj: I.JSCSelectedSeat): void { const sectionID: string = config.state.layoutRows[inSeatObj.id][3]; const sectionDesc: string | undefined = XMLHelper.getSectionDescBySectionID(sectionID); const seatStr: string | undefined = `${sectionDesc}
Reihe ${row} Platz ${seat}`; - const buyerTypes: buyerType = getBuyerTypesByPricescaleID(inSeatObj.data.seatsObj.id[0]); + const buyerTypes: I.TypeBuyerType = XMLHelper.getBuyerTypesByPricescaleID(inSeatObj.data.seatsObj.id[0]); const cartID: string = `cartItem-${inSeatObj.id}`; const dropdownBuyerTypesSelector: string = `#${cartID} .dropdownBuyerTypes`; @@ -24,6 +21,58 @@ export function addItem(inSeatObj: I.JSCSelectedSeat): void { Events.addCartDropdownBuyerTypes(dropdownBuyerTypesSelector, inSeatObj); } +export function removeCartItems(): void { + jQuery("#cartItemHTML .cartItem").each(function () { + this.remove(); + }); +} + +export function changedDropdownBuyerType(inSelect: HTMLSelectElement, inSeatObj: I.JSCSelectedSeat): void { + const index: number = config.state.selectedSeatsArr.findIndex(arr => + arr[0] === inSeatObj.id); + + config.state.selectedSeatsArr[index][1] = inSelect.value; + const buyerTypeCode = XMLHelper.getBuyerTypeCodeByBuyerTypeID(inSelect.value); + + if (buyerTypeCode) + config.state.selectedSeatsArr[index][2] = buyerTypeCode; + + calcOverallPrice(); + UI.setBtnCartText(); + + const url = XMLHelper.generateCheckoutUrl(); + Events.addRedirectCheckout(url); +} + +export function calcOverallPrice(): string | undefined { + if (!config.state.selectedSeatsArr.length) { + config.state.priceOverall = "0"; + return "0"; + } + + config.state.priceOverall = sumSeatPrices(); + return config.state.priceOverall; +} + + +export function generateCartItems(): void { + if (!config.state.selectedSeatsArr.length) + return; + + for (const key in config.state.selectedSeatsObj) { + if (Object.prototype.hasOwnProperty.call(config.state.selectedSeatsObj, key)) { + const element = config.state.selectedSeatsObj[key]; + addItem(element); + } + } +} + +export function initModalCart(): void { + jQuery("#modalCart-overlay").hide(); + Events.addCartBack(); + Events.addCartClose(); +} + function appendHTML(inCartID: string, inColor: string, inCategory: string | undefined, inSeatStr: string): void { jQuery("#cartItemHTML .fl-html").append(`
@@ -35,81 +84,25 @@ function appendHTML(inCartID: string, inColor: string, inCategory: string | unde } // todo: generalize dropdown fill options -function addDropdownBuyerTypeOptions(inBuyerTypes: buyerType, inSelector: string) { +function addDropdownBuyerTypeOptions(inBuyerTypes: I.TypeBuyerType, inSelector: string) { if (!inBuyerTypes) return; - const dropdownBuyerTypes: HTMLElement = jQuery(inSelector).get(0); - inBuyerTypes.forEach(arr => { if (arr[0]) - appendOption(dropdownBuyerTypes, arr) + appendOption(inSelector, arr) }); } -function appendOption(inDropdownBuyerTypes: HTMLElement, inArr: buyerTypeArr) { +function appendOption(inSelector: string, inArr: I.TypeBuyerTypeArr): void { + const dropdownBuyerTypes: HTMLElement = jQuery(inSelector).get(0); let opt: HTMLOptionElement = document.createElement('option'); opt.value = inArr[0]; opt.innerHTML = `${inArr[2]} €${inArr[1]}`; - inDropdownBuyerTypes.appendChild(opt); + dropdownBuyerTypes.appendChild(opt); } -function getBuyerTypesByPricescaleID(inPricescaleID: string) { - const venueXML: I.VenueXML = config.state.inVenueXML!; - const venuePricescaleArr: I.Pricescale5[] = venueXML.price_structure[0].pricescale; - - const buyerTypesArr = venuePricescaleArr.find(obj => { - return obj.id[0] === inPricescaleID; - })?.buyer_type; - - if (!buyerTypesArr) - return; - - const buyerTypes: buyerType = buyerTypesArr.map(arr => { - const buyerTypeDesc = venueXML.venue[0].buyer_types[0].buyer_type.find(obj => { - return obj.id[0] === arr.id[0] ? obj.desc[0] : undefined; - })?.desc[0]; - - return [arr.id[0], arr.price[0], buyerTypeDesc]; - }); - - return buyerTypes; -} - -export function removeCartItems() { - jQuery("#cartItemHTML .cartItem").each(function () { - this.remove(); - }); -} - -export function changedDropdownBuyerType(inSelect: HTMLSelectElement, inSeatObj: I.JSCSelectedSeat) { - const index = config.state.selectedSeatsArr.findIndex(arr => { - return arr[0] === inSeatObj.id; - }); - - config.state.selectedSeatsArr[index][1] = inSelect.value; - - const buyerTypeCode = XMLHelper.getBuyerTypeCodeByBuyerTypeID(inSelect.value); - - if (buyerTypeCode) - config.state.selectedSeatsArr[index][2] = buyerTypeCode; - - calcOverallPrice(); - UI.setBtnCartText(); - - const url = XMLHelper.generateCheckoutUrl(); - console.log(url); - Events.addRedirectCheckout(url); - - console.log(config.state); -} - -export function calcOverallPrice(): string | undefined { - if (!config.state.selectedSeatsArr.length) { - config.state.priceOverall = "0"; - return "0"; - } - +function sumSeatPrices(): string { let overallPrice: number = 0; config.state.selectedSeatsArr.forEach(arr => { @@ -119,36 +112,13 @@ export function calcOverallPrice(): string | undefined { const pricescaleID: string = selectedSeat.data.seatsObj.id[0]; const pricescaleObj: I.Pricescale5 | undefined = XMLHelper.getVenuePriceStructurePropertyByPricescaleID(pricescaleID); - if (!pricescaleObj) - return; + if (pricescaleObj) { + const seatPrice: number | undefined = XMLHelper.getPriceByBuyerTypeID(buyertypeID, pricescaleObj); - const seatPrice: number | undefined = XMLHelper.getPriceByBuyertypeID(buyertypeID, pricescaleObj); - - if (!seatPrice) - return; - - overallPrice += seatPrice; + if (seatPrice) + overallPrice += seatPrice; + } }); - config.state.priceOverall = overallPrice.toFixed(2); - - return config.state.priceOverall; + return overallPrice.toFixed(2); } - -export function generateCartItems() { - if (!config.state.selectedSeatsArr.length) - return; - - for (const key in config.state.selectedSeatsObj) { - if (Object.prototype.hasOwnProperty.call(config.state.selectedSeatsObj, key)) { - const element = config.state.selectedSeatsObj[key]; - addItem(element); - } - } -} - -export function initModalCart() { - jQuery("#modalCart-overlay").hide(); - Events.addCartBack(); - Events.addCartClose(); -} \ No newline at end of file diff --git a/client/src/modules/communication.ts b/client/src/modules/communication.ts index afa9e22..53c6dca 100644 --- a/client/src/modules/communication.ts +++ b/client/src/modules/communication.ts @@ -2,19 +2,24 @@ import * as I from "../types/types"; import * as xml from "./xmlhelper"; // rework try/catch ? -export function sendMessage(data: I.Message, to: string): void { - if (to === "parent") - window.parent.postMessage(JSON.stringify(data), '*'); +export function sendMessage(inData: I.Message, inTo: string): void { + if (inTo === "parent") + window.parent.postMessage(JSON.stringify(inData), '*'); else { - console.log("trying to send to child"); - const child: any = document.getElementById(to); - if (child === null) { - console.log(`Element with ID ${to} does not exist`); - return; - } + const child: any = document.getElementById(inTo); + + if (child !== null && child.contentWindow !== null) + child.contentWindow.postMessage(JSON.stringify(inData), "*"); + else + console.log(`Element with ID ${inTo} does not exist`); + + // if (child === null) { + // console.log(`Element with ID ${inTo} does not exist`); + // return; + // } - if (child.contentWindow !== null) - child.contentWindow.postMessage(JSON.stringify(data), "*") + // if (child.contentWindow !== null) + // child.contentWindow.postMessage(JSON.stringify(inData), "*") } } diff --git a/client/src/modules/xmlhelper.ts b/client/src/modules/xmlhelper.ts index 3f6b8f3..cf96d5d 100644 --- a/client/src/modules/xmlhelper.ts +++ b/client/src/modules/xmlhelper.ts @@ -6,7 +6,6 @@ import * as UI from "./ui"; import { config } from "./config"; import * as Communication from "./communication"; - export function getXMLPromise(url: string): Promise { return axios.get(url) .then(function (response: void | AxiosResponse) { @@ -150,7 +149,7 @@ export function getBuyerTypeCodeByBuyerTypeID(inBuyerTypeID: string): string | u })?.code[0]; } -export function getPriceByBuyertypeID(inBuyertypeID: string, inPricescaleObj: I.Pricescale5) { +export function getPriceByBuyerTypeID(inBuyertypeID: string, inPricescaleObj: I.Pricescale5) { const price = inPricescaleObj?.buyer_type.find(arr => { return arr.id[0] === inBuyertypeID; })?.price[0]; @@ -181,4 +180,37 @@ export function generatePricescaleCSS(): string { }); return (cssArr.join("\r\n")); +} + +export function getBuyerTypesByPricescaleID(inPricescaleID: string): I.TypeBuyerTypeArr[] | undefined { + const buyerTypesArr: I.BuyerType3[] | undefined = findBuyerTypesArrByPricescaleID(inPricescaleID); + + if (buyerTypesArr) { + const buyerTypes: I.TypeBuyerType = buyerTypesArr.map(arr => { + const buyerTypeDesc: string | undefined = getBuyerTypeDesc(arr); + return [arr.id[0], arr.price[0], buyerTypeDesc]; + }); + + return buyerTypes; + } + else + return undefined; +} + +function findBuyerTypesArrByPricescaleID(inPricescaleID: string): I.BuyerType3[] | undefined { + const venueXML: I.VenueXML = config.state.inVenueXML!; + const venuePricescaleArr: I.Pricescale5[] = venueXML.price_structure[0].pricescale; + + return venuePricescaleArr.find(obj => + obj.id[0] === inPricescaleID) + ?.buyer_type; +} + +function getBuyerTypeDesc(inArr: I.BuyerType3): string | undefined { + const venueXML: I.VenueXML = config.state.inVenueXML!; + const buyerTypeArr: I.BuyerType2[] = venueXML.venue[0].buyer_types[0].buyer_type; + + return buyerTypeArr.find(obj => + obj.id[0] === inArr.id[0] ? obj.desc[0] : undefined) + ?.desc[0]; } \ No newline at end of file diff --git a/client/src/types/types.d.ts b/client/src/types/types.d.ts index 5cad112..af8606e 100644 --- a/client/src/types/types.d.ts +++ b/client/src/types/types.d.ts @@ -404,4 +404,7 @@ export interface JSCSelectedSeat { column: number; character: string; $node: Node; -} \ No newline at end of file +} + +export type TypeBuyerType = (string | undefined)[][] | undefined; +export type TypeBuyerTypeArr = (string | undefined)[]; \ No newline at end of file