First version, for githup; UNSTABLE, DO NOT USE!

www/intern/js/custom-msg-display.js

@@ -0,0 +1,90 @@
+let lastMsgTime = 0;
+let lastMsgContent = '';
+const MSG_COOLDOWN = 500;
+
+function fadeOutDiv(div) {
+    div.removeClass('show');
+    setTimeout(() => div.remove(), 1500);
+}
+
+let $msgDiv = $('.msgDiv');
+
+jQuery(document).ready(function ($) {
+
+    if ($msgDiv.length > 1) {
+        $msgDiv.not(':first').remove();
+        $msgDiv = $msgDiv.first();
+    }
+
+    if ($msgDiv.length === 0) {
+        $msgDiv = $('<div class="msgDiv"></div>');
+        $('body').append($msgDiv);
+    }
+
+});
+
+function displayMsg(type, msg) {
+    const now = Date.now();
+
+    if ($msgDiv.length === 0) {
+        $msgDiv = $('.msgDiv');
+    }
+
+    if (now - lastMsgTime < MSG_COOLDOWN && lastMsgContent === msg) {
+        return; // ignore spam
+    }
+
+    lastMsgTime = now;
+    lastMsgContent = msg;
+
+    const colors = ["rgb(255, 0, 0)", "rgb(0, 255, 0)", "#ff9d00"];
+    if (type !== 0 && type !== 1 && type !== 2) return;
+
+    const d = new Date();
+
+    console.group("MsgDivLog:");
+    console.log("Type:", type);
+    console.log("Nachricht:", msg);
+    console.log("Timestamp:", d);
+    console.groupEnd();
+
+    const $div = $('<div class="msgBox"></div>')
+        .css({ 'border-color': colors[type] })
+        .text(msg);
+
+    $msgDiv.append($div);
+
+    setTimeout(() => $div.addClass('show'), 50);
+    setTimeout(() => fadeOutDiv($div), 5000);
+}
+
+function displayConfirm(type, msg) {
+    return new Promise((resolve) => {
+        const colors = ["rgb(255, 0, 0)", "rgb(0, 255, 0)", "#ff9d00"];
+        if (![0, 1, 2].includes(type)) return resolve(false);
+
+        const $div = $('<div class="confirmBox"></div>')
+            .css({ 'border-color': colors[type] })
+            .text(msg);
+
+        const $buttonDiv = $('<div class="buttonConfirmDiv"></div>');
+        const $buttonYes = $('<button class="confirmYesButton">Ja</button>');
+        const $buttonNo = $('<button class="confirmNoButton">Nein</button>');
+
+        $buttonDiv.append($buttonNo, $buttonYes);
+        $div.append($buttonDiv);
+        $msgDiv.append($div);
+
+        $buttonYes.on('click', function () {
+            fadeOutDiv($div);
+            resolve(true);
+        });
+
+        $buttonNo.on('click', function () {
+            fadeOutDiv($div);
+            resolve(false);
+        });
+
+        setTimeout(() => $div.addClass('show'), 50);
+    });
+}