56 lines
2 KiB
HTML
56 lines
2 KiB
HTML
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>Path Animator Tool</title>
|
||
|
|
<meta charset="UTF-8" />
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
|
|
<style type="text/css">
|
||
|
|
<%= grunt.file.read('tmp/default.css') %>
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<h2>1. Source image</h2>
|
||
|
|
<div id="drop-area">
|
||
|
|
<form>
|
||
|
|
<p>Select image with the file dialog or by dragging and dropping an image onto the dashed region.</p>
|
||
|
|
<input type="file" id="fileElem" accept="image/*" />
|
||
|
|
<label class="button" for="fileElem">Select an image</label>
|
||
|
|
</form>
|
||
|
|
<div id="gallery"></div>
|
||
|
|
</div>
|
||
|
|
<h2>2. Configure algorithm</h2>
|
||
|
|
<div id="algorithm">
|
||
|
|
<form>
|
||
|
|
<div><label for="algorithm">Select the algorithm to use:</label>
|
||
|
|
<select name="algorithm" id="alsel">
|
||
|
|
<option value="distancepath" selected="selected">Distance Path</option>
|
||
|
|
<option value="noise">Noise</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<div id="distancepath">
|
||
|
|
<h3>Distance path</h3>
|
||
|
|
<div><label for="weightpath">Weight of path</label> <input type="text" name="weightpath" value="1"/></div>
|
||
|
|
<div><label for="weightblock">Weight of block</label> <input type="text" name="weightblock" value="1000"/></div>
|
||
|
|
<div><label for="threshold">Treshold for traversable pixel</label> <input type="text" name="treshold" value="210"/></div>
|
||
|
|
<div><label for="maxdistance">Maximum distance value</label> <input type="text" name="maxdistance" value="3000000"/></div>
|
||
|
|
<div><label for="startpoints">List of starting points Format:<br />x1,y1 x2,y2 ...</label> <input type="text" name="startpoints" value="0,0"/></div>
|
||
|
|
</div>
|
||
|
|
<div id="noise" class="hidden">
|
||
|
|
<h3>Noise</h3>
|
||
|
|
Nothing to configure.
|
||
|
|
</div>
|
||
|
|
<p>
|
||
|
|
<button id="run" class="button hidden">run</button>
|
||
|
|
</p>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
<h2>3. Output image</h2>
|
||
|
|
<div id="output">
|
||
|
|
</div>
|
||
|
|
<p><button id="save" class="button hidden">Save image</button></p>
|
||
|
|
<canvas id="outputcanvas" class="hidden"></canvas>
|
||
|
|
<canvas id="inputcanvas" class="hidden"></canvas>
|
||
|
|
<script type="text/javascript">
|
||
|
|
<%= grunt.file.read('tmp/bootstrap.out') %>
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|