pointvec/template.interface.html
2017-01-06 02:06:34 +01:00

50 lines
1.6 KiB
HTML

<html>
<head>
<script type="text/javascript" src="scripts/dotgrid.js"></script>
<script type="text/javascript" src="scripts/keyboard.js"></script>
<link rel="stylesheet" type="text/css" href="links/reset.css"/>
<link rel="stylesheet" type="text/css" href="links/fonts.css"/>
<link rel="stylesheet" type="text/css" href="links/main.css"/>
<title>Dotgrid(Interface)</title>
</head>
<body>
<body>
<pre class="reference">
q <b>CLEAR</b>
w <b>DELETE LAST</b>
e <b>EXPORT</b>
aA <b>CLOCKWISE</b>
sS <b>COUNTERWISE</b>
d <b>LINE</b>
z <b>DOT</b>
x <b>CIRCLE</b>
c <b>--</b>
</pre>
<pre class="settings">
<b>THICKNESS</b> <input type="number" value=1 min="0" step="0.1"
oninput="dotgrid.update_style('strokeWidth', this.value);">
<b>LINECAP</b> <select
onchange="dotgrid.update_style('strokeLinecap', this.value);">
<option value="butt">butt</option>
<option value="round">round</option>
<option value="square">square</option>
</select>
</pre>
<script>
dotgrid = new Dotgrid(320,568,31,61,6,6, 1,"square","#000000");
dotgrid.install();
var keyboard = new Keyboard();
document.onkeyup = function myFunction(event){ keyboard.listen(event); };
document.addEventListener('mousedown', function(e){ dotgrid.mouse_down(e); }, false);
document.addEventListener('mousemove', function(e){ dotgrid.mouse_move(e); }, false);
document.addEventListener('mouseup', function(e){ dotgrid.mouse_up(e);}, false);
</script>
</body>
</html>