import {getSelect, getForm} from "./selectors";

let initialized = false;
let formEl: HTMLFormElement;
let dateEl: HTMLSelectElement;
let capacityEl: HTMLSelectElement;
let searchTimeout: number | undefined;

export function initSessionsPage() {
    if (!initialized) {
        if (document.readyState === 'loading') {
            document.addEventListener('DOMContentLoaded', setup);
        } else {
            setup();
        }

        initialized = true;
    }
}

function setup() {
    formEl = getForm('search-sessions');
    dateEl = getSelect('date');
    capacityEl = getSelect('capacity');

    dateEl.addEventListener('change', searchSessions);
    capacityEl.addEventListener('change', searchSessions);
    addPrintEventListener();
}

function searchSessions() {
    if (searchTimeout) {
        clearTimeout(searchTimeout);
    }

    searchTimeout = window.setTimeout(() => {
        formEl.submit();
    }, 0);
}

function addPrintEventListener() {
    const buttonCollection = document.getElementsByClassName('print-button') as HTMLCollectionOf<HTMLButtonElement>;
    if (buttonCollection) {
        const buttons: HTMLButtonElement[] = Array.from(buttonCollection);
        buttons.forEach(button => {
            const url = button.dataset.listsUrl;
            button.addEventListener('click', () => printSessionBlockLists(url));
        });
    }
}

function printSessionBlockLists(url: string) {
    const printWindow = window.open(url, 'PrintWindow', windowFeatures());
    printWindow.document.close();
    printWindow.onafterprint = () => printWindow.close();
    printWindow.onload = () => printWindow.print();
}

function windowFeatures() {
    return `width=${screen.availWidth},` +
        `height=${screen.availHeight},` +
        'top=0,' +
        'left=0,' +
        'toolbars=no,' +
        'scrollbars=auto,' +
        'status=no,' +
        'resizable=no,' +
        'fullscreen=yes';
}