diff options
Diffstat (limited to 'www/index.html')
| -rw-r--r-- | www/index.html | 156 |
1 files changed, 156 insertions, 0 deletions
diff --git a/www/index.html b/www/index.html new file mode 100644 index 0000000..e935adb --- /dev/null +++ b/www/index.html @@ -0,0 +1,156 @@ +<!DOCTYPE html> +<head> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <title>Tileshop</title> + <meta charset="utf-8"> + <meta name="description" content=""> + <meta name="author" content=""> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <!-- <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> --> + <link rel="stylesheet" href="css/bootstrap.min.css"> + <link rel="stylesheet" href="css/main.css"> + <!--[if lt IE 9]> + <script src="//cdn.jsdelivr.net/html5shiv/3.7.2/html5shiv.min.js"></script> + <script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script> + <![endif]--> + <link rel="shortcut icon" href=""> +</head> +<body> + <div class="container-fluid"> + <div class="row"> + <div class="col-md-12"> + <h1> isohedral tiling pattern generator </h1> + </div> + </div> + <div class="row"> + <div class="col-md-7"> + <h2>editor </h2> + <ul class="list-unstyled"> + <li> + <ul class="list-inline"> + <li> + <canvas id="editor" width="180" height="180"></canvas> + </li> + + <li class="bg-success"> + <h4> tile preview </h4> + <canvas id="modeltile" width="180" height="180"></canvas> + </li> + + <li> + <ul class="list-unstyled"> + <li> + <label for="edge-selector">Active Edge</label> + <select class="form-control" name="edge-selector" id="edge-selector"> + + </select> + </li> + <li> + <label for="stroke">Line Width </label> + <input name="stroke" id="stroke" + type="range" min="1" max="20" value="1"/> + </li> + + <li> + <label for="scale">Scale </label> + <input name="scale" id="scale" + type="range" min="26" max="200" step="2" value="50"/> + </li> + + <li> + <label for="rotation"> Rotation </label> + <input name="rotation" id="rotation" + type="range" min="0" max="359" step="1" value="0"/> + </li> + </ul> + </li> + <li> + <ul class="list-unstyled"> + <li> + <ul class="list-unstyled" id="vertex-parameters"> + + </ul> + </li> + <li> + <label for="tiling-class">Tiling Type</label> + <select class="form-control" id="tiling-class" name="tiling-class"> + + </select> + </li> + </ul> + </li> + </ul> + </li> + <li> + <ul class="list-inline"> + <li> + <label for="freehand-toggle">Freehand: </label> + <input type="checkbox" name="freehand-toggle" + id="freehand-toggle"/> + </li> + <li> + <label for="tile-filename">Name This Tile</label> + <input name="tile-filename" id="tile-filename" + type="text" value="tile"/> + <a href="#" + class="btn btn-default" + id="download-tile-button">Export Tile as SVG</a> + </li> + </ul> + </li> + <li> + <ul class="list-inline"> + <li> + <div class="btn btn-default" id="refresh-editor">Refresh</div> + </li> + <li> + <div class="btn btn-default" id="undo-btn">↫</div> + </li> + <li> + <div class="btn btn-default" id="redo-btn">↬</div> + </li> + <li id="tiling-link"> + + </li> + </ul> + </li> + </ul> + </div> + <div class="col-md-5"> + <canvas id="tilecanvas" width="500" height="500"></canvas> + <ul class="list-inline"> + <li> + <label for="filename">Name</label> + <input name="filename" id="filename" type="text" value="tiling"/> + </li> + <li> <a href="#" + class="btn btn-default" + id="download-button">Export As SVG</a> + </li> + </ul> + </div> + </div> + <div class="row"> + <div class="col-md-9"> + <p> Enjoying the application? Do you have a particular use + case in mind? I'd be happy + to <a href="mailto:colin@cicadas.surf"> hear about + it </a>. + </div> + <div class="col-md-3"> + <p class="text-muted" id="timestamp">Last Updated Sun Jul 24 09:58:44 CDT 2016 + </p> + </div> + </div> + </div> + <!-- SCRIPTS --> + <script src="js/jquery-3.6.1.min.js"></script> + <script src="js/lz-string.js"></script> + <script src="js/ashlar.js"></script> + <script src="js/paper.js"></script> + <script type="text/paperscript" src="js/tilecanvas.js" canvas="tilecanvas"></script> + <script src="js/main.js"></script> + +</body> +</html> + |