diff --git a/js/interactive-examples.js b/js/interactive-examples.js index 4c711928cc..dae67a741f 100644 --- a/js/interactive-examples.js +++ b/js/interactive-examples.js @@ -4,7 +4,7 @@ function createOutput(output) { const container = document.createElement("div"); container.classList.add("screen", "example-contents"); const title = document.createElement("p"); - title.innerText = "Output (PHP "+ PHP.version +"):"; + title.innerText = "Output of the above example in PHP "+ PHP.version +":"; container.appendChild(title); const div = document.createElement("div"); div.classList.add("examplescode"); @@ -56,6 +56,16 @@ async function main() { return; } + let exampleTitleContainer = example.nextElementSibling; + let exampleTitleParagraphElement = null; + let exampleScreenContainer = null; + let exampleScreenPreElement = null; + if (exampleTitleContainer !== null) { + exampleTitleParagraphElement = exampleTitleContainer.querySelector("p") + exampleScreenContainer = exampleTitleContainer.nextElementSibling; + exampleScreenPreElement = exampleScreenContainer.querySelector("pre"); + } + const code = phpcode.querySelector("code"); code.spellcheck = false; code.setAttribute("contentEditable", true); @@ -68,8 +78,13 @@ async function main() { const runPhp = await PHP.loadPhp(); runPhp(phpcode.innerText); - lastOutput = createOutput(PHP.buffer.join("")); - phpcode.parentNode.appendChild(lastOutput); + if (exampleScreenPreElement !== null) { + exampleTitleParagraphElement.innerText = "Output of the above example in PHP "+ PHP.version +":"; + exampleScreenPreElement.innerText = PHP.buffer.join(""); + } else { + lastOutput = createOutput(PHP.buffer.join("")); + phpcode.parentNode.appendChild(lastOutput); + } PHP.buffer.length = 0; };