(function () {
    const DYNAMIC_API_BASE_URL = 'https://api-v2.q-83.com/api';
    const API_BASE_URL = DYNAMIC_API_BASE_URL ?? 'https://api-v2.q-83.com/api';
    let form;
    let platformWrapper;
    function createFormElement() {
        const form = document.createElement('form');
        form.id = 'kitlyDiscoveryForm';
        form.method = 'POST';
        form.action = `${API_BASE_URL}/discovery/register`;
        const companyNameInput = document.createElement('input');
        companyNameInput.type = 'hidden';
        companyNameInput.name = 'companyName';
        const firstNameInput = document.createElement('input');
        firstNameInput.type = 'hidden';
        firstNameInput.name = 'firstName';
        const lastNameInput = document.createElement('input');
        lastNameInput.type = 'hidden';
        lastNameInput.name = 'lastName';
        const emailInput = document.createElement('input');
        emailInput.type = 'hidden';
        emailInput.name = 'email';
        const formWrapper = document.createElement('div');
        formWrapper.className = 'kitly-discovery-form-wrapper';
        platformWrapper = document.createElement('div');
        platformWrapper.className = 'kitly-discovery-platform-wrapper';
        const platformLabel = document.createElement('div');
        platformLabel.textContent = 'Platform';
        platformLabel.className = 'kitly-discovery-platform-label';
        platformWrapper.appendChild(platformLabel);
        const platformOptionsWrapper = document.createElement('div');
        platformOptionsWrapper.className = 'kitly-discovery-platform-options-wrapper';
        const platformOptions = [
            { value: 'instagram', logo: 'https://media.q-83.com/site/channel_icons/instagram.png', label: 'Instagram' },
            { value: 'youtube', logo: 'https://media.q-83.com/site/channel_icons/yt_logo.svg', label: 'YouTube' },
            { value: 'tiktok', logo: 'https://media.q-83.com/site/channel_icons/tiktok.svg', label: 'TikTok' },
        ];
        platformOptions.forEach((platform, index) => {
            const button = document.createElement('button');
            button.dataset.platform = platform.value;
            button.title = platform.label;
            if (index === 0) {
                button.classList.add('active');
            }
            button.tabIndex = 0;
            const logo = document.createElement('img');
            logo.src = platform.logo;
            logo.alt = platform.label;
            button.appendChild(logo);
            button.addEventListener('click', (event) => {
                event.preventDefault();
                if (!button.classList.contains('active')) {
                    platformOptionsWrapper.querySelectorAll('button').forEach((btn) => {
                        btn.classList.remove('active');
                    });
                    button.classList.add('active');
                    form.elements.channel.value = platform.value;
                }
            });
            platformOptionsWrapper.appendChild(button);
        });
        platformWrapper.appendChild(platformOptionsWrapper);
        const channelInput = document.createElement('input');
        channelInput.type = 'hidden';
        channelInput.name = 'channel';
        channelInput.value = 'instagram';
        const quickSearchWrapper = document.createElement('div');
        quickSearchWrapper.className = 'kitly-discovery-quick-search-wrapper';
        const quickSearchLabel = document.createElement('div');
        quickSearchLabel.textContent = 'Kitly Search';
        quickSearchLabel.className = 'kitly-discovery-quick-search-label';
        const quickSearchInput = document.createElement('input');
        quickSearchInput.type = 'text';
        quickSearchInput.placeholder = 'Search by @handle';
        quickSearchInput.name = 'handle';
        quickSearchInput.required = !0;
        quickSearchInput.tabIndex = 0;
        quickSearchInput.setAttribute('aria-label', 'Search Kitly by social media handle');
        quickSearchInput.addEventListener('keydown', (event) => {
            if (event.key === 'Enter') {
                event.preventDefault();
                form.dispatchEvent(new Event('submit'));
            }
        });
        quickSearchWrapper.appendChild(quickSearchLabel);
        quickSearchWrapper.appendChild(quickSearchInput);
        const searchButtonWrapper = document.createElement('div');
        searchButtonWrapper.className = 'kitly-discovery-search-button-wrapper';
        const searchButton = document.createElement('button');
        searchButton.type = 'submit';
        searchButton.textContent = 'Search';
        searchButton.tabIndex = 0;
        searchButtonWrapper.appendChild(searchButton);
        formWrapper.appendChild(platformWrapper);
        formWrapper.appendChild(quickSearchWrapper);
        formWrapper.appendChild(searchButtonWrapper);
        form.appendChild(channelInput);
        form.appendChild(companyNameInput);
        form.appendChild(firstNameInput);
        form.appendChild(lastNameInput);
        form.appendChild(emailInput);
        form.appendChild(formWrapper);
        return form;
    }
    function handleFormSubmit(event) {
        event.preventDefault();
        const selectedPlatform = platformWrapper.querySelector('button.active')?.dataset.platform;
        form.elements.channel.value = selectedPlatform || 'instagram';
        const formData = new FormData(event.target);
        const apiKey = event.target.dataset.apikey;

        const jsonObject = {};

        formData.forEach(function(value, key){
            jsonObject[key] = value;
        });


        fetch(event.target.action, {
            method: event.target.method,
            body: JSON.stringify({...jsonObject, handle: jsonObject.handle.replace(/@/g, '')}),
            headers: { 
                'x-kitly-api-key': apiKey, 
                'Content-Type': 'application/json'  
            },
        })
            .then((response) => response.json())
            .then((data) => {
                if (data.redirectUrl) {
                    window.open(data.redirectUrl, '_blank');
                }
            })
            .catch((error) => {
                console.error('Error:', error);
            });
    }
    function init(apiKey, targetElementId, companyName, firstName, lastName, email) {
        const container = document.getElementById(targetElementId);
        if (container) {
            form = createFormElement();
            form.dataset.apikey = apiKey;
            form.addEventListener('submit', handleFormSubmit);
            form.elements.companyName.value = companyName;
            form.elements.firstName.value = firstName;
            form.elements.lastName.value = lastName;
            form.elements.email.value = email;
            container.appendChild(form);
        }
    }

    window.kitlyDiscoverySearchInit = function (apiKey, targetElementId, companyName, firstName, lastName, email) {
        init(apiKey, targetElementId, companyName, firstName, lastName, email);
    };
})();