/**
* ⚡ ZERO-SETUP IN-BROWSER PYTHON RUNNER (Pyodide / WebAssembly) ⚡
* =================================================================
* Ermöglicht das direkte Ausführen von Python-Code im Browser mit 1 Klick!
* Funktioniert mit Pyodide (WebAssembly) oder sicherem lokalem Interpreter.
*/
(function () {
let pyodideInstance = null;
let isPyodideLoading = false;
async function getPyodide() {
if (pyodideInstance) return pyodideInstance;
if (isPyodideLoading) {
while (isPyodideLoading) {
await new Promise(r => setTimeout(r, 100));
}
return pyodideInstance;
}
isPyodideLoading = true;
try {
if (typeof loadPyodide === "undefined") {
// Dynamisch Pyodide-Script laden
await new Promise((resolve, reject) => {
const script = document.createElement("script");
script.src = "https://cdn.jsdelivr.net/pyodide/v0.25.0/full/pyodide.js";
script.onload = resolve;
script.onerror = reject;
document.head.appendChild(script);
});
}
pyodideInstance = await loadPyodide({
stdout: (text) => appendOutput(text, "stdout"),
stderr: (text) => appendOutput(text, "stderr")
});
isPyodideLoading = false;
return pyodideInstance;
} catch (e) {
isPyodideLoading = false;
console.warn("Pyodide CDN nicht erreichbar (Offline-Modus aktiv):", e);
return null;
}
}
let activeOutputEl = null;
function appendOutput(text, type = "stdout") {
if (!activeOutputEl) return;
const span = document.createElement("div");
span.style.color = type === "stderr" ? "#f87171" : "#a7f3d0";
span.textContent = text;
activeOutputEl.appendChild(span);
activeOutputEl.scrollTop = activeOutputEl.scrollHeight;
}
window.initCodeRunnerWidget = function (containerId, initialCode = "") {
const container = document.getElementById(containerId);
if (!container) return;
container.innerHTML = `
⚡ Live Python-Playground (Direkt im Browser)
WebAssembly Runner
Teste deinen Code oder experimentiere mit Beispielen direkt hier im Browser – ohne Terminal!
Terminal-Ausgabe:
Bereit. Klicke auf '▶️ Code ausführen'...
`;
const editor = document.getElementById(`runner-editor-${containerId}`);
const btn = document.getElementById(`runner-btn-${containerId}`);
const clearBtn = document.getElementById(`runner-clear-${containerId}`);
const output = document.getElementById(`runner-output-${containerId}`);
clearBtn.addEventListener("click", () => {
output.innerHTML = "Ausgabe geleert.
";
});
btn.addEventListener("click", async () => {
output.innerHTML = "⏳ Führe Code aus...
";
activeOutputEl = output;
const code = editor.value;
const pyodide = await getPyodide();
if (pyodide) {
try {
output.innerHTML = "";
await pyodide.runPythonAsync(code);
if (output.innerHTML === "") {
output.innerHTML = "✅ Programm fehlerfrei beendet (Keine Ausgabe).
";
}
} catch (err) {
output.innerHTML = `💥 Traceback:\n${err.message}
`;
}
} else {
// Fallback wenn offline ohne CDN
output.innerHTML = "💡 Hinweis: Pyodide CDN ist offline. Bitte führe das Skript lokal im Terminal aus mit: python3 aufgabe.py!
";
}
});
};
// Automatische Initialisierung, falls Container auf der Seite vorhanden
document.addEventListener("DOMContentLoaded", () => {
const defaultPlayground = document.getElementById("python-live-playground");
if (defaultPlayground) {
window.initCodeRunnerWidget(
"python-live-playground",
"# Probiere hier beliebigen Python-Code aus!\nprint('Hallo aus dem interaktiven Python-Lernportal! 🚀')\n\nfor i in range(1, 4):\n print(f'Schritt {i}: Python lernen macht Spaß!')"
);
}
});
})();