MediaWiki:Gadget-CodeHelper.js

Hinweis: Leere nach dem Veröffentlichen den Browser-Cache, um die Änderungen sehen zu können.

• Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
• Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
• Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken

// Gadget: CodeHelper
// Fügt allen Codeblöcken Copy-Button + Platzhalterleiste hinzu
(function () {
    'use strict';

    // Hilfsfunktion: Copy to Clipboard
    function copyToClipboard(text) {
        navigator.clipboard.writeText(text).then(() => {
            alert("✅ Code kopiert!");
        }, () => {
            alert("❌ Kopieren fehlgeschlagen!");
        });
    }

    // Alle Codeblöcke auf der Seite
    const codeBlocks = document.querySelectorAll('pre, code.syntaxhighlight');

    codeBlocks.forEach((block, index) => {
        // ID setzen, falls nicht vorhanden
        if (!block.id) block.id = `codehelper-block-${index}`;

        // Container für Leiste und Code
        const container = document.createElement('div');
        container.classList.add('codehelper-container');

        // Platzhalter-Leiste
        const toolbar = document.createElement('div');
        toolbar.classList.add('codehelper-toolbar');

        // Hier kannst du beliebige Variablen einfügen
        // Standard: {folder}
        const folderInput = document.createElement('input');
        folderInput.type = 'text';
        folderInput.placeholder = 'Ordner';
        folderInput.value = ''; // leer initial

        // Button zum Anwenden der Variablen
        const applyBtn = document.createElement('button');
        applyBtn.textContent = 'Variablen anwenden';
        applyBtn.addEventListener('click', () => {
            let code = block.textContent;
            // Platzhalter ersetzen
            code = code.replace(/\{\{folder\}\}/g, folderInput.value || 'wiki');
            block.textContent = code;
        });

        // Copy-Button
        const copyBtn = document.createElement('button');
        copyBtn.textContent = '📋 Kopieren';
        copyBtn.addEventListener('click', () => {
            copyToClipboard(block.textContent);
        });

        // Toolbar zusammenbauen
        toolbar.appendChild(folderInput);
        toolbar.appendChild(applyBtn);
        toolbar.appendChild(copyBtn);

        // Container zusammenbauen
        block.parentNode.insertBefore(container, block);
        container.appendChild(toolbar);
        container.appendChild(block);
    });

    // Optional: ein bisschen CSS für die Leiste
    const style = document.createElement('style');
    style.textContent = `
        .codehelper-container { margin-bottom: 1em; }
        .codehelper-toolbar {
            margin-bottom: 0.2em;
            display: flex;
            gap: 0.5em;
        }
        .codehelper-toolbar input {
            padding: 0.2em 0.4em;
            flex: 1;
        }
        .codehelper-toolbar button {
            padding: 0.2em 0.6em;
            cursor: pointer;
        }
    `;
    document.head.appendChild(style);

})();