window.resources = []

async function loadResources(){

    window.resources = await api(API + "/resources/active")
    const resources = window.resources

    const mappings = await api(API + "/domainmap");

    const table = document.getElementById("resources");
    table.innerHTML = "";

    resources.forEach(r => {

        let ips = "";

        if(Array.isArray(r.ips)){
            ips = r.ips.map(ip =>
                "<span class='ip'>" + (ip.type || "") + " " + ip.ip + "</span>"
            ).join("");
        }

        let domains = mappings
            .filter(m => m.resource_id == r.id)
            .map(m => "<span class='ip'>🌐 " + m.domain_name + "</span>")
            .join("");

        const tr = document.createElement("tr");

        tr.innerHTML = `
        <td>
          <span style="cursor:pointer;color:#1e3a8a;font-weight:bold"
          onclick='openServerDetail(${JSON.stringify(r)})'>
          ${r.name}
          </span>
        </td>
        <td>${r.produkt || ""}</td>
        <td><span class="provider">${r.provider || ""}</span></td>
        <td id="status-${r.id}">...</td>

        <td>
        <div class="system">
        ${r.cpu ? r.cpu + " CPU" : ""}
        ${r.ram ? " • " + r.ram + " RAM" : ""}
        ${r.disk ? " • " + r.disk : ""}
        ${r.os ? " • " + r.os : ""}
        </div>
        </td>

        <td>${domains}</td>

        <td>
        ${ips}
        <br>
        <button onclick="openIPManager(${r.id})">IPs</button>
        </td>

        <td>

        <button onclick='openEdit(${JSON.stringify(r)})'>
        Edit
        </button>

        <button onclick="deleteResource(${r.id})">
        Delete
        </button>

        </td>
        `;

        table.appendChild(tr);
        checkServerStatus(r);

    });

}


async function loadDomains(){

const domains = await api(API + "/domains")
const subs = await api(API + "/subdomains")

const table = document.getElementById("domains")
table.innerHTML = ""

for(const d of domains){

const tr = document.createElement("tr")

const sublist = subs
.filter(s => s.domain_id === d.id)
.map(s => `
<div class="subdomain">

↳ ${s.subdomain}.${s.domain_name}
<span id="subdns-${s.id}">...</span>

<button onclick="deleteSub(${s.id})">Delete</button>

</div>
`)

.join("");


tr.innerHTML = `
<td>
${d.domain_name}
${sublist}
</td>

<td><span class="provider">${d.provider || ""}</span></td>
<td>${d.ip_address || ""}</td>
<td>${d.resource_name || ""}</td>
<td id="dns-${d.id}">...</td>
<td>${d.yearly_cost || ""}</td>

<td>
<button onclick='openDomainEdit(${JSON.stringify(d)})'>Edit</button>
<button onclick="deleteDomain(${d.id})">Delete</button>
<button onclick="openSubCreate(${d.id},'${d.domain_name}')">
+ Subdomain
</button>
</td>
`;
table.appendChild(tr)
subs
.filter(s => s.domain_id === d.id)
.forEach(async s => {

const full = s.subdomain + "." + s.domain_name

try{

const dns = await api(API + "/dns/" + full)

let status="❌"

if(dns.ips && dns.ips.includes(s.ip_address)){
status="✅" + dns.ips.join(", ")
}else if(dns.ips.length){
status="⚠"  + dns.ips.join(", ")
}

document.getElementById("subdns-"+s.id).innerHTML=status

}catch(e){

document.getElementById("subdns-"+s.id).innerHTML="❌"

}

})


try{

const dnsRes = await fetch(API + "/dns/" + d.domain_name)
const result = await dnsRes.json()

let status = "❌"

if(result.ips && result.ips.length){

const ipList = result.ips.join("<br>")

if(d.ip_address && result.ips.includes(d.ip_address)){
status = "✅ " + ipList
}else{
status = "⚠ " + ipList
}

}

document.getElementById("dns-"+d.id).innerHTML = status

}catch(e){

document.getElementById("dns-"+d.id).innerHTML = "❌"

}

}

}



async function deleteDomain(id){

    if(!confirm("Domain löschen?")) return;

    await api(API + "/domains/" + id, {
        method: "DELETE"
    });

    loadDomains();
}

async function loadMapping(){

    const data = await api(API + "/domainmap");

    const table = document.getElementById("mapping");
    table.innerHTML = "";

    data.forEach(m => {

        const tr = document.createElement("tr");

        tr.innerHTML = `
            <td>${m.domain_name}</td>
            <td>${m.ip_address}</td>
            <td>${m.server_name || ""}</td>
        `;

        table.appendChild(tr);

    });

}

function openIPManager(resourceId){

document.getElementById("ip_resource_id").value = resourceId
document.getElementById("ipModal").style.display = "block"

loadIPs(resourceId)

}

function closeIPModal(){

document.getElementById("ipModal").style.display = "none"

}

async function loadIPs(resourceId){

const ips = await api(API + "/resources/" + resourceId + "/ips")

const container = document.getElementById("ipList")
container.innerHTML = ""

ips.forEach(ip=>{

const div = document.createElement("div")

div.innerHTML = `
${ip.ip} (${ip.type||""}) ${ip.comment||""}
<button onclick="deleteIP(${ip.id},${resourceId})">Delete</button>
`

container.appendChild(div)

})

}

async function saveIP(){

const resourceId = document.getElementById("ip_resource_id").value

const ip = document.getElementById("new_ip").value
const type = document.getElementById("new_type").value
const comment = document.getElementById("new_comment").value

await api("/resman/api/resources/"+resourceId+"/ips",{
method:"POST",
headers:{'Content-Type':'application/json'},
body:JSON.stringify({ip,type,comment})
})

loadIPs(resourceId)
loadResources()

}

function openCreate(){

document.getElementById("modalTitle").innerText = "Create Resource"
document.getElementById("resource_id").value = ""

document.querySelectorAll("#resourceModal input, #resourceModal textarea")
.forEach(e=>e.value="")

document.getElementById("status").value = "aktiv"

document.getElementById("resourceModal").style.display = "block"

}


function openEdit(resource){

document.getElementById("modalTitle").innerText = "Edit Resource"

document.getElementById("resource_id").value = resource.id

Object.keys(resource).forEach(k=>{

const el = document.getElementById(k)

if(el) el.value = resource[k] || ""

})

document.getElementById("resourceModal").style.display = "block"

}

function closeModal(){

document.getElementById("resourceModal").style.display="none"

}

async function saveResource(){

const id = document.getElementById("resource_id").value

let kostenMonat=document.getElementById("kosten_monat").value
let kostenJahr=document.getElementById("kosten_jahr").value

if(kostenMonat) kostenMonat=kostenMonat.replace(",",".")
if(kostenJahr) kostenJahr=kostenJahr.replace(",",".")


const data={

name:document.getElementById("name").value,
produkt:document.getElementById("produkt").value,
provider:document.getElementById("provider").value,
art:document.getElementById("art").value,

cpu:document.getElementById("cpu").value,
ram:document.getElementById("ram").value,
disk:document.getElementById("disk").value,
os:document.getElementById("os").value,

kosten_monat:kostenMonat || null,
kosten_jahr:kostenJahr || null,

providername:document.getElementById("providername").value,
ipv6_net:document.getElementById("ipv6_net").value,

bestelldatum:document.getElementById("bestelldatum").value || null,
kuendbar_ab:document.getElementById("kuendbar_ab").value || null,
kuendigungsdatum:document.getElementById("kuendigungsdatum").value || null,

status:document.getElementById("status").value,
bemerkung:document.getElementById("bemerkung").value

}


if(id){

await api(API+"/resources/"+id,{
method:"PUT",
headers:{'Content-Type':'application/json'},
body:JSON.stringify(data)
})

}else{

await api(API+"/resources",{
method:"POST",
headers:{'Content-Type':'application/json'},
body:JSON.stringify(data)
})

}

closeModal()

loadResources()
loadCancelled()
loadCosts()
loadInfrastructure()

}


function openDomainCreate(){

document.getElementById("domainModalTitle").innerText="Create Domain"

document.getElementById("domain_id").value=""

document.getElementById("domain_name").value=""
document.getElementById("domain_provider").value=""
document.getElementById("domain_ip").value=""
document.getElementById("domain_cost").value=""
document.getElementById("domain_notes").value=""

document.getElementById("domainModal").style.display="block"

}

function openDomainEdit(d){

document.getElementById("domainModalTitle").innerText="Edit Domain"

document.getElementById("domain_id").value=d.id

document.getElementById("domain_name").value=d.domain_name||""
document.getElementById("domain_provider").value=d.provider||""
document.getElementById("domain_ip").value=d.ip_address||""
document.getElementById("domain_cost").value=d.yearly_cost||""
document.getElementById("domain_notes").value=d.notes||""

document.getElementById("domainModal").style.display="block"

}

function closeDomainModal(){

document.getElementById("domainModal").style.display="none"

}

async function saveDomain(){

const id=document.getElementById("domain_id").value

let cost=document.getElementById("domain_cost").value

if(cost){
cost=cost.replace(",",".")
}

const data={

domain_name:domain_name.value,
provider:domain_provider.value,
ip_address:domain_ip.value,
yearly_cost:cost || null,
notes:domain_notes.value

}

if(id){

await api(API+"/domains/"+id,{
method:"PUT",
headers:{'Content-Type':'application/json'},
body:JSON.stringify(data)
})

}else{

await api(API+"/domains",{
method:"POST",
headers:{'Content-Type':'application/json'},
body:JSON.stringify(data)
})

}

closeDomainModal()

loadDomains()
loadMapping()
loadCosts()

}

async function loadCancelled(){

const res = await api(API+"/resources/cancelled")

const table = document.getElementById("cancelled")

table.innerHTML=""

res.forEach(r=>{

const tr=document.createElement("tr")

tr.innerHTML=`

<td>${r.name}</td>
<td>${r.produkt||""}</td>
<td><span class="provider">${r.provider || ""}</span></td>
<td>${r.cpu||""}</td>
<td>${r.ram||""}</td>
<td>${r.disk||""}</td>
<td>gekündigt</td>

`

table.appendChild(tr)

})

}

async function loadCosts(){

const resources = await api(API+"/resources/active")
const domains = await api(API+"/domains")

let month = 0
let year = 0
let domainYear = 0

resources.forEach(r=>{

let m = Number(r.kosten_monat || 0)
let y = Number(r.kosten_jahr || 0)

if(m){
month += m
}else if(y){
month += y / 12
}

if(y){
year += y
}else if(m){
year += m * 12
}

})

domains.forEach(d=>{
domainYear += Number(d.yearly_cost || 0)
})

document.getElementById("costMonth").innerText = month.toFixed(2)
document.getElementById("costYear").innerText = year.toFixed(2)
document.getElementById("costDomain").innerText = domainYear.toFixed(2)
document.getElementById("costTotal").innerText = (year + domainYear).toFixed(2)

}

async function loadInfrastructure(){

const resources = await api(API + "/resources/active")
const mappings = await api(API + "/domainmap")

let html = ""

resources.forEach(r => {

html += `
<div style="margin-bottom:20px;border:1px solid #ddd;padding:10px;border-radius:6px">

<b>${r.name}</b><br>
Produkt: ${r.produkt || ""}<br>
CPU: ${r.cpu || ""} | RAM: ${r.ram || ""} | Disk: ${r.disk || ""}<br>
OS: ${r.os || ""}

<br><br>
`

if(Array.isArray(r.ips)){

r.ips.forEach(ip => {

html += `
<div style="margin-left:20px">

<b>IP:</b> ${ip.ip} (${ip.type || ""})
`

const domains = mappings.filter(m => m.ip_address == ip.ip)

domains.forEach(d => {

html += `
<div style="margin-left:20px;color:#444">
🌐 ${d.domain_name}
</div>
`

})

html += "</div>"

})

}

html += "</div>"

})

document.getElementById("infraView").innerHTML = html

}


async function checkServerStatus(resource){

    if(!Array.isArray(resource.ips)) return;

    // zuerst public IP suchen
    let ip = resource.ips.find(i =>
        i.type && i.type.toLowerCase().includes("public")
    );

    // wenn keine public IP existiert → erste nehmen
    if(!ip){
        ip = resource.ips[0];
    }

    if(!ip) return;

    try{

        const res = await fetch(API + "/ping/" + ip.ip);
        const data = await res.json();

        let icon = "🔴";

        if(data.status === "online"){
            icon = "🟢";
        }

        const el = document.getElementById("status-" + resource.id);

        if(el){
            el.innerHTML = icon;
        }

    }catch(e){
        console.log("Ping error", e);
    }

}


async function deleteResource(id){

    if(!confirm("delete resource?")) return;

    await api(API + "/resources/" + id,{
        method:"DELETE"
    });

    loadResources();
    loadCosts();

}

async function deleteIP(id, resourceId){

    await api(API + "/ips/" + id,{
        method:"DELETE"
    });

    loadIPs(resourceId);
    loadResources();

}


async function openServerDetail(resource){

const mappings = await api(API+"/domainmap")

let html = `

<b>Name:</b> ${resource.name}<br>
<b>Produkt:</b> ${resource.produkt || ""}<br>
<b>Provider:</b> ${resource.provider || ""}<br>
<b>Provider Name:</b> ${resource.providername || ""}

<br><br>

<b>System</b><br>
CPU: ${resource.cpu || ""}<br>
RAM: ${resource.ram || ""}<br>
Disk: ${resource.disk || ""}<br>
OS: ${resource.os || ""}

<br><br>

<b>IPs</b><br>
`

if(Array.isArray(resource.ips)){

resource.ips.forEach(ip=>{
html += `<div class="ip">${ip.type || ""} ${ip.ip}</div>`
})

}

html += `<br><b>Domains</b><br>`

const domains = mappings.filter(m => m.resource_id == resource.id)

domains.forEach(d=>{
html += `<div class="ip">🌐 ${d.domain_name}</div>`
})

html += `

<br>

<b>Bestelldatum:</b> ${resource.bestelldatum || ""}<br>
<b>Kündbar ab:</b> ${resource.kuendbar_ab || ""}

<br><br>

<b>Bemerkung</b><br>
${resource.bemerkung || ""}

`
const subs = await api(API + "/subdomains")

html += "<br><b>Subdomains</b><br>"

if(Array.isArray(resource.ips)){

subs.forEach(s => {

const match = resource.ips.find(ip => ip.ip === s.ip_address)

if(match){
html += `<div class="ip">🌐 ${s.subdomain}.${s.domain_name}</div>`
}

})

}

/* jetzt erst rendern */

document.getElementById("serverDetailContent").innerHTML = html
document.getElementById("serverDetailModal").style.display="block"

}


function closeServerDetail(){

document.getElementById("serverDetailModal").style.display="none"

}


document.addEventListener("click", function(event){

    const modal = document.getElementById("serverDetailModal");

    if(!modal) return;

    if(event.target === modal){
        modal.style.display = "none";
    }

});


document.addEventListener("keydown", function(e){

    if(e.key === "Escape"){
        const modal = document.getElementById("serverDetailModal");
        if(modal) modal.style.display="none";
    }

});


router.delete("/:id", async (req,res)=>{

await db.query("DELETE FROM subdomains WHERE id=?",[req.params.id])

res.json({success:true})

})

function openSubCreate(domainId){

document.getElementById("sub_domain_id").value=domainId

document.getElementById("sub_name").value=""
document.getElementById("sub_ip").value=""

document.getElementById("subdomainModal").style.display="block"

}

function closeSubModal(){

document.getElementById("subdomainModal").style.display="none"

}

async function saveSubdomain(){

const domain_id=document.getElementById("sub_domain_id").value

const subdomain=document.getElementById("sub_name").value
const ip_address=document.getElementById("sub_ip").value

await api(API+"/subdomains",{
method:"POST",
headers:{'Content-Type':'application/json'},
body:JSON.stringify({
domain_id,
subdomain,
ip_address
})
})

closeSubModal()

loadDomains()

}