const euroFormat = new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' });

/**
 * Erstellt ein Accordion an einem vorgegebenen Punkt, mit einem Inhalt der übergeben wird
 * @param {DOMElement} rootElement 
 * @param {object} element 
 * @param {DOMElement} body 
 * @param {string} linkName 
 */
export function createAccordion(rootElement, element, body, linkName) {
    // accordion
    const accordion = document.createElement("div");
    accordion.setAttribute("class", "accordion clickable");

    if (body !== null)
        accordion.setAttribute("class", "accordion clickable");
    else
        accordion.setAttribute("class", "accordion");

    // accordion Titel
    const accordionTitle = document.createElement("div");
    accordionTitle.setAttribute("class", "accordion-title");

    // accordion Titel Nummer
    const numberText = document.createElement("div");
    numberText.innerHTML = element.number;
    numberText.setAttribute("class", "title-number");
    accordionTitle.appendChild(numberText);

    // accordion Titel Name
    const titleText = document.createElement("div");
    titleText.setAttribute("class", "title-name");

    const titleLink = document.createElement("a");
    titleLink.innerHTML = element.name;
    titleLink.setAttribute("class", "title-link");
    titleLink.href = `html/detail.html?account=${linkName}`;
    //titleLink.target = "_blank";

    titleText.appendChild(titleLink);
    accordionTitle.appendChild(titleText);

    // accordion Titel Beschreibung
    const descriptionText = document.createElement("div");
    descriptionText.innerHTML = element.description ? element.description : "";
    descriptionText.setAttribute("class", "title-description");
    accordionTitle.appendChild(descriptionText);

    // accordion Titel Wert
    const balanceText = document.createElement("div");
    balanceText.innerHTML = euroFormat.format(element.balance);

    if (element.balance < 0)
        balanceText.setAttribute("class", "title-balance negative-number");
    else if (element.balance > 0)
        balanceText.setAttribute("class", "title-balance positive-number");
    else
        balanceText.setAttribute("class", "title-balance neutral-number");

    accordionTitle.appendChild(balanceText);

    // accordion Anzeige, ob Unterkonten vorhanden
    const indicatorText = document.createElement("div");
    indicatorText.innerHTML = element.subaccounts.length > 0 ? "↓" : "";
    indicatorText.setAttribute("class", "title-indicator");
    accordionTitle.appendChild(indicatorText);

    // accordion onclick handler
    accordionTitle.onclick = () => {
        if (accordion.querySelector(".accordion-content")) {
            closeAccordion(accordion);
        } else {
            const accordions = document.querySelectorAll(".accordion");
            //accordions.forEach((accordion) => closeAccordion(accordion));
            if (body !== null) openAccordion(accordion, body);
        }
    }

    accordion.appendChild(accordionTitle);
    rootElement.appendChild(accordion);
}

/**
 * Öffnet das Accordion
 * @param {DOMElement} accordion 
 * @param {DOMElement} body 
 */
function openAccordion(accordion, body) {
    // accordion Inhalt
    const accordionContent = document.createElement("div");
    accordionContent.setAttribute("class", "accordion-content");
    accordionContent.appendChild(body);

    accordion.appendChild(accordionContent);
    accordion.setAttribute("class", "accordion clickable open");
};


/**
 * Schließt das Accordion
 * @param {DOMElement} accordion 
 * @param {DOMElement} body 
 */
function closeAccordion(accordion) {
    accordion.setAttribute("class", "accordion clickable");
    const content = accordion.querySelector(".accordion-content");
    if (content)
        content.remove();
};