Source: modules/usernotes.js

import { CockpitUser } from "../lib/classes.js?cb=20240904-01";
import { cockpitDebugMessage, cockpitSystemMessage, getElement, isMainpage } from "../lib/functions.js?cb=20240904-01";

/**
 * Neue Notiz an den Body hinzufügen
 * @param {number} id 
 * @param {string} headline_class 
 * @returns {HTMLElement}
 */
function newEntryHTML (id, headline_class) {
    const html =
        `<div class="card">
            <div class="card-headline ${ headline_class }">
                <span id="headline_${ id }">Neuer Eintrag</span>
                <span class="right pointer usno-headline-edit" data-tooltip="Überschrift bearbeiten" forentry="${ id }">
                    <i class="fa-solid fa-pen-to-square"></i>
                </span>
            </div>
            <div class="card-body">
                <div class="editor pell-content" contenteditable="true" id="content_${ id }"></div>
                <button class="button button-success button-round usno-save-content" forentry="${ id }">Speichern</button>
            </div>
        </div>`;
    return html;
}

/**
 * HTML für die Notizen-Seite generieren
 * @param {CockpitUser} cockpitUser 
 * @returns {HTMLElement}
 */
function insertBodyHTML (cockpitUser) {
    const notes = cockpitUser.usernotes,
        settings = cockpitUser.settings.usernotes;

    let html = "";

    for (const [idx, { headline, content }] of notes.entries()) {
        html += `<div class="card">
                    <div class="card-headline ${ settings.headline_class }">
                        <span id="headline_${ idx }">${ headline }</span>
                        <span class="right pointer usno-headline-edit" data-tooltip="Überschrift bearbeiten" forentry="${ idx }">
                            <i class="fa-solid fa-pen-to-square"></i>
                        </span>
                    </div>
                    <div class="card-body">
                        <div class="editor pell-content" contenteditable="true" id="content_${ idx }">
                            ${ content }
                        </div>
                        <button class="button button-success button-round usno-save-content" forentry="${ idx }">Speichern</button>
                    </div>
                </div>`;
    }

    return html;
}

/**
 * 
 * @param {CockpitUser} cockpitUser 
 * @param {boolean} isMain 
 */
function writeNotesToAd (cockpitUser, isMain) {
    const notes = cockpitUser.usernotes,
        settings = cockpitUser.settings.usernotes;

    const addCardBodyClass = bol => bol ? "" : "cockpit-hide";

    let html = "";

    for (const { headline, content } of notes) {
        html += `<div class="card">
                    <div class="card-headline ${ settings.headline_class } cockpit-notes-toggle">${ headline }</div>
                    <div class="card-body">
                        <div class="editor ${ addCardBodyClass(settings.show_on_top) }">${ content }</div>
                    </div>
                </div>`;
    }

    getElement(isMain, "#usno_notes").html(html);
}

/**
 * HTML für das ehemalige Werbefeld generieren
 * @returns {HTMLElement}
 */
function appendAdHTML () {
    const html =
        `<div>
            <div style="text-align:center;">
                Spielernotizen
                <i
                    class="fa-solid fa-pen-to-square frame-opener"
                    frame="1/3/4/5"
                    frame-url="script/resi-cockpit/usernotes"
                    style="cursor:pointer;"
                    data-tooltip="Neue Notiz anlegen oder Notizen verwalten"
                >
                </i>
            </div>
            <div id="usno_notes"></div>
        </div>`;
    return html;
}

/**
 * Neue Notizen speichern und HTML generieren
 * @param {CockpitUser} cockpitUser 
 * @param {string} path 
 * @param {Array} notes 
 */
function saveNotesPage (cockpitUser, path, notes) {
    cockpitUser.usernotes = notes;
    cockpitSystemMessage("Notizen wurden erfolgreich geändert.", "success");
    $(".panel-body").html(insertBodyHTML(cockpitUser));
    writeNotesToAd(cockpitUser, isMainpage(path));
}

/**
 * Modul usernotes ausführen
 * @param {CockpitUser} cockpitUser 
 * @param {string} path 
 */
export function execute (cockpitUser, path) {

    cockpitDebugMessage(cockpitUser, "usernotes.js geladen => path:", path, " => CockpitUser:", cockpitUser);

    if (path === "/") {

        $("#ad > div")
            .css({ "overflow": "auto", "max-height": "" })
            .append(appendAdHTML());

        writeNotesToAd(cockpitUser, isMainpage(path));

        $(document).on("click", ".cockpit-notes-toggle", e => {
            const { currentTarget } = e;
            $(currentTarget).next().children().toggleClass("cockpit-hide");
        });

    } else if (path === "/script/resi-cockpit/usernotes") {

        let newEntry = false;

        $("#scriptTitle").text("Spielernotizen");
        $("#scriptDescription")
            .text("Verwalte hier deine persönlichen Notizen")
            .append(`<div class="btn-group">
                        <button class="button button-success button-round" id="usno_new_note">Neue Notiz anlegen</button>
                        <button class="button button-danger button-round" id="usno_del_note">Eine Notiz löschen</button>
                    </div>`);

        $(".panel-body").html(insertBodyHTML(cockpitUser));

        $(document).on("click", "#usno_new_note", () => {
            if (newEntry === true) return;

            const notes = cockpitUser.usernotes,
                settings = cockpitUser.settings.usernotes,
                newID = notes.length;

            $(".panel-body")
                .append(newEntryHTML(newID, settings.headline_class));

            newEntry = true;
        });

        $(document).on("click", "#usno_del_note", async () => {
            const newNotes = cockpitUser.usernotes,
                getIdx = headline => newNotes.findIndex(h => h.headline === headline),
                selections = newNotes.map(s => { return { value: getIdx(s.headline), disable: false, selected: false, text: s.headline } });

            const deletionIdx = +await selectModal({
                title: "Notiz löschen",
                elements: selections,
                confirmText: "Löschen",
                cancelText: "Abbrechen"
            });

            newNotes.splice(deletionIdx, 1);
            saveNotesPage(cockpitUser, path, newNotes);
        });

        $(document).on("click", ".usno-headline-edit", async e => {
            const notes = cockpitUser.usernotes,
                { currentTarget } = e,
                entryID = +currentTarget.attributes.forentry.value,
                actualHeadline = $(`#headline_${ entryID }`).text();

            const newHeadline = await inputModal({
                title: "Notizüberschrift",
                label: "Überschrift der Notiz festlegen",
                placeholder: "Überschrift",
                confirmText: "Speichern",
                cancelText: "Abbrechen",
                type: "text",
                value: actualHeadline
            });

            if (notes[entryID]) {
                notes[entryID].headline = newHeadline
            } else {
                notes.push({
                    headline: newHeadline,
                    content: ""
                });
                newEntry = false
            }

            $(`#headline_${ entryID }`).text(newHeadline);
            saveNotesPage(cockpitUser, path, notes);
        });

        $(document).on("click", ".usno-save-content", e => {
            const notes = cockpitUser.usernotes,
                { currentTarget } = e,
                entryID = +currentTarget.attributes.forentry.value,
                newContent = $(`#content_${ entryID }`).html();

            if (notes[entryID]) {
                notes[entryID].content = newContent
            } else {
                notes.push({
                    headline: $(`#headline_${ entryID }`).text(),
                    content: newContent
                });
                newEntry = false
            }

            saveNotesPage(cockpitUser, path, notes);
        });
    }
}