Änderungen von Dokument Abkürzungsverzeichnis

Zusammenfassung

• Objekte (1 geändert, 0 hinzugefügt, 0 gelöscht)
  • XWiki.JavaScriptExtension[0]

Details

XWiki.JavaScriptExtension[0]

code

...	...	@@ -1,89 +1,117 @@
	1	+let currentFilter = 'Alle';
	2	+
1	1	function initTableFilter() {
2		- var table = document.querySelector('table'); // Erste Tabelle auf der Seite
3		- if (!table) return; // Fallback, falls keine Tabelle
4		- var tbody = table.querySelector('tbody') || table; // Fallback auf table, falls kein tbody
5		- var rows = Array.from(table.querySelectorAll('tr')).slice(1); // Alle Zeilen außer Header
6		- var availableLetters = new Set();
7		-
8		- // Alphabetisch sortieren
9		- rows.sort(function(a, b) {
10		- var textA = a.querySelector('td:first-child').textContent.trim().toUpperCase();
11		- var textB = b.querySelector('td:first-child').textContent.trim().toUpperCase();
	4	+ const table = document.querySelector('table');
	5	+ if (!table) return;
	6	+
	7	+ const tbody = table.querySelector('tbody') || table;
	8	+ const rows = Array.from(table.querySelectorAll('tr')).slice(1);
	9	+ const availableLetters = new Set();
	10	+
	11	+ // Sortieren
	12	+ rows.sort((a, b) => {
	13	+ const textA = a.querySelector('td:first-child').textContent.trim().toUpperCase();
	14	+ const textB = b.querySelector('td:first-child').textContent.trim().toUpperCase();
12	12	return textA.localeCompare(textB, 'de', { sensitivity: 'base' });
13	13	});
14		-
15		- // Sortierte Zeilen wieder in die Tabelle einfügen
16		- rows.forEach(function(row) {
17		- tbody.appendChild(row);
18		- });
19		-
20		- // Klassen dynamisch zuweisen und Anfangsbuchstaben sammeln
21		- rows.forEach(function(row) {
22		- var firstCell = row.querySelector('td:first-child'); // Erste Spalte (Begriff)
	17	+ rows.forEach(row => tbody.appendChild(row));
	18	+
	19	+ // Klassen & IDs
	20	+ rows.forEach(row => {
	21	+ const firstCell = row.querySelector('td:first-child');
23	23	if (firstCell && firstCell.textContent) {
24		- var firstChar = firstCell.textContent.trim().charAt(0).toUpperCase();
25		- // Umlaute handhaben
26		- if (firstChar === 'Ä') firstChar = 'Ä';
27		- else if (firstChar === 'Ö') firstChar = 'Ö';
28		- else if (firstChar === 'Ü') firstChar = 'Ü';
	23	+ const text = firstCell.textContent.trim();
	24	+ let firstChar = text.charAt(0).toUpperCase();
	25	+ if (['Ä','Ö','Ü'].includes(firstChar)) firstChar = firstChar;
29	29	row.classList.add('letter-' + firstChar);
30	30	availableLetters.add(firstChar);
	28	+
	29	+ const idMatch = firstCell.innerHTML.match(/id\s*=\s*["']([^"']+)["']/);
	30	+ if (idMatch) {
	31	+ const anchorId = idMatch[1];
	32	+ row.id = anchorId;
	33	+ firstCell.innerHTML = firstCell.innerHTML.replace(/id\s*=\s*["'][^"']+["']/, '');
	34	+ firstCell.classList.add('anchor-target');
	35	+ }
31	31	}
32	32	});
33		-
34		- // Buchstaben ohne Einträge ausgrauen
35		- var letters = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z', 'Ä', 'Ö', 'Ü'];
36		- letters.forEach(function(letter) {
37		- var link = document.getElementById('letter-' + letter);
38		- if (link && !availableLetters.has(letter)) {
39		- link.classList.add('disabled');
40		- link.style.pointerEvents = 'none'; // Klick deaktivieren
	38	+
	39	+ // Ausgrauen
	40	+ const letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZÄÖÜ'.split('');
	41	+ letters.forEach(letter => {
	42	+ const link = document.getElementById('letter-' + letter);
	43	+ if (link && !availableLetters.has(letter)) link.classList.add('disabled');
	44	+ });
	45	+
	46	+ filterTable('Alle', document.getElementById('all-link'));
	47	+
	48	+ // Anker-Links
	49	+ document.addEventListener('click', e => {
	50	+ if (e.target.tagName === 'A' && e.target.getAttribute('href')?.startsWith('#')) {
	51	+ const hash = e.target.getAttribute('href');
	52	+ if (hash === '#') return;
	53	+ e.preventDefault();
	54	+ handleAnchorClick(hash.substring(1));
41	41	}
42	42	});
43		-
44		- // Initial: Alle anzeigen und "Alle" highlighten
45		- filterTable('Alle', document.getElementById('all-link')); // "Alle" mit Link-Referenz aufrufen
	57	+
	58	+ // Initialer Hash
	59	+ if (window.location.hash) {
	60	+ setTimeout(() => handleAnchorClick(window.location.hash.substring(1)), 300);
	61	+ }
46	46	}
47	47
48	48	function filterTable(letter, targetLink) {
49		- var table = document.querySelector('table');
	65	+ currentFilter = letter;
	66	+ const table = document.querySelector('table');
50	50	if (!table) return;
51		- var rows = table.querySelectorAll('tr');
52		- var visibleCount = 0;
53		-
54		- rows.forEach(function(row, index) {
55		- if (index === 0) { // Header immer sichtbar
56		- row.style.display = '';
57		- return;
58		- }
59		- if (letter === 'Alle') {
60		- row.style.display = '';
61		- visibleCount++;
62		- } else if (row.classList.contains('letter-' + letter)) {
63		- row.style.display = '';
64		- visibleCount++;
65		- } else {
66		- row.style.display = 'none';
67		- }
	68	+ const rows = table.querySelectorAll('tr');
	69	+
	70	+ rows.forEach((row, index) => {
	71	+ if (index === 0) { row.style.display = ''; return; }
	72	+ row.style.display = (letter === 'Alle' || row.classList.contains('letter-' + letter)) ? '' : 'none';
68	68	});
69		-
70		- // Aktiven Buchstaben highlighten
71		- var links = document.querySelectorAll('#alpha-nav a');
72		- links.forEach(function(link) {
73		- link.style.fontWeight = 'normal';
74		- link.style.color = 'inherit';
	74	+
	75	+ // Highlight Navigation
	76	+ document.querySelectorAll('#alpha-nav a').forEach(link => {
	77	+ link.style.fontWeight = 'normal';
	78	+ link.style.color = 'inherit';
75	75	});
76		- // Highlight entweder über targetLink (Initialisierung) oder event.target (Klick)
77		- var linkToHighlight = targetLink || event.target;
78		- if (linkToHighlight) {
79		- linkToHighlight.style.fontWeight = 'bold';
80		- linkToHighlight.style.color = '#00597B'; // Corporate Design: Dunkelblau
	80	+ if (targetLink) {
	81	+ targetLink.style.fontWeight = 'bold';
	82	+ targetLink.style.color = '#00597B';
81	81	}
82	82	}
83	83
84		-// Initialisierung nach Laden
85		-if (document.readyState === 'loading') {
86		- document.addEventListener('DOMContentLoaded', initTableFilter);
87		-} else {
88		- initTableFilter();
	86	+// --- Stabiler Anker-Sprung ---
	87	+function handleAnchorClick(targetId) {
	88	+ const targetRow = document.getElementById(targetId);
	89	+ if (!targetRow) return;
	90	+
	91	+ const firstCell = targetRow.querySelector('td:first-child');
	92	+ const text = firstCell.textContent.trim();
	93	+ let firstChar = text.charAt(0).toUpperCase();
	94	+ if (['Ä','Ö','Ü'].includes(firstChar)) firstChar = firstChar;
	95	+
	96	+ // Filter ggf. anpassen
	97	+ if (targetRow.style.display === 'none' || currentFilter !== firstChar) {
	98	+ const link = document.getElementById('letter-' + firstChar);
	99	+ if (link && !link.classList.contains('disabled')) {
	100	+ filterTable(firstChar, link);
	101	+ } else if (currentFilter !== 'Alle') {
	102	+ filterTable('Alle', document.getElementById('all-link'));
	103	+ }
	104	+ }
	105	+
	106	+ // Scrollen + Hervorheben (ohne Sprung zurück)
	107	+ setTimeout(() => {
	108	+ history.replaceState(null, '', '#' + targetId); // Hash stabilisieren
	109	+ targetRow.scrollIntoView({ behavior: 'smooth', block: 'center' });
	110	+ targetRow.style.transition = 'background-color 0.6s';
	111	+ targetRow.style.backgroundColor = '#e6f3ff';
	112	+ setTimeout(() => { targetRow.style.backgroundColor = ''; }, 2000);
	113	+ }, 200);
89	89	}
	115	+
	116	+// Init aufrufen
	117	+document.addEventListener('DOMContentLoaded', initTableFilter);