Files
seatmapv2/client/src/modules/ui.ts

120 lines
4.6 KiB
TypeScript

import * as I from "../types/types";
import * as Communication from "./communication";
import { config } from "./config";
import * as Events from "./events";
import * as Panzoom from "./panzoom";
import * as CartButtons from "./cartButtons";
import Utils from "./utils";
export function setOptionSelect(inSeatmapListing: I.Seatmap[], inId: string): void {
const seatmapDropdown: HTMLElement | null = document.getElementById(inId);
if (seatmapDropdown) {
for (let seatmapObj of inSeatmapListing) {
const id: string = seatmapObj.id[0];
const desc: string = Utils.encodeCP850DecodeUTF8(seatmapObj.desc[0]);
var opt: HTMLOptionElement = document.createElement('option');
opt.value = id;
opt.innerHTML = desc;
seatmapDropdown.appendChild(opt);
}
}
}
export function changeSiteTitle(): void {
document.title += ` ${config.state.inputsWithValue?.supplier_code}`;
}
export function setEventInfo(inEventInfo: I.EventInfo): void {
const inputsWithValue = config.state.inputsWithValue!;
const desc: string = Utils.encodeCP850DecodeUTF8(inEventInfo.desc[0]);
const location: string = inputsWithValue.venueLocation;
jQuery("#eventInfoDesc span.fl-heading-text")[0].childNodes[0].textContent = desc;
jQuery("#eventInfoLocation p")[0].childNodes[0].textContent = location;
jQuery("#eventInfoDate p")[0].childNodes[0].textContent = inEventInfo.start[0];
jQuery("#eventInfoCapacity p")[0].childNodes[0].textContent = `Verfügbare Plätze: ${inEventInfo.seats_available} von ${inEventInfo.venue_config_capacity[0]}`;
}
export function createDialog(): void {
const iframeHTML: string = "<iframe id='iframeSeatmap' scrolling='no' frameborder='0' marginwidth='0' marginheight='0' allowfullscreen width='100%' />";
const src: string = Utils.getConfigValue("seatmap");
Utils.consoleLog(src);
jQuery("#dialogSeatmap").append(
jQuery(iframeHTML)
.attr("src", src))
.dialog({
modal: true,
autoOpen: false,
closeOnEscape: true,
draggable: false,
hide: true,
show: true,
resizable: false,
title: "",
width: "100%",
height: "auto",
close: () => jQuery("html, body").css("overflow", "auto"),
});
Events.addOpenSeatmap();
}
export function destroyCurrentSeatmap(inSelector: string): void {
if (config.state.panzoom)
Panzoom.unbindPanzoomEvents(inSelector);
jQuery("#containerSeatmapInner").remove();
jQuery("#htmlSeatmapInner .fl-html").removeAttr("style");
jQuery("#htmlSeatmapInner .fl-html").append('<div id="containerSeatmapInner"></div>');
jQuery("#JSCLegendInner").remove();
jQuery("#JSCLegend .fl-html").append('<div id="JSCLegendInner"></div>');
}
export function controlLoftloader(inSwitch: string) {
if (inSwitch === "show")
jQuery("body").removeClass("loaded loftloader-loaded");
else if (inSwitch === "hide")
jQuery("body").addClass("loaded loftloader-loaded");
}
export function changeVenueImage(): void {
const inputsWithValue: I.InputsWithValue = config.state.inputsWithValue!;
if (inputsWithValue.venueImageSrc !== undefined)
jQuery("#venueImage img").attr("src", inputsWithValue.venueImageSrc);
}
export function fadeInCartModal(): void {
jQuery("#modalCart-overlay").fadeIn(300);
Communication.sendEventToParent("child_hide_dialog_titlebar");
}
export function generatePricescaleCSS(): string {
const venueXML: I.VenueXML = config.state.inVenueXML!;
const venuePricescalesArr: I.Pricescale2[] = venueXML.venue[0].pricescales[0].pricescale;
return venuePricescalesArr.map((arr, i) => {
const ID: string = arr.id[0];
const color: string = arr.color[0];
// Update: Colors are always defined: fallback colors exist in system so every XML provides them
// Update 2: Above is not true, since old PVO versions does NOT have default/fallback colors
const colorCSS:string = color ? `#${color} !important` : `${config.fallbackColors[i]} !important`;
return `._${ID} { background-color: ${colorCSS}; }`;
}).join("\r\n");
}
export function adjustUIToLoading(): void {
CartButtons.showHideBtnCartLoading("show");
jQuery("#modalCart i").hide();
jQuery("#modalCart .uabb-button-text").addClass("dot-pulse");
}
export function appendVersion(): void {
jQuery("#bottomHTMLVersion")[0].innerText = config.version;
jQuery("#bottomHTMLBranch")[0].innerText = `(${config.branch})`;
}