Migrated register_events from jquery to native JS

This commit is contained in:
Jan Böhmer 2026-06-21 14:52:30 +02:00
parent b83fc73e18
commit 3491559e9f

View file

@ -19,9 +19,8 @@
'use strict'; 'use strict';
import {Dropdown} from "bootstrap"; import {Dropdown, Modal, Tooltip} from "bootstrap";
import ClipboardJS from "clipboard"; import ClipboardJS from "clipboard";
import {Modal} from "bootstrap";
class RegisterEventHelper { class RegisterEventHelper {
constructor() { constructor() {
@ -40,8 +39,6 @@ class RegisterEventHelper {
}); });
this.registerModalDropRemovalOnFormSubmit(); this.registerModalDropRemovalOnFormSubmit();
} }
registerModalDropRemovalOnFormSubmit() { registerModalDropRemovalOnFormSubmit() {
@ -83,11 +80,17 @@ class RegisterEventHelper {
registerTooltips() { registerTooltips() {
const handler = () => { const handler = () => {
$(".tooltip").remove(); document.querySelectorAll('.tooltip').forEach(el => el.remove());
//Exclude dropdown buttons from tooltips, otherwise we run into endless errors from bootstrap (bootstrap.esm.js:614 Bootstrap doesn't allow more than one instance per element. Bound instance: bs.dropdown.) //Exclude dropdown buttons from tooltips, otherwise we run into endless errors from bootstrap (bootstrap.esm.js:614 Bootstrap doesn't allow more than one instance per element. Bound instance: bs.dropdown.)
$('a[title], label[title], button[title]:not([data-bs-toggle="dropdown"]), p[title], span[title], h6[title], h3[title], i[title], small[title]') const tooltipSelector = 'a[title], label[title], button[title]:not([data-bs-toggle="dropdown"]), p[title], span[title], h6[title], h3[title], i[title], small[title]';
//@ts-ignore document.querySelectorAll(tooltipSelector).forEach(el => {
.tooltip("hide").tooltip({container: "body", placement: "auto", boundary: 'window'}); const existing = Tooltip.getInstance(el);
if (existing) {
existing.dispose();
}
new Tooltip(el, {container: 'body', placement: 'auto', boundary: 'window'});
});
}; };
this.registerLoadHandler(handler); this.registerLoadHandler(handler);
@ -95,9 +98,7 @@ class RegisterEventHelper {
} }
registerSpecialCharInput() { registerSpecialCharInput() {
this.registerLoadHandler(() => { const keydownHandler = function(event) {
//@ts-ignore
$("input[type=text], input[type=search]").unbind("keydown").keydown(function (event) {
let use_special_char = event.altKey; let use_special_char = event.altKey;
let greek_char = ""; let greek_char = "";
@ -106,148 +107,148 @@ class RegisterEventHelper {
switch(event.key) { switch(event.key) {
//Greek letters //Greek letters
case "a": //Alpha (lowercase) case "a": //Alpha (lowercase)
greek_char = "\u03B1"; greek_char = "α";
break; break;
case "A": //Alpha (uppercase) case "A": //Alpha (uppercase)
greek_char = "\u0391"; greek_char = "Α";
break; break;
case "b": //Beta (lowercase) case "b": //Beta (lowercase)
greek_char = "\u03B2"; greek_char = ";
break; break;
case "B": //Beta (uppercase) case "B": //Beta (uppercase)
greek_char = "\u0392"; greek_char = "Β";
break; break;
case "g": //Gamma (lowercase) case "g": //Gamma (lowercase)
greek_char = "\u03B3"; greek_char = "γ";
break; break;
case "G": //Gamma (uppercase) case "G": //Gamma (uppercase)
greek_char = "\u0393"; greek_char = ";
break; break;
case "d": //Delta (lowercase) case "d": //Delta (lowercase)
greek_char = "\u03B4"; greek_char = ";
break; break;
case "D": //Delta (uppercase) case "D": //Delta (uppercase)
greek_char = "\u0394"; greek_char = ";
break; break;
case "e": //Epsilon (lowercase) case "e": //Epsilon (lowercase)
greek_char = "\u03B5"; greek_char = ";
break; break;
case "E": //Epsilon (uppercase) case "E": //Epsilon (uppercase)
greek_char = "\u0395"; greek_char = "Ε";
break; break;
case "z": //Zeta (lowercase) case "z": //Zeta (lowercase)
greek_char = "\u03B6"; greek_char = ";
break; break;
case "Z": //Zeta (uppercase) case "Z": //Zeta (uppercase)
greek_char = "\u0396"; greek_char = "Ζ";
break; break;
case "h": //Eta (lowercase) case "h": //Eta (lowercase)
greek_char = "\u03B7"; greek_char = ";
break; break;
case "H": //Eta (uppercase) case "H": //Eta (uppercase)
greek_char = "\u0397"; greek_char = "Η";
break; break;
case "q": //Theta (lowercase) case "q": //Theta (lowercase)
greek_char = "\u03B8"; greek_char = ";
break; break;
case "Q": //Theta (uppercase) case "Q": //Theta (uppercase)
greek_char = "\u0398"; greek_char = ";
break; break;
case "i": //Iota (lowercase) case "i": //Iota (lowercase)
greek_char = "\u03B9"; greek_char = "ι";
break; break;
case "I": //Iota (uppercase) case "I": //Iota (uppercase)
greek_char = "\u0399"; greek_char = "Ι";
break; break;
case "k": //Kappa (lowercase) case "k": //Kappa (lowercase)
greek_char = "\u03BA"; greek_char = ";
break; break;
case "K": //Kappa (uppercase) case "K": //Kappa (uppercase)
greek_char = "\u039A"; greek_char = "Κ";
break; break;
case "l": //Lambda (lowercase) case "l": //Lambda (lowercase)
greek_char = "\u03BB"; greek_char = ";
break; break;
case "L": //Lambda (uppercase) case "L": //Lambda (uppercase)
greek_char = "\u039B"; greek_char = ";
break; break;
case "m": //Mu (lowercase) case "m": //Mu (lowercase)
greek_char = "\u03BC"; greek_char = ";
break; break;
case "M": //Mu (uppercase) case "M": //Mu (uppercase)
greek_char = "\u039C"; greek_char = "Μ";
break; break;
case "n": //Nu (lowercase) case "n": //Nu (lowercase)
greek_char = "\u03BD"; greek_char = "ν";
break; break;
case "N": //Nu (uppercase) case "N": //Nu (uppercase)
greek_char = "\u039D"; greek_char = "Ν";
break; break;
case "x": //Xi (lowercase) case "x": //Xi (lowercase)
greek_char = "\u03BE"; greek_char = ";
break; break;
case "X": //Xi (uppercase) case "X": //Xi (uppercase)
greek_char = "\u039E"; greek_char = ";
break; break;
case "o": //Omicron (lowercase) case "o": //Omicron (lowercase)
greek_char = "\u03BF"; greek_char = "ο";
break; break;
case "O": //Omicron (uppercase) case "O": //Omicron (uppercase)
greek_char = "\u039F"; greek_char = "Ο";
break; break;
case "p": //Pi (lowercase) case "p": //Pi (lowercase)
greek_char = "\u03C0"; greek_char = ";
break; break;
case "P": //Pi (uppercase) case "P": //Pi (uppercase)
greek_char = "\u03A0"; greek_char = ";
break; break;
case "r": //Rho (lowercase) case "r": //Rho (lowercase)
greek_char = "\u03C1"; greek_char = "ρ";
break; break;
case "R": //Rho (uppercase) case "R": //Rho (uppercase)
greek_char = "\u03A1"; greek_char = "Ρ";
break; break;
case "s": //Sigma (lowercase) case "s": //Sigma (lowercase)
greek_char = "\u03C3"; greek_char = "σ";
break; break;
case "S": //Sigma (uppercase) case "S": //Sigma (uppercase)
greek_char = "\u03A3"; greek_char = ";
break; break;
case "t": //Tau (lowercase) case "t": //Tau (lowercase)
greek_char = "\u03C4"; greek_char = ";
break; break;
case "T": //Tau (uppercase) case "T": //Tau (uppercase)
greek_char = "\u03A4"; greek_char = "Τ";
break; break;
case "u": //Upsilon (lowercase) case "u": //Upsilon (lowercase)
greek_char = "\u03C5"; greek_char = "υ";
break; break;
case "U": //Upsilon (uppercase) case "U": //Upsilon (uppercase)
greek_char = "\u03A5"; greek_char = "Υ";
break; break;
case "f": //Phi (lowercase) case "f": //Phi (lowercase)
greek_char = "\u03C6"; greek_char = ";
break; break;
case "F": //Phi (uppercase) case "F": //Phi (uppercase)
greek_char = "\u03A6"; greek_char = ";
break; break;
case "c": //Chi (lowercase) case "c": //Chi (lowercase)
greek_char = "\u03C7"; greek_char = ";
break; break;
case "C": //Chi (uppercase) case "C": //Chi (uppercase)
greek_char = "\u03A7"; greek_char = "Χ";
break; break;
case "y": //Psi (lowercase) case "y": //Psi (lowercase)
greek_char = "\u03C8"; greek_char = ";
break; break;
case "Y": //Psi (uppercase) case "Y": //Psi (uppercase)
greek_char = "\u03A8"; greek_char = ";
break; break;
case "w": //Omega (lowercase) case "w": //Omega (lowercase)
greek_char = "\u03C9"; greek_char = ";
break; break;
case "W": //Omega (uppercase) case "W": //Omega (uppercase)
greek_char = "\u03A9"; greek_char = ";
break; break;
} }
@ -255,81 +256,81 @@ class RegisterEventHelper {
switch (event.keyCode) { switch (event.keyCode) {
case 49: //1 key case 49: //1 key
//Product symbol on shift, sum on no shift //Product symbol on shift, sum on no shift
greek_char = event.shiftKey ? "\u220F" : "\u2211"; greek_char = event.shiftKey ? "∏" : "∑";
break; break;
case 50: //2 key case 50: //2 key
//Integral on no shift, partial derivative on shift //Integral on no shift, partial derivative on shift
greek_char = event.shiftKey ? "\u2202" : "\u222B"; greek_char = event.shiftKey ? "∂" : "∫";
break; break;
case 51: //3 key case 51: //3 key
//Less than or equal on no shift, greater than or equal on shift //Less than or equal on no shift, greater than or equal on shift
greek_char = event.shiftKey ? "\u2265" : "\u2264"; greek_char = event.shiftKey ? "≥" : "≤";
break; break;
case 52: //4 key case 52: //4 key
//Empty set on shift, infinity on no shift //Empty set on shift, infinity on no shift
greek_char = event.shiftKey ? "\u2205" : "\u221E"; greek_char = event.shiftKey ? "∅" : "∞";
break; break;
case 53: //5 key case 53: //5 key
//Not equal on shift, approx equal on no shift //Not equal on shift, approx equal on no shift
greek_char = event.shiftKey ? "\u2260" : "\u2248"; greek_char = event.shiftKey ? "≠" : "≈";
break; break;
case 54: //6 key case 54: //6 key
//Element of on no shift, not element of on shift //Element of on no shift, not element of on shift
greek_char = event.shiftKey ? "\u2209" : "\u2208"; greek_char = event.shiftKey ? "∉" : "∈";
break; break;
case 55: //7 key case 55: //7 key
//And on shift, or on no shift //And on shift, or on no shift
greek_char = event.shiftKey ? "\u2227" : "\u2228"; greek_char = event.shiftKey ? "∧" : "";
break; break;
case 56: //8 key case 56: //8 key
//Proportional to on shift, angle on no shift //Proportional to on shift, angle on no shift
greek_char = event.shiftKey ? "\u221D" : "\u2220"; greek_char = event.shiftKey ? "∝" : "∠";
break; break;
case 57: //9 key case 57: //9 key
//Cube root on shift, square root on no shift //Cube root on shift, square root on no shift
greek_char = event.shiftKey ? "\u221B" : "\u221A"; greek_char = event.shiftKey ? "∛" : "√";
break; break;
case 48: //0 key case 48: //0 key
//Minus-Plus on shift, plus-minus on no shift //Minus-Plus on shift, plus-minus on no shift
greek_char = event.shiftKey ? "\u2213" : "\u00B1"; greek_char = event.shiftKey ? "∓" : ";
break; break;
//Special characters //Special characters
case 219: //hyphen (or ß on german layout) case 219: //hyphen (or ß on german layout)
//Copyright on no shift, TM on shift //Copyright on no shift, TM on shift
greek_char = event.shiftKey ? "\u2122" : "\u00A9"; greek_char = event.shiftKey ? "™" : ";
break; break;
case 191: //forward slash (or # on german layout) case 191: //forward slash (or # on german layout)
//Generic currency on no shift, paragraph on shift //Generic currency on no shift, paragraph on shift
greek_char = event.shiftKey ? "\u00B6" : "\u00A4"; greek_char = event.shiftKey ? "¶" : ";
break; break;
//Currency symbols //Currency symbols
case 192: //: or (ö on german layout) case 192: //: or (ö on german layout)
//Euro on no shift, pound on shift //Euro on no shift, pound on shift
greek_char = event.shiftKey ? "\u00A3" : "\u20AC"; greek_char = event.shiftKey ? "£" : "€";
break; break;
case 221: //; or (ä on german layout) case 221: //; or (ä on german layout)
//Yen on no shift, dollar on shift //Yen on no shift, dollar on shift
greek_char = event.shiftKey ? "\u0024" : "\u00A5"; greek_char = event.shiftKey ? "$" : ";
break; break;
} }
if(greek_char=="") return; if(greek_char=="") return;
let $txt = $(this); const txt = event.currentTarget;
//@ts-ignore const caretPos = txt.selectionStart;
let caretPos = $txt[0].selectionStart; const textAreaTxt = txt.value;
let textAreaTxt = $txt.val().toString(); txt.value = textAreaTxt.substring(0, caretPos) + greek_char + textAreaTxt.substring(caretPos);
$txt.val(textAreaTxt.substring(0, caretPos) + greek_char + textAreaTxt.substring(caretPos) );
} }
};
this.registerLoadHandler(() => {
document.querySelectorAll('input[type=text], input[type=search]').forEach(input => {
input.removeEventListener('keydown', keydownHandler);
input.addEventListener('keydown', keydownHandler);
});
}); });
//@ts-ignore
this.greek_once = true;
})
} }
} }