import jBox from "jbox";
import { config } from "./config";
import * as XMLHelper from "./xmlhelper";
import Utils from "./utils";

export function showJBoxNotice(inContent: string, inAutoClose: number | boolean | undefined = 5000): void {
    new jBox<"Notice"> ('Notice', {
        position: { x: 'center', y: 'top' },
        offset: { x: 0, y: 320 },
        content: inContent,
        autoClose: inAutoClose,
        animation: { open: "zoomIn", close: "zoomOut" },
        closeOnEsc: false,
        closeButton: true,
        closeOnMouseleave: false,
        closeOnClick: false,
        draggable: false,
        color: "red",
        stack: true,
        showCountdown: true,
        reposition: true,
        responsiveWidth: true,
        responsiveHeight: true,
    });
}

export function createSeatTooltips(): void {
    new jBox<"Tooltip"> ("Tooltip", {
        attach: jQuery(".seatCharts-seat"),
        onOpen: function (this: any) {
            showSeatTooltip(this);
        },
    });
}

function showSeatTooltip(jBox: any): void {
    const seatID: string = jBox.source[0].id;
    const seat: string = config.state.layoutRows[seatID][5];
    const row: string = config.state.layoutRows[seatID][4];
    const sectionID: string = config.state.layoutRows[seatID][3];
    const sectionDesc: string | undefined = Utils.encodeCP850DecodeUTF8( XMLHelper.getSectionDescBySectionID(sectionID)! );
    const tooltipContent: string = `${sectionDesc}<br/>Reihe ${row} Platz ${seat}`;

    jBox.setContent(tooltipContent);
}