63 lines
2.1 KiB
HTML
63 lines
2.1 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<script src="js/sci-script-tag.js" type="application/javascript"></script>
|
|
<script src="js/sci-script-tag-plugin-reagent.js" type="application/javascript"></script>
|
|
|
|
<script type="application/x-sci" src="cljs/tictactoe.cljs"></script>
|
|
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.7.2/highlight.min.js" type="text/javascript"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.7.2/languages/clojure.min.js" type="text/javascript"></script>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.7.2/styles/zenburn.min.css" integrity="sha512-JPxjD2t82edI35nXydY/erE9jVPpqxEJ++6nYEoZEpX2TRsmp2FpZuQqZa+wBCen5U16QZOkMadGXHCfp+tUdg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
<style>
|
|
body
|
|
{
|
|
font-family: Arial;
|
|
}
|
|
|
|
div#app
|
|
{
|
|
color:#666;
|
|
}
|
|
|
|
div#app td
|
|
{
|
|
width:50px;
|
|
height:50px;
|
|
border:1px solid #dedede;
|
|
background:#fff;
|
|
margin:1px;
|
|
color:#666;
|
|
text-align: center;
|
|
line-height: 50px;
|
|
}
|
|
|
|
div#app td:hover
|
|
{
|
|
cursor:pointer;
|
|
}
|
|
</style>
|
|
|
|
</head>
|
|
<body>
|
|
<h1>SCI script tag: Reagent tic-tac-toe</h1>
|
|
<div id="app"></div>
|
|
<p>The following source was loaded and interpreted
|
|
from <a href="cljs/tictactoe.cljs"><tt>cljs/tictactoe.cljs</tt></a> using the
|
|
script tag:
|
|
<pre><code class="html"><script type="application/x-sci" src="cljs/tictactoe.cljs"></script></code></pre>
|
|
</p>
|
|
<pre><code class="language-clojure" id="cljs"></code></pre>
|
|
<script type="application/x-sci">
|
|
(defn set-text [progress-event]
|
|
(let [elt (.getElementById js/document "cljs")]
|
|
(set! (.-innerHTML elt) (.. progress-event -srcElement -responseText))
|
|
(.highlightAll js/hljs)))
|
|
(def oreq (js/XMLHttpRequest.))
|
|
(.addEventListener oreq "load" set-text)
|
|
(.open oreq "GET" "cljs/tictactoe.cljs")
|
|
(.send oreq)
|
|
</script>
|
|
</body>
|
|
</html>
|