like2d 2.12.0 → 2.13.0
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 +20 -30
- package/assets/logo-banner-optimized.svg +1 -1
- package/dist/engine.d.ts +13 -7
- package/dist/engine.js +21 -46
- package/dist/events.d.ts +61 -59
- package/dist/graphics/graphics.d.ts +5 -4
- package/dist/graphics/graphics.js +3 -3
- package/dist/graphics/index.d.ts +1 -1
- package/dist/index.d.ts +3 -4
- package/dist/index.js +1 -2
- package/dist/input/gamepad.d.ts +2 -2
- package/dist/input/gamepad.js +2 -2
- package/dist/input/mouse.d.ts +8 -8
- package/dist/input/mouse.js +8 -8
- package/dist/like.d.ts +45 -67
- package/dist/math/rect.d.ts +1 -0
- package/dist/math/rect.js +1 -0
- package/dist/math/vector2.d.ts +3 -0
- package/dist/math/vector2.js +3 -0
- package/dist/scene/index.d.ts +368 -0
- package/dist/scene/index.js +204 -0
- package/dist/scene/prefab/fadeTransition.d.ts +25 -0
- package/dist/scene/prefab/fadeTransition.js +55 -0
- package/dist/scene/prefab/mapGamepad.d.ts +47 -0
- package/dist/scene/prefab/mapGamepad.js +189 -0
- package/dist/scene/prefab/startScreen.d.ts +47 -0
- package/dist/{prefab-scenes → scene/prefab}/startScreen.js +25 -84
- package/package.json +11 -6
- package/dist/prefab-scenes/index.d.ts +0 -10
- package/dist/prefab-scenes/index.js +0 -9
- package/dist/prefab-scenes/mapGamepad.d.ts +0 -42
- package/dist/prefab-scenes/mapGamepad.js +0 -199
- package/dist/prefab-scenes/startScreen.d.ts +0 -58
- package/dist/scene.d.ts +0 -143
- package/dist/scene.js +0 -23
package/README.md
CHANGED
|
@@ -1,33 +1,23 @@
|
|
|
1
1
|
# LÏKE2D
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
<
|
|
3
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
4
|
+
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
|
5
|
+
<svg version="1.1" viewBox="0 0 256 85" xmlns="http://www.w3.org/2000/svg">
|
|
6
|
+
<rect x="8.4949" y="14.841" width="239.13" height="60.337" ry="14.369"/>
|
|
7
|
+
<path d="m49.519 2.1933-22.841 22.854-0.01193 0.01193a16.159 16.168 0 0 0 0 22.866 16.159 16.168 0 0 0 20.539 1.9189 16.159 16.168 0 0 1 0.0048 0.39055 16.159 16.168 0 0 1-16.159 16.169h36.935a16.159 16.168 0 0 1-16.159-16.169 16.159 16.168 0 0 1 0.0054-0.39055 16.159 16.168 0 0 0 20.539-1.9193 16.159 16.168 0 0 0-4.76e-4 -22.866z" fill="#ba2b2b" stroke="#ffcf42" stroke-linejoin="round" stroke-width=".5"/>
|
|
8
|
+
<g fill="none" stroke="#ffcf42" stroke-width=".5">
|
|
9
|
+
<circle transform="matrix(-.7069 .70731 -.7069 -.70731 0 0)" cx="-17.311" cy="-68.903" r="16.164"/>
|
|
10
|
+
<circle transform="matrix(-.7069 .70731 -.7069 -.70731 0 0)" cx="-1.147" cy="-52.739" r="16.164"/>
|
|
11
|
+
<ellipse cx="67.986" cy="50.234" rx="16.159" ry="16.168"/>
|
|
12
|
+
<ellipse cx="31.051" cy="50.234" rx="16.159" ry="16.168"/>
|
|
10
13
|
</g>
|
|
11
|
-
<g>
|
|
12
|
-
<
|
|
13
|
-
<
|
|
14
|
-
<
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
<g>
|
|
19
|
-
<path d="m237.53 38.691-17.505-9.3882 17.505-18.073z"/>
|
|
20
|
-
<rect x="202.88" y="48.079" width="16.772" height="9.3882"/>
|
|
21
|
-
<rect x="272.54" y="20.266" width="16.772" height="9.3882"/>
|
|
22
|
-
<rect x="272.54" y="38.691" width="16.772" height="9.3882"/>
|
|
23
|
-
<path d="m202.52 29.302 0.36685-18.073h17.139z"/>
|
|
24
|
-
</g>
|
|
25
|
-
<path d="m64.078 1.0042-33.375 33.375-0.01743 0.0174a23.612 23.612 0 0 0 0 33.392 23.612 23.612 0 0 0 30.012 2.8022 23.612 23.612 0 0 1 7e-3 0.57034 23.612 23.612 0 0 1-23.612 23.612h53.97a23.612 23.612 0 0 1-23.611-23.612 23.612 23.612 0 0 1 7e-3 -0.57034 23.612 23.612 0 0 0 30.012-2.8029 23.612 23.612 0 0 0-6.88e-4 -33.392z" fill="#80c3e4" stroke="#000" stroke-linejoin="round"/>
|
|
26
|
-
<g fill="none" stroke="#000" stroke-width=".5">
|
|
27
|
-
<circle transform="rotate(135)" cx="-20.988" cy="-93.243" r="23.612"/>
|
|
28
|
-
<circle transform="rotate(135)" cx="2.6238" cy="-69.632" r="23.612"/>
|
|
29
|
-
<circle cx="91.062" cy="71.161" r="23.612"/>
|
|
30
|
-
<circle cx="37.093" cy="71.161" r="23.612"/>
|
|
14
|
+
<g fill="#ffcf42" stroke="#000" stroke-width=".5">
|
|
15
|
+
<path d="m89.924 21.979v36.375h28.103v-14.771h-12.029v-21.604z"/>
|
|
16
|
+
<path d="m127.94 24.678v7.665h5.0453v11.046h-5.0453v14.966h24.748v-14.966h-5.048v-11.046h5.048v-7.665h-12.377z"/>
|
|
17
|
+
<path d="m206.89 22.088v36.375h33.739v-13.179h-10.908v-5.0678h10.908v-7.109h-10.908v-5.069h10.908v-5.9504z"/>
|
|
18
|
+
<path d="m162.76 19.77v38.693h12.281v-5.069h11.523v5.069h12.281s1.0482-15.115-2.2012-18.768c-3.4704-3.9018-6.3723-4.5209-6.3723-4.5209l8.8848-13.087h-13.615l-6.4108 13.022-4.3423 0.03698-8e-3 -15.377z"/>
|
|
19
|
+
<ellipse cx="132.99" cy="16.122" rx="6.0221" ry="6.1182"/>
|
|
20
|
+
<ellipse cx="147.49" cy="16.122" rx="6.0221" ry="6.1182"/>
|
|
31
21
|
</g>
|
|
32
22
|
</svg>
|
|
33
23
|
|
|
@@ -70,7 +60,7 @@ To try Like2D quickly, use this starter with
|
|
|
70
60
|
hot reloading and a basic webpage.
|
|
71
61
|
|
|
72
62
|
```bash
|
|
73
|
-
npx degit
|
|
63
|
+
npx degit likeOrg/Like2D/examples/starter my-game
|
|
74
64
|
```
|
|
75
65
|
|
|
76
66
|
## Usage Example
|
|
@@ -144,9 +134,9 @@ LIKE's API is not the same as LOVE, but similar in spirit. Notable differences:
|
|
|
144
134
|
|
|
145
135
|
[JSR](https://jsr.io/@like2d/like)
|
|
146
136
|
|
|
147
|
-
[GitHub](https://github.com/
|
|
137
|
+
[GitHub](https://github.com/likeOrg/Like2D)
|
|
148
138
|
|
|
149
|
-
[Full Documentation](https://
|
|
139
|
+
[Full Documentation](https://likeorg.github.io/Like2D/api/documents/README.html)
|
|
150
140
|
|
|
151
141
|
## License
|
|
152
142
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
2
|
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
|
3
|
-
<svg
|
|
3
|
+
<svg version="1.1" viewBox="0 0 256 85" xmlns="http://www.w3.org/2000/svg">
|
|
4
4
|
<rect x="8.4949" y="14.841" width="239.13" height="60.337" ry="14.369"/>
|
|
5
5
|
<path d="m49.519 2.1933-22.841 22.854-0.01193 0.01193a16.159 16.168 0 0 0 0 22.866 16.159 16.168 0 0 0 20.539 1.9189 16.159 16.168 0 0 1 0.0048 0.39055 16.159 16.168 0 0 1-16.159 16.169h36.935a16.159 16.168 0 0 1-16.159-16.169 16.159 16.168 0 0 1 0.0054-0.39055 16.159 16.168 0 0 0 20.539-1.9193 16.159 16.168 0 0 0-4.76e-4 -22.866z" fill="#ba2b2b" stroke="#ffcf42" stroke-linejoin="round" stroke-width=".5"/>
|
|
6
6
|
<g fill="none" stroke="#ffcf42" stroke-width=".5">
|
package/dist/engine.d.ts
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
import type
|
|
1
|
+
import type { LikeEvent, LikeEventHandlers, Dispatcher, LikeCanvasElement } from './events';
|
|
2
|
+
import { LikeHandlers, type Like } from './like';
|
|
3
3
|
/** @private */
|
|
4
|
-
export type EngineDispatcher = Dispatcher<
|
|
4
|
+
export type EngineDispatcher = Dispatcher<keyof LikeEventHandlers>;
|
|
5
5
|
/** @private */
|
|
6
|
-
export type EngineProps<
|
|
6
|
+
export type EngineProps<K extends keyof LikeEventHandlers> = {
|
|
7
7
|
canvas: LikeCanvasElement;
|
|
8
8
|
abort: AbortSignal;
|
|
9
|
-
dispatch: Dispatcher<
|
|
9
|
+
dispatch: Dispatcher<K>;
|
|
10
10
|
};
|
|
11
11
|
/** @private */
|
|
12
12
|
export declare class Engine {
|
|
@@ -17,13 +17,11 @@ export declare class Engine {
|
|
|
17
17
|
private isRunning;
|
|
18
18
|
private lastTime;
|
|
19
19
|
private abort;
|
|
20
|
-
private sceneStack;
|
|
21
20
|
/**
|
|
22
21
|
* The Like interface providing access to all engine subsystems.
|
|
23
22
|
*/
|
|
24
23
|
readonly like: Like;
|
|
25
24
|
constructor(container: HTMLElement);
|
|
26
|
-
private refreshScene;
|
|
27
25
|
private dispatch;
|
|
28
26
|
/**
|
|
29
27
|
* Start the game loop.
|
|
@@ -34,4 +32,12 @@ export declare class Engine {
|
|
|
34
32
|
*/
|
|
35
33
|
dispose(): void;
|
|
36
34
|
}
|
|
35
|
+
export declare function likeDispatch(obj: LikeHandlers, event: LikeEvent): void;
|
|
36
|
+
/**
|
|
37
|
+
* Call event handlers from an event. For example, an event with `.type = update, .args = [dt]`
|
|
38
|
+
* translates to calling `obj.draw(dt)`.
|
|
39
|
+
*
|
|
40
|
+
* Typically used at the end of a custom {@link LikeHandlers.handleEvent | handleEvent}.
|
|
41
|
+
*/
|
|
42
|
+
export declare function callOwnHandlers(obj: LikeHandlers, event: LikeEvent): void;
|
|
37
43
|
//# sourceMappingURL=engine.d.ts.map
|
package/dist/engine.js
CHANGED
|
@@ -6,7 +6,6 @@ import { Mouse } from './input/mouse';
|
|
|
6
6
|
import { Gamepad } from './input/gamepad';
|
|
7
7
|
import { Graphics } from './graphics/graphics';
|
|
8
8
|
import { Canvas } from './graphics/canvas';
|
|
9
|
-
import { sceneDispatch } from './scene';
|
|
10
9
|
/** @private */
|
|
11
10
|
export class Engine {
|
|
12
11
|
constructor(container) {
|
|
@@ -42,12 +41,6 @@ export class Engine {
|
|
|
42
41
|
writable: true,
|
|
43
42
|
value: new AbortController()
|
|
44
43
|
});
|
|
45
|
-
Object.defineProperty(this, "sceneStack", {
|
|
46
|
-
enumerable: true,
|
|
47
|
-
configurable: true,
|
|
48
|
-
writable: true,
|
|
49
|
-
value: []
|
|
50
|
-
});
|
|
51
44
|
/**
|
|
52
45
|
* The Like interface providing access to all engine subsystems.
|
|
53
46
|
*/
|
|
@@ -83,52 +76,15 @@ export class Engine {
|
|
|
83
76
|
canvas,
|
|
84
77
|
start: this.start.bind(this),
|
|
85
78
|
dispose: this.dispose.bind(this),
|
|
86
|
-
|
|
87
|
-
return this.sceneStack.at(pos);
|
|
88
|
-
},
|
|
89
|
-
pushScene: (scene, _overlay) => {
|
|
90
|
-
this.sceneStack.push(scene);
|
|
91
|
-
this.refreshScene();
|
|
92
|
-
},
|
|
93
|
-
popScene: () => {
|
|
94
|
-
const s = this.sceneStack.pop();
|
|
95
|
-
this.refreshScene();
|
|
96
|
-
return s;
|
|
97
|
-
},
|
|
98
|
-
setScene: (scene) => {
|
|
99
|
-
const idx = Math.max(0, this.sceneStack.length - 1);
|
|
100
|
-
this.sceneStack[idx] = scene;
|
|
101
|
-
this.refreshScene();
|
|
102
|
-
},
|
|
103
|
-
callOwnHandlers: (event) => {
|
|
104
|
-
if (event.type in this.like)
|
|
105
|
-
this.like[event.type](...event.args);
|
|
106
|
-
}
|
|
79
|
+
callOwnHandlers: (ev) => callOwnHandlers(this.like, ev),
|
|
107
80
|
};
|
|
108
81
|
window.addEventListener('focus', () => this.dispatch('focus', ['tab']));
|
|
109
82
|
window.addEventListener('blur', () => this.dispatch('blur', ['tab']));
|
|
110
83
|
this.canvas.addEventListener('focus', () => this.dispatch('focus', ['canvas']));
|
|
111
84
|
}
|
|
112
|
-
refreshScene() {
|
|
113
|
-
const topScene = this.sceneStack.at(-1);
|
|
114
|
-
if (topScene) {
|
|
115
|
-
this.like.handleEvent = (event) => sceneDispatch(topScene, this.like, event);
|
|
116
|
-
if (this.isRunning) {
|
|
117
|
-
this.dispatch("load", []);
|
|
118
|
-
}
|
|
119
|
-
}
|
|
120
|
-
else {
|
|
121
|
-
this.like.handleEvent = undefined;
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
85
|
dispatch(type, args) {
|
|
125
86
|
const event = { type, args, timestamp: this.like.timer.getTime() };
|
|
126
|
-
|
|
127
|
-
this.like.handleEvent(event);
|
|
128
|
-
}
|
|
129
|
-
else {
|
|
130
|
-
this.like.callOwnHandlers(event);
|
|
131
|
-
}
|
|
87
|
+
likeDispatch(this.like, event);
|
|
132
88
|
}
|
|
133
89
|
/**
|
|
134
90
|
* Start the game loop.
|
|
@@ -158,7 +114,26 @@ export class Engine {
|
|
|
158
114
|
* Clean up all resources and stop the engine.
|
|
159
115
|
*/
|
|
160
116
|
dispose() {
|
|
117
|
+
this.dispatch('quit', []);
|
|
161
118
|
this.isRunning = false;
|
|
162
119
|
this.abort.abort();
|
|
163
120
|
}
|
|
164
121
|
}
|
|
122
|
+
export function likeDispatch(obj, event) {
|
|
123
|
+
if (obj.handleEvent) {
|
|
124
|
+
obj.handleEvent(event);
|
|
125
|
+
}
|
|
126
|
+
else {
|
|
127
|
+
callOwnHandlers(obj, event);
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
/**
|
|
131
|
+
* Call event handlers from an event. For example, an event with `.type = update, .args = [dt]`
|
|
132
|
+
* translates to calling `obj.draw(dt)`.
|
|
133
|
+
*
|
|
134
|
+
* Typically used at the end of a custom {@link LikeHandlers.handleEvent | handleEvent}.
|
|
135
|
+
*/
|
|
136
|
+
export function callOwnHandlers(obj, event) {
|
|
137
|
+
if (event.type in obj)
|
|
138
|
+
obj[event.type](...event.args);
|
|
139
|
+
}
|
package/dist/events.d.ts
CHANGED
|
@@ -2,78 +2,54 @@
|
|
|
2
2
|
* @module events
|
|
3
3
|
* @description All events that flow through the engine.
|
|
4
4
|
*/
|
|
5
|
+
import type { LikeButton } from './input/';
|
|
6
|
+
import type { MouseButton } from './input/mouse';
|
|
5
7
|
import type { Vector2 } from './math/vector2';
|
|
6
|
-
|
|
7
|
-
import { MouseButton } from './input/mouse';
|
|
8
|
-
/** @private */
|
|
9
|
-
export type LikeCanvasEventMap = HTMLElementEventMap & {
|
|
10
|
-
'like:mousemoved': CustomEvent<{
|
|
11
|
-
pos: Vector2;
|
|
12
|
-
delta: Vector2;
|
|
13
|
-
}>;
|
|
14
|
-
'like:resizeCanvas': CustomEvent<{
|
|
15
|
-
size: Vector2;
|
|
16
|
-
}>;
|
|
17
|
-
'like:preDraw': CustomEvent<{}>;
|
|
18
|
-
'like:postDraw': CustomEvent<{}>;
|
|
19
|
-
'like:update': CustomEvent<{
|
|
20
|
-
dt: number;
|
|
21
|
-
}>;
|
|
22
|
-
};
|
|
23
|
-
/** @private Custom canvas type that uses our event map as the single source of truth */
|
|
24
|
-
export interface LikeCanvasElement extends HTMLCanvasElement {
|
|
25
|
-
addEventListener<K extends keyof LikeCanvasEventMap>(type: K, listener: (this: LikeCanvasElement, ev: LikeCanvasEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
26
|
-
}
|
|
27
|
-
/**
|
|
28
|
-
* It's a list of every possible event in like2d!
|
|
29
|
-
*
|
|
30
|
-
* Not just that, but these events translate directly into `like` callbacks.
|
|
31
|
-
*
|
|
32
|
-
* For example: `keypressed: [scancode: string, keycode: string]` translates to
|
|
33
|
-
* setting `like.keypressed = (scancode, keycode) => { ... }`!
|
|
34
|
-
*
|
|
35
|
-
*/
|
|
36
|
-
export type EventMap = {
|
|
8
|
+
export type LikeEventHandlers = {
|
|
37
9
|
/** Game initialization. Called once before the first frame. */
|
|
38
|
-
load:
|
|
10
|
+
load: () => void;
|
|
11
|
+
/**
|
|
12
|
+
* Game deinit. Called when like is disposed.
|
|
13
|
+
*
|
|
14
|
+
* Use case: you're using native event handlers or global resource
|
|
15
|
+
* allocations that need to be cleared out to avoid memory leaks,
|
|
16
|
+
* regardless of what called like.dispose().
|
|
17
|
+
*/
|
|
18
|
+
quit: () => void;
|
|
39
19
|
/** Frame update. dt is delta time in seconds (time since last frame). */
|
|
40
|
-
update:
|
|
20
|
+
update: (dt: number) => void;
|
|
41
21
|
/** Render frame. Clear the screen and draw your game here. */
|
|
42
|
-
draw:
|
|
22
|
+
draw: () => void;
|
|
43
23
|
/** Canvas was resized. Used mostly in native mode, though setMode may send it too. */
|
|
44
|
-
resize:
|
|
24
|
+
resize: (size: Vector2) => void;
|
|
45
25
|
/** Physical key pressed. scancode is the physical key, keycode is the character. */
|
|
46
|
-
keypressed:
|
|
26
|
+
keypressed: (scancode: string, keycode: string) => void;
|
|
47
27
|
/** Physical key released. */
|
|
48
|
-
keyreleased:
|
|
28
|
+
keyreleased: (scancode: string, keycode: string) => void;
|
|
49
29
|
/** Canvas or tab gained focus. Game may resume audio/updates. */
|
|
50
|
-
focus:
|
|
30
|
+
focus: (source: 'canvas' | 'tab') => void;
|
|
51
31
|
/** Canvas or tab lost focus. Game may pause audio/updates. */
|
|
52
|
-
blur:
|
|
32
|
+
blur: (source: 'canvas' | 'tab') => void;
|
|
53
33
|
/** Mouse moved event. `pos` is absolute, `delta` is relative. */
|
|
54
|
-
mousemoved:
|
|
34
|
+
mousemoved: (pos: Vector2, delta: Vector2) => void;
|
|
55
35
|
/** Mouse button pressed. pos in canvas pixels. Button: 1=left, 2=middle, 3=right. */
|
|
56
|
-
mousepressed:
|
|
36
|
+
mousepressed: (pos: Vector2, button: MouseButton) => void;
|
|
57
37
|
/** Mouse button released. */
|
|
58
|
-
mousereleased:
|
|
38
|
+
mousereleased: (pos: Vector2, button: MouseButton) => void;
|
|
59
39
|
/** Gamepad button pressed. `source` is controller index, `name` is derived from a mapping on the raw `num` */
|
|
60
|
-
gamepadpressed:
|
|
40
|
+
gamepadpressed: (source: number, name: LikeButton, num: number) => void;
|
|
61
41
|
/** Gamepad button released. `source` is controller index, `name` is derived from a mapping on the raw `num` */
|
|
62
|
-
gamepadreleased:
|
|
63
|
-
/**
|
|
64
|
-
|
|
65
|
-
*/
|
|
66
|
-
gamepadconnected: [index: number];
|
|
42
|
+
gamepadreleased: (source: number, name: LikeButton, num: number) => void;
|
|
43
|
+
/** Fires when a gamepad is connected. */
|
|
44
|
+
gamepadconnected: (index: number) => void;
|
|
67
45
|
/** Fires when a gamepad is disconnected. */
|
|
68
|
-
gamepaddisconnected:
|
|
46
|
+
gamepaddisconnected: (index: number) => void;
|
|
69
47
|
/** Mapped action triggered. See {@link input.Input} for action mapping. */
|
|
70
|
-
actionpressed:
|
|
48
|
+
actionpressed: (action: string) => void;
|
|
71
49
|
/** Mapped action released. */
|
|
72
|
-
actionreleased:
|
|
50
|
+
actionreleased: (action: string) => void;
|
|
73
51
|
};
|
|
74
52
|
/** @private */
|
|
75
|
-
export type EventType = keyof EventMap;
|
|
76
|
-
/** @private */
|
|
77
53
|
export type LikeMouseEvent = 'mousemoved' | 'mousepressed' | 'mousereleased';
|
|
78
54
|
/** @private */
|
|
79
55
|
export type LikeKeyboardEvent = 'keypressed' | 'keyreleased';
|
|
@@ -85,16 +61,42 @@ export type LikeActionEvent = 'actionpressed' | 'actionreleased';
|
|
|
85
61
|
* @private
|
|
86
62
|
* Generic dispatcher - each module defines its own event subset
|
|
87
63
|
*/
|
|
88
|
-
export type Dispatcher<
|
|
64
|
+
export type Dispatcher<K extends keyof LikeEventHandlers> = (type: K, args: Parameters<LikeEventHandlers[K]>) => void;
|
|
89
65
|
/**
|
|
90
|
-
* @
|
|
91
|
-
*
|
|
66
|
+
* This is what gets passed into {@link LikeHandlers.handleEvent} functions, which are
|
|
67
|
+
* used to filter event streams.
|
|
68
|
+
*
|
|
69
|
+
* Example:
|
|
70
|
+
* ```ts
|
|
71
|
+
* { type: 'mousemoved', args: [ [100, 250], [-5, -5] ], timestamp: 2.56 }
|
|
72
|
+
* ```
|
|
73
|
+
*
|
|
74
|
+
* {@link LikeHandlers} has the full list.
|
|
92
75
|
*/
|
|
93
76
|
export type LikeEvent = {
|
|
94
|
-
[K in
|
|
77
|
+
[K in keyof LikeEventHandlers]: {
|
|
95
78
|
type: K;
|
|
96
|
-
args:
|
|
79
|
+
args: Parameters<LikeEventHandlers[K]>;
|
|
97
80
|
timestamp: number;
|
|
98
81
|
};
|
|
99
|
-
}[
|
|
82
|
+
}[keyof LikeEventHandlers];
|
|
83
|
+
/** @private */
|
|
84
|
+
export type LikeCanvasEventMap = HTMLElementEventMap & {
|
|
85
|
+
'like:mousemoved': CustomEvent<{
|
|
86
|
+
pos: Vector2;
|
|
87
|
+
delta: Vector2;
|
|
88
|
+
}>;
|
|
89
|
+
'like:resizeCanvas': CustomEvent<{
|
|
90
|
+
size: Vector2;
|
|
91
|
+
}>;
|
|
92
|
+
'like:preDraw': CustomEvent<{}>;
|
|
93
|
+
'like:postDraw': CustomEvent<{}>;
|
|
94
|
+
'like:update': CustomEvent<{
|
|
95
|
+
dt: number;
|
|
96
|
+
}>;
|
|
97
|
+
};
|
|
98
|
+
/** @private Custom canvas type that uses our event map as the single source of truth */
|
|
99
|
+
export interface LikeCanvasElement extends HTMLCanvasElement {
|
|
100
|
+
addEventListener<K extends keyof LikeCanvasEventMap>(type: K, listener: (this: LikeCanvasElement, ev: LikeCanvasEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
101
|
+
}
|
|
100
102
|
//# sourceMappingURL=events.d.ts.map
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* # Graphics Module
|
|
6
6
|
*
|
|
7
7
|
* A wrapper around browser Canvas.
|
|
8
|
-
* In standard usage `like.gfx` gives a {@link
|
|
8
|
+
* In standard usage `like.gfx` gives a {@link Graphics} object with a canvas already on it.
|
|
9
9
|
* So, you can for example call `like.gfx.rectangle('fill', 'green', [10, 10, 30, 30])`
|
|
10
10
|
*
|
|
11
11
|
* ## State Isolation
|
|
@@ -35,7 +35,8 @@ export type DrawMode = "fill" | "line";
|
|
|
35
35
|
* - Alpha defaults to 1 if omitted
|
|
36
36
|
* - CSS color strings also accepted: `"red"`, `"#ff0000"`, `"rgb(255,0,0)"`
|
|
37
37
|
*/
|
|
38
|
-
export type
|
|
38
|
+
export type ColorNum = [number, number, number, number?];
|
|
39
|
+
export type Color = ColorNum | string;
|
|
39
40
|
export type TransformProps = {
|
|
40
41
|
angle?: number;
|
|
41
42
|
scale?: number | Vector2;
|
|
@@ -114,7 +115,7 @@ export declare class Graphics {
|
|
|
114
115
|
* @param mode Fill or line.
|
|
115
116
|
* @param color Fill or stroke color.
|
|
116
117
|
* @param position Center position.
|
|
117
|
-
* @param
|
|
118
|
+
* @param radius
|
|
118
119
|
* @param props Optional arc, center, and stroke properties. Center is true by default.
|
|
119
120
|
*/
|
|
120
121
|
circle(mode: DrawMode, color: Color, position: Vector2, radius: number, props?: ShapeProps & {
|
|
@@ -217,7 +218,7 @@ export declare class Graphics {
|
|
|
217
218
|
*
|
|
218
219
|
* Outside, it stays the same.
|
|
219
220
|
*
|
|
220
|
-
* @param
|
|
221
|
+
* @param context The context to call when drawing.
|
|
221
222
|
* @param callback Functions that will be called while drawing to the target.
|
|
222
223
|
*/
|
|
223
224
|
withRenderTarget(context: CanvasRenderingContext2D, callback: () => void): void;
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* # Graphics Module
|
|
6
6
|
*
|
|
7
7
|
* A wrapper around browser Canvas.
|
|
8
|
-
* In standard usage `like.gfx` gives a {@link
|
|
8
|
+
* In standard usage `like.gfx` gives a {@link Graphics} object with a canvas already on it.
|
|
9
9
|
* So, you can for example call `like.gfx.rectangle('fill', 'green', [10, 10, 30, 30])`
|
|
10
10
|
*
|
|
11
11
|
* ## State Isolation
|
|
@@ -148,7 +148,7 @@ export class Graphics {
|
|
|
148
148
|
* @param mode Fill or line.
|
|
149
149
|
* @param color Fill or stroke color.
|
|
150
150
|
* @param position Center position.
|
|
151
|
-
* @param
|
|
151
|
+
* @param radius
|
|
152
152
|
* @param props Optional arc, center, and stroke properties. Center is true by default.
|
|
153
153
|
*/
|
|
154
154
|
circle(mode, color, position, radius, props) {
|
|
@@ -373,7 +373,7 @@ export class Graphics {
|
|
|
373
373
|
*
|
|
374
374
|
* Outside, it stays the same.
|
|
375
375
|
*
|
|
376
|
-
* @param
|
|
376
|
+
* @param context The context to call when drawing.
|
|
377
377
|
* @param callback Functions that will be called while drawing to the target.
|
|
378
378
|
*/
|
|
379
379
|
withRenderTarget(context, callback) {
|
package/dist/graphics/index.d.ts
CHANGED
|
@@ -5,6 +5,6 @@
|
|
|
5
5
|
export type { Graphics } from "./graphics";
|
|
6
6
|
export type { Canvas } from "./canvas";
|
|
7
7
|
export type { ImageHandle } from './image';
|
|
8
|
-
export type { Color, DrawMode, ShapeProps, DrawProps, PrintProps, } from "./graphics";
|
|
8
|
+
export type { Color, ColorNum, DrawMode, ShapeProps, DrawProps, PrintProps, TransformProps, } from "./graphics";
|
|
9
9
|
export type { CanvasSize, CanvasModeOptions, } from "./canvas";
|
|
10
10
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts
CHANGED
|
@@ -3,10 +3,9 @@
|
|
|
3
3
|
*
|
|
4
4
|
*/
|
|
5
5
|
import type { Like } from './like';
|
|
6
|
-
export type { Like,
|
|
7
|
-
export type { LikeEvent,
|
|
8
|
-
export
|
|
9
|
-
export type { EngineProps } from './engine';
|
|
6
|
+
export type { Like, LikeHandlers, LikeBase, TopLevelEventHandler } from './like';
|
|
7
|
+
export type { LikeEvent, LikeCanvasElement } from './events';
|
|
8
|
+
export { callOwnHandlers, likeDispatch } from './engine';
|
|
10
9
|
/**
|
|
11
10
|
* Create a new Like2D game instance attached to a DOM container.
|
|
12
11
|
*
|
package/dist/index.js
CHANGED
|
@@ -6,10 +6,9 @@
|
|
|
6
6
|
* Here are the top-level events, modules, and the scene system.
|
|
7
7
|
*
|
|
8
8
|
* See {@link createLike} to get started.
|
|
9
|
-
*
|
|
10
|
-
* @module like
|
|
11
9
|
*/
|
|
12
10
|
import { Engine } from './engine';
|
|
11
|
+
export { callOwnHandlers, likeDispatch } from './engine';
|
|
13
12
|
/**
|
|
14
13
|
* Create a new Like2D game instance attached to a DOM container.
|
|
15
14
|
*
|
package/dist/input/gamepad.d.ts
CHANGED
|
@@ -12,9 +12,9 @@ export type GamepadTarget = number | "any";
|
|
|
12
12
|
*
|
|
13
13
|
* If you're planning on supporting gamepads, please include a
|
|
14
14
|
* way to generate {@link GamepadMapping} and set it with {@link Gamepad.setMapping}.
|
|
15
|
-
* Perhaps trigger it on {@link index.
|
|
15
|
+
* Perhaps trigger it on {@link index.LikeHandlers.gamepadconnected | gamepadconnected} events.
|
|
16
16
|
*
|
|
17
|
-
* If you don't want to make your own, take a look at {@link prefab
|
|
17
|
+
* If you don't want to make your own, take a look at {@link scene/prefab/mapGamepad}
|
|
18
18
|
*
|
|
19
19
|
* ## When to use gamepad remapping
|
|
20
20
|
*
|
package/dist/input/gamepad.js
CHANGED
|
@@ -7,9 +7,9 @@ import { defaultMapping, fullButtonName, getSdlMapping, mapStick, standardButton
|
|
|
7
7
|
*
|
|
8
8
|
* If you're planning on supporting gamepads, please include a
|
|
9
9
|
* way to generate {@link GamepadMapping} and set it with {@link Gamepad.setMapping}.
|
|
10
|
-
* Perhaps trigger it on {@link index.
|
|
10
|
+
* Perhaps trigger it on {@link index.LikeHandlers.gamepadconnected | gamepadconnected} events.
|
|
11
11
|
*
|
|
12
|
-
* If you don't want to make your own, take a look at {@link prefab
|
|
12
|
+
* If you don't want to make your own, take a look at {@link scene/prefab/mapGamepad}
|
|
13
13
|
*
|
|
14
14
|
* ## When to use gamepad remapping
|
|
15
15
|
*
|
package/dist/input/mouse.d.ts
CHANGED
|
@@ -87,7 +87,7 @@ export declare class Mouse {
|
|
|
87
87
|
* In locked mode, the cursor cannot escape the canvas.
|
|
88
88
|
* It also becomes invisible.
|
|
89
89
|
* However, it can move infinitely, sensitivity can be controlled,
|
|
90
|
-
* and the emulated cursor (in `pos` of {@link index.
|
|
90
|
+
* and the emulated cursor (in `pos` of {@link index.LikeHandlers.mousemoved}) can be freely repositioned.
|
|
91
91
|
*
|
|
92
92
|
* ```ts
|
|
93
93
|
* {
|
|
@@ -98,13 +98,13 @@ export declare class Mouse {
|
|
|
98
98
|
* Avoid binding the `ESC` key in captured mode. This will exit the capture and
|
|
99
99
|
* reset mode to default.
|
|
100
100
|
*
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
101
|
+
* ### Note on `pos` vs `delta`
|
|
102
|
+
* Event {@link index.LikeHandlers.mousemoved} passes both `pos` and `delta` args.
|
|
103
|
+
*
|
|
104
|
+
* Though the emulated cursor in locked mode
|
|
105
|
+
* (locked mode doesn't natively track absolute position)
|
|
106
|
+
* may be stuck on canvas edges, the `delta` field always
|
|
107
|
+
* represents mouse movement, even against edges.
|
|
108
108
|
*/
|
|
109
109
|
setMode(mode: MouseSetMode): void;
|
|
110
110
|
getMode(): MouseMode;
|
package/dist/input/mouse.js
CHANGED
|
@@ -189,7 +189,7 @@ export class Mouse {
|
|
|
189
189
|
* In locked mode, the cursor cannot escape the canvas.
|
|
190
190
|
* It also becomes invisible.
|
|
191
191
|
* However, it can move infinitely, sensitivity can be controlled,
|
|
192
|
-
* and the emulated cursor (in `pos` of {@link index.
|
|
192
|
+
* and the emulated cursor (in `pos` of {@link index.LikeHandlers.mousemoved}) can be freely repositioned.
|
|
193
193
|
*
|
|
194
194
|
* ```ts
|
|
195
195
|
* {
|
|
@@ -200,13 +200,13 @@ export class Mouse {
|
|
|
200
200
|
* Avoid binding the `ESC` key in captured mode. This will exit the capture and
|
|
201
201
|
* reset mode to default.
|
|
202
202
|
*
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
203
|
+
* ### Note on `pos` vs `delta`
|
|
204
|
+
* Event {@link index.LikeHandlers.mousemoved} passes both `pos` and `delta` args.
|
|
205
|
+
*
|
|
206
|
+
* Though the emulated cursor in locked mode
|
|
207
|
+
* (locked mode doesn't natively track absolute position)
|
|
208
|
+
* may be stuck on canvas edges, the `delta` field always
|
|
209
|
+
* represents mouse movement, even against edges.
|
|
210
210
|
*/
|
|
211
211
|
setMode(mode) {
|
|
212
212
|
this.lockPointer(mode.lock);
|