const saveButton = document.getElementById('saveButton');

function openTab(evt, tabName) {
    const tabContents = document.getElementsByClassName("tabcontent");
    for (let i = 0; i < tabContents.length; i++) {
        tabContents[i].style.display = "none";
    }
    document.getElementById(tabName).style.display = "block";

    const tablinks = document.getElementsByClassName("tablinks");
    for (let i = 0; i < tablinks.length; i++) {
        tablinks[i].className = tablinks[i].className.replace(" active", "");
    }
    evt.currentTarget.className += " active";
}

function addEntry(type) {
    let entryContainer;
    let newEntry;

    switch (type) {
        case 'typesWingedOffSet':
            entryContainer = document.getElementById('typesWingedOffSetEntries');
            const offsetIndex = document.getElementById('offsetIndex');
            const comment1 = document.getElementById('comment1');
            const northX = document.getElementById('northX');
            const northY = document.getElementById('northY');
            const eastX = document.getElementById('eastX');
            const eastY = document.getElementById('eastY');
            const southX = document.getElementById('southX');
            const southY = document.getElementById('southY');
            const westX = document.getElementById('westX');
            const westY = document.getElementById('westY');

            if (!entryContainer || !offsetIndex || !comment1 || !northX || !northY || !eastX || !eastY || !southX || !southY || !westX || !westY) {
                console.error('Uno o más elementos están faltando para typesWingedOffSet');
                return;
            }

            const offsetIndexValue = parseInt(offsetIndex.value);
            const northXValue = parseInt(northX.value);
            const northYValue = parseInt(northY.value);
            const eastXValue = parseInt(eastX.value);
            const eastYValue = parseInt(eastY.value);
            const southXValue = parseInt(southX.value);
            const southYValue = parseInt(southY.value);
            const westXValue = parseInt(westX.value);
            const westYValue = parseInt(westY.value);

            const existingEntry1 = Array.from(entryContainer.getElementsByClassName('entry')).find(entry => {
                return entry.innerText.includes(`[${offsetIndexValue}]`);
            });

            if (existingEntry1) {
                existingEntry1.innerHTML = `
    [${offsetIndexValue}] = { -- ${comment1.value}
        [North] = {x = ${northXValue}, y = ${northYValue}},
        [East] = {x = ${eastXValue}, y = ${eastYValue}},
        [South] = {x = ${southXValue}, y = ${southYValue}},
        [West] = {x = ${westXValue}, y = ${westYValue}},
    },`;
            } else {
                newEntry = `
<div class="entry">
    [${offsetIndexValue}] = { -- ${comment1.value}
        [North] = {x = ${northXValue}, y = ${northYValue}},
        [East] = {x = ${eastXValue}, y = ${eastYValue}},
        [South] = {x = ${southXValue}, y = ${southYValue}},
        [West] = {x = ${westXValue}, y = ${westYValue}},
    },
</div>`;
                entryContainer.innerHTML += newEntry;
            }
            break;

        case 'typesWingedMountedOffSet':
            entryContainer = document.getElementById('typesWingedMountedOffSetEntries');
            const mountedOffsetIndex = parseInt(document.getElementById('mountedOffsetIndex').value);
            const comment2 = document.getElementById('comment2').value;
            const mountedNorthX = parseInt(document.getElementById('mountedNorthX').value);
            const mountedNorthY = parseInt(document.getElementById('mountedNorthY').value);
            const mountedEastX = parseInt(document.getElementById('mountedEastX').value);
            const mountedEastY = parseInt(document.getElementById('mountedEastY').value);
            const mountedSouthX = parseInt(document.getElementById('mountedSouthX').value);
            const mountedSouthY = parseInt(document.getElementById('mountedSouthY').value);
            const mountedWestX = parseInt(document.getElementById('mountedWestX').value);
            const mountedWestY = parseInt(document.getElementById('mountedWestY').value);

            if (!entryContainer || isNaN(mountedOffsetIndex) || isNaN(mountedNorthX) || isNaN(mountedNorthY) || isNaN(mountedEastX) || isNaN(mountedEastY) || isNaN(mountedSouthX) || isNaN(mountedSouthY) || isNaN(mountedWestX) || isNaN(mountedWestY) || comment2 === undefined) {
                console.error('Uno o más elementos están faltando para typesWingedMountedOffSet');
                return;
            }

            const existingEntry2 = Array.from(entryContainer.getElementsByClassName('entry')).find(entry => {
                return entry.innerText.includes(`[${mountedOffsetIndex}]`);
            });

            if (existingEntry2) {
                existingEntry2.innerHTML = `
    [${mountedOffsetIndex}] = { -- ${comment2}
        [North] = {x = ${mountedNorthX}, y = ${mountedNorthY}},
        [East] = {x = ${mountedEastX}, y = ${mountedEastY}},
        [South] = {x = ${mountedSouthX}, y = ${mountedSouthY}},
        [West] = {x = ${mountedWestX}, y = ${mountedWestY}},
    },`;
            } else {
                newEntry = `
<div class="entry">
    [${mountedOffsetIndex}] = { -- ${comment2}
        [North] = {x = ${mountedNorthX}, y = ${mountedNorthY}},
        [East] = {x = ${mountedEastX}, y = ${mountedEastY}},
        [South] = {x = ${mountedSouthX}, y = ${mountedSouthY}},
        [West] = {x = ${mountedWestX}, y = ${mountedWestY}},
    },
</div>`;
                entryContainer.innerHTML += newEntry;
            }
            break;

        case 'WingsOffsets':
            entryContainer = document.getElementById('WingsOffsetsEntries');
            const wingID = parseInt(document.getElementById('wingID').value);
            const outfitID = parseInt(document.getElementById('outfitID').value);
            const comment3 = document.getElementById('comment3').value;

            if (!entryContainer || isNaN(wingID) || isNaN(outfitID) || comment3 === undefined) {
                console.error('Uno o más elementos están faltando para WingsOffsets');
                return;
            }

            const existingWingsEntry = Array.from(entryContainer.getElementsByClassName('entry')).find(entry => {
                return entry.innerText.includes(`[${wingID}]`);
            });

            if (existingWingsEntry) {
                existingWingsEntry.innerHTML = `
    [${wingID}] = { -- ${comment3}
        [${outfitID}] = typesWingedOffSet[1],
    },`;
            } else {
                newEntry = `
<div class="entry">
    [${wingID}] = { -- ${comment3}
        [${outfitID}] = typesWingedOffSet[],
    },
</div>`;
                entryContainer.innerHTML += newEntry;
            }
            break;

        case 'WingsMountedOffsets':
            entryContainer = document.getElementById('WingsMountedOffsetsEntries');
            const mountedWingID = parseInt(document.getElementById('mountedWingID').value);
            const mountedOutfitID = parseInt(document.getElementById('mountedOutfitID').value);
            const comment4 = document.getElementById('comment4').value;

            if (!entryContainer || isNaN(mountedWingID) || isNaN(mountedOutfitID) || comment4 === undefined) {
                console.error('Uno o más elementos están faltando para WingsMountedOffsets');
                return;
            }

            const existingMountedWingsEntry = Array.from(entryContainer.getElementsByClassName('entry')).find(entry => {
                return entry.innerText.includes(`[${mountedWingID}]`);
            });

            if (existingMountedWingsEntry) {
                existingMountedWingsEntry.innerHTML = `
    [${mountedWingID}] = { -- ${comment4}
        [${mountedOutfitID}] = typesWingedMountedOffSet[1],
    },`;
            } else {
                newEntry = `
<div class="entry">
    [${mountedWingID}] = { -- ${comment4}
        [${mountedOutfitID}] = typesWingedMountedOffSet[1],
    },
</div>`;
                entryContainer.innerHTML += newEntry;
            }
            break;
    }
}


// Rueda del mouse para cambiar valores
document.querySelectorAll('input[type="number"]').forEach(input => {
    input.addEventListener('wheel', (event) => {
        event.preventDefault();
        const delta = event.deltaY < 0 ? 1 : -1;
        input.value = parseInt(input.value) + delta;
    });
});

saveButton.addEventListener('click', saveStructure);

function saveStructure() {
    const typesWingedOffSetContent = document.getElementById('typesWingedOffSetEntries').innerText.trim();
    const typesWingedMountedOffSetContent = document.getElementById('typesWingedMountedOffSetEntries').innerText.trim();
    const wingsOffsetsContent = document.getElementById('WingsOffsetsEntries').innerText.trim();
    const wingsMountedOffsetsContent = document.getElementById('WingsMountedOffsetsEntries').innerText.trim();

    const content = `typesWingedOffSet = {\n${typesWingedOffSetContent}\n}\n\n` +
        `typesWingedMountedOffSet = {\n${typesWingedMountedOffSetContent}\n}\n\n` +
        `WingsOffsets = {\n${wingsOffsetsContent}\n}\n\n` +
        `WingsMountedOffsets = {\n${wingsMountedOffsetsContent}\n}`;

    const blob = new Blob([content], { type: 'text/plain;charset=utf-8' });
    const url = window.URL.createObjectURL(blob);

    const downloadLink = document.createElement('a');
    downloadLink.href = url;
    downloadLink.download = 'types_wings_structure.lua';
    downloadLink.click();

    window.URL.revokeObjectURL(url);
}