--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>SVG and Koch's Fractal</title>
+ <script type="text/javascript" src="koch.js"></script>
+ </head>
+<body>
+ <h1> Koch's Snowflake </h1>
+ <p> An example of using the DOM to make a fractal --- an interactive document.</p>
+ <p> <b>Warning:</b> If you iterate too many times you will likely crash your browser </p>
+ <svg
+ id="kochSVG"
+ xmlns="http://www.w3.org/2000/svg"
+ version="1.1"
+ width="400"
+ height="400"
+ >
+ <path
+ id="line"
+ style="stroke:#000000; fill:none; stroke-width:1px;"
+ d = "M 100,100 300,100 200,273.2051 100,100"
+ />
+ </svg>
+ <p></p>
+ <table>
+ <tr> <td> Inwards <input type="radio" name="dir" id="dir_in"/> Outwards <input type="radio" name="dir" value="dir_out" checked="yes"/> </td> </tr>
+ <tr> <td> Insert <input type="radio" name="mode" id="mode_insert" checked="yes"/> Append <input type="radio" name="mode" id="mode_append"/> </td> </tr>
+ <tr> <td> <input type="text" value="1" id="iterations"/> <button onclick="iterateKoch();">Koch Iterate</button> </td> </tr>
+ <tr> <td> <input type="text" value="#000000" id="stroke"/> <button onclick="stroke();">Stroke Colour</button> </td> </tr>
+ <tr> <td> <input type="text" value="none" id="fill"> <button onclick="fill();">Fill Colour</button> </td> </tr>
+ <tr> <td> <input type="text" value="1" id="stroke-width"/> <button onclick="strokeWidth();">Stroke Thickness</button> </td> </tr>
+ <tr> <td><button onclick="reset();">Reset</button> <button onclick="svgToText();">Standalone SVG</button></td></tr>
+ </table>
+ <p id="debug"></p>
+</body>
+</html>