html-live-code-editor/script.js at main · coders2-HCJ/html-live-code-editor · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
var editor = ace.edit("editor");
var result = document.getElementById("result");
editor.setTheme("ace/theme/light");
editor.session.setMode("ace/mode/html");
editor.setValue("<!DOCTYPE html>\n<html>\n\t<head>\n\t\t<title>New Website</title>\n\t\t<meta charset=\"utf-8\">\n\t</head>\n\t<body>\n\t\tHello world!\n\t</body>\n</html>");
function showRes() {
	result.src = "data:text/html;charset=utf-8," + encodeURIComponent(editor.getValue());
}
editor.session.on("change", showRes);
showRes();
function download(filename, text) {
	var element = document.createElement("a");
	element.setAttribute("href", "data:text/plain;charset=utf-8," + encodeURIComponent(text));
	element.setAttribute("download", filename);
	element.style.display = "none";
	document.body.appendChild(element);
	element.click();
	document.body.removeChild(element);
}
document.getElementById("save").onclick = function() {
	download("program.html", editor.getValue());
};
document.getElementById("reload").onclick = function() {showRes();};