<!DOCTYPE html> <html lang="fr"> <head> <meta charset="utf-8" /> <title>Chaos game</title> <!-- Loading Bootstrap --> <link href="bootstrap/css/bootstrap.css" rel="stylesheet"> <link href="bootstrap/css/prettify.css" rel="stylesheet"> <!-- Loading Flat UI --> <link href="css/flat-ui.css" rel="stylesheet"> <link href="css/docs.css" rel="stylesheet"> <!-- Site styles --> <link href="css/main.css" rel="stylesheet"> <!-- HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. --> <!--[if lt IE 9]> <script src="js/html5shiv.js"></script> <![endif]--> </head> <body> <section id="renderer"> <h3>Render</h3> <p> <canvas width="500" height="500" id="canvas"> Please update to newer version of your browser in order to view this page! </canvas> </p> <ul class="pager" id="zoomer"> <li> <a href="#" id="zoom-in"><span> <i class="fui-plus"></i> Zoom </span></a> </li> <li><a href="#" id="zoom-out">—</a></li> </ul> </section> <section id="parameters"> <form> <fieldset> <legend>Parameters</legend> <p> <label for="pt-num">Precision :</label> <input type="range" class="ui-slider" min="1" max="500" step="1" value="25000" id="pt-num" /> </p> <p> <label for="pt-width">Size :</label> <input type="number" class="form-control" min="50" max="5000" step="50" value="500" id="pt-size" /> </p> <p> <label for="pt-vertices">Vertices :</label> <input type="number" class="form-control" min="3" value="3" step="1" id="pt-vertices" /> </p> <p> <label for="pt-frac-top">Factor :</label> <span class="fraction form-control"> <sup><input type="number" class="form-control flat" min="1" value="1" step="1" id="pt-frac-top" /></sup> <sub><input type="number" class="form-control flat" min="1" value="2" step="1" id="pt-frac-bottom" /></sub> </span> </p> </fieldset> <fieldset> <legend>Presets</legend> <p> <img src="images/setting1.png" class="setting" data-setting-id="1" alt="Sierpinski's triangle" title="Sierpinski's triangle" /> <img src="images/setting2.png" class="setting" data-setting-id="2" alt="Fractal no. 1" title="Fractal no. 1" /> <img src="images/setting3.png" class="setting" data-setting-id="3" alt="Fractal no. 2" title="Fractal no. 2" /> <img src="images/setting4.png" class="setting" data-setting-id="4" alt="Fractal no. 3" title="Fractal no. 3" /> </p> </fieldset> <p class="bottom"> <button class="btn btn-primary" id="pt-gen">Plot</button> <button class="btn btn-primary" id="pt-render"> <a href="#" download="chaos-game-result.png">Download result</a> </button> </p> </form> </section> <script src="js/lib/jquery-1.8.3.min.js"></script> <script src="js/lib/jquery-ui-1.10.3.custom.min.js"></script> <script src="js/lib/jquery.ui.touch-punch.min.js"></script> <script src="js/lib/bootstrap.min.js"></script> <script src="js/lib/bootstrap-select.js"></script> <script src="js/lib/bootstrap-switch.js"></script> <script src="js/lib/flatui-checkbox.js"></script> <script src="js/lib/flatui-radio.js"></script> <script src="js/lib/jquery.tagsinput.js"></script> <script src="js/lib/jquery.placeholder.js"></script> <script src="bootstrap/js/google-code-prettify/prettify.js"></script> <script src="js/lib/application.js"></script> <script src="js/utils.js"></script> <script src="js/script.js"></script> </body> </html>