100 lines
3.7 KiB
TypeScript
100 lines
3.7 KiB
TypeScript
import { config } from "./config";
|
|
import * as I from "../types/types";
|
|
import Utils from "./utils";
|
|
import * as Cart from "./cart";
|
|
import * as JSC from "./jsc";
|
|
|
|
export function convertLegendToDropdown(inID: string): void {
|
|
jQuery('ul.seatCharts-legendList').each(function () {
|
|
let select: JQuery<HTMLSelectElement> = jQuery(document.createElement('select'))
|
|
.insertBefore(
|
|
jQuery(this).hide()
|
|
);
|
|
|
|
select.attr({ id: inID });
|
|
appendFirstLegendOption(select);
|
|
appendLegendOptions(this, select);
|
|
});
|
|
}
|
|
|
|
export function generateLegend(inNode: string): I.JSCLegend {
|
|
const seatmapXML: any = config.state.seatmapXML;
|
|
const venueXML: I.VenueXML = config.state.inVenueXML!;
|
|
const pricescaleArr: I.SeatmapPricescale[] = seatmapXML.seatmap[0].pricescale_config[0].pricescale;
|
|
const venuePricescaleArr: I.Pricescale2[] = venueXML.venue[0].pricescales[0].pricescale;
|
|
|
|
return <I.JSCLegend>{
|
|
node: jQuery(inNode),
|
|
items: createLegendItems(pricescaleArr, venuePricescaleArr)
|
|
}
|
|
}
|
|
|
|
export function dropdownLegendOnChange(inHTMLSelectElement: HTMLSelectElement, inSelector: string) {
|
|
const seatmap: any = config.state.seatmap;
|
|
const sectionID: string = inHTMLSelectElement.value;
|
|
const className: string = `._${sectionID}`;
|
|
|
|
changeDropdownLegendBGColor(inSelector, sectionID, className);
|
|
|
|
console.log(sectionID);
|
|
|
|
if (sectionID === "all") {
|
|
seatmap.find('unavailable').status('available');
|
|
}
|
|
else {
|
|
seatmap.find('available').status('unavailable');
|
|
JSC.activateSeatsBySectionID(sectionID);
|
|
}
|
|
|
|
JSC.setBookedSeatsUnavailable();
|
|
JSC.selectSeatsInCart();
|
|
}
|
|
|
|
function changeDropdownLegendBGColor(inSelector: string, inValue: string, inClassName: string): void {
|
|
return;
|
|
let bgColor: string = "#fafafa";
|
|
let color: string = "#5c5c5c";
|
|
|
|
if (inValue !== "all") {
|
|
color = "white";
|
|
bgColor = jQuery(inClassName).css("background-color");
|
|
}
|
|
|
|
jQuery(inSelector).css("color", color);
|
|
jQuery(inSelector).css("background-color", bgColor);
|
|
jQuery(`${inSelector} option[value="all"]`).css("color", color);
|
|
}
|
|
|
|
function appendLegendOptions(inElement: HTMLElement, inSelect: JQuery<HTMLSelectElement>): void {
|
|
jQuery('>li', inElement).each(function () {
|
|
const className: string = jQuery(this)[0].children[0].classList[3];
|
|
const val: string = className.substring(1);
|
|
const text: string = (<HTMLElement>jQuery(this)[0].children[1]).innerText;
|
|
|
|
appendLegendOption(inSelect, className, val, text);
|
|
});
|
|
}
|
|
|
|
function appendLegendOption(inSelect: JQuery<HTMLSelectElement>, inClassName: string, inVal: string, inText: string): void {
|
|
let option: JQuery<HTMLOptionElement> = jQuery('<option/>');
|
|
option.attr({ 'value': inVal, 'class': inClassName }).text(inText);
|
|
inSelect.append(option);
|
|
}
|
|
|
|
function appendFirstLegendOption(inSelect: JQuery<HTMLSelectElement>): void {
|
|
let option: JQuery<HTMLOptionElement> = jQuery('<option/>');
|
|
option.attr({ 'value': 'all' }).text('Alle Preiskategorien');
|
|
option.css("color", "#5c5c5c");
|
|
inSelect.append(option);
|
|
}
|
|
|
|
function createLegendItems(pricescaleArr: I.SeatmapPricescale[], venuePricescaleArr: I.Pricescale2[]): string[][] {
|
|
return pricescaleArr.map((arr, index: number) => {
|
|
const id: string = arr.id[0];
|
|
const seatsKey: string = String.fromCharCode(97 + index).toLocaleUpperCase();
|
|
const desc: string | undefined = Utils.encodeCP850DecodeUTF8(venuePricescaleArr.find(obj => obj.id[0] === id)?.desc[0]!);
|
|
const price: string = Cart.getPriceInEur(pricescaleArr[index].ref_price[0]);
|
|
const description: string = `${desc} ${price}`;
|
|
return [seatsKey, "available", description];
|
|
});
|
|
} |