kippy 0.2.0 → 0.2.1

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 CHANGED
@@ -31,6 +31,9 @@ const game = new Game({
31
31
 
32
32
  // Start the game loop
33
33
  game.start();
34
+
35
+ // You can also swap canvas if you want
36
+ // game.setCanvas(someOtherCanvas);
34
37
  ```
35
38
 
36
39
  ### Create a scene
@@ -63,7 +66,8 @@ const entity = new Entity({
63
66
  sprite, // Entity's sprite to be rendered, type Sprite
64
67
  x, // Entity's x position (centered), type number
65
68
  y, // Entity's y position (centered), type number
66
- rotation // Entity's rotation in radians, type number
69
+ rotation, // Entity's rotation in radians, type number
70
+ body, // Entity's physical body, type EntityBody
67
71
  });
68
72
 
69
73
  // Add it to a scene
@@ -84,13 +88,13 @@ A sprite represents what an entity looks like, the "graphics part", you can crea
84
88
  import { Sprite } from "kippy";
85
89
 
86
90
  const sprite = new Sprite({
87
- texture, // Sprite's texture, can be HTMLImageElement, HTMLCanvasElement, OffscreenCanvas, ImageBitmap
91
+ texture, // Sprite's texture - HTMLImageElement, HTMLCanvasElement, OffscreenCanvas, ImageBitmap
88
92
  width, // Sprite's width, type number
89
93
  height // Sprite's height, type number
90
94
  });
91
95
 
92
96
  // Set sprite for an entity
93
- entity.setSprite(sprite);
97
+ entity.sprite = sprite;
94
98
  ```
95
99
 
96
100
  ### Add controls
@@ -116,11 +120,39 @@ input.mouseY; // Current Y position of mouse
116
120
 
117
121
  ### Physics
118
122
 
123
+ For movements, currently you can create a `RigidBody`:
124
+ ```js
125
+ // Create a rigid body
126
+ const rigidBody = new RigidBody({
127
+ velocityX, // X velocity, type number
128
+ velocityY, // Y velocity, type number
129
+ rotationVelocity, // Angular/rotation velocity, type number
130
+ mass, // Entity's mass, type number
131
+ inertia, // Entity's inertia, type number
132
+ forceX, // Entity's force on X axis, type number
133
+ forceY, // Entity's force on Y axis, type number
134
+ torque, // Entity's torque/rotational force, type number
135
+ });
136
+
137
+ // Attach body to an entity
138
+ entity.body = rigidBody;
139
+
140
+ // And you can mutate these props to update movement every frame
141
+ entity.body.velocityX; // Set with the matching parameter above, default is 0
142
+ entity.body.velocityY; // Set with the matching parameter above, default is 0
143
+ entity.body.rotationVelocity; // Set with the matching parameter above, default is 0
144
+ entity.body.mass; // Set with the matching parameter above, default is 1
145
+ entity.body.inertia; // Set with the matching parameter above, default is 1
146
+ entity.body.forceX; // Set with the matching parameter above, default is 0
147
+ entity.body.forceY; // Set with the matching parameter above, default is 0
148
+ entity.body.torque; // Set with the matching parameter above, default is 0
149
+ ```
119
150
 
151
+ Collisions to be added.
120
152
 
121
153
  ### Animation
122
154
 
123
- To be added, for now call `setSprite` to swap sprites for animations.
155
+ To be added, for now mutate `entity.sprite` to swap sprites and create animations manually.
124
156
 
125
157
  ### Audio
126
158
 
package/dist/entity.d.ts CHANGED
@@ -1,19 +1,18 @@
1
- import { RigidBody } from "./physics.js";
1
+ import { EntityBody } from "./physics.js";
2
2
  import { Sprite } from "./sprite.js";
3
3
  export interface EntityOptions {
4
4
  sprite?: Sprite;
5
5
  x?: number;
6
6
  y?: number;
7
7
  rotation?: number;
8
- body?: RigidBody;
8
+ body?: EntityBody;
9
9
  }
10
10
  export declare class Entity {
11
11
  sprite?: Sprite;
12
12
  x: number;
13
13
  y: number;
14
14
  rotation: number;
15
- body?: RigidBody;
15
+ body?: EntityBody;
16
16
  constructor(options?: EntityOptions);
17
- setSprite(sprite: Sprite): void;
18
17
  render(ctx: CanvasRenderingContext2D): void;
19
18
  }
package/dist/entity.js CHANGED
@@ -11,9 +11,6 @@ export class Entity {
11
11
  this.rotation = options.rotation ?? 0;
12
12
  this.body = options.body;
13
13
  }
14
- setSprite(sprite) {
15
- this.sprite = sprite;
16
- }
17
14
  render(ctx) {
18
15
  if (this.sprite) {
19
16
  ctx.save();
package/dist/game.d.ts CHANGED
@@ -14,8 +14,8 @@ export declare class Game {
14
14
  input: Input;
15
15
  physics: Physics;
16
16
  constructor(options: GameOptions);
17
+ setCanvas(canvas: HTMLCanvasElement): void;
17
18
  setScene(scene: Scene): void;
18
- setInput(input: Input): void;
19
19
  start(): void;
20
20
  loop(timestamp: number): void;
21
21
  }
package/dist/game.js CHANGED
@@ -13,14 +13,15 @@ export class Game {
13
13
  this.input = options.input ?? new Input({ canvas: this.canvas });
14
14
  this.physics = options.physics ?? new Physics();
15
15
  }
16
+ setCanvas(canvas) {
17
+ this.canvas = canvas;
18
+ this.ctx = this.canvas.getContext("2d");
19
+ }
16
20
  setScene(scene) {
17
21
  this.scene?.exit();
18
22
  this.scene = scene;
19
23
  this.scene.init();
20
24
  }
21
- setInput(input) {
22
- this.input = input;
23
- }
24
25
  start() {
25
26
  requestAnimationFrame(this.loop.bind(this));
26
27
  }
package/dist/physics.d.ts CHANGED
@@ -20,6 +20,7 @@ export declare class RigidBody {
20
20
  torque: number;
21
21
  constructor(options?: RigidBodyOptions);
22
22
  }
23
+ export type EntityBody = RigidBody;
23
24
  export declare class Physics {
24
25
  update(entities: Entity[]): void;
25
26
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kippy",
3
- "version": "0.2.0",
3
+ "version": "0.2.1",
4
4
  "description": "Kippy 2D web game engine for JS",
5
5
  "keywords": [
6
6
  "kippy",