48 lines
1.2 KiB
HTML
Executable File
48 lines
1.2 KiB
HTML
Executable File
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
|
|
"http://www.w3.org/TR/html4/strict.dtd">
|
|
|
|
<html lang="en">
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
<title>Static Code highlighter using Ace</title>
|
|
<meta name="author" content="Fabian Jakobs">
|
|
</head>
|
|
<body>
|
|
|
|
<h2>Client Side Syntax Highlighting</h2>
|
|
|
|
<p>Syntax highlighting using Ace language modes and themes.</p>
|
|
|
|
<div id="code"></div>
|
|
|
|
<script type="text/javascript">
|
|
var require = {
|
|
paths: {
|
|
demo: "..",
|
|
ace: "../../lib/ace"
|
|
}
|
|
};
|
|
</script>
|
|
<script src="../kitchen-sink/require.js"></script>
|
|
<script>
|
|
|
|
require(["ace/ext/static_highlight", "ace/mode/javascript", "ace/theme/twilight", "ace/lib/dom"], function() {
|
|
|
|
var highlighter = require("ace/ext/static_highlight");
|
|
var JavaScriptMode = require("ace/mode/javascript").Mode;
|
|
var theme = require("ace/theme/twilight");
|
|
var dom = require("ace/lib/dom");
|
|
|
|
var codeEl = document.getElementById("code");
|
|
var data = document.body.innerHTML;
|
|
|
|
var highlighted = highlighter.render(data, new JavaScriptMode(), theme);
|
|
|
|
dom.importCssString(highlighted.css, "ace_highlight");
|
|
codeEl.innerHTML = highlighted.html;
|
|
});
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|