revised cart
This commit is contained in:
@@ -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}<br/>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(`
|
||||
<div class="cartItem" id="${inCartID}">
|
||||
@@ -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 = <string>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();
|
||||
}
|
||||
@@ -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), "*")
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -6,7 +6,6 @@ import * as UI from "./ui";
|
||||
import { config } from "./config";
|
||||
import * as Communication from "./communication";
|
||||
|
||||
|
||||
export function getXMLPromise(url: string): Promise<unknown> {
|
||||
return axios.get(url)
|
||||
.then(function (response: void | AxiosResponse<any>) {
|
||||
@@ -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];
|
||||
}
|
||||
5
client/src/types/types.d.ts
vendored
5
client/src/types/types.d.ts
vendored
@@ -404,4 +404,7 @@ export interface JSCSelectedSeat {
|
||||
column: number;
|
||||
character: string;
|
||||
$node: Node;
|
||||
}
|
||||
}
|
||||
|
||||
export type TypeBuyerType = (string | undefined)[][] | undefined;
|
||||
export type TypeBuyerTypeArr = (string | undefined)[];
|
||||
Reference in New Issue
Block a user