Array.from(document.querySelectorAll("pre code"))
.forEach(function(element){
console.log(element.clientHeight )
let code = element.innerHTML;
let n = document.createElement('div');
n.className = 'code';
n.innerHTML = code;
n.setAttribute("height", "200px");
let par = element.parentNode;
par.outerHTML = n.outerHTML;
})
Array.from(document.querySelectorAll(".code"))
.forEach(function(element){
let html = element.innerHTML;
element.innerHTML = '';
let n = document.createElement('iframe');
n.setAttribute("style", "width: 100%; height: 200px; border: 0;")
n.frameBorder = 0;
element.appendChild(n);
var iframeDocument = n.contentDocument;
// Set the content of the iframe
iframeDocument.open();
iframeDocument.write(`
Embedded Page with JavaScript
${html}
`);
iframeDocument.close();
function sc(link){
let n = document.createElement('script');
n.async = true;
n.src = link;
return n
}
function sch(link){
let n = document.createElement('script');
n.async = true;
n.innerHTML = link;
return n
}
iframeDocument.body.appendChild(sc('https://cdnjs.cloudflare.com/ajax/libs/ace/1.32.2/ace.js'))
iframeDocument.body.appendChild(sch(`
(function clbk(){
if(typeof ace != 'undefined'){
var editor = ace.edit("editor");
editor.setTheme("ace/theme/ambiance");
editor.getSession().setMode("ace/mode/mysql");
editor.setReadOnly(true);
}else{
setTimeout(function(){
clbk();
},100)
}
})();
`))
})