// var ospFormsPageHash = '42e5373cc524f2ebe558749ab23c7775';
// var now = new Date();
// var ttl = now.getTime() + (1000 * 60 * 60 * 24 * 14);
// var formsData = {};
// formsData [ospFormsPageHash] = {
//     '62025d057c005b10fb682751': {
//         enable: true,
//         expire: ttl
//     },
//     '622b55a46402057d1ff60865': {
//         enable: true,
//         expire: ttl
//     }
// };
// localStorage.setItem('osp_forms__list', JSON.stringify({ value: formsData, expire: null }))
let docLoadWaiter = setInterval(function () {
    // if (document.readyState === 'complete') {
    if (document.readyState !== 'loading') { // interactive or complete
        clearInterval(docLoadWaiter)
        fetchFormsForPage().then(async response => {
            const formsInfo = await response.json();
            processFormsList(formsInfo);
        });
    } else {
        console.log('wait until state become at least interactive')
    }
}, 1000)


function processFormsList (formsInfo) {
    // console.log(formsInfo);
    const pageHash = formsInfo.pageHash || null;
    const formsList = formsInfo.forms || [];
    if (!pageHash || formsList.length === 0) {
        return
    }

    // let LSData = localStorage.getItem('osp_forms__list');
    // if (!LSData) {
    //     LSData = { value: {}, expire: null };
    // } else {
    //     LSData = JSON.parse(LSData);
    // }

    let LSData = readLS();

    let pageLSData = LSData.value[pageHash] || {}
    pageLSData = cleanExpiredForms(pageLSData);
    let embeddedFormsList = [];
    for (let k in formsList) {
        let formData = formsList[k];
        if (formData.type === 'popup') {
            if (!pageLSData[formData.id]) {
                pageLSData[formData.id] = buildInitialFormObj(formData, LSData);
            }
        } else if (formData.type === 'embedded') {
            embeddedFormsList.push({formId: formData.id, elemId: '#' + formData.elemId})
        }
    }

    if (Object.keys(pageLSData).length > 0) {
        LSData.value[pageHash] = pageLSData;
    }

    localStorage.setItem('osp_forms__list', JSON.stringify(LSData));
    let formsToShowExists = false;
    let embeddedFormsExists = embeddedFormsList.length > 0;

    for (let k in pageLSData) {
        if (pageLSData[k].enable) {
            formsToShowExists = true;
            break;
        }
    }

    if (embeddedFormsExists) {
        // create global var
        ospEmbeddedformsMap = embeddedFormsList;
    }

    if (formsToShowExists || embeddedFormsExists) {
        // create global var
        ospFormsPageHash = pageHash;
        injectAppCode();
    }
}

function cleanExpiredForms (pageFormsData) {
    const now = new Date().getTime();
    for (let k in pageFormsData) {
        if (pageFormsData[k].expire < now) {
            delete (pageFormsData[k]);
        }
    }
    return pageFormsData;
}

function buildInitialFormObj (formData, LSdata) {
    const fShowMode = formData.showMode || null;

    // formData.LS_LifeTimeHours keeps local storage lifetime in hours
    const expire = new Date().getTime() + 1000 * 60 * 60 * formData.LS_LifeTimeHours;
    const initialObj = { enable: true, expire: expire };

    if (fShowMode === 'always') {
        return initialObj;
    }
    const fId = formData.id || null;
    const pagesForms = Object.values(LSdata.value);
    for (let k in pagesForms) {
        let formsForPage = pagesForms[k] || {};
        // if customer has already closed this form in past at any page, then let him alone
        if (formsForPage[fId] && formsForPage[fId].enable === false) {
            initialObj.enable = false;
            initialObj.expire = formsForPage[fId].expire || expire
            return initialObj;
        }
    }
    return initialObj;
}

async function fetchFormsForPage() {
    // const url = location.host.indexOf('.ru') !== -1 ? 'https://forms.opensystems.ru/api/form/for-page' : 'http://forms.loc/api/form/for-page';
    const url = 'https://forms.opensystems.ru/api/form/for-page';
    const data = {
        site: location.hostname,
        page: location.pathname
    };
    try {
        const requestOptions = {
            method: 'post',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
            },
            // mode: 'no-cors',
            body: new URLSearchParams(data)
        };
        return await fetch(url, requestOptions);
    } catch (e) {
        console.log(e.toString());
        return []
    }
}

function injectAppCode() {
    // ospFormsPageHash = '42e5373cc524f2ebe558749ab23c7775';

    // const baseUrl = location.host.indexOf('.ru') !== -1 ? 'https://forms.opensystems.ru/app/' : 'http://forms.loc/app/';
    const baseUrl = 'https://forms.opensystems.ru/app/';
    const linksToHead =[
        {
            // href: 'https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900',
            href: baseUrl + 'css/font/roboto.css',
            rel: 'stylesheet',
            as: null
        },
        {
            // href: 'https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css',
            href: baseUrl + 'css/mdi/css/materialdesignicons.min.css',
            rel: 'stylesheet',
            as: null
        },
        {
            href: baseUrl +  'css/app.ospforms.css',
            rel: 'preload',
            as: 'style'
        },
        {
            href: baseUrl +  'css/chunk-vendors.ospforms.css',
            rel: 'preload',
            as: 'style'
        },
        {
            href: baseUrl +  'js/app.ospforms.js',
            rel: 'preload',
            as: 'script'
        },

        {
            href: baseUrl +  'js/chunk-vendors.ospforms.js',
            rel: 'preload',
            as: 'script'
        },
        {
            href: baseUrl +  'css/chunk-vendors.ospforms.css',
            rel: 'stylesheet',
            as: null
        },
        {
            href: baseUrl +  'css/app.ospforms.css',
            rel: 'stylesheet',
            as: null
        },
    ];
    const scriptsToBody = [
        // { src: 'http://forms.loc/test.js' },
        { src: baseUrl + 'js/chunk-vendors.ospforms.js' },
        { src: baseUrl + 'js/app.ospforms.js' },
    ];
    for (let k in linksToHead) {
        let link = document.createElement('link',);
        link.href = linksToHead[k].href;
        link.rel = linksToHead[k].rel;
        if (linksToHead[k].as) {
            link.as = linksToHead[k].as
        }
        document.head.appendChild(link);
    }
    const idString = 'opensystemsFormsContainer';
    // const existsCont = document.querySelector('#' + idString);
    // if (existsCont !== null) {
    //     existsCont.remove();
    // }
    const appContainerDiv = document.createElement('div');
    appContainerDiv.id = idString;
    // appContainerDiv.prepend(document.body)
    document.body.appendChild(appContainerDiv);

    const vendorsScript = document.createElement('script');
    vendorsScript.onload = function () {
        console.log(scriptsToBody);
        const appScript = document.createElement('script');
        document.body.appendChild(appScript);
        appScript.src = scriptsToBody[1].src;
    }
    document.body.appendChild(vendorsScript);
    vendorsScript.src = scriptsToBody[0].src;
}
function readLS(){
    let LSData = localStorage.getItem('osp_forms__list');
    if (!LSData) {
        LSData = { value: {}, expire: null };
    } else {
        LSData = JSON.parse(LSData);
    }
    const now = new Date().getTime();
    let v = LSData.value;
    const pagesList = Object.keys(v);
    for (let pKey in pagesList) {
        let pageHash = pagesList[pKey];
        let formsList = Object.keys(v[pageHash]);
        for (let fKey in formsList) {
            let formHash = formsList[fKey];
            let formData = LSData['value'][pageHash][formHash];
            if (formData.expire && (now > formData.expire)) {
                delete (LSData['value'][pageHash][formHash]);
                if (Object.keys(LSData['value'][pageHash]).length === 0) {
                    delete (LSData['value'][pageHash]);
                }
            }
        }
    }
    if (!LSData.value) {
        LSData = { value: {}, expire: null };
    }
    return LSData;
}