kippy 0.2.1 → 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -7
- package/dist/input.d.ts +8 -8
- package/dist/input.js +40 -20
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -99,7 +99,7 @@ entity.sprite = sprite;
|
|
|
99
99
|
|
|
100
100
|
### Add controls
|
|
101
101
|
|
|
102
|
-
Game controls like mouse presses, key presses, and
|
|
102
|
+
Game controls like mouse presses, key presses, touch, and cursor traking (in the game canvas, not the web window) can be done by using the input handler from your `game` instance:
|
|
103
103
|
```js
|
|
104
104
|
const input = game.input;
|
|
105
105
|
```
|
|
@@ -110,12 +110,12 @@ Then in a scene's `update` method, you can use these utilities to check for key
|
|
|
110
110
|
input.isKeyDown(/* Character/key here */); // true if key is held, false otherwise
|
|
111
111
|
input.isKeyPressed(/* Character/key here */); // true if key is pressed, false otherwise
|
|
112
112
|
input.isKeyReleased(/* Character/key here */); // true if key is released, false otherwise
|
|
113
|
-
// Mouse
|
|
114
|
-
input.
|
|
115
|
-
input.
|
|
116
|
-
input.
|
|
117
|
-
input.
|
|
118
|
-
input.
|
|
113
|
+
// Mouse/touch
|
|
114
|
+
input.isPointerDown(/* 0 for left, 1 for right, 2 for touch */); // true if held, false otherwise
|
|
115
|
+
input.isPointerPressed(/* 0 for left, 1 for right, 2 for touch */); // true if pressed, false otherwise
|
|
116
|
+
input.isPointerReleased(/* 0 for left, 1 for right, 2 for touch */); // true if released, false otherwise
|
|
117
|
+
input.pointerX; // Current X position of mouse/touch
|
|
118
|
+
input.pointerY; // Current Y position of mouse/touch
|
|
119
119
|
```
|
|
120
120
|
|
|
121
121
|
### Physics
|
package/dist/input.d.ts
CHANGED
|
@@ -6,17 +6,17 @@ export declare class Input {
|
|
|
6
6
|
keys: Set<string>;
|
|
7
7
|
keysPressed: Set<string>;
|
|
8
8
|
keysReleased: Set<string>;
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
9
|
+
pointerX: number;
|
|
10
|
+
pointerY: number;
|
|
11
|
+
pointers: Set<number>;
|
|
12
|
+
pointersPressed: Set<number>;
|
|
13
|
+
pointersReleased: Set<number>;
|
|
14
14
|
constructor(options: InputOptions);
|
|
15
15
|
update(): void;
|
|
16
16
|
isKeyDown(key: string): boolean;
|
|
17
17
|
isKeyPressed(key: string): boolean;
|
|
18
18
|
isKeyReleased(key: string): boolean;
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
19
|
+
isPointerDown(button?: number): boolean;
|
|
20
|
+
isPointerPressed(button?: number): boolean;
|
|
21
|
+
isPointerReleased(button?: number): boolean;
|
|
22
22
|
}
|
package/dist/input.js
CHANGED
|
@@ -3,11 +3,11 @@ export class Input {
|
|
|
3
3
|
keys = new Set(); // Key on hold
|
|
4
4
|
keysPressed = new Set(); // Key pressed
|
|
5
5
|
keysReleased = new Set(); // Key released
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
pointerX = 0; // Mouse/touch coord x in canvas
|
|
7
|
+
pointerY = 0; // Mouse/touch coord y in canvas
|
|
8
|
+
pointers = new Set(); // Mouse/touch on hold
|
|
9
|
+
pointersPressed = new Set(); // Mouse/touch pressed
|
|
10
|
+
pointersReleased = new Set(); // Mouse/touch released
|
|
11
11
|
constructor(options) {
|
|
12
12
|
this.canvas = options.canvas;
|
|
13
13
|
// Keyboard
|
|
@@ -21,21 +21,40 @@ export class Input {
|
|
|
21
21
|
this.keys.delete(e.key);
|
|
22
22
|
this.keysReleased.add(e.key);
|
|
23
23
|
});
|
|
24
|
-
// Mouse
|
|
24
|
+
// Mouse and touch
|
|
25
25
|
this.canvas.addEventListener("mousemove", (e) => {
|
|
26
26
|
const rect = this.canvas.getBoundingClientRect();
|
|
27
|
-
this.
|
|
28
|
-
this.
|
|
27
|
+
this.pointerX = e.clientX - rect.left;
|
|
28
|
+
this.pointerY = e.clientY - rect.top;
|
|
29
29
|
});
|
|
30
30
|
this.canvas.addEventListener("mousedown", (e) => {
|
|
31
|
-
if (!this.
|
|
32
|
-
this.
|
|
31
|
+
if (!this.pointers.has(e.button)) {
|
|
32
|
+
this.pointersPressed.add(e.button);
|
|
33
33
|
}
|
|
34
|
-
this.
|
|
34
|
+
this.pointers.add(e.button);
|
|
35
35
|
});
|
|
36
36
|
this.canvas.addEventListener("mouseup", (e) => {
|
|
37
|
-
this.
|
|
38
|
-
this.
|
|
37
|
+
this.pointers.delete(e.button);
|
|
38
|
+
this.pointersReleased.add(e.button);
|
|
39
|
+
});
|
|
40
|
+
this.canvas.addEventListener("touchmove", (e) => {
|
|
41
|
+
e.preventDefault();
|
|
42
|
+
const rect = this.canvas.getBoundingClientRect();
|
|
43
|
+
const touch = e.touches[0];
|
|
44
|
+
this.pointerX = touch.clientX - rect.left;
|
|
45
|
+
this.pointerY = touch.clientY - rect.top;
|
|
46
|
+
});
|
|
47
|
+
this.canvas.addEventListener("touchstart", (e) => {
|
|
48
|
+
e.preventDefault();
|
|
49
|
+
if (!this.pointers.has(2)) {
|
|
50
|
+
this.pointersPressed.add(2);
|
|
51
|
+
}
|
|
52
|
+
this.pointers.add(2);
|
|
53
|
+
});
|
|
54
|
+
this.canvas.addEventListener("touchend", (e) => {
|
|
55
|
+
e.preventDefault();
|
|
56
|
+
this.pointers.delete(2);
|
|
57
|
+
this.pointersReleased.add(2);
|
|
39
58
|
});
|
|
40
59
|
// Prevent right-click menu
|
|
41
60
|
this.canvas.addEventListener("contextmenu", (e) => {
|
|
@@ -46,7 +65,8 @@ export class Input {
|
|
|
46
65
|
update() {
|
|
47
66
|
this.keysPressed.clear();
|
|
48
67
|
this.keysReleased.clear();
|
|
49
|
-
this.
|
|
68
|
+
this.pointersPressed.clear();
|
|
69
|
+
this.pointersReleased.clear();
|
|
50
70
|
}
|
|
51
71
|
// Helper methods
|
|
52
72
|
isKeyDown(key) {
|
|
@@ -58,13 +78,13 @@ export class Input {
|
|
|
58
78
|
isKeyReleased(key) {
|
|
59
79
|
return this.keysReleased.has(key);
|
|
60
80
|
}
|
|
61
|
-
|
|
62
|
-
return this.
|
|
81
|
+
isPointerDown(button = 0) {
|
|
82
|
+
return this.pointers.has(button);
|
|
63
83
|
}
|
|
64
|
-
|
|
65
|
-
return this.
|
|
84
|
+
isPointerPressed(button = 0) {
|
|
85
|
+
return this.pointersPressed.has(button);
|
|
66
86
|
}
|
|
67
|
-
|
|
68
|
-
return this.
|
|
87
|
+
isPointerReleased(button = 0) {
|
|
88
|
+
return this.pointersReleased.has(button);
|
|
69
89
|
}
|
|
70
90
|
}
|