-
Notifications
You must be signed in to change notification settings - Fork 0
/
input.html
51 lines (42 loc) · 1.58 KB
/
input.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple Canvas mouse input example</title>
</head>
<body>
<canvas width="800" height="600"></canvas>
<script type="text/javascript" src="../simple-canvas.js"></script>
<script>
const canvas = document.querySelector("canvas");
const ctx = canvas.getContext("2d");
setupCanvas(ctx);
function init() {
preventcontextmenu();
cursor("crosshair");
}
function update() {
cls();
// mouse coordinates and mouse buttons
text("Mouse x: " + mouse()[0],5,20);
text("Mouse y: " + mouse()[1],5,35);
text("LMB: " + mousedown(0),5,50);
text("RMB: " + mousedown(1),5,65);
// WASD
(btn("W") ? rectfill : rect)(60,100,30,30,"#a00");
text("W",63,127,btn("W") ? "white" : "#a00");
(btn("A") ? rectfill : rect)(35,133,30,30,"#a00");
text("A",38,160,btn("A") ? "white" : "#a00");
(btn("S") ? rectfill : rect)(68,133,30,30,"#a00");
text("S",71,160,btn("S") ? "white" : "#a00");
(btn("D") ? rectfill : rect)(101,133,30,30,"#a00");
text("D",104,160,btn("D") ? "white" : "#a00");
// All pressed keys
text("Pressed keys: " + btn().join(", "),30,200);
// Mouse circle
(mousedown(1) ? circfill : circ)(mouse()[0], mouse()[1], 20, mousedown(0) ? "red" : "blue");
}
</script>
</body>
</html>