const ADMINISTRATOR = 'administrator';
const modalOfflineExternalID = '#modalOfflineExternal';
const serviceWorkerFileName = 'ngsw-worker.js';
const COContentManagerVariableForProjectDomain = "https://egu22.eu/";
const checkFileFilename = "sw-ignore.ping";

if ('serviceWorker' in navigator) {
    window.addEventListener('load', function () {
        if (window.location.host.indexOf(ADMINISTRATOR) !== -1) {
            return false;
        }
        if (window.location.host.indexOf('webforms') !== -1) {
            return false;
        }
        navigator.serviceWorker.register(COContentManagerVariableForProjectDomain + serviceWorkerFileName).then(function (registration) {
            // Registration was successful
            console.log('ServiceWorker registration successful with scope: ', registration.scope);
        }, function (err) {
            // registration failed :(
            console.log('ServiceWorker registration failed: ', err);
        });
    });
}

/**
 *
 * @type {COCheckOnlineOffline}
 */
COCheckOnlineOffline = class {
    /**
     *
     * @type {boolean}
     */
    showOfflineModalForExternalLinks = false;

    /**
     *
     * @param showOfflineModalForExternalLinks
     */
    constructor(showOfflineModalForExternalLinks) {
        this.showOfflineModalForExternalLinks = showOfflineModalForExternalLinks;

        this.setOnlineFlags();
        this.setOfflineFlags();

        this.addOnlineEventListener();
        this.addOfflineEventListener();

        this.addDOMContentLoaded();

        // setInterval(() => {
        //     this.checkOnlineOffline();
        // }, 5000);
    }

    /**
     *
     */
    addOfflineEventListener() {
        window.addEventListener('offline', () => {
            console.log('Web-site is offline');
            window.isOnline = false;
            window.isOffline = true;
            if (this.showOfflineModalForExternalLinks) {
                this.addModal();
                this.handleExternalLinks();
            }

            let offlineToHide = document.getElementsByClassName('hide-offline');
            if (offlineToHide.length > 0) {
                for (let i = 0; i < offlineToHide.length; i++) {
                    offlineToHide[i].classList.add('d-none');
                }
            }

            let onlineToHide = document.getElementsByClassName('hide-online');
            if (onlineToHide.length > 0) {
                for (let i = 0; i < onlineToHide.length; i++) {
                    onlineToHide[i].classList.remove('d-none');
                }
            }
        });
    }

    /**
     *
     */
    addOnlineEventListener() {
        window.addEventListener('online', () => {
            console.log('Web-site is online');
            window.isOnline = true;
            window.isOffline = false;
            let offlineToHide = document.getElementsByClassName('hide-offline');
            if (offlineToHide.length > 0) {
                for (let i = 0; i < offlineToHide.length; i++) {
                    offlineToHide[i].classList.remove('d-none');
                }
            }

            let onlineToHide = document.getElementsByClassName('hide-online');
            if (onlineToHide.length > 0) {
                for (let i = 0; i < onlineToHide.length; i++) {
                    onlineToHide[i].classList.add('d-none');
                }
            }
            this.hideMessages();
        });
    }

    /**
     *
     */
    setOnlineFlags() {
        window.isOnline = window.navigator.onLine;
    }

    /**
     *
     */
    setOfflineFlags() {
        window.isOffline = !window.navigator.onLine;
    }

    /**
     *
     */
    hideMessages() {
        $(modalOfflineExternalID).modal('hide');
    }

    /**
     *
     */
    addDOMContentLoaded() {
        document.addEventListener('DOMContentLoaded', e => {
            this.checkOnlineOffline();
            if (window.navigator.onLine) {
                window.dispatchEvent(new Event('online'));
            } else {
                window.dispatchEvent(new Event('offline'));
            }
        });
    }

    checkOnlineOffline() {
return true;
        $.ajax({
            type: 'GET',
            url: COContentManagerVariableForProjectDomain + "/" + checkFileFilename + "?" + new Date().getTime(),
            timeout: 1000,
            dataType: 'text',
            beforeSend: function () {
            },
            complete: function () {
            }
        }).done(function (data) {
            if (window.isOnline === false) {
                window.isOnline = true;
                window.isOffline = false;
                window.dispatchEvent(new Event('online'));
            }
        }).fail(function (response, textStatus) {
            if (window.isOffline === false) {
                window.isOnline = false;
                window.isOffline = true;
                window.dispatchEvent(new Event('offline'));
            }
        });
    }

    /**
     *
     */
    handleExternalLinks() {
        let links = document.querySelectorAll('a');
        if (links.length > 0) {
            for (let i = 0; i < links.length; i++) {
                let link = links[i];
                let href = link.href;
                links[i].addEventListener('click', (event) => {
                    if (href === '#' || href === '') {
                        return;
                    }

                    if (!window.isOnline) {
                        const hrefClean = href.replace('www.', '');
                        const windowHrefClean = window.location.hostname.replace('www.', '');
                        if (!hrefClean.includes(windowHrefClean)) {
                            event.preventDefault();
                            event.stopImmediatePropagation();
                            event.stopPropagation();
                            $(modalOfflineExternalID).modal('show');
                        }
                    }

                });
            }
        }
    }

    /**
     *
     */
    addModal() {
        let divModal = document.createElement('div');
        divModal.classList.add('modal');
        divModal.setAttribute('id', 'modalOfflineExternal');

        let divModalDialog = document.createElement('div');
        divModalDialog.classList.add('modal-dialog');

        let divModalContent = document.createElement('div');
        divModalContent.classList.add('modal-content');

        //Header
        let divHeader = document.createElement('div');
        divHeader.classList.add('modal-header');

        let headline = document.createElement('h3');
        headline.classList.add('modal-title');
        headline.innerText = 'You are offline';

        let buttonClose = document.createElement('button');
        buttonClose.classList.add('close');
        buttonClose.setAttribute('type', 'button');
        buttonClose.setAttribute('data-dismiss', 'modal');

        let closeIcon = document.createElement('span');
        closeIcon.innerHTML = '×';
        buttonClose.appendChild(closeIcon);
        divHeader.appendChild(headline);
        divHeader.appendChild(buttonClose);

        //Body
        let divBody = document.createElement('div');
        divBody.classList.add('modal-body');

        let text = document.createElement('p');
        text.innerHTML = 'You selected a page that requires an Internet connection. Please check your connectivity or try again later.';
        divBody.appendChild(text);

        //Footer
        let divFooter = document.createElement('div');
        divFooter.classList.add('modal-footer');

        let buttonCloseFooter = document.createElement('button');
        buttonCloseFooter.classList.add('btn');
        buttonCloseFooter.classList.add('btn-primary');
        buttonCloseFooter.setAttribute('type', 'button');
        buttonCloseFooter.setAttribute('data-dismiss', 'modal');
        buttonCloseFooter.innerText = 'OK';

        divFooter.appendChild(buttonCloseFooter);

        divModalContent.appendChild(divHeader);
        divModalContent.appendChild(divBody);
        divModalContent.appendChild(divFooter);

        divModalDialog.appendChild(divModalContent);

        divModal.appendChild(divModalDialog);

        document.body.appendChild(divModal);
    }
};


const coCheckOnlineOfflineInstance = new COCheckOnlineOffline(true);
