diff --git a/content/demo-dev.html b/content/demo-dev.html index 52efdf3..5baddec 100644 --- a/content/demo-dev.html +++ b/content/demo-dev.html @@ -107,49 +107,63 @@ display: none !important; } `; - const loader = document.getElementById('loader'); - - for (const codeEl of document.querySelectorAll('code[data-run]')) { - const styleSheet = document.createElement("style"); - styleSheet.textContent = styles; - const iframe = document.createElement('iframe'); - const code = codeEl.textContent; - // find indent - let indent = 0; - for (const line of code.split('\n')) { - if (line.length === 0) { - continue - } - while (line.length > indent && line.substring(indent, indent + 1) === ' ') { - indent += 1; + async function getJupyterApp(iframe, pause=50, maxAttempts=100) { + let attempt = 1; + while (attempt < maxAttempts) { + if (iframe.contentWindow.jupyterapp) { + return iframe.contentWindow.jupyterapp; } - break; + attempt += 1; + await new Promise(resolve => setTimeout(resolve, pause)); } - let cleanCode = ''; - let blocks = []; - for (const line of code.split('\n')) { - if (cleanCode === '' && line.length === 0) { - continue + throw Error(`Could not acquite 'jupyterapp' object in ${maxAttempts * pause} ms`); + } + async function load() { + const loader = document.getElementById('loader'); + + for (const codeEl of document.querySelectorAll('code[data-run]')) { + const styleSheet = document.createElement("style"); + styleSheet.textContent = styles; + const iframe = document.createElement('iframe'); + const code = codeEl.textContent; + // find indent + let indent = 0; + for (const line of code.split('\n')) { + if (line.length === 0) { + continue + } + while (line.length > indent && line.substring(indent, indent + 1) === ' ') { + indent += 1; + } + break; } - cleanCode += line.substring(indent) + '\n'; - } - codeEl.textContent = cleanCode; - iframe.src = `https://quansight.github.io/jupyterlite-demo/repl/index.html?kernel=python&toolbar=1`; - iframe.style.width = '100%'; - iframe.onload = () => { - if (iframe.contentDocument) { - iframe.contentDocument.head.appendChild(styleSheet); - const jupyter = iframe.contentWindow.jupyterapp; - jupyter.commands.execute('console:replace-selection', {text: cleanCode}); - jupyter.restored.then(() => { + let cleanCode = ''; + let blocks = []; + for (const line of code.split('\n')) { + if (cleanCode === '' && line.length === 0) { + continue + } + cleanCode += line.substring(indent) + '\n'; + } + codeEl.textContent = cleanCode; + iframe.src = `https://quansight.github.io/jupyterlite-demo/repl/index.html?kernel=python&toolbar=1`; + iframe.style.width = '100%'; + iframe.onload = () => { + if (iframe.contentDocument) { + iframe.contentDocument.head.appendChild(styleSheet); + const jupyter = await getJupyterApp(iframe); + jupyter.commands.execute('console:replace-selection', {text: cleanCode}); + jupyter.restored.then(() => { + codeEl.replaceWith(iframe); + }); + } else { codeEl.replaceWith(iframe); - }) - } else { - codeEl.replaceWith(iframe); + } } + loader.appendChild(iframe); } - loader.appendChild(iframe); } + load()