const thynkconsent = {
    vars: {
        dismissed: false,
        lifetime: 2592000,
        localStorageName: 'thynkconsent-dismissed',
        dataprotectionurl: 'https://www.hebamme-simone-röttgers.de/datenschutz.html',
        language: 'de-DE'
    },
    selectors: {
        modalTable: 'thynk-consent-table',
        hint: 'thynk-consent-hint'
    },
    functions: {
        init: function() {
            let dismissed = localStorage.getItem(thynkconsent.vars.localStorageName);
            if (dismissed !== null) {
                let now = thynkconsent.functions.getTime();
                let difference = parseInt(now) - parseInt(dismissed);
                if (difference > thynkconsent.vars.lifetime) {
                    localStorage.removeItem(thynkconsent.vars.localStorageName);
                } else {
                    thynkconsent.vars.dismissed = true;
                }
            }

            let oldButton = document.querySelector('a[href="#CCM.openControlPanel"]');
            if (oldButton) {
                oldButton.setAttribute('href', '#');
                oldButton.setAttribute('onclick', 'thynkconsent.functions.showTMCModal(); return false;');
            }

            console.log('-- IFrame Blocker Development --');

            console.log('-- Collecting all iframes --');
            let iframes = document.querySelectorAll('iframe');

            console.log('-- Load given consents --');
            thynkconsent.functions.consents.loadConsents();

            console.log('-- Loop through iframes --');
            iframes.forEach(thynkconsent.functions.iframes.replaceOriginalSource);

            console.log('-- Adding Message Eventlistener to top window --');
            window.addEventListener("message", thynkconsent.functions.listenToIframeConsentMessage);
        },
        consents: {
            loadConsents: function () {
                let consents = sessionStorage.getItem('iframe-consents');
                if (consents === null) {
                    consents = [];
                } else {
                    consents = JSON.parse(consents);
                }
                thynkconsent.vars.givenConsents = consents;
            },
            addConsent: function (host) {
                thynkconsent.vars.givenConsents.push(host);
                sessionStorage.setItem('iframe-consents', JSON.stringify(thynkconsent.vars.givenConsents));
            },
        },
        dismiss: function() {
            localStorage.setItem(thynkconsent.vars.localStorageName, thynkconsent.functions.getTime());
            document.querySelector('#' + thynkconsent.selectors.hint).style.display = 'none';
        },
        translate: function (key) {
            return thynkconsent.language['app'][key] ?? key;
        },
        getTime: function() {
            return Math.floor(Date.now() / 1000);
        },
        showTMCModal: function() {
            let modal = document.querySelector('#' + thynkconsent.selectors.modalTable);
            modal.style.display = 'flex';
        },
        hideTMCModal: function() {
            let modal = document.querySelector('#' + thynkconsent.selectors.modalTable);
            modal.style.display = 'none';
        },
        listenToIframeConsentMessage: function (event) {
            let host = event.data;

            let run = false;

            try {
                let t = JSON.parse(host);
            } catch (e) {
                run = true;
            }

            if (!run) {
                return;
            }

            console.log('-- Collecting all iframes with host ' + host);
            let iframes = document.querySelectorAll('iframe[data-host="' + host + '"]');

            console.log('-- Add consent to session list --');
            thynkconsent.functions.consents.addConsent(host);

            console.log('-- Loop through iframes --');
            iframes.forEach(thynkconsent.functions.iframes.restoreOriginalSource);
        },
        iframes: {
            replaceOriginalSource: function (iframe, index) {

                console.log('-- Process iframe no. ' + (index + 1) + ' --');

                let src = iframe.getAttribute('src');
                let url = new URL(src);
                let host = url.host;

                if (thynkconsent.vars.givenConsents.includes(host)) {
                    console.log('-- Consent for ' + host + ' already given, no need to block. --');
                    return;
                }

                console.log('-- Source: ' + src + ' --');
                console.log('-- Host: ' + host + ' --');

                iframe.setAttribute('src', "https://keks.thynk.media/content-blocked/" + thynkconsent.vars.language + "?src=" + encodeURIComponent(src));
                iframe.setAttribute('data-src', src);
                iframe.setAttribute('data-host', host);
            },
            restoreOriginalSource: function (iframe) {
                console.log('-- Restore original source --');
                let originalSrc = iframe.getAttribute('data-src');
                console.log(originalSrc)
                iframe.setAttribute('src', originalSrc);
            },
        }
    },
    language: JSON.parse('{"app":{"general_cookie_text":"Diese Webseite nutzt ausschlie\u00dflich technische Cookies. Weitere Informationen finden Sie in der","general_cookie_dataprotection":"Datenschutzerkl\u00e4rung","general_cookie_show_table":"Liste aller Cookies anzeigen","general_cookie_heading_table":"Liste der Cookies","general_cookie_ok":"Verstanden","general_cookie_embedding_company":"Herausgeber","general_cookie_embedding_description":"Beschreibung","general_cookie_embedding_dataprotection":"Link zur Datenschutzerkl\u00e4rung","general_cookie_embedding_datacollection":"Welche Daten werden erhoben?","general_cookie_embedding_cookies":"Cookies","general_cookie_embedding_datacollectionpurpose":"Zweck der Datenerhebung","general_cookie_embedding_legalbase":"Rechtliche Grundlage","general_cookie_embedding_placeofagreement":"Ort der Verarbeitung","general_cookie_cookie_name":"Name","general_cookie_cookie_lifetime":"Lebensdauer","general_cookie_cookie_desc":"Beschreibung"},"cookies":{"session":{"integrationname":"Session-Cookie","company":"Simone R\u00f6ttgers","description":"Dieser Cookie ist f\u00fcr eine fehlerfreie Funktionalit\u00e4t unserer Webseite erforderlich und kann nicht deaktiviert werden.","datacollection":"Loginstatus, Sprache und Formulardaten werden zur Laufzeit im Browser gespeichert. Mit Schlie\u00dfen des Browserfensters verfallen diese Daten.","datacollectionpurpose":"Verwaltung von Loginstatus, Sprache und Formulardaten.","legalbase":"Berechtigtes Interesse, Art. 6 Abs.1 lit. f i.V.m. Art. 7 Abs.1 DSGVO","placeprivacyagreement":"Simone R\u00f6ttgers, Klosterstr. 4, 49832 Thuine","dataprotectionlink":"https:\/\/www.hebamme-simone-r\u00f6ttgers.de\/datenschutz.html","cookies":[{"name":"Sitzungscookie","lifetime":"Session","desc":"Erm\u00f6glicht die Grundfunktion der Webseite."}]}}}'),
    cookies: JSON.parse('[{"key":"session"}]'),
    templates: {
        css: function() {
            return `
                <style>
                    .tmc-hidden {
                        display: none !important;
                    }
                    .tmc-button {
                        background-color: #fff;
                        color: #000;
                        border-radius: 3px;
                        padding: 10px 20px;
                        font-size: 14px;
                        font-weight: 700;
                        text-transform: uppercase;
                        cursor: pointer;
                        border: 1px solid #fff;
                    }
                    .tmc-button:hover {
                        background-color: #000;
                        color: #fff;
                        border: 1px solid #fff;
                    }
                    .tmc-modal {
                        z-index: 9999;
                        position: fixed;
                        top: 0;
                        left: 0;
                        width: 100%;
                        height: 100%;
                        overflow: auto;
                        background-color: rgba(0,0,0,0.4);
                        align-items: center;
                        justify-content: center;
                        padding: 20px;
                        box-sizing: border-box;
                        display: none;
                    }
                    .tmc-modal *:not(a) {
                        color: #000;
                    }
                    .tmc-modal-dialog {
                        position: relative;
                        max-width: 600px;
                        width: 100%;
                        background-color: #fff;
                        border-radius: 5px;
                        box-shadow: 0 0 10px rgba(0,0,0,0.2);
                        padding: 30px;
                        box-sizing: border-box;
                        max-height: 90%;
                        overflow: scroll;
                         -ms-overflow-style: none;  /* IE and Edge */
                        scrollbar-width: none;  /* Firefox */
                    }
                    .tmc-modal-dialog::-webkit-scrollbar {
                        display: none;
                    }
                    @media (max-width: 600px) {
                        .tmc-modal-dialog {
                            padding: 20px;
                        }
                    }
                    .tmc-modal-title {
                        font-size: 30px;
                        font-weight: 700;
                        text-transform: uppercase;
                        margin-top: 0;
                        font-family: "Open Sans";
                    }
                    @media (max-width: 600px) {
                        .tmc-modal-title{
                            font-size: 20px !important;
                            max-width: 80%;
                        }
                    }
                    .tmc-accordion{
                        list-style: none !important;
                        padding: 0 !important;
                        width: 100%;
                        margin: 0;
                    }
                    .tmc-accordion-title{
                        cursor: pointer;
                        background-color: #eee;
                        padding: 10px 40px 10px 15px;
                        display: block;
                        box-sizing: border-box;
                        font-size: 17px;
                        position: relative;
                    }
                    @media (max-width: 600px) {
                        .tmc-accordion-title{
                            font-size: 15px !important;
                        }
                    }
                    .tmc-accordion-title:hover{
                        background-color: #ddd;
                    }
                    .tmc-accordion-title:after{
                        content: '';
                        height: 20px;
                        width: 20px;
                        background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjQyNi42NjY2N3B0IiB2aWV3Qm94PSIwIDAgNDI2LjY2NjY3IDQyNi42NjY2NyIgd2lkdGg9IjQyNi42NjY2N3B0IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Im00MDUuMzMyMDMxIDE5MmgtMTcwLjY2NDA2MnYtMTcwLjY2Nzk2OWMwLTExLjc3MzQzNy05LjU1ODU5NC0yMS4zMzIwMzEtMjEuMzM1OTM4LTIxLjMzMjAzMS0xMS43NzM0MzcgMC0yMS4zMzIwMzEgOS41NTg1OTQtMjEuMzMyMDMxIDIxLjMzMjAzMXYxNzAuNjY3OTY5aC0xNzAuNjY3OTY5Yy0xMS43NzM0MzcgMC0yMS4zMzIwMzEgOS41NTg1OTQtMjEuMzMyMDMxIDIxLjMzMjAzMSAwIDExLjc3NzM0NCA5LjU1ODU5NCAyMS4zMzU5MzggMjEuMzMyMDMxIDIxLjMzNTkzOGgxNzAuNjY3OTY5djE3MC42NjQwNjJjMCAxMS43NzczNDQgOS41NTg1OTQgMjEuMzM1OTM4IDIxLjMzMjAzMSAyMS4zMzU5MzggMTEuNzc3MzQ0IDAgMjEuMzM1OTM4LTkuNTU4NTk0IDIxLjMzNTkzOC0yMS4zMzU5Mzh2LTE3MC42NjQwNjJoMTcwLjY2NDA2MmMxMS43NzczNDQgMCAyMS4zMzU5MzgtOS41NTg1OTQgMjEuMzM1OTM4LTIxLjMzNTkzOCAwLTExLjc3MzQzNy05LjU1ODU5NC0yMS4zMzIwMzEtMjEuMzM1OTM4LTIxLjMzMjAzMXptMCAwIi8+PC9zdmc+);
                        background-position: center;
                        background-size: cover;
                        position: absolute;
                        right: 10px;
                        top: 50%;
                        transform: translateY(-50%);
                        font-size: 50px;
                        line-height: 0;
                    }
                    .tmc-accordion-content{
                        max-height: 0;
                        overflow: auto;
                        transition: all 0.4s ease;
                        background: #f8f8f8;
                    }
                     .tmc-accordion-content h3 {
                        font-family: "Open Sans";
                        font-size: 24px;
                    }
                    .tmc-accordion-content a{
                        color: #555;
                        text-decoration: underline;
                    }
                    .tmc-checkbox:checked ~ .tmc-accordion-content{
                        max-height: 50vh;
                        padding: 15px;
                        box-sizing: border-box;
                    } 
                    .tmc-checkbox:checked ~ .tmc-accordion-title:after{
                        background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE2LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgd2lkdGg9IjEyMS44MDVweCIgaGVpZ2h0PSIxMjEuODA0cHgiIHZpZXdCb3g9IjAgMCAxMjEuODA1IDEyMS44MDQiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDEyMS44MDUgMTIxLjgwNDsiDQoJIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPGc+DQoJCTxwYXRoIGQ9Ik03LjMwOCw2OC4yMTFoMTA3LjE4OGM0LjAzNywwLDcuMzA5LTMuMjcyLDcuMzA5LTcuMzFjMC00LjAzNy0zLjI3MS03LjMwOS03LjMwOS03LjMwOUg3LjMwOA0KCQkJQzMuMjcyLDUzLjU5MywwLDU2Ljg2NSwwLDYwLjkwMkMwLDY0LjkzOSwzLjI3Miw2OC4yMTEsNy4zMDgsNjguMjExeiIvPg0KCTwvZz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjwvc3ZnPg0K")
                    }
                    .tmc-close {
                        position: absolute;
                        top: 10px;
                        right: 10px;
                        cursor: pointer;
                        background-color: #000;
                        padding: 10px;
                        border-radius: 7px;
                        line-height: 0;
                        border: 2px solid #fff;
                    }
                    .tmc-close img {
                        width: 15px;
                        height: 15px;
                        filter: invert(1);
                    }
                    .tmc-close:hover {
                        background-color: #fff;
                        border: 2px solid #000;
                    }
                    .tmc-close:hover img {
                        filter: invert(0);
                    }
                    #thynk-consent-hint {
                        background-color: #000;
                        color: #fff;
                        padding: 20px;
                        text-align: center;
                        border-top: 1px solid #fff5;
                        font-size: 17px;
                        box-sizing: border-box;
                        z-index: 2;
                    }
                    #thynk-consent-hint .tmc-button {
                        margin: 0 5px;
                    }
                    @media (max-width: 600px) {
                        #thynk-consent-hint .tmc-button {
                            margin-bottom: 10px;
                        }
                    }
                    #thynk-consent-hint a {
                        color: #FFF;
                        text-decoration: underline;
                    }
                    .tmc-table, .tmc-table td, .tmc-table th {
                        border: 1px solid;
                        padding: 10px;
                    }
                    .tmc-table {
                        width: 100%;
                        border-collapse: collapse;
                        overflow-x: auto;
                    }
                </style>
            `;
        },
        hint: function() {
            return `
                <div id="${thynkconsent.selectors.hint}" class="tmc-section tmc-section-primary tmc-flex tmc-flex-center tmc-flex-middle" 
                    style="${(thynkconsent.vars.dismissed) ? 'display:none' : ''};width: 100vw; position: fixed; bottom: 0; left: 0;">
                    <p class="tmc-margin-remove-bottom tmc-margin-right">
                        ${thynkconsent.functions.translate('general_cookie_text')}
                        <a href="${thynkconsent.vars.dataprotectionurl}">${thynkconsent.functions.translate('general_cookie_dataprotection')}</a>
                    </p>
                    <button onclick="thynkconsent.functions.showTMCModal()" class="tmc-button tmc-margin-right">${thynkconsent.functions.translate('general_cookie_show_table')}</button>
                    <button onclick="thynkconsent.functions.dismiss()" class="tmc-button">${thynkconsent.functions.translate('general_cookie_ok')}</button>
                </div>
            `;
        },
        modal: function() {
            return `
                <div id="${thynkconsent.selectors.modalTable}" class="tmc-flex-top tmc-modal">
                    <div class="tmc-modal-dialog tmc-modal-body tmc-margin-auto-vertical">
                        <button onclick="thynkconsent.functions.hideTMCModal()" class="tmc-modal-close-default tmc-close" type="button" ><img alt="" src="data:image/svg+xml;base64,PHN2ZyBpZD0iQ2FwYV8xIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAzMjAuNTkxIDMyMC41OTEiIGhlaWdodD0iNTEyIiB2aWV3Qm94PSIwIDAgMzIwLjU5MSAzMjAuNTkxIiB3aWR0aD0iNTEyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnPjxnIGlkPSJjbG9zZV8xXyI+PHBhdGggZD0ibTMwLjM5MSAzMTguNTgzYy03Ljg2LjQ1Ny0xNS41OS0yLjE1Ni0yMS41Ni03LjI4OC0xMS43NzQtMTEuODQ0LTExLjc3NC0zMC45NzMgMC00Mi44MTdsMjU3LjgxMi0yNTcuODEzYzEyLjI0Ni0xMS40NTkgMzEuNDYyLTEwLjgyMiA0Mi45MjEgMS40MjQgMTAuMzYyIDExLjA3NCAxMC45NjYgMjguMDk1IDEuNDE0IDM5Ljg3NWwtMjU5LjMzMSAyNTkuMzMxYy01Ljg5MyA1LjA1OC0xMy40OTkgNy42NjYtMjEuMjU2IDcuMjg4eiIvPjxwYXRoIGQ9Im0yODcuOSAzMTguNTgzYy03Ljk2Ni0uMDM0LTE1LjYwMS0zLjE5Ni0yMS4yNTctOC44MDZsLTI1Ny44MTMtMjU3LjgxNGMtMTAuOTA4LTEyLjczOC05LjQyNS0zMS45MDggMy4zMTMtNDIuODE3IDExLjM2OS05LjczNiAyOC4xMzYtOS43MzYgMzkuNTA0IDBsMjU5LjMzMSAyNTcuODEzYzEyLjI0MyAxMS40NjIgMTIuODc2IDMwLjY3OSAxLjQxNCA0Mi45MjItLjQ1Ni40ODctLjkyNy45NTgtMS40MTQgMS40MTQtNi4zNSA1LjUyMi0xNC43MDcgOC4xNjEtMjMuMDc4IDcuMjg4eiIvPjwvZz48L2c+PC9zdmc+" /></button>
                        <h2 class="tmc-modal-title">${thynkconsent.functions.translate('general_cookie_heading_table')}</h2>
                        <ul class="tmc-accordion">
                            ${thynkconsent.cookies.map((cookie, idx) => {
                                return `
                                   <li>
                                        <input type="checkbox" class="tmc-hidden tmc-checkbox" id="chck${idx}">
                                        <label for="chck${idx}" class="tmc-accordion-title">${thynkconsent.language['cookies'][cookie.key].integrationname}</label>
                                        <div class="tmc-accordion-content">
                                            <h3>${thynkconsent.language['cookies'][cookie.key].integrationname}</h3>
                                            <p>
                                                <strong>${thynkconsent.functions.translate('general_cookie_embedding_company')}</strong><br>
                                                ${thynkconsent.language['cookies'][cookie.key].company}
                                            </p>
                                            <p>
                                                <strong>${thynkconsent.functions.translate('general_cookie_embedding_description')}</strong><br>
                                                ${thynkconsent.language['cookies'][cookie.key].description}
                                            </p>
                                            <p>
                                                <strong>${thynkconsent.functions.translate('general_cookie_embedding_dataprotection')}</strong><br>
                                                <a href="${thynkconsent.language['cookies'][cookie.key].dataprotectionlink}" target="_blank">
                                                    ${thynkconsent.language['cookies'][cookie.key].dataprotectionlink}
                                                </a>
                                            </p>
                                            <p>
                                                <strong>${thynkconsent.functions.translate('general_cookie_embedding_datacollection')}</strong><br>
                                                ${thynkconsent.language['cookies'][cookie.key].datacollection}
                                            </p>
                                            <p>
                                                <strong>${thynkconsent.functions.translate('general_cookie_embedding_datacollectionpurpose')}</strong><br>
                                               ${thynkconsent.language['cookies'][cookie.key].datacollectionpurpose}
                                            </p>
                                            <p>
                                                <strong>${thynkconsent.functions.translate('general_cookie_embedding_cookies')}</strong>
                                                <table class="tmc-table tmc-table-divider">
                                                    <thead>
                                                        <tr>
                                                            <th>${thynkconsent.functions.translate('general_cookie_cookie_name')}</th>
                                                            <th>${thynkconsent.functions.translate('general_cookie_cookie_lifetime')}</th>
                                                            <th>${thynkconsent.functions.translate('general_cookie_cookie_desc')}</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        ${thynkconsent.language['cookies'][cookie.key].cookies.map((sub_cookie) => {
                                                            return `
                                                                <tr>
                                                                    <td>${sub_cookie.name}</td>
                                                                    <td>${sub_cookie.lifetime}</td>
                                                                    <td>${sub_cookie.desc}</td>
                                                                </tr>
                                                            `;
                                                            }).join('')}
                                                    </tbody>
                                                </table>
                                            </p>
                                            <p>
                                                <strong>${thynkconsent.functions.translate('general_cookie_embedding_legalbase')}</strong><br>
                                                ${thynkconsent.language['cookies'][cookie.key].legalbase}
                                            </p>
                                            <p>
                                                <strong>${thynkconsent.functions.translate('general_cookie_embedding_placeofagreement')}</strong><br>
                                                ${thynkconsent.language['cookies'][cookie.key].placeprivacyagreement}
                                            </p>
                                    </li>
                                `;
                                }).join('')}
                        </ul>
                    </div>
                </div>
            `;
        }
    }
};

document.addEventListener('DOMContentLoaded', function() {
    thynkconsent.functions.init();
    let elm = document.createElement('div');
    elm.innerHTML = `
    ${thynkconsent.templates.hint()}
    ${thynkconsent.templates.modal()}
    ${thynkconsent.templates.css()}
    `;
    document.body.appendChild(elm);
});