import {navAff as navAffSearchForm, utmParams as utmParamsSearch, eventID as eventIDSearch} from "globals";
import {geoCloudflareLocation as geoCloudflareLocationSearchForm} from "api";
import {__translate as __sw_translate} from "translate";

const SEARCH_FORM_VER = '1.0';

const searchFormFuncSearchForm = () => {
    const searchFormInput = document.querySelector(`.frontSearch__form #form_domain`);
    const searchFormBtn = document.querySelector(`.frontSearch__form #form_save`);

    const headerSearchFront = document.querySelector(`.frontSearch`);
    const headerSearchForm = document.querySelector(`.frontSearch__form form`);

    const primeBlock = document.querySelector(`.prime-bg`);

    const frontSearchBtnClose = document.querySelector(`.frontSearch__btn--close`);

    const frontSearchFormBtn = document.querySelector(`.frontSearch__form__btn`);

    const LOCALE_COUNTRY = document.querySelector(`body`).dataset.localeCountry.toLowerCase();
    const COUNTRY_NAME = (searchDropdownSearchForm.dataset.country === `Poland` || searchDropdownSearchForm.dataset.country === 'Polska') ? `Polsce` : searchDropdownSearchForm.dataset.country;

    const getLoc = async () => {
        let loc = document.body.dataset.geo;
        if (!loc) loc = await geoCloudflareLocationSearchForm();

        localStorage.setItem('geo', loc);

        return loc;
    }

    const getOffers = async (limit = 6) => {
        let displaySponsoredPosition = 'false';
        let sponsoredFrequency = 0;
        let sponsoredStartPosition = 0;
        let loc = await getLoc();

        headerSearchFront.dataset.sponsoredFrequency ? sponsoredFrequency = headerSearchFront.dataset.sponsoredFrequency : sponsoredFrequency;
        headerSearchFront.dataset.sponsoredStartPosition ? sponsoredStartPosition = headerSearchFront.dataset.sponsoredStartPosition : sponsoredStartPosition;
        headerSearchFront.dataset.sponsoredDisplay ? displaySponsoredPosition = headerSearchFront.dataset.sponsoredDisplay : displaySponsoredPosition;

        let searchFormPopular = localStorage.getItem('searchFormPopular');
        if (!searchFormPopular) {
            let endpointByOutputType = `/api/offers?country=${loc}&limit=${limit}&sort=true`;

            if (displaySponsoredPosition === 'true') {
                endpointByOutputType += `&sponsored=true`;

                if (sponsoredFrequency) {
                    endpointByOutputType += `&sponsored_frequency=${sponsoredFrequency}`
                }

                if (sponsoredStartPosition) {
                    endpointByOutputType += `&sponsored_start_position=${sponsoredStartPosition}`
                }
            }

            searchFormPopular = await fetch(endpointByOutputType, {mode: "cors"})
                .then(res => res.json())
                .then(data => {
                    localStorage.setItem('searchFormPopular', JSON.stringify(data));
                    return data;
                });
        } else {
            searchFormPopular = JSON.parse(localStorage.getItem('searchFormPopular'));
        }

        return searchFormPopular;
    }

    const getSlots = async (limit = 5) => {
        let loc = await getLoc();

        let searchFormSlots = localStorage.getItem('searchFormSlots_' + SEARCH_FORM_VER);

        if (!searchFormSlots) {

            localStorage.setItem('searchFormVer', SEARCH_FORM_VER);

            searchFormSlots = await fetch(`/api/slots?country=${loc}&limit=${limit}`, {mode: "cors"})
                .then(res => res.json())
                .then(data => data.map(item => {
                    return item;
                }))
                .then(data => {
                    localStorage.setItem('searchFormSlots_' + SEARCH_FORM_VER, JSON.stringify(data));
                    return data;
                })
        } else
            searchFormSlots = JSON.parse(localStorage.getItem('searchFormSlots_' + SEARCH_FORM_VER));

        return searchFormSlots;
    }

    const SEARCH_COUNT_ALL = 9;
    const SEARCH_COUNT = 5;

    const getSearch = async (value, type = `all`) => await fetch(`/search-hint?search=${value}&limit=${type === `all` ? SEARCH_COUNT_ALL : SEARCH_COUNT}&type=${type}`)
        .then(data => data.json());

    let renderedSearchDropdown = false;

    if (searchFormInput) {
        searchFormInput.setAttribute(`autocomplete`, `off`);

        searchFormInput.addEventListener(`click`, e => {
            e.stopPropagation();
        });

        searchFormInput.addEventListener(`focus`, e => {
            e.stopPropagation();
            showSearchDropdown();
        });

        let debounceTimer;
        let lastInputValue = '';

        searchFormInput.addEventListener(`input`, e => {
            e.stopPropagation();
            const inputValue = e.target.value;

            clearTimeout(debounceTimer);

            if (inputValue !== lastInputValue) {
                lastInputValue = inputValue;

                debounceTimer = setTimeout(() => {
                    renderSearchResult(inputValue).then(r => r);
                }, 1000);
            }
        });

        searchFormBtn.addEventListener(`click`, e => {
            e.stopPropagation();
            showSearchDropdown();

            let searchResult = document.querySelector(`.search__result--container .item`);
            searchResult && !headerSearchForm ? searchResult.click() : showSearchDropdown();
        });

        headerSearchForm && headerSearchForm.addEventListener(`submit`, e => {
            e.preventDefault();
            let searchResult = document.querySelector(`.search__result--container .item`);
            searchResult && searchResult.click();
        });

        searchDropdownSearchForm.addEventListener(`click`, e => {
            e.stopPropagation();
        });
    }

    document.body.addEventListener(`click`, () => {
        if (document.body.classList.contains(`searchDropdown`)) {
            document.body.classList.remove(`searchDropdown`);
        }
    })

    const renderSearchResult = async (value) => {
        if (value.length) {
            const searchContainer = document.querySelector(`.search__result--container`);

            let type = document.querySelector(`.search__btns--items button.active`).dataset.name;
            let result = await getSearch(value, type);

            searchContainer.innerHTML = ``;

            let casinos = result.filter(item => item.group === `casino`),
                bonuses = result.filter(item => item.group === `bonus`),
                slots = result.filter(item => item.group === `slot`);

            switch (type) {
                case `all`:
                    searchContainer.append(
                        casinos.length ? await renderSearchReviews(casinos, 3) : ``,
                        bonuses.length ? await renderSearchBonuses(bonuses, 3) : ``,
                        slots.length ? await renderSearchSlots(slots, 3) : ``);
                    break;
                case `casino`:
                    casinos.length && searchContainer.append(await renderSearchReviews(casinos, 5));
                    break;
                case `bonus`:
                    bonuses.length && searchContainer.append(await renderSearchBonuses(bonuses, 5));
                    break;
                case `slot`:
                    slots.length && searchContainer.append(await renderSearchSlots(slots, 5));
                    break;
            }
        }
    }

    frontSearchFormBtn && frontSearchFormBtn.addEventListener(`click`, e => {
        e.stopPropagation();

        let searchResult = document.querySelector(`.search__result--container .item`);
        searchResult ? searchResult.click() : showSearchDropdown();
    })

    frontSearchBtnClose && frontSearchBtnClose.addEventListener(`click`, e => {
        e.stopPropagation();
        headerSearchFront.classList.remove(`show`);
        frontSearchBtnClose.classList.remove(`active`);
        if (primeBlock) primeBlock.style.overflow = `hidden`;
    })

    document.body.addEventListener(`click`, e => {
        if (headerSearchFront && headerSearchFront.classList.contains(`show`)) {
            headerSearchFront.classList.remove(`show`);
            frontSearchBtnClose.classList.remove(`active`);
            if (primeBlock) primeBlock.style.overflow = `hidden`;
        }
    })

    const showSearchDropdown = () => {
        if (!renderedSearchDropdown) renderSearchDropdown();
        headerSearchFront.classList.add(`show`);
        frontSearchBtnClose.classList.add(`active`);
        if (primeBlock) primeBlock.style.overflow = `inherit`;
    }

    const renderSearchDropdown = async () => {
        renderedSearchDropdown = true;

        const popularContainer = renderSearchPopularContainer();
        popularContainer.append(await renderSearchPopular(), renderSearchNav());

        const scrollContainer = document.createElement(`div`);
        scrollContainer.className = `search__scroll--container`;
        scrollContainer.append(renderSearchContainer(), popularContainer);

        searchDropdownSearchForm.append(renderSearchBtns(), scrollContainer);
        handleSearchBtns();
    }

    const renderSearchContainer = () => {
        let div = document.createElement(`div`);
        div.className = `search__result--container`;
        return div;
    }

    const handleSearchBtns = () => {
        const btns = document.querySelectorAll(`.search__btns--items button`);
        const popularContainer = document.querySelector(`.search__popular--container`);
        btns.forEach(btn => {
            btn.addEventListener(`click`, async e => {
                e.stopPropagation();

                popularContainer.innerHTML = ``;
                document.querySelector(`.search__btns--items button.active`).classList.remove(`active`);
                btn.classList.add(`active`);

                switch (btn.dataset.name) {
                    case `all`:
                        popularContainer.append(await renderSearchPopular(), renderSearchNav());
                        break;
                    case `casino`:
                        popularContainer.append(await renderSearchPopularCasinos());
                        break;
                    case `bonus`:
                        popularContainer.append(await renderSearchPopularBonuses());
                        break;
                    case `slot`:
                        if (await renderSearchPopularSlots() !== null) {
                            popularContainer.append(await renderSearchPopular(), await renderSearchPopularSlots());
                        } else {
                            popularContainer.append(await renderSearchPopular());
                        }
                        break;
                }

                renderSearchResult(searchFormInput.value);
            })
        })
    }

    const renderSearchBtns = () => {
        const casinoPath = searchDropdownSearchForm.dataset.casino;
        const bonusPath = searchDropdownSearchForm.dataset.bonus;
        const slotPath = searchDropdownSearchForm.dataset.slot;

        const block = document.createElement(`div`);
        block.className = `search__btns`;
        block.innerHTML = `<div class="search__btns--items">
	      <button type="button" data-name="all" class="active">${__sw_translate("All", LOCALE_COUNTRY)}</button>
	      ${casinoPath && `<button type="button" data-name="casino">${__sw_translate("Casino Reviews", LOCALE_COUNTRY)}</button>`}
	      ${bonusPath && `<button type="button" data-name="bonus">${__sw_translate("Bonuses", LOCALE_COUNTRY)}</button>`}
	      ${slotPath && `<button type="button" data-name="slot">${__sw_translate("Slots", LOCALE_COUNTRY)}</button>`}
	  </div>`;

        return block;
    }

    const renderSearchNav = () => {
        const casinoPath = searchDropdownSearchForm.dataset.casino;
        const bonusPath = searchDropdownSearchForm.dataset.bonus;
        const slotPath = searchDropdownSearchForm.dataset.slot;

        const domainName = document.location.host
            .replace(`loc.`, ``)
            .replace(`dev.`, ``)
            .replace(`green.`, ``)
            .replace(`blue.`, ``);

        let data = [];

        if (domainName === `casinosanalyzer.com`) data.push({
            text: __sw_translate("Free spins no deposit", LOCALE_COUNTRY),
            path: `free-spins-no-deposit`
        });


        if (bonusPath) data.push({
            text: __sw_translate("Casino bonuses", LOCALE_COUNTRY),
            path: bonusPath
        });

        if (domainName === `casinosanalyzer.com`) data.push({
            text: __sw_translate("New bonuses", LOCALE_COUNTRY),
            path: `free-spins-no-deposit/new`
        });

        if (casinoPath) data.push({
            text: __sw_translate("Online casinos", LOCALE_COUNTRY),
            path: casinoPath
        });

        if (slotPath) data.push({
            text: __sw_translate("Free slots", LOCALE_COUNTRY),
            path: slotPath
        });

        const block = document.createElement(`div`);
        block.className = `search__nav`;
        block.innerHTML = data
            .map(item => `<a href="/${item.path}">
      <img src="/build/casinosanalyzer/img/redesign/search.svg" alt="search">
      <span>${item.text}</span>
  </a>`)
            .join(``);

        return block;
    }

    const renderSearchPopularContainer = () => {
        const block = document.createElement(`div`);
        block.className = `search__popular--container`;
        return block;
    }

// amplitudeDataset
    const amplitudeDataset = (block, item, index) => {
        block.dataset.score = JSON.stringify(item.score ? item.score : item.rate ? item.rate : 4);
        block.dataset.titleShort = JSON.stringify(item.titleShort ? item.titleShort : null);
        block.dataset.titleLong = JSON.stringify(item.titleLong ? item.titleLong : null);
        block.dataset.affiliateUrl = JSON.stringify(item.affiliateUrl ? item.affiliateUrl : null);
        block.dataset.id = JSON.stringify(item.id ? item.id : null);
        block.dataset.amountMax = JSON.stringify(item.amountMax ? item.amountMax : 0);
        block.dataset.percent = JSON.stringify(item.percent ? item.percent : 0);
        block.dataset.expired = JSON.stringify(item.expiredDate ? item.expiredDate : null);
        block.dataset.specialButtonTitle = JSON.stringify(item.specialButtonTitle ? item.specialButtonTitle : null);
        block.dataset.wageringRequirements = JSON.stringify(item.wageringRequirements ? item.wageringRequirements : 0);
        block.dataset.depositMin = JSON.stringify(item.depositMinValue);
        block.dataset.code = JSON.stringify(item.code ? item.code : null);
        block.dataset.label = JSON.stringify(item.label ? item.label : null);
        block.dataset.bonusCategories = JSON.stringify(item.bonusCategories ? item.bonusCategories : null);
        block.dataset.bonusTypes = JSON.stringify(item.bonusTypes ? item.bonusTypes : null);
        block.dataset.freeSpins = JSON.stringify(item.freeSpins ? item.freeSpins : 0);
        block.dataset.widget_list_index = JSON.stringify(index);
        block.dataset.currency = JSON.stringify(item.currency && Array.isArray(item.currency) && item.currency.length && !(item.currency).every(item => item === null) ? item.currency : ["Not Set"]);
        block.dataset.slots = JSON.stringify(item.slots && Array.isArray(item.slots) && item.slots.length ? item.slots.map(item => item.name) : ["Not Set"]);
        block.dataset.casino_bonus_category_display = JSON.stringify(null);
        block.dataset.casino_geo_rating = JSON.stringify(item.score ? +item.score.toFixed(1) : 0);
        block.dataset.casino_bonus_exclusive = JSON.stringify(item.exclusive ? item.exclusive : false);
        block.dataset.casino_bonus_code = JSON.stringify(item.code ? item.code : "Not Set");
        block.dataset.casino_bonus_cashable = JSON.stringify(item.cashable ? item.cashable : false);

        if (item.casino) {
            block.dataset.casinoId = JSON.stringify(item.casino.casinoId);
            block.dataset.name = JSON.stringify(item.casino.name);
            block.dataset.domain = JSON.stringify(item.casino.domain);
        } else {
            block.dataset.casinoId = JSON.stringify(null);
            block.dataset.name = JSON.stringify(item.name ? item.name : null);
            block.dataset.domain = JSON.stringify(item.domain ? item.domain : item.slug ? item.slug : null);
        }

        let casino_bonus_days_after_create = 0;
        if (item.created) {
            const createdDate = new Date(item.created.date);
            const currentDate = new Date();
            const diffTime = Math.abs(currentDate - createdDate);
            casino_bonus_days_after_create = Math.floor(diffTime / (1000 * 60 * 60 * 24));
        }
        block.dataset.casino_bonus_days_after_create = JSON.stringify(+casino_bonus_days_after_create);

        let casino_bonus_active_days_left = 365;
        if (item.expiredDate) {
            const expiredDate = new Date(item.expiredDate.date);
            const currentDate = new Date();
            if (expiredDate < currentDate) casino_bonus_active_days_left = 0;
            else {
                const diffTime = Math.abs(expiredDate - currentDate);
                casino_bonus_active_days_left = Math.floor(diffTime / (1000 * 60 * 60 * 24)) + 1;
            }
        }
        block.dataset.casino_bonus_active_days_left = JSON.stringify(+casino_bonus_active_days_left);

        return block;
    }
// amplitudeDataset

// popular
    const renderSearchPopular = async () => {
        let data = await getOffers(6);
        let items = data
            .slice(0, 5)
            .map((item, index) => {
                let rating = [];
                for (let i = 1; i <= 5; i++) {
                    rating.push(`<img src="/build/casinosanalyzer/img/redesign/${i <= Math.round(item.sponsored ? 5 : item.score) ? `star-full` : `star`}.svg" alt="star">`);
                }

                let block = document.createElement(`div`);
                block.className = `item`;
                block = amplitudeDataset(block, item, ++index);

                block.innerHTML = `<div class="item__logo ${item.sponsored ? 'sponsored' : ''}" style="background-color: #${item.casino?.background ? item.casino.background : 'fff'}">
          <img src="${item.casino?.logo ? item.casino.logo : 'fff'}" alt="${item.casino.name}">
      </div>
      <div class="item__rating">
          ${rating.join(``)}
      </div>
      <p class="item__title">${item.casino.name}</p>`;

                block.addEventListener(`click`, e => {
                    e.stopPropagation();
                    navAffSearchForm(`${item.casino.domain}?bonus=${item.id}`, true, {}, false, item.affiliateUrl);
                    searchAmplitudeClick(block);
                })

                return block;
            });

        const block = document.createElement(`div`);

        block.className = `search__popular`;
        block.innerHTML = headerSearchFront.dataset.sponsoredDisplay === 'true' ? `<p>${__sw_translate("Sponsored offers", LOCALE_COUNTRY)}</p>` : `<p>${__sw_translate("Popular search results in", LOCALE_COUNTRY)} <span>${COUNTRY_NAME}</span></p>`;

        let blockItems = document.createElement(`div`);
        blockItems.className = `search__popular--items`;
        items.forEach(item => blockItems.append(item));

        block.append(blockItems);

        return block;
    }

    const renderSearchPopularCasinos = async () => {
        let data = await getOffers(5);
        const casinoPath = searchDropdownSearchForm.dataset.casino;
        let items = data
            .slice(0, 4)
            .map((item, index) => {
                let block = document.createElement(`div`);
                block.className = `item`;
                block = amplitudeDataset(block, item, ++index);

                block.innerHTML = `<div class="item__logo" style="background-color: #${item.casino.background}">
            <img src="${item.casino.logo}" alt="${item.casino.name}">
        </div>
				<div class="item__info">
					<p class="item__title">
						<span>${item.casino.name}</span>
						<img src="/build/casinosanalyzer/img/redesign/star-full.svg" alt="star">
	          ${item.score.toFixed(1)}
					</p>
					<p class="item__subtitle">${__sw_translate("In Casino reviews", LOCALE_COUNTRY)}</p>
        </div>`;

                block.addEventListener(`click`, e => {
                    e.stopPropagation();
                    document.location.href = `/${casinoPath}/${item.casino.domain}`
                    searchAmplitudeClick(block);
                })

                return block;
            });

        const block = document.createElement(`div`);
        block.className = `search__popular search__popular--casinos`;
        block.innerHTML = `<p>${__sw_translate("Popular Casino Reviews in", LOCALE_COUNTRY)} <span>${COUNTRY_NAME}</span></p>`;

        let blockItems = document.createElement(`div`);
        blockItems.className = `search__popular--items`;
        items.forEach(item => blockItems.append(item));

        block.append(blockItems);

        return block;
    }

    const renderSearchPopularBonuses = async () => {
        let data = await getOffers(5);
        let items = data
            .slice(0, 4)
            .map((item, index) => {
                let block = document.createElement(`div`);
                block.className = `item`;
                block = amplitudeDataset(block, item, ++index);

                block.innerHTML = `<div class="item__logo ${item.sponsored ? 'sponsored' : ''}" style="background-color: #${item.casino.background}">
            <img src="${item.casino.logo}" alt="${item.casino.name}">
        </div>
				<div class="item__info">
					<p class="item__title">
						<span>${item.title}</span>
						<img src="/build/casinosanalyzer/img/redesign/star-full.svg" alt="star">
	          ${item.score.toFixed(1)}
					</p>
					<p class="item__subtitle">${__sw_translate("In Bonuses", LOCALE_COUNTRY)}</p>
        </div>`;

                block.addEventListener(`click`, e => {
                    e.stopPropagation();
                    navAffSearchForm(`${item.casino.domain}?bonus=${item.id}`, true, {}, false, item.affiliateUrl);
                    searchAmplitudeClick(block);
                })

                return block;
            });

        const block = document.createElement(`div`);
        block.className = `search__popular search__popular--bonuses`;
        block.innerHTML = headerSearchFront.dataset.sponsoredDisplay === 'true' ? `<p>${__sw_translate("Sponsored offers", LOCALE_COUNTRY)}</p>` : `<p>${__sw_translate("Popular Bonuses in", LOCALE_COUNTRY)} <span>${COUNTRY_NAME}</span></p>`;

        let blockItems = document.createElement(`div`);
        blockItems.className = `search__popular--items`;
        items.forEach(item => blockItems.append(item));

        block.append(blockItems);

        return block;
    }

    const renderSearchPopularSlots = async () => {
        const RANK_DEFAULT = 4;
        const slotPath = searchDropdownSearchForm.dataset.slot;
        let data = await getSlots(5);

        if (data.length > 0) {
            let items = data
                .slice(0, 4)
                .map((item, index) => {
                    let block = document.createElement(`div`);
                    block.className = `item`;
                    block = amplitudeDataset(block, item, ++index);

                    block.innerHTML = `<div class="item__info">
					<p class="item__title">
						<span>${item.name}</span>
						<img src="/build/casinosanalyzer/img/redesign/star-full.svg" alt="star">
	          ${item.rank ? item.rank.toFixed(1) : RANK_DEFAULT.toFixed(1)}
					</p>
					<p class="item__subtitle">${__sw_translate("In Slots", LOCALE_COUNTRY)}</p>
        </div>`;

                    block.addEventListener(`click`, e => {
                        e.stopPropagation();
                        document.location.href = `/${slotPath}/${item.slug}`;
                        searchAmplitudeClick(block);
                    });

                    return block;
                });

            const block = document.createElement(`div`);
            block.className = `search__popular search__popular--slots`;
            block.innerHTML = `<p>${__sw_translate("Popular Slots in", LOCALE_COUNTRY)} <span>${COUNTRY_NAME}</span></p>`;

            let blockItems = document.createElement(`div`);
            blockItems.className = `search__popular--items`;
            items.forEach(item => blockItems.append(item));

            block.append(blockItems);

            return block;
        }
        return null;
    }
// popular

// search result
    const renderSearchReviews = async (data, limit) => {
        const SCORE_DEFAULT = 4;
        const SCORE_MAX = 5;
        let items = data
            .slice(0, limit)
            .map((item, index) => {
                let block = document.createElement(`div`);
                block.className = `item`;
                block = amplitudeDataset(block, item, ++index);

                block.innerHTML = `<div class="item__logo" style="background-color: #${item.background}">
            <img src="${item.logo}" alt="${item.name}">
        </div>
				<div class="item__info">
					<p class="item__title">
						<span>${item.name}</span>
						<img src="/build/casinosanalyzer/img/redesign/star-full.svg" alt="star">
	          ${item.score ? (item.score > SCORE_MAX ? SCORE_DEFAULT.toFixed(1) : item.score.toFixed(1)) : SCORE_DEFAULT.toFixed(1)}
					</p>
					<p class="item__subtitle">${__sw_translate("In Casino reviews", LOCALE_COUNTRY)}</p>
        </div>`;

                block.addEventListener(`click`, e => {
                    e.stopPropagation();
                    document.location.href = item.path;
                    searchAmplitudeClick(block);
                })

                return block;
            });

        const block = document.createElement(`div`);
        block.className = `search__popular search__popular--casinos`;
        block.innerHTML = `<p>${__sw_translate("Found in", LOCALE_COUNTRY)} ${__sw_translate("Casino Reviews", LOCALE_COUNTRY)}</p>`;

        let blockItems = document.createElement(`div`);
        blockItems.className = `search__popular--items`;
        items.forEach(item => blockItems.append(item));

        block.append(blockItems);

        return block;
    }

    const renderSearchBonuses = async (data, limit) => {
        let items = data
            .slice(0, limit)
            .map((item, index) => {
                let block = document.createElement(`div`);
                block.className = `item`;
                block = amplitudeDataset(block, item, ++index);

                block.innerHTML = `<div class="item__logo" style="background-color: #${item.background}">
            <img src="${item.logo}" alt="${item.name}">
        </div>
				<div class="item__info">
					<p class="item__title">
						<span>${item.alias}</span>
						<img src="/build/casinosanalyzer/img/redesign/star-full.svg" alt="star">
	          ${item.score.toFixed(1)}
					</p>
					<p class="item__subtitle">${__sw_translate("In Bonuses", LOCALE_COUNTRY)}</p>
        </div>`;

                block.addEventListener(`click`, e => {
                    e.stopPropagation();
                    document.location.href = item.path;
                    searchAmplitudeClick(block);
                })

                return block;
            });

        const block = document.createElement(`div`);
        block.className = `search__popular search__popular--bonuses`;
        block.innerHTML = `<p>${__sw_translate("Found in Bonuses", LOCALE_COUNTRY)}</p>`;

        let blockItems = document.createElement(`div`);
        blockItems.className = `search__popular--items`;
        items.forEach(item => blockItems.append(item));

        block.append(blockItems);

        return block;
    }

    const renderSearchSlots = async (data, limit) => {
        const RANK_DEFAULT = 4;
        const RANK_MAX = 4;
        let items = data
            .slice(0, limit)
            .map((item, index) => {
                let block = document.createElement(`div`);
                block.className = `item`;
                block = amplitudeDataset(block, item, ++index);

                block.innerHTML = `<div class="item__info">
					<p class="item__title">
						<span>${item.name}</span>
						<img src="/build/casinosanalyzer/img/redesign/star-full.svg" alt="star">
	          ${item.rank ? (item.rank > RANK_MAX ? RANK_DEFAULT.toFixed(1) : item.rank.toFixed(1)) : RANK_DEFAULT.toFixed(1)}
					</p>
					<p class="item__subtitle">${__sw_translate("In Slots", LOCALE_COUNTRY)}</p>
        </div>`;

                block.addEventListener(`click`, e => {
                    e.stopPropagation();
                    document.location.href = item.path;
                    searchAmplitudeClick(block);
                });

                return block;
            });

        const block = document.createElement(`div`);
        block.className = `search__popular search__popular--slots`;
        block.innerHTML = `<p>${__sw_translate("Found in Slots", LOCALE_COUNTRY)}</p>`;

        let blockItems = document.createElement(`div`);
        blockItems.className = `search__popular--items`;
        items.forEach(item => blockItems.append(item));

        block.append(blockItems);

        return block;
    }
// search result

    window.addEventListener('pagehide', () => {
        localStorage.getItem('searchFormPopular') ? localStorage.removeItem('searchFormPopular') : null;
    });
}

// searchAmplitudeClick
let searchAffLinkClickIndex = 0;
const searchAmplitudeClick = item => {
    const searchForm = document.querySelector('#form_domain');
    const headerSearch = document.querySelector(`.header__search`);
    const container = headerSearch ? headerSearch : searchForm.closest(`.container-fluid`);
    const widgetId = container.dataset.widgetId;
    const widgetHandler = container.dataset.widgetHandler;
    const widgetPosition = container.dataset.widgetPosition;

    const casinoScoreGeoText = (value) => {
        let casino_score_geo_text = "";
        if (value === 5) {
            casino_score_geo_text = "A";
        } else if (value > 4.5 && value <= 4.9) {
            casino_score_geo_text = "B";
        } else if (value > 4 && value <= 4.5) {
            casino_score_geo_text = "C";
        } else if (value <= 4) {
            casino_score_geo_text = "D";
        }
        return casino_score_geo_text;
    };

    const PAGE__CURRENT__PATH = document.location.pathname,
        PAGE__URL = document.location.origin + document.location.pathname,
        PAGE__URL__FULL = document.location.href,
        ROUTE = document.body.dataset.routeBonus,
        ROUTE__ID = document.body.dataset.routeId,
        ROUTE__EXIST = eventIDSearch.findIndex(item => item === ROUTE),
        EVENT__ID = ROUTE__EXIST > -1 ? ROUTE__EXIST + 1 : eventIDSearch.length,
        EVENT__CAT = ROUTE__EXIST > -1 ? eventIDSearch[ROUTE__EXIST] : eventIDSearch[eventIDSearch.length - 1],
        LOCALE__LANG = document.body.dataset.localeLang,
        WEBSITE__ENVIRONMENT = document.body.dataset.websiteEnv,
        LOCALE__COUNTRY = document.body.dataset.localeCountry,
        COUNTRY__BACKEND = document.body.dataset.geo;

    let element = {
        widgetTitle: "Search form",
        widgetId: widgetId,
        widgetHandler: widgetHandler,
        widgetPosition: widgetPosition
    }

    let pageAffLinkClickIndex = JSON.parse(localStorage.getItem(`pageAffLinkClickIndex`));
    pageAffLinkClickIndex++;
    localStorage.setItem(`pageAffLinkClickIndex`, JSON.stringify(pageAffLinkClickIndex));

    searchAffLinkClickIndex++;

    let btn = item.querySelector(`.item__link`);
    let btnName = btn ? btn.innerHTML : `Popular search result`;

    let data = {
        score: JSON.parse(item.dataset.score),
        titleShort: JSON.parse(item.dataset.titleShort),
        titleLong: JSON.parse(item.dataset.titleLong),
        casino: {
            casinoId: JSON.parse(item.dataset.casinoId),
            name: JSON.parse(item.dataset.name),
            domain: JSON.parse(item.dataset.domain),
        },
        affiliateUrl: JSON.parse(item.dataset.affiliateUrl),
        id: JSON.parse(item.dataset.id),
        amountMax: JSON.parse(item.dataset.amountMax),
        percent: JSON.parse(item.dataset.percent),
        expired: JSON.parse(item.dataset.expired),
        specialButtonTitle: JSON.parse(item.dataset.specialButtonTitle),
        wageringRequirements: JSON.parse(item.dataset.wageringRequirements),
        depositMin: JSON.parse(item.dataset.depositMin),
        code: JSON.parse(item.dataset.code),
        label: JSON.parse(item.dataset.label),
        bonusCategories: JSON.parse(item.dataset.bonusCategories),
        bonusTypes: JSON.parse(item.dataset.bonusTypes),
        freeSpins: JSON.parse(item.dataset.freeSpins),
        currency: JSON.parse(item.dataset.currency),
        slots: JSON.parse(item.dataset.slots),
        casino_geo_rating: JSON.parse(+item.dataset.casino_geo_rating),
        casino_bonus_active_days_left: JSON.parse(+item.dataset.casino_bonus_active_days_left),
        casino_bonus_days_after_create: JSON.parse(+item.dataset.casino_bonus_days_after_create),
        casino_bonus_exclusive: JSON.parse(item.dataset.casino_bonus_exclusive),
        casino_bonus_code: JSON.parse(item.dataset.casino_bonus_code),
        casino_bonus_cashable: JSON.parse(item.dataset.casino_bonus_cashable)
    }

    dataLayer.push(Object.assign(
        {
            'event_id': `d-v1-${item.dataset.widget_list_index}`,
            'event': 'addEvents_clickAffLink',
            'event_cat': 'w_website_search_form_widget_new',
            'event_name': 'casino_visit',
            "casino_bonus_button_name": JSON.stringify(btnName),
            "casino_user_country_allowed": JSON.stringify(true),
            "page_afflink_click_index": JSON.stringify(pageAffLinkClickIndex),
            "widget_afflink_click_index": JSON.stringify(searchAffLinkClickIndex),
            "widget_list_index": JSON.stringify(item.dataset.widget_list_index),
            "website_domain": JSON.stringify(document.location.hostname),
        },
        {
            "page_current_path": JSON.stringify(PAGE__CURRENT__PATH),
            "page_url": JSON.stringify(PAGE__URL),
            "page_group": JSON.stringify(EVENT__CAT),
            "widget_title": JSON.stringify(element.widgetTitle),
            "widget_id": JSON.stringify(element.widgetId),
            "page_route_id": JSON.stringify(ROUTE__ID),
            "widget_handler": JSON.stringify(element.widgetHandler),
            "widget_position": JSON.stringify(element.widgetPosition),
            "casino_list_user_country": JSON.stringify(COUNTRY__BACKEND),
            "casino_user_country": JSON.stringify(COUNTRY__BACKEND),
            "casino_list_for_geo": JSON.stringify(element.widgetBonusCountry ? element.widgetBonusCountry : element.widgetCasinoCountry ? element.widgetCasinoCountry : false)
        },
        {
            "casino_bonus_title_short": JSON.stringify(data.titleShort ? data.titleShort : ''),
            "casino_bonus_title_short_strlen": JSON.stringify(data.titleShort ? data.titleShort.length : 0),
            "casino_id": JSON.stringify(data.casino.casinoId),
            "casino_name": JSON.stringify(data.casino.name),
            "casino_domain": JSON.stringify(data.casino.domain),
            "casino_bonus_amount_max": JSON.stringify(data.amountMax && !isNaN(parseInt(data.amountMax)) ? parseInt(data.amountMax) : 0),
            "casino_bonus_percent": JSON.stringify(data.percent ? data.percent : 0),
            "casino_bonus_expired": JSON.stringify(!!data.expired),
            "casino_bonus_id": JSON.stringify(data.id),
            "casino_domain_bonus_id": JSON.stringify(`${data.casino.domain}_${data.id}`),
            "casino_score_geo": JSON.stringify(data.score.toFixed(1)),
            "casino_afflink_exist": JSON.stringify(!!data.affiliateUrl),
            "casino_bonus_wagering_requirements": JSON.stringify(data.wageringRequirements && !isNaN(parseInt(data.wageringRequirements)) ? parseInt(data.wageringRequirements) : 0),
            "casino_bonus_deposit_min": JSON.stringify(parseInt(data.depositMin)),
            "casino_bonus_code_exist": JSON.stringify(!!data.code),
            "casino_bonus_label_exist": JSON.stringify(!!data.label),
            "casino_bonus_category": JSON.stringify(data.bonusCategories && Array.isArray(data.bonusCategories) ? data.bonusCategories.map(item => item.name) : ''),
            "casino_bonus_label": JSON.stringify(data.label ? data.label : "Not Set"),
            "casino_bonus_type": JSON.stringify(data.bonusTypes && Array.isArray(data.bonusTypes) ? data.bonusTypes.map(item => item.name) : ''),
            "casino_bonus_free_spins": JSON.stringify(data.freeSpins ? +data.freeSpins : 0),
            "casino_score_geo_text": JSON.stringify(casinoScoreGeoText),
            "casino_bonus_currency": JSON.stringify(data.currency),
            "casino_bonus_active": JSON.stringify(false),
            "casino_bonus_slots": JSON.stringify(data.slots),
            "casino_bonus_category_display": JSON.stringify("Not Set"),
            "casino_geo_rating": JSON.stringify(data.casino_geo_rating ? +data.casino_geo_rating : 0),
            "casino_bonus_active_days_left": JSON.stringify(+data.casino_bonus_active_days_left),
            "casino_bonus_days_after_create": JSON.stringify(+data.casino_bonus_days_after_create),
            "casino_bonus_exclusive": JSON.stringify(data.casino_bonus_exclusive),
            "casino_bonus_code": JSON.stringify(data.casino_bonus_code),
            "casino_bonus_cashable": JSON.stringify(data.casino_bonus_cashable)
        }, utmParamsSearch())
    );
}
// searchAmplitudeClick

const searchDropdownSearchForm = document.querySelector(`.frontSearch #searchDropdown`);
searchDropdownSearchForm && searchFormFuncSearchForm();import {getTermsAndConditions as bonusWelcomeTypeTNC} from "api";
import {__translate as __bwt_translate} from "translate";
import {
    navAff as navAffWelcomeBonus,
    getLocaleCountry as __bwt_localeCountry,
    utmParams as utmParamsBonusWelcomeType,
    eventID as eventIDWelcome
} from "globals";

class BonusWelcomeTypeWidget {

    noAmplitudeParam = new URLSearchParams(document.location.search).get("no-amplitude");

    /**
     *
     * @type {T[]}
     */
    bonusWelcomeTypeWidgetCards = Array.from(document.querySelectorAll('.bonusWelcomeTypeWidget__card'));

    /**
     *
     * @type {Element}
     */
    bonusWelcomeTypeMoreBtn = document.querySelector('.bonusWelcomeTypeWidget__more-bonuses__btn');

    /**
     *
     * @type {Element}
     */
    header = document.querySelector('.header');

    /**
     *
     * @type {[string]}
     */
    tncCountries = [`GB`];

    generateTnc() {
        if (this.bonusWelcomeTypeWidgetCards.length > 0) {
            this.bonusWelcomeTypeWidgetCards.forEach(item => {
                item.addEventListener('click', (e) => {
                    const {target} = e
                    if (target.closest('.bonusWelcomeTypeWidget__card__tnc--toogle')) {
                        return this.onClickShowTnc(item, item.dataset.bonus)
                    }

                    if (!e.target.classList.contains('show-more-link')) {
                        return navAffWelcomeBonus(item.dataset.url, item.dataset.blank, item.dataset.events, item.dataset.restricted, item.dataset.afflink)
                    }
                })
            });
            this.tncShow();
        }
    }

    moreBtnClick() {
        if (this.bonusWelcomeTypeMoreBtn) {
            this.bonusWelcomeTypeMoreBtn.addEventListener('click', (e) => {
                e.preventDefault();
                let bonusWelcomeTypeMoreBtnTarget = this.bonusWelcomeTypeMoreBtn.dataset.target
                bonusWelcomeTypeMoreBtnTarget = document.querySelector('.' + bonusWelcomeTypeMoreBtnTarget)
                if (!bonusWelcomeTypeMoreBtnTarget) {
                    return;
                }
                const bonusTableOffset = bonusWelcomeTypeMoreBtnTarget.getBoundingClientRect().top

                window.scrollTo({
                    top: bonusTableOffset + window.scrollY - this.header.offsetHeight,
                    left: 0,
                    behavior: 'smooth'
                });
            })
        }
    }

    /**
     *
     * @param item
     * @param bonus_id
     * @returns {Promise<void>}
     */
    async onClickShowTnc(item, bonus_id) {
        const innerTerms = document.createElement('div');
        innerTerms.classList.add('bonusWelcomeTypeWidget__card__tnc--content');

        const tncWrapper = item.querySelector('.bonusWelcomeTypeWidget__card__tnc');
        const tncTxt = item.querySelector('.bonusWelcomeTypeWidget__card__tnc--toogle-txt');

        let tncContent = item.querySelector('.bonusWelcomeTypeWidget__card__tnc--content');

        if (item.classList.contains('tnc-show') && tncContent) {
            tncContent.parentNode.removeChild(tncContent);
            setTimeout(() => item.classList.remove('tnc-show'), 100)
            return;
        }

        const tnc = await this.getTerms(bonus_id);

        item.classList.add('tnc-show');

        innerTerms.innerHTML = `<span class="bonusWelcomeTypeWidget__card__tnc--content-txt">${tnc}</span>`;

        this.tncShowMore(tnc, innerTerms);

        tncWrapper.insertAdjacentElement('afterend', innerTerms);

        let tnxTextBlock = innerTerms.querySelector(`.bonusWelcomeTypeWidget__card__tnc--content-txt`);

        if (tncTxt.dataset.termsUrl) {
            tnxTextBlock ? tnxTextBlock.addEventListener(`click`, e => {
                e.stopPropagation();
                if (!e.target.classList.contains('show-more-link')) {
                    !this.noAmplitudeParam && this.amplitudeTC(e);
                    window.open(tncTxt.dataset.termsUrl, `_blank`);
                }
            }) : null;
        }
    }

    /**
     *
     * @param el
     */
    amplitudeTC(el) {
        const table = el.target.closest(`.bonusWelcomeTypeWidget__cards`);

        const element = {
            items: JSON.parse(table.dataset.items),
            route: table.dataset.route,
            widgetId: table.dataset.widgetId,
            widgetTitle: table.dataset.widgetTitle,
            widgetHandler: table.dataset.widgetHandler,
            widgetNotice: table.dataset.widgetNotice,
            widgetBonusCountry: table.dataset.widgetBonusCountry,
            widgetCasinoCountry: table.dataset.widgetCasinoCountry,
            widgetArguments: table.dataset.widgetArguments ? JSON.parse(table.dataset.widgetArguments) : ``,
            eventCat: "w_website",
            eventAffClickName: "tc_redirect",
            clickAffLinkVersion: 48
        };

        const tr = el.target.closest(`.bonusWelcomeTypeWidget__card`),
            index = tr.dataset.widget_list_index - 1,
            data = element.items[index],
            btnName = tr.dataset.casino_bonus_button_name,
            tncLink = tr.dataset.termsUrl;

        let casinoUserCountryAllowed = true;

        let pageAffLinkClickIndex = JSON.parse(localStorage.getItem(`pageAffLinkClickIndex`));
        pageAffLinkClickIndex++;
        localStorage.setItem(`pageAffLinkClickIndex`, JSON.stringify(pageAffLinkClickIndex));

        const amplitudeVersion = 1;

        dataLayer.push(Object.assign(
            {
                'event': 'addEvents_click',
                'event_id': `d-v${amplitudeVersion}-e${element.clickAffLinkVersion}`,
                'event_cat': element.eventCat,
                'event_name': element.eventAffClickName,
                "casino_bonus_button_name": JSON.stringify(btnName),
                "widget_list_index": JSON.stringify(tr.dataset.widget_list_index),
                "casino_user_country_allowed": JSON.stringify(casinoUserCountryAllowed),
                "page_afflink_click_index": JSON.stringify(pageAffLinkClickIndex),
                "redirect_link": JSON.stringify(tncLink)
            },
            this.newPageData(element),
            this.newBonusData(data),
            utmParamsBonusWelcomeType())
        );
    }

    /**
     *
     * @param element
     * @returns {{page_url: string, page_current_path: string, casino_list_for_geo: string, page_url_full: string, page_group: string, widget_id: string, page_route_id: string, widget_title: string, casino_user_country: string, widget_handler: string, casino_bonus_short: string, casino_list_user_country: string}}
     */
    newPageData(element) {
        let ROUTE = document.body.dataset.routeBonus,
            ROUTE__ID = document.body.dataset.routeId,
            ROUTE__EXIST = eventIDWelcome.findIndex(item => item === ROUTE),
            EVENT__CAT = ROUTE__EXIST > -1 ? eventIDWelcome[ROUTE__EXIST] : eventIDWelcome[eventIDWelcome.length - 1],
            PAGE__CURRENT__PATH = document.location.pathname,
            PAGE__URL = document.location.origin + document.location.pathname,
            PAGE__URL__FULL = document.location.href,
            COUNTRY__BACKEND = document.body.dataset.geo;

        return {
            "page_current_path": JSON.stringify(PAGE__CURRENT__PATH),
            "page_url": JSON.stringify(PAGE__URL),
            "page_group": JSON.stringify(EVENT__CAT),
            "widget_title": JSON.stringify(element.widgetTitle),
            "widget_id": JSON.stringify(element.widgetId),
            "page_route_id": JSON.stringify(ROUTE__ID),
            "widget_handler": JSON.stringify(element.widgetHandler),
            "casino_list_user_country": JSON.stringify(COUNTRY__BACKEND),
            "casino_user_country": JSON.stringify(COUNTRY__BACKEND),
            "casino_list_for_geo": JSON.stringify(element.widgetBonusCountry ? element.widgetBonusCountry : element.widgetCasinoCountry ? element.widgetCasinoCountry : false)
        }
    };

    /**
     *
     * @param score
     * @returns {string}
     */
    calculateCasinoScoreGeoText(score) {
        if (score === 5) return 'A';
        if (score > 4.5 && score <= 4.9) return 'B';
        if (score > 4 && score <= 4.5) return 'C';

        return 'D';
    };

    /**
     *
     * @param data
     * @returns {{casino_id: string, casino_bonus_title_short_strlen: string, casino_bonus_title_short: string, casino_bonus_id: string, casino_bonus_type: string, casino_bonus_deposit_min: string, casino_bonus_code_exist: string, casino_bonus_percent: string, casino_domain: string, casino_score_geo: string, casino_bonus_exclusive: string, casino_bonus_special_button_title: string, casino_bonus_label_exist: string, casino_bonus_category: string, casino_domain_bonus_id: string, casino_bonus_free_spins: string, casino_bonus_cashable: string, casino_bonus_wagering_requirements: string, casino_bonus_title_long: string, casino_bonus_title_long_strlen: string, casino_score_geo_text: string, casino_name: string, casino_afflink_exist: string, casino_bonus_label: string, casino_bonus_amount_max: string, casino_bonus_expired: string}}
     */
    newBonusData(data) {
        const casinoScoreGeoText = this.calculateCasinoScoreGeoText(data.score.toFixed(1));

        return {
            "casino_bonus_title_short": JSON.stringify(data.titleShort ? data.titleShort : ''),
            "casino_bonus_title_short_strlen": JSON.stringify(data.titleShort ? data.titleShort.length : 0),
            "casino_id": JSON.stringify(data.casino.casinoId),
            "casino_name": JSON.stringify(data.casino.name),
            "casino_domain": JSON.stringify(data.casino.domain),
            "casino_bonus_amount_max": JSON.stringify(data.amountMax && !isNaN(parseInt(data.amountMax)) ? parseInt(data.amountMax) : 0),
            "casino_bonus_percent": JSON.stringify(data.percent ? data.percent : 0),
            "casino_bonus_exclusive": JSON.stringify(!!data.exclusive),
            "casino_bonus_cashable": JSON.stringify(!!data.cashable),
            "casino_bonus_expired": JSON.stringify(!!data.expired),
            "casino_bonus_id": JSON.stringify(data.id),
            "casino_domain_bonus_id": JSON.stringify(`${data.casino.domain}_${data.id}`),
            "casino_score_geo": JSON.stringify(data.score.toFixed(1)),
            "casino_afflink_exist": JSON.stringify(!!data.affiliateUrl),
            "casino_bonus_wagering_requirements": JSON.stringify(data.wageringRequirements && !isNaN(parseInt(data.wageringRequirements)) ? parseInt(data.wageringRequirements) : 0),
            "casino_bonus_deposit_min": JSON.stringify(parseInt(data.depositMin)),
            "casino_bonus_code_exist": JSON.stringify(!!data.code),
            "casino_bonus_label_exist": JSON.stringify(!!data.label),
            "casino_bonus_category": JSON.stringify(data.bonusCategories && Array.isArray(data.bonusCategories) ? data.bonusCategories.map(item => item.name) : ''),
            "casino_bonus_label": JSON.stringify(data.label),
            "casino_bonus_type": JSON.stringify(data.bonusTypes && Array.isArray(data.bonusTypes) ? data.bonusTypes.map(item => item.name) : ''),
            "casino_bonus_free_spins": JSON.stringify(data.freeSpins ? +data.freeSpins : 0),
            "casino_score_geo_text": JSON.stringify(casinoScoreGeoText)
        }
    };

    tncShow() {
        let loc = document.body.dataset.geo;

        if (this.tncCountries.includes(loc)) {
            this.bonusWelcomeTypeWidgetCards.forEach(async item => {
                const innerTerms = document.createElement('div');
                innerTerms.classList.add('bonusWelcomeTypeWidget__card__tnc--content');

                const tncWrapper = item.querySelector('.bonusWelcomeTypeWidget__card__tnc');
                const tncTxt = item.querySelector('.bonusWelcomeTypeWidget__card__tnc--toogle-txt');
                let bonusId = item.dataset.bonus;

                let tncContent = item.querySelector('.bonusWelcomeTypeWidget__card__tnc--content');
                if (item.classList.contains('tnc-show') && tncContent) {
                    tncContent.parentNode.removeChild(tncContent);
                    setTimeout(() => item.classList.remove('tnc-show'), 100)
                    return;
                }

                const tnc = await this.getTerms(bonusId)
                item.classList.add('tnc-show')
                innerTerms.innerHTML = `<span class="bonusWelcomeTypeWidget__card__tnc--content-txt">${tnc}</span>`;
                tncWrapper.insertAdjacentElement('afterend', innerTerms);

                let tnxTextBlock = innerTerms.querySelector(`.bonusWelcomeTypeWidget__card__tnc--content-txt`);

                if (tncTxt.dataset.termsUrl) {
                    tnxTextBlock.addEventListener(`click`, e => {
                        e.stopPropagation();
                        window.open(tncTxt.dataset.termsUrl, `_blank`);
                    })
                }

                this.tncShowMore(innerTerms, tnxTextBlock)
            })
        }
    }

    /**
     *
     * @param contentText
     * @param element
     * @returns {string}
     */
    tncShowMore(contentText, element) {
        const limit = 160;

        if (contentText.length > limit) {
            const truncatedText = contentText.slice(0, limit);
            const hiddenText = contentText.slice(limit);
            element.innerHTML = truncatedText + `<span class="hidden-text">${hiddenText}</span><span class="show-more-link">... ${__bwt_translate('Show more', __bwt_localeCountry()) ?? 'Show more'}</span>`;

            const showMoreLink = element.querySelector('.show-more-link');
            const hiddenTextSpan = element.querySelector('.hidden-text');

            showMoreLink.addEventListener('click', () => {
                if (hiddenTextSpan.style.display !== 'none' || hiddenTextSpan.style.display !== '') {
                    hiddenTextSpan.style.display = 'inline';
                    showMoreLink.textContent = '';
                } else {
                    hiddenTextSpan.style.display = 'none';
                    showMoreLink.textContent = `... ${__bwt_translate('Show more', __bwt_localeCountry()) ?? 'Show more'}`;
                }
            });

            return element;
        }

        return element.innerHTML;
    }

    /**
     *
     * @param casino_id
     * @returns {Promise<*>}
     */
    async getTerms(casino_id) {
        return await bonusWelcomeTypeTNC(casino_id)
    }
}

const bonusWelcomeTypeWidget = new BonusWelcomeTypeWidget;

bonusWelcomeTypeWidget.generateTnc();
bonusWelcomeTypeWidget.moreBtnClick();


import {__translate as __int_translate} from "translate";

class IntroWidget {

	/**
	 *
	 * @type {Element}
	 */
	prime = document.querySelector('.prime-bg');

	/**
	 *
	 * @type {Element}
	 */
	header = document.querySelector('.header');

	/**
	 *
	 * @type {NodeListOf<Element>}
	 */
	introBlocks = document.querySelectorAll(`.block__intro`);

	/**
	 *
	 * @type {Element}
	 */
	buttonViewBonusesWidget = document.querySelector('.buttonViewBonusesWidget__more-bonuses__btn');

	/**
	 *
	 * @type {Element}
	 */
	blockMoreContent = document.querySelector('.block__more--content');

	/**
	 *
	 * @type {NodeListOf<Element>}
	 */
	introDescriptionParagraph = document.querySelectorAll('[data-widget-handler="IntroWidget"] .block__intro.block__more--hide');

	/**
	 *
	 * @type {string}
	 */
	route = document.body.dataset.routeBonus;

	/**
	 *
	 * @type {Element}
	 */
	restrictedBlock = document.querySelector(`.restrictedBlock`);

	/**
	 *
     @type {boolean}
	 */
	casinoRouteDesktop = this.route === `p_casino` && this.restrictedBlock && window.innerWidth >= 992;

	moreBtnClick() {
		if (this.buttonViewBonusesWidget) {
			this.buttonViewBonusesWidget.addEventListener('click', (e) => {
				e.preventDefault();

				const blockHeight = this.prime.getBoundingClientRect().height;

				window.scrollTo({
					top: window.pageYOffset + blockHeight,
					behavior: 'smooth'
				});
			})
		}
	}

	onLoadDescriptionShowMore() {
		if (this.introDescriptionParagraph.length && !this.casinoRouteDesktop) {
			this.introDescriptionParagraph.forEach(block => {
				let children = [...block.children];

				block.parentElement.classList.remove('intro__more-btn--show');

				if (children.length) {
					const countOfChars = 480;
					let previewText = [];
					let indexOfLastWhiteSpace;
					let newPreviewText;
					let textMore = false;

					block.innerHTML = ``;

					const getNearestWhiteSpaceIndex = (index, charts) => {
						let char = charts[index];
						if (char !== ` ` && char !== `.` && char !== `!` && char !== `?`) getNearestWhiteSpaceIndex((index + 1), charts);
						else indexOfLastWhiteSpace = index;
					}

					for (let i = 0; i < children.length; i++) {
						if (children[i].tagName === `TABLE`) continue;

						let itemChars = (children[i].innerHTML.split(``) || []);
						let previewTextLength = previewText.length;
						previewText = previewText.concat([` `], itemChars);

						if (previewText.length >= countOfChars) {
							textMore = true;
							getNearestWhiteSpaceIndex((countOfChars - 1), previewText);
							newPreviewText = previewText.slice(previewTextLength, indexOfLastWhiteSpace).join(``);
							break;
						} else {
							block.append(children[i]);
						}
					}

					if (textMore) {
						let previewWrap = document.createElement(`p`);
						previewWrap.innerHTML = newPreviewText + `...`;

						let btnWrap = document.createElement('div');
						btnWrap.className = 'intro__more-btn-wrapper'

						const showMoreBtn = document.createElement(`span`);
						const LOCALE_COUNTRY = document.querySelector(`body`).dataset.localeCountry.toLowerCase();
						showMoreBtn.innerHTML = __int_translate("Read more", LOCALE_COUNTRY);
						showMoreBtn.className = `intro__more-btn`;
						showMoreBtn.addEventListener(`click`, () => {
							block.innerHTML = ``;
							children.forEach(item => block.append(item));
							btnWrap.remove();
							block.parentElement.classList.remove('intro__more-btn--show');
							this.introBlocks[0].style.cssText = 'max-height: unset; overflow: unset;';
						});

						btnWrap.append(showMoreBtn);

						block.parentElement.classList.add('intro__more-btn--show');
						block.append(btnWrap);

						block.append(previewWrap);
					}
				}
			});
		} else {
			if (this.introBlocks.length) this.introBlocks[0].style.cssText = 'max-height: unset; overflow: unset;';
		}
	}

	casinoRoute() {
		if (this.casinoRouteDesktop) {
			if (this.introDescriptionParagraph.length) {
				this.introDescriptionParagraph.forEach(block => {
					block.classList.remove(`block__more--hide`);
				});
			}
		}
	}
}

const introWidget = new IntroWidget();

introWidget.casinoRoute();
introWidget.moreBtnClick();
introWidget.onLoadDescriptionShowMore();

class ScrollButtonWidget {
    header = document.querySelector('.header');
    scrollButton = document.querySelectorAll('.scrollButtonWidget__btn');

    scrollButtonClick() {
        if (this.scrollButton) {
            this.scrollButton.forEach(item => {
                item.addEventListener('click', (e) => {
                    e.preventDefault();
                    let scrollButtonTarget = item.dataset.target;
                    scrollButtonTarget = document.querySelector(`#${scrollButtonTarget}`) ?? this.firstBlock();

                    if (!scrollButtonTarget) {
                        return;
                    }

                    const scrollButtonTargetOffset = scrollButtonTarget.getBoundingClientRect().top

                    setTimeout(() => {
                        window.scroll({
                            top: scrollButtonTargetOffset + (window.scrollY - this.header.offsetHeight),
                            behavior: 'smooth'
                        });
                    }, 100);
                })
            })
        }
    }

    firstBlock() {
        for (let i = 1; i <= 100; i++) {
            let elementId = "block_" + i;
            let element = document.getElementById(elementId);

            if (element) {
                return element;
            }
        }
        return null
    }
}

const scrollButtonWidget = new ScrollButtonWidget();

scrollButtonWidget.scrollButtonClick();

import {geoCloudflareLocation as currentGeo} from "api";

const location = await currentGeo();
const geoFact = document.body.dataset.geoFact;

const getAmplitudeCookieLockWidget = name => {
	let value = `; ${document.cookie}`;
	let parts = value.split(`; ${name}=`);
	if (parts.length === 2) return parts.pop().split(';').shift();
}

const getDevicePlatformLockWidget = () => {
	const ua = navigator.userAgent;
	if (/(tablet|ipad|playbook|silk)|(android(?!.*mobi))/i.test(ua)) {
		return "tablet";
	}
	if (
		/Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Kindle|Silk-Accelerated|(hpw|web)OS|Opera M(obi|ini)/.test(
			ua
		)
	) {
		return "mob";
	}
	return "web";
};

const appendLockScreen = (title, description) => {
	let div = document.createElement('div');
	div.setAttribute('id', 'lockScreen');

	let options = document.createElement('div');
	let info = document.createElement('div');
	let icon = document.createElement('div');

	div.style.position = 'fixed';
	div.style.top = '0';
	div.style.width = '100%';
	div.style.height = '100vh';
	div.style.background = '#1c3045';
	div.style.color = '#ffffff';
	div.style.zIndex = '999999999999';
	div.style.display = 'flex';
	div.style.alignItems = 'center';
	div.style.justifyContent = 'center';
	div.style.padding = '0 20px';

	info.style.fontSize = '19px';
	info.style.fontWeight = '600';
	info.style.color = '#ffffff';
	info.innerHTML = description;

	icon.style.marginBottom = '10px';
	icon.style.display = 'flex';
	icon.style.alignItems = 'center';
	icon.innerHTML = `
              <svg width="35" height="35"><use href="/build/casinosanalyzer/dist/img/header.svg#logo"></use></svg>
              <span style="font-weight: 600;
                          text-transform: uppercase;
                          letter-spacing: 1px;
                          font-size: 18px;
                          color: #fff;
                          margin-left: 8px;">${title}</span>
      `;

	div.appendChild(options);

	options.appendChild(icon);
	options.appendChild(info);

	document.documentElement.appendChild(div);

	setTimeout(() => {
		document.body.innerHTML = '';
	}, 500);
}

const getDomainName = () => {
	let domain = document.location.host;

	const prefix = [
		'loc.',
		'dev.',
		'dev1.',
		'dev2.',
		'dev3.',
		'green.',
		'blue.',
		'preprod.',
	];

	for (let i = 0; i < prefix.length; i++) {
		domain = domain.replace(prefix[i], '');
	}

	return domain;
}

const checkDateIsWeekends = (date = new Date()) => {
	const WEEKENDS_DAYS = {
		'saturday': 6,
		'sunday': 0
	};

	return date.getDay() === WEEKENDS_DAYS['saturday'] || date.getDay() === WEEKENDS_DAYS['sunday'];
}

let activeCH = location === `CH` || geoFact === `CH`;
let activePL = location === `PL` || geoFact === `PL`;
let activeFR = location === `FR` || geoFact === `FR`;
let activeNL = location === `NL` || geoFact === `NL`;
let activeAU = location === `AU` || geoFact === `AU`;

if (getDevicePlatformLockWidget() === 'web' && !getAmplitudeCookieLockWidget('ca_admin') && activePL && !checkDateIsWeekends()) {
	appendLockScreen(
		getDomainName() === 'kasynoanalyzer.com' ? 'Kasyno Analyzer Polska' : 'POLAND CASINOS ANALYZER',
		'Niestety nasza strona nie jest dostępna dla odwiedzających, którzy korzystają z polskiego adresu IP. Bardzo przepraszamy<br/> za niedogodności.'
	);
}

if (getDevicePlatformLockWidget() === 'web' && !getAmplitudeCookieLockWidget('ca_admin') && activeCH && !checkDateIsWeekends()) {
	appendLockScreen(
		'Switzerland Casino Analyzer',
		'Due to legal restrictions, our website is not available to visitors using<br/> a Switzerland IP address. We are very sorry for the inconvenience.'
	);
}

if (getDevicePlatformLockWidget() === 'web' && !getAmplitudeCookieLockWidget('ca_admin') && activeFR) {
	appendLockScreen(
		'FRANCE CASINOS ANALYZER',
		'Due to legal restrictions, our website is not available to visitors using a France IP address. We are very sorry for the inconvenience.'
	);
}

if (getDevicePlatformLockWidget() === 'web' && !getAmplitudeCookieLockWidget('ca_admin') && activeNL) {
	appendLockScreen(
		'NETHERLANDS CASINOS ANALYZER',
		'Due to legal restrictions, our website is not available to visitors using a Netherlands IP address. We are very sorry for the inconvenience.'
	);
}

if (getDevicePlatformLockWidget() === 'web' && !getAmplitudeCookieLockWidget('ca_admin') && activeAU) {
	appendLockScreen(
		'AUSTRALIA CASINOS ANALYZER',
		'Access Denied! We are currently unable to accept visitors from Australia. Sorry for the inconvenience!'
	);
}
