document.addEventListener('DOMContentLoaded', () => {
    window.YMM_APP.init();
});

document.addEventListener('shopify:section:load', () => {
    console.log("YMM: Sekcja przeładowana w edytorze.");
    window.YMM_APP.init();
});

window.YMM_APP = {
    config: {},
    storeId: null,
    apiHost: null,
    formFields: [],
    mappingManufacturer: {},

    init: async function() {
        this.config = window.YMM_CONFIG || {};
        this.storeId = this.config.permanent_domain;
        this.apiHost = `https://3cerp.eu/api/shopify/catalogue/?shop=${this.storeId}`;
        
        console.log("YMM Loaded (Auto-Select Version) for shop:", this.storeId);

        try {
            let res = await fetch(this.apiHost, { method: "POST" }).then((data) => data.json());
            if (!res || res.length === 0) return;
            
            let mapping = {};
            res.forEach((item) => mapping[item._id] = item.name);
            this.mappingManufacturer = mapping;

            this.formFields = res.map((item) => {
                 const fieldsList = item.fields || [];
                 return {
                      idForm: item.name, 
                      fields: fieldsList.map((field) => ({
                           id: field.field,
                           name: field.name,
                           control: "select",
                           disabled: true,
                      })),
                 };
            });
            
            const manufacturerSelect = document.querySelector(`[field="manufacturer"]`);
            if (manufacturerSelect) {
                this.clearSelect(manufacturerSelect);
                
                let placeholder = document.createElement("option");
                placeholder.text = this.config.text_manufacturer || "Wybierz producenta"; 
                placeholder.value = "";
                placeholder.disabled = true;
                placeholder.selected = true;
                manufacturerSelect.appendChild(placeholder);

                res.forEach((item) => {
                     let optionHTML = document.createElement("option");
                     optionHTML.setAttribute("value", item._id); 
                     optionHTML.innerHTML = item.name;
                     manufacturerSelect.appendChild(optionHTML);
                });

                // ==========================================
                // LOGIKA: DOMYŚLNY PRODUCENT Z USTAWIEŃ
                // ==========================================
                let defaultManName = this.config.default_manufacturer ? this.config.default_manufacturer.trim().toLowerCase() : "";
                let matchedManufacturerId = null;

                if (defaultManName) {
                    // Szukamy po nazwie (ignorując wielkość liter)
                    let matchedObj = res.find(m => m.name.toLowerCase() === defaultManName);
                    if (matchedObj) {
                        matchedManufacturerId = matchedObj._id;
                    } else {
                        console.warn(`YMM: Nie znaleziono producenta o nazwie "${this.config.default_manufacturer}"`);
                    }
                }

                if (matchedManufacturerId) {
                    // Mamy dopasowanie! 
                    // 1. Ukrywamy całkowicie kontener (div) z tym polem select
                    if (manufacturerSelect.parentElement) {
                        manufacturerSelect.parentElement.style.display = 'none';
                    }
                    // 2. Ustawiamy mu wartość (niewidoczną dla oka, ale potrzebną formularzowi)
                    manufacturerSelect.value = matchedManufacturerId;
                    
                    // 3. Odpalamy logikę tworzenia kolejnych pól
                    this.handleSelectManufacturer(matchedManufacturerId);
                } else {
                    // Standardowy tryb (jeśli pusto lub zły wpis) – patrzymy na adres URL
                    await this.setManufacturerAfterRefresh();
                }
            }

        } catch (error) {
            console.error("Critical Init Error:", error);
        }
    },

    normalizeName: function(name) {
        if (!name) return "";
        return name.toLowerCase();
    },

    clearSelect: function(selectHTML) {
        if (!selectHTML) return;
        selectHTML.innerHTML = ""; 
    },

    getFormValues: function(fieldsID = []) {
        const formHTML = document.getElementById("catalogueForm");
        if (!formHTML) return {};

        const data = {
             manufacturer: null, make: null, peryear: null, year: null, 
             model: null, variant: null, engine: null
        };
   
        fieldsID.forEach((requestedItem) => {
             let selector = `[field="${requestedItem}"]`;
             let input = formHTML.querySelector(selector);
             let value = input?.value ?? null;
             data[requestedItem] = value;
        });
        return { ...data };
   },

    getOptionsToSelect: async function(query, method, formData) {
        try {
             let res = await fetch(query, { method: method, body: formData }).then((res) => res.json());
             if (!res || res.length === 0) return [];
   
             if (typeof res[0] === 'string' || typeof res[0] === 'number') {
                  return res.map((item) => ({ _id: item, name: item }));
             }
             return res;
        } catch (error) {
             console.error("Error in getOptionsToSelect:", error);
             return [];
        }
    },

    createForm: function(manufacturerId) {
        const container = document.getElementById("form-catalogue__structure_container");
        if (!container) return;

        let manufacturerName = this.mappingManufacturer[manufacturerId];
        const currentFormObj = this.formFields.find((item) => item.idForm === manufacturerName);
        const currentForm = currentFormObj?.fields ?? undefined;
        
        if (!currentForm) return;
   
        currentForm.forEach((field) => {
             if (field.control === "select") {
                  let selectHTML = document.createElement(field.control);
                  let selectID = [field.id].join("");
                  
                  selectHTML.setAttribute("field", selectID);
                  selectHTML.setAttribute("manufacturer", manufacturerId); 
                  selectHTML.setAttribute("disabled", true);
                  
                  selectHTML.setAttribute(
                       "onchange",
                       `window.YMM_APP.handleFieldChange('${manufacturerId}', '${selectID}', event.target.value)`
                  );
                  
                  selectHTML.classList.add("form-catalogue__select");
                  
                  let optionHTML = document.createElement("option");
                  optionHTML.setAttribute("value", "");
                  optionHTML.setAttribute("disabled", true);
                  optionHTML.setAttribute("selected", true);
                  optionHTML.innerText = field.name; 
                  
                  selectHTML.appendChild(optionHTML);
                  container.appendChild(selectHTML);
             }
        });
    },

    handleFieldChange: function(manufacturerId, fieldId, value) {
        this.enableDisableFieldsInsideForm(manufacturerId, fieldId);
        this.resetValuesNextSteps(manufacturerId, fieldId);
        this.lockOrUnlockSubmit(manufacturerId);
        this.setParamsFromForm(fieldId, value);
        this.getItemsToNextField(fieldId, manufacturerId);
        this.resetResults();
    },

    enableDisableFieldsInsideForm: function(manufacturerId, field) {
        let manufacturerName = this.mappingManufacturer[manufacturerId];
        let fieldSequence = this.formFields.find((item) => item.idForm === manufacturerName)?.fields.map((item) => item.id);
        if (!fieldSequence) return;
        
        let formHTML = document.getElementById("catalogueForm");
        
        if (field === "manufacturer") {
             let firstFieldId = fieldSequence[0];
             let fieldToUnlock = formHTML.querySelector(`[field="${firstFieldId}"]`);
             if (fieldToUnlock) fieldToUnlock.removeAttribute("disabled");
             return;
        }
        
        const normalizedCurrentField = this.normalizeName(field);
        const currentIndex = fieldSequence.findIndex((item) => this.normalizeName(item) === normalizedCurrentField);
        
        fieldSequence.forEach((item, index) => {
             let fieldToUpdate = formHTML.querySelector(`[field="${item}"]`);
             if (fieldToUpdate) {
                  if (index <= currentIndex + 1) {
                       fieldToUpdate.removeAttribute("disabled");
                  } else {
                       fieldToUpdate.setAttribute("disabled", true);
                  }
             }
        });
    },

    handleSelectManufacturer: function(id) {
         const container = document.getElementById("form-catalogue__structure_container");
         if(container) container.innerHTML = ""; 

         this.createForm(id); 
         this.enableDisableFieldsInsideForm(id, "manufacturer"); 
         this.getItemsToNextField("manufacturer", id);
    },

    getSelectItems: async function(id, manufacturerId) {
        try {
             const selectHTML = document.querySelector(`[field="${id}"]`);
             if (!selectHTML) return;
   
             let url = this.apiHost;
             let formData = new FormData();
             
             if (id !== "manufacturer") {
                 this.clearSelect(selectHTML);
                 selectHTML.classList.add("loading");
                 selectHTML.disabled = true; 
                 
                 let loadingOption = document.createElement("option");
                 loadingOption.innerText = this.config.text_loading || "Loading...";
                 selectHTML.appendChild(loadingOption);
             }

             const manufacturerName = this.mappingManufacturer[manufacturerId];
             const normalizedId = this.normalizeName(id);

             if (normalizedId === "make") {
                  formData.append("manufacturergroup", manufacturerId);
                  formData.append("field", id);
             }
             if (normalizedId === "peryear") {
                  let { make } = this.getFormValues(["make"]);
                  formData.append("manufacturergroup", manufacturerId);
                  formData.append("make", make);
                  formData.append("field", id);
             }
             if (normalizedId === "year") {
                  let { make, model } = this.getFormValues(["make", "model"]);
                  formData.append("manufacturergroup", manufacturerId);
                  if (make) formData.append("make", make);
                  if (model) formData.append("model", model);
                  formData.append("field", id);
             }
             if (normalizedId === "model") {
                  let fieldSequence = this.formFields.find((item) => item.idForm === manufacturerName)?.fields.map((item) => item.id);
                  let { make, peryear } = this.getFormValues(["make", "peryear"]);
                  
                  formData.append("manufacturergroup", manufacturerId);
                  formData.append("make", make);
                  
                  const hasPerYear = fieldSequence.some(f => this.normalizeName(f) === "peryear");
                  if (hasPerYear) {
                       formData.append("peryear", peryear);
                  }
                  formData.append("field", id);
             }
             if (normalizedId === "variant") {
                  if (manufacturerName === "ACL" || manufacturerName === "ARP") {
                       let { engine } = this.getFormValues(["engine"]);
                       formData.append("manufacturergroup", manufacturerId);
                       formData.append("engine", engine);
                  } else {
                       let { make, peryear, model } = this.getFormValues(["make", "peryear", "model"]);
                       formData.append("manufacturergroup", manufacturerId);
                       if (make) formData.append("make", make);
                       if (peryear) formData.append("peryear", peryear);
                       if (model) formData.append("model", model);
                  }
                  formData.append("field", id);
             }
             if (normalizedId === "engine") {
                  if (manufacturerName === "ACL" || manufacturerName === "ARP") {
                       let { make } = this.getFormValues(["make"]);
                       formData.append("manufacturergroup", manufacturerId);
                       if (make) formData.append("make", make);
                  } else {
                       let { make, peryear, model, variant } = this.getFormValues(["make", "peryear", "model", "variant"]);
                       formData.append("manufacturergroup", manufacturerId);
                       if (make) formData.append("make", make);
                       if (peryear) formData.append("peryear", peryear);
                       if (model) formData.append("model", model);
                       if (variant) formData.append("variant", variant);
                  }
                  formData.append("field", id);
             }
   
             const options = await this.getOptionsToSelect(url, "POST", formData);
             
             selectHTML.classList.remove("loading");
             this.clearSelect(selectHTML); 
             
             if (options && options.length > 0) {
                 selectHTML.removeAttribute("disabled");
                 
                 let placeholder = document.createElement("option");
                 placeholder.text = "Wybierz opcję"; 
                 placeholder.value = "";
                 placeholder.disabled = true;
                 placeholder.selected = true;
                 selectHTML.appendChild(placeholder);
             }

             options.forEach((item) => {
                  let optionHTML = document.createElement("option");
                  const val = item._id || item;
                  const txt = item.name || item;
                  optionHTML.setAttribute("value", val);
                  optionHTML.innerHTML = txt;
                  selectHTML.appendChild(optionHTML);
             });
             
        } catch (error) {
             console.error("Error in getSelectItems:", error);
             const selectHTML = document.querySelector(`[field="${id}"]`);
             if (selectHTML) selectHTML.classList.remove("loading");
        }
    },

    getItemsToNextField: async function(currentFieldId, manufacturerId) {
        let manufacturerName = this.mappingManufacturer[manufacturerId];
        let fieldSequence = this.formFields.find((item) => item.idForm === manufacturerName)?.fields.map((item) => item.id);
        if (!fieldSequence) return;
        
        if (currentFieldId === "manufacturer") {
             return await this.getSelectItems(fieldSequence[0], manufacturerId);
        }
        
        const normalizedCurrent = this.normalizeName(currentFieldId);
        const indexOfCurrentField = fieldSequence.findIndex((item) => this.normalizeName(item) === normalizedCurrent);
        
        if (indexOfCurrentField + 1 >= fieldSequence.length) return;
        
        let nextFieldId = fieldSequence[indexOfCurrentField + 1];
        return await this.getSelectItems(nextFieldId, manufacturerId);
    },

    resetValuesNextSteps: function(manufacturerId, field) {
        let manufacturerName = this.mappingManufacturer[manufacturerId];
        let fieldSequence = this.formFields.find((item) => item.idForm === manufacturerName)?.fields.map((item) => item.id);
        if (!fieldSequence) return;
        
        let formHTML = document.getElementById("catalogueForm");
        if (field === "manufacturer") return;
        
        const normalizedCurrent = this.normalizeName(field);
        const currentIndex = fieldSequence.findIndex((item) => this.normalizeName(item) === normalizedCurrent);

        fieldSequence.forEach((item, index) => {
             let fieldToresetValue = formHTML.querySelector(`[field="${item}"]`);
             if (fieldToresetValue && index > currentIndex) {
                  fieldToresetValue.value = "";
                  this.clearSelect(fieldToresetValue);
                  fieldToresetValue.setAttribute("disabled", true);
             }
        });
    },

    lockOrUnlockSubmit: function(manufacturerId) {
        let submitHTML = document.getElementById("submitForm");
        let manufacturerName = this.mappingManufacturer[manufacturerId];
        let fieldSequence = this.formFields.find((item) => item.idForm === manufacturerName)?.fields.map((item) => item.id);
        if (!fieldSequence) return;
        
        let data = this.getFormValues(fieldSequence);
        let readyToUnLock = fieldSequence.every((item) => {
             let key = item;
             return data[key];
        });
        
        if (readyToUnLock) {
            submitHTML.removeAttribute("disabled");
        } else {
            submitHTML.setAttribute("disabled", true);
        }
    },

    setParamsFromForm: function(id, value) {
        const url = new URL(window.location);
        if (!id || !value || !["manufacturer"].includes(id)) return;
        url.searchParams.set(id, value);
        window.history.replaceState({}, "", url);
    },

    resetResults: function() {
        const results = document.getElementById("catalogue-results");
        if(results) results.innerHTML = "";
    },

    setManufacturerAfterRefresh: async function() {
        if (Object.keys(this.mappingManufacturer).length === 0) return;
        let url = new URL(window.location);
        let currentManufacturerId = url.searchParams.get("manufacturer");
        
        if (!currentManufacturerId || !this.mappingManufacturer[currentManufacturerId]) return;

        let manufacturerSelectHTML = document.querySelector(`[field="manufacturer"]`);
        if(manufacturerSelectHTML) {
            manufacturerSelectHTML.value = currentManufacturerId;
            this.handleSelectManufacturer(currentManufacturerId);
        }
    },

    getResult: async function(event) {
        event.preventDefault();
        const productLoader = document.getElementById("productLoader");
        const resultsContainer = document.getElementById("catalogue-results");
        const themeSectionId = window.YMM_CONFIG.section_id || 'main-search';
        
        try {
             if(productLoader) productLoader.style.display = "block";
             if(resultsContainer) resultsContainer.innerHTML = "";
             
             let data = this.getFormValues(["manufacturer", "make", "peryear", "year", "model", "variant", "engine"]);
             let formData = new FormData();
             for (const key in data) {
                  if (data[key]) formData.append(key === "manufacturer" ? "manufacturergroup" : key, data[key]);
             }
             formData.append("show", true);
             formData.append("currency", window.Shopify?.currency?.active || 'EUR');
             formData.append("exchangerate", window.Shopify?.currency?.rate || 1);

             let apiResponse = await fetch(this.apiHost, { method: "POST", body: formData }).then((res) => res.json());

             if (!apiResponse || apiResponse.length === 0) {
                  resultsContainer.innerHTML = '<div class="rte" style="text-align:center"><p>Nie znaleziono produktów.</p></div>';
                  if(productLoader) productLoader.style.display = "none";
                  return;
             }
             const handles = apiResponse.map(item => item.handle).filter(Boolean).slice(0, 40);
             if (handles.length === 0) {
                 resultsContainer.innerHTML = '<p>Błąd danych produktu.</p>';
                 if(productLoader) productLoader.style.display = "none";
                 return;
             }
             const query = handles.map(h => `handle:${h}`).join(' OR ');

             if (window.YMM_CONFIG.results_mode === 'redirect') {
                 const redirectUrl = `${window.Shopify.routes.root}search?type=product&q=${encodeURIComponent(query)}`;
                 window.location.href = redirectUrl; 
                 return; 
             }
             
             const searchUrl = `${window.Shopify.routes.root}search?section_id=${themeSectionId}&type=product&q=${encodeURIComponent(query)}`;
             
             const response = await fetch(searchUrl);
             if (!response.ok) throw new Error("Shopify Search API Error");
             const text = await response.text();
             
             const parser = new DOMParser();
             const doc = parser.parseFromString(text, 'text/html');

             const fetchedStyles = doc.querySelectorAll('link[rel="stylesheet"], style');
             if (fetchedStyles.length > 0) {
                 const head = document.getElementsByTagName('head')[0];
                 fetchedStyles.forEach((styleNode) => {
                     let exists = false;
                     if (styleNode.tagName === 'LINK') {
                         exists = document.querySelector(`link[href="${styleNode.getAttribute('href')}"]`);
                     }
                     if (!exists) {
                         head.appendChild(styleNode.cloneNode(true));
                     }
                 });
             }
             
             const newGrid = doc.querySelector('#product-grid') || doc.querySelector('.product-grid') || doc.querySelector('.grid');
             
             if (newGrid) {
                 resultsContainer.innerHTML = newGrid.innerHTML;
                 resultsContainer.className = newGrid.className; 
             } else {
                 resultsContainer.innerHTML = "<p>Błąd wyświetlania wyników.</p>";
             }
             if(productLoader) productLoader.style.display = "none";
        } catch (error) {
             console.error("Error in getResult:", error);
             if(productLoader) productLoader.style.display = "none";
             if(resultsContainer) resultsContainer.innerHTML = "<p>Wystąpił błąd.</p>";
        }
    }
};

window.handleSelectManufacturer = (id) => window.YMM_APP.handleSelectManufacturer(id);
window.getResult = (e) => window.YMM_APP.getResult(e);