zino/seatmapv2
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

outsourced inject and seatmap to modules

Browse Source
This commit is contained in:
zino
2021-05-18 19:57:04 +02:00
parent 48c5efbd57
commit d15476161c
5 changed files with 194 additions and 151 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
client/src/inject.ts
View File

@@ -6,8 +6,8 @@ import * as Communication from "./modules/communication";
import * as Parser from './modules/parser';
import * as UI from "./modules/ui";
import { config } from "./modules/config";
import axios from 'axios';
import * as BookingBtn from "./modules/bookingButton";
import * as Parent from "./modules/parent";
let inputsWithValue: I.InputsWithValue;
@@ -62,95 +62,42 @@ function messageHandler(e: any) {
console.log(data);
switch (data.event) {
case "child_init_needInputsWithValue": {
const message: I.Message = {
message: inputsWithValue,
from: "parent",
event: "parent_init_sendInputsWithValue",
date: Date.now()
};
Communication.sendMessage(message, "iframeSeatmap");
Parent.initNeedInputsWithValue(inputsWithValue);
break;
}
case "child_init_needVenueXML": {
Communication.sendXML(inputsWithValue["posturl"], "iframeSeatmap", "parent_init_sendVenueXML", "parent");
config.childHasVenueXML = true;
Parent.initNeedVenueXML(inputsWithValue);
break;
}
case "child_needSeatmapXML": {
const seatmapUrl: string = `${inputsWithValue["posturlRawDecoded"]}&inclseatmap=Y&seatmap=${data.message}`;
Communication.sendXML(seatmapUrl, "iframeSeatmap", "parent_sendSeatmapXML", "parent");
Parent.needSeatmapXML(e, inputsWithValue);
break;
}
case "child_seatmap_ready": {
jQuery("#containerBookingBtn").show();
break;
}
case "child_needCheckoutResponse": {
const inUrl: string = data.message.url;
axios.get(inUrl, {
maxRedirects: 0
})
.then((inE) => {
let isValidSeatSelection: boolean = false;
const content: string = inE.data;
const parsedHTML: Node[] = jQuery.parseHTML(content);
const orderkey: string | undefined = jQuery(parsedHTML).find("#orderkey").val();
console.log(`orderkey: ${orderkey}`);
if (orderkey) {
isValidSeatSelection = true;
const cancelUrl = `${inputsWithValue["ticketPurchaseUrl"]}?user_context=${inputsWithValue["user_context"]}&pid=${inputsWithValue["pid"]}&orderkey=${orderkey}&trxstate=92`;
Communication.cancelCheckout(cancelUrl);
}
const message: I.Message = {
message: {
"isValidSeatSelection": isValidSeatSelection,
"parsedHTML": parsedHTML,
"url": inUrl,
},
from: "parent",
event: "parent_sendCheckoutResponse",
date: Date.now()
};
Communication.sendMessage(message, "iframeSeatmap");
})
.catch(function (error) {
console.log("error in child_needCheckoutResponse");
console.log(error);
});
Parent.needCheckoutResponse(e, inputsWithValue);
break;
}
case "child_hide_dialog_titlebar": {
jQuery(".ui-dialog-titlebar").hide();
break;
}
case "child_show_dialog_titlebar": {
jQuery(".ui-dialog-titlebar").show();
break;
}
case "child_click_checkout": {
const inUrl: string = data.message.url;
window.location.href = inUrl;
Parent.clickCheckout(e);
break;
}
case "child_closeDialog": {
jQuery(".ui-dialog-titlebar-close").click();
break;
}
default:
break;
}

97
client/src/modules/child.ts Normal file
View File

@@ -0,0 +1,97 @@
import * as Communication from "./communication";
import * as UI from "./ui";
import { config } from "./config";
import Utils from "./utils";
import * as Parser from './parser';
import * as I from "../types/types";
import * as JSC from "./jsc";
import * as Legend from "./legend";
import * as Events from "./events";
import * as Trims from "./trims";
import * as XMLHelper from "./xmlhelper";
import * as Panzoom from "./panzoom";
import * as jBoxHelper from "./jBoxHelper";
import * as Cart from "./cart";
import * as CartButtons from "./cartButtons";
export function initVenue() {
UI.controlLoftloader("show");
Communication.sendEventToParent("child_init_needInputsWithValue");
}
export function initSendVenueXML(inE: any) {
const data: I.Message = JSON.parse(inE.data);
config.state.inVenueXML = data.message.map_response;
const venueXML = config.state.inVenueXML!;
// Generate pricescale css classes
const css = UI.generatePricescaleCSS();
Utils.inject(css, "cssCustom", "body");
// Fill event info
const eventInfo = Parser.getEventInfo();
UI.setEventInfo(eventInfo);
// Fill select dropdown
const seatmapListing: I.Seatmap[] = venueXML.seatmap_config[0].seatmap;
UI.setOptionSelect(seatmapListing, "dropdownSeatmap");
// Display first seatmapXML
const id: string = seatmapListing[0].id[0];
jQuery("#dropdownSeatmap").val(id);
Communication.needSeatmapXML(id);
console.log(css);
console.log(seatmapListing);
}
export function initSendInputsWithValue(inE: any) {
const data: I.Message = JSON.parse(inE.data);
config.state.inputsWithValue = data.message;
UI.changeVenueImage();
Communication.sendEventToParent("child_init_needVenueXML");
}
export function sendSeatmapXML(inE: any) {
const data: I.Message = JSON.parse(inE.data);
config.state.seatmapXML = data.message.map_response;
const map: string[] = JSC.generateMap();
const rowsNaming: string[] = JSC.getRowsNaming();
const seats: I.JSCSeats = JSC.getSeats();
const legend: I.JSCLegend = JSC.generateLegend("#JSCLegendInner");
JSC.addSeatmap("#containerSeatmapInner", map, rowsNaming, seats, legend);
JSC.setUnavailableSeats();
JSC.selectSeatsInCart();
Legend.convertLegendToDropdown("dropdownLegend");
Events.dropdownLegendOnChange("#dropdownLegend");
Trims.addTrims();
XMLHelper.processSMAP();
config.state.panzoom = Panzoom.addPanzoom("#containerSeatmapInner", ".panzoomZoomIn", ".panzoomZoomOut", "#panzoomResetZoom");
UI.controlLoftloader("hide");
jBoxHelper.createSeatTooltips();
}
export function sendCheckoutResponse(inE: any) {
const data: I.Message = JSON.parse(inE.data);
config.state.isValidSeatSelection = data.message.isValidSeatSelection;
console.log(data.message);
if (!config.state.isValidSeatSelection) {
jBoxHelper.showJBoxNotice(`Auswahl nicht möglich: Bitte lassen Sie keinen einzelnen Platz frei.`);
CartButtons.showHideBtnCartLoading("hide");
}
else {
Cart.removeCartItems();
Cart.generateCartItems();
const url = Cart.generateCheckoutUrl();
Events.addRedirectCheckout(url);
UI.fadeInCartModal();
CartButtons.showHideBtnCartLoading("hide");
}
config.state.cartChanged = false;
}

26
client/src/modules/communication.ts
View File

@@ -35,9 +35,9 @@ export function sendXML(inUrl: string, inTo: string, inEvent: string, inFrom: st
}
sendMessage(message, inTo);
})
.catch(function (err) {
console.error(err);
});
.catch(function (err) {
console.error(err);
});
}
export function sendEventToChild(inEvent: string): void {
@@ -76,11 +76,11 @@ export function cancelCheckout(inUrl: string): void {
fetch(inUrl, {
redirect: "manual"
})
.then(() => console.log(`${inUrl} canceled`))
.catch(function (error) {
console.log("error");
console.log(error);
});
.then(() => console.log(`${inUrl} canceled`))
.catch(function (error) {
console.log("error");
console.log(error);
});
}
export function isValidSeatSelection(): void {
@@ -113,11 +113,11 @@ function getXMLPromise(inUrl: string): Promise<unknown> {
xml2jsParser(AxiosResponse.data,
{ normalizeTags: true, normalize: true, mergeAttrs: true },
(err: any, result: any) => {
if (err)
reject(err);
else
resolve(result);
});
if (err)
reject(err);
else
resolve(result);
});
}
});
})

71
client/src/modules/parent.ts Normal file
View File

@@ -0,0 +1,71 @@
import { config } from "./config";
import axios from 'axios';
import * as Communication from "./communication";
import * as I from "../types/types";
export function needCheckoutResponse(inE: any, inInputsWithValue: I.InputsWithValue) {
const data: I.Message = JSON.parse(inE.data);
const inUrl: string = data.message.url;
axios.get(inUrl, {
maxRedirects: 0
})
.then((inE) => {
type orderkey = string | number | string[] | undefined;
let isValidSeatSelection: boolean = false;
const content: string = inE.data;
const parsedHTML: Node[] = jQuery.parseHTML(content);
const orderkey: orderkey = jQuery(parsedHTML).find("#orderkey").val();
console.log(`orderkey: ${orderkey}`);
if (orderkey) {
isValidSeatSelection = true;
const cancelUrl = `${inInputsWithValue["ticketPurchaseUrl"]}?user_context=${inInputsWithValue["user_context"]}&pid=${inInputsWithValue["pid"]}&orderkey=${orderkey}&trxstate=92`;
Communication.cancelCheckout(cancelUrl);
}
const message: I.Message = {
message: {
"isValidSeatSelection": isValidSeatSelection,
"parsedHTML": parsedHTML,
"url": inUrl,
},
from: "parent",
event: "parent_sendCheckoutResponse",
date: Date.now()
};
Communication.sendMessage(message, "iframeSeatmap");
})
.catch(function (error) {
console.log("error in child_needCheckoutResponse");
console.log(error);
});
}
export function initNeedInputsWithValue(inInputsWithValue: I.InputsWithValue) {
const message: I.Message = {
message: inInputsWithValue,
from: "parent",
event: "parent_init_sendInputsWithValue",
date: Date.now()
};
Communication.sendMessage(message, "iframeSeatmap");
}
export function initNeedVenueXML(inInputsWithValue: I.InputsWithValue) {
Communication.sendXML(inInputsWithValue["posturl"], "iframeSeatmap", "parent_init_sendVenueXML", "parent");
config.childHasVenueXML = true;
}
export function needSeatmapXML(inE: any, inInputsWithValue: I.InputsWithValue) {
const data: I.Message = JSON.parse(inE.data);
const seatmapUrl: string = `${inInputsWithValue["posturlRawDecoded"]}&inclseatmap=Y&seatmap=${data.message}`;
Communication.sendXML(seatmapUrl, "iframeSeatmap", "parent_sendSeatmapXML", "parent");
}
export function clickCheckout(inE: any) {
const data: I.Message = JSON.parse(inE.data);
const inUrl: string = data.message.url;
window.location.href = inUrl;
}

86
client/src/seatmap.ts
View File

@@ -1,21 +1,13 @@
import jQuery = require("jquery");
import * as XMLHelper from "./modules/xmlhelper";
import * as Communication from "./modules/communication";
import * as I from "./types/types";
import * as UI from "./modules/ui";
import * as JSC from "./modules/jsc";
import { config } from "./modules/config";
import Utils from "./modules/utils";
import * as Events from "./modules/events";
require("jbox/dist/jBox.all.css");
import * as Cart from "./modules/cart";
import * as Trims from "./modules/trims";
import * as Legend from "./modules/legend";
import * as BookingBtn from "./modules/bookingButton";
import * as Panzoom from "./modules/panzoom";
import * as CartButtons from "./modules/cartButtons";
import * as jBoxHelper from "./modules/jBoxHelper";
import * as Parser from './modules/parser';
import * as Child from './modules/child';
window.addEventListener('load', () => {
// Inject JSC (jQuery Seat Charts)
@@ -68,90 +60,26 @@ function messageHandler(inE: any) {
console.log(data);
switch (data.event) {
case "parent_init_venue": {
UI.controlLoftloader("show");
Communication.sendEventToParent("child_init_needInputsWithValue");
Child.initVenue();
break;
}
case "parent_init_sendVenueXML": {
config.state.inVenueXML = data.message.map_response;
const venueXML = config.state.inVenueXML!;
// Generate pricescale css classes
const css = UI.generatePricescaleCSS();
Utils.inject(css, "cssCustom", "body");
// Fill event info
const eventInfo = Parser.getEventInfo();
UI.setEventInfo(eventInfo);
// Fill select dropdown
const seatmapListing: I.Seatmap[] = venueXML.seatmap_config[0].seatmap;
UI.setOptionSelect(seatmapListing, "dropdownSeatmap");
// Display first seatmapXML
const id: string = seatmapListing[0].id[0];
jQuery("#dropdownSeatmap").val(id);
Communication.needSeatmapXML(id);
console.log(css);
console.log(seatmapListing);
Child.initSendVenueXML(inE);
break;
}
case "parent_init_sendInputsWithValue": {
config.state.inputsWithValue = data.message;
UI.changeVenueImage();
Communication.sendEventToParent("child_init_needVenueXML");
Child.initSendInputsWithValue(inE);
break;
}
case "parent_sendSeatmapXML": {
config.state.seatmapXML = data.message.map_response;
const map: string[] = JSC.generateMap();
const rowsNaming: string[] = JSC.getRowsNaming();
const seats: I.JSCSeats = JSC.getSeats();
const legend: I.JSCLegend = JSC.generateLegend("#JSCLegendInner");
JSC.addSeatmap("#containerSeatmapInner", map, rowsNaming, seats, legend);
JSC.setUnavailableSeats();
JSC.selectSeatsInCart();
Legend.convertLegendToDropdown("dropdownLegend");
Events.dropdownLegendOnChange("#dropdownLegend");
Trims.addTrims();
XMLHelper.processSMAP();
config.state.panzoom = Panzoom.addPanzoom("#containerSeatmapInner", ".panzoomZoomIn", ".panzoomZoomOut", "#panzoomResetZoom");
UI.controlLoftloader("hide");
jBoxHelper.createSeatTooltips();
Child.sendSeatmapXML(inE);
break;
}
case "parent_sendCheckoutResponse": {
config.state.isValidSeatSelection = data.message.isValidSeatSelection;
console.log(data.message);
if (!config.state.isValidSeatSelection) {
jBoxHelper.showJBoxNotice(`Auswahl nicht möglich: Bitte lassen Sie keinen einzelnen Platz frei.`);
CartButtons.showHideBtnCartLoading("hide");
}
else {
Cart.removeCartItems();
Cart.generateCartItems();
const url = Cart.generateCheckoutUrl();
Events.addRedirectCheckout(url);
UI.fadeInCartModal();
CartButtons.showHideBtnCartLoading("hide");
}
config.state.cartChanged = false;
case "parent_sendCheckoutResponse": {
Child.sendCheckoutResponse(inE);
break;
}
default:
break;
}