document.addEventListener('DOMContentLoaded', () => {
    let settingsLink;
    if (window.location.href.includes('/pl/lite/widget/editor')) {
        settingsLink = document.querySelector('.right-buttons .settings-link');
    }

    if (settingsLink) {
        const widgetLink = document.createElement('a');
        widgetLink.className = 'widget-link';
        widgetLink.href = 'javascript:void(0)'; // Предотвращает переход
        widgetLink.style = ''; // Пустой стиль, если не нужен
        widgetLink.innerHTML = '<span class="glyphicon glyphicon-modal-window"></span> Скрипт для тильды';

        widgetLink.addEventListener('click', () => {
            showFormWidget();
            /*if (!document.querySelector('.modal')) {
                showFormWidget();
            }*/
        });

        // Получаем родительский элемент .settings-link
        const parent = settingsLink.parentNode;
        // Вставляем widgetLink перед settingsLink
        parent.insertBefore(widgetLink, settingsLink);
    } else {
        console.error('Элемент .settings-link не найден');
    }
});

let forms = {};
function showFormWidget() {
    
    try {
        document.querySelectorAll('form').forEach(form => {
        const formId = form.getAttribute('data-id');
        if (!formId) {
            return;
        }
        forms[formId] = [];
        let i = 0;
        form.querySelectorAll('div[data-param^="form/items/parts/"]').forEach(field => {
            field.querySelectorAll('input').forEach(input => {
                if (!forms[formId][i] || !forms[formId][i].label) {                
                    if (input.placeholder) {
                        forms[formId].push({ label: input.placeholder });
                    } else {
                        const label = field.querySelector('label span[class="label-value"]').innerText.trim();
                        if (label) {
                            forms[formId].push({ label: label });
                        } else {
                            return;
                        }
                    }
                }

                if (forms[formId][i] && forms[formId][i].label) {
                    if (input.name) {
                        forms[formId][i].name = input.name;
                        i++;
                    }
                }
            });            
        });
    });

      createModal(forms);
  } catch (error) {
      console.log(error);
  }
}

function createModal(forms) {
    const values = {
        "имя": "obj['name']",
        "email": "obj['email']", 
        "+7 (999) 999-99-99": "obj['phone']",
        "Я выражаю согласие на обработку моих персональных данных в соответствии с Политикой обработки персональных данных": 1,
        "Даю согласие на получение информационной и рекламной рассылки": 1,
        "utm_source": "source_val",
        "utm_medium": "medium_val",
        "utm_campaign": "campaign_val",
        "utm_term": "term_val",
        "utm_content": "content_val",
        "roistat": "obj['roistat_visit']",
        "ref": "ref_val",
        "current_url": "current_url"
    };

    // Устанавливаем значения value для каждой формы
    Object.keys(forms).forEach(formId => {
        forms[formId].forEach(field => {
            if (values[field.label]) {
                field.value = values[field.label];
            } else {
                field.value = '';
            }
        });
    });
    const modal = document.createElement('div');
    modal.classList.add('modal');
    modal.style.display = 'flex';
    modal.style.position = 'fixed';
    modal.style.top = '40%';
    modal.style.left = '50%';
    modal.style.transform = 'translate(-50%, -50%)';
    modal.style.backgroundColor = 'white';
    modal.style.padding = '20px';
    modal.style.borderRadius = '10px';
    modal.style.width = '500px';
    modal.style.overflowY = 'auto';
    //modal.style.position = 'relative';

    const modalContent = `
        <div class="modal-content" style="overflow-y: scroll; padding: 10px;">
            <h2>Forms</h2>
            <div class="form-container">
                ${Object.keys(forms).map(formId => `
                    <div class="form-item">
                        <h3>${formId}</h3>
                        <form onsubmit="return submitForm('${formId}', event)">
                        ${forms[formId].map(field => `
                            <div class="form-field">
                                <label>${field.label}</label>
                                <br>
                                <input type="text" name="${field.name}" value="${field.value}" placeholder="Введите соответствующее значение" required>
                                <br>
                            </div>
                        `).join('')}
                        <br>
                        <button type="submit">Создать скрипт</button>
                        </form>
                    </div>
                `).join('')}
        </div>
    `;
    
    modal.innerHTML = modalContent;

    const closeButton = document.createElement('button');
    closeButton.innerHTML = '×';
    closeButton.style.position = 'absolute';
    closeButton.style.right = '10px';
    closeButton.style.top = '10px';
    closeButton.style.border = 'none';
    closeButton.style.background = 'none';
    closeButton.style.fontSize = '24px';
    closeButton.style.cursor = 'pointer';
    closeButton.onclick = () => {
        document.body.removeChild(modal);
    };
    
    modal.appendChild(closeButton);
    document.body.appendChild(modal);
}

function submitForm(formId, event) {
    event.preventDefault();
    const form = event.target;
    const inputs = form.querySelectorAll('input');
    let values = {};
    let i = 0;
    inputs.forEach(input => {
        forms[formId][i].value = input.value;
        i++;
    });

    let script = `
<script>
function t396_onSuccess(form) {
    if (!form) return;
    if (form instanceof jQuery) {
        form = form.get(0);
    }

    /* номер заявки (Lead ID) */
    var leadId = form.tildaTranId;
    var orderId = form.tildaOrderId;

    /* Все поля заявки */
    var obj = {};
    var inputs = form.elements;
    Array.prototype.forEach.call(inputs, function (input) {
      if (input.type === 'radio') {
        if (input.checked) obj[input.name] = input.value;
      } else {
       obj[input.name] = input.value;
      }
    });


    // Получение UTM и ref данных
    var source_val = getGet("utm_source");
    var medium_val = getGet("utm_medium");
    var campaign_val = getGet("utm_campaign");
    var term_val = getGet("utm_term");
    var content_val = getGet("utm_content");
    var ref_val = getGet("ref");
    var current_url = window.location.origin + window.location.pathname;

    if (obj['type'] == 'data') {
        var gcform = document.querySelector('#НЕОБХОДИМО ДОБАВИТЬ ID ФОРМЫ');
        ${forms[formId].map(field => 
            `gcform.querySelector('[name="${field.name}"]').value = ${field.value};
        `
        ).join('')}

        document.forms["НЕОБХОДИМО ДОБАВИТЬ ID ФОРМЫ"].submit();
        }
}

function getGet(name) {
    var s = window.location.search;
    s = s.match(new RegExp(name + '=([^&=]+)'));
    return s ? decodeURI(s[1]) : false;
}
</script>`;
        // Создаем Blob из скрипта
        const blob = new Blob([script], {type: 'text/javascript'});
        
        // Создаем ссылку для скачивания
        const downloadLink = document.createElement('a');
        downloadLink.href = URL.createObjectURL(blob);
        downloadLink.download = 'form-script.js';
        
        // Добавляем ссылку на страницу и эмулируем клик
        document.body.appendChild(downloadLink);
        downloadLink.click();
        
        // Удаляем ссылку и освобождаем память
        document.body.removeChild(downloadLink);
        URL.revokeObjectURL(downloadLink.href);
}