feat: fps built in & animation entity

examples/atlas.ts

@@ -0,0 +1,37 @@
+import { World, Animation, Atlas } from '../mod.ts';
+
+
+class Game extends World {
+    public test = new Atlas('assets/klutzy.json');
+    public setup() {
+        const test = new Animation(this, 45, 45, this.test, [
+            'sprite1',
+            'sprite2',
+            'sprite3',
+            'sprite4',
+            'sprite5',
+            'sprite6',
+            'sprite7',
+            'sprite8'
+        ]);
+        this.addChild(test);
+    }
+    public draw() {
+
+    }
+}
+
+const test = new Game({
+    title: "test",
+    width: 800,
+    height: 600,
+    centered: true,
+    fullscreen: false,
+    hidden: false,
+    resizable: true,
+    minimized: false,
+    maximized: false,
+    flags: null,    
+});
+
+await test.start();

examples/sprite.ts

@@ -2,6 +2,7 @@ import { World, Sprite } from '../mod.ts';
 
 
 class Game extends World {
+    public FPS = 5;
     public test = new Sprite(this, "assets/sample.png", 200, 100, 307, 127,{rows:1,cols:4});
 
     public setup() {

mod.ts

@@ -1,36 +1,34 @@
 export { World } from "./src/World.ts";
 export {
+  Animation,
   Arne16,
   Atlas,
   AtlasSprite,
   C64,
   CGA,
-  JMP,
-  MSX,
   Entity,
+  Group,
   Image,
+  JMP,
   Line,
+  MSX,
   PICO8,
   Point,
   Rectangle,
   Sprite,
   Text,
   TextureSprite,
-  Group
 } from "./src/entities/mod.ts";
-export {
-  GravityForce,
-  NormalForce
-} from "./src/physics/mod.ts"
+export { GravityForce, NormalForce } from "./src/physics/mod.ts";
 export { Vector } from "./src/math/mod.ts";
 export { Keys } from "./src/utils/Keycodes.ts";
-export type { 
-    KeyEvent,
-    MouseDownEvent,
-    PixelTexture,
-    spriteConfig,
-    Frame,
-    RGBA,
-    WorldOptions,
-    WorldPhysicsOptions
+export type {
+  Frame,
+  KeyEvent,
+  MouseDownEvent,
+  PixelTexture,
+  RGBA,
+  spriteConfig,
+  WorldOptions,
+  WorldPhysicsOptions,
 } from "./src/types.ts";

src/World.ts

@@ -10,10 +10,12 @@ import {
   Sprite,
   Text,
   TextureSprite,
+  Animation,
 } from "../mod.ts";
 import { hexToRGBA } from "./utils/mod.ts";
 
 export abstract class World extends Canvas {
+  public FPS = 100;
   public entities: Array<Entity> = [];
   public params: WorldOptions;
   constructor(params: WorldOptions) {
@@ -52,6 +54,7 @@ export abstract class World extends Canvas {
     this.entities.splice(index, 1);
   }
   private _draw() {
+    this._fps()();
     this.setDrawColor(0, 0, 0, 255);
     this.clear();
     for (const entity of this.entities) {
@@ -62,6 +65,19 @@ export abstract class World extends Canvas {
     Deno.sleepSync(10);
   }
 
+  public _fps() {
+    let start = performance.now();
+    let frames = 0;
+    return () => {
+      frames++;
+      if ((performance.now() - start) >= 1000) {
+        start = performance.now();
+        frames = 0;
+      }
+
+      Deno.sleepSync(1 / this.FPS * 1000);
+    }
+  }
   private _render(entity: Entity) {
     if (entity instanceof Rectangle) {
       this.setDrawColor(
@@ -138,6 +154,9 @@ export abstract class World extends Canvas {
           height: Math.round(entity.frame.height),
         },
       );
+    } else if (entity instanceof Animation) {
+        this._render(new AtlasSprite(this, entity.x, entity.y, entity.atlas, entity.frames[entity.currentFrame]));
+        entity.currentFrame = (entity.currentFrame + 1) % entity.frames.length;
     } else if (entity instanceof TextureSprite) {
       for (let y = 0; y < entity.data.length; y++) {
         const row = entity.data[y];

src/entities/mod.ts

@@ -1,6 +1,6 @@
-export { Entity } from './Entity.ts';
-export { Rectangle, Point, Line } from './geometry/mod.ts';
-export { Sprite, Image, Atlas, AtlasSprite } from './sprites/mod.ts';
+export { Entity } from "./Entity.ts";
+export { Line, Point, Rectangle } from "./geometry/mod.ts";
+export { Animation, Atlas, AtlasSprite, Image, Sprite } from "./sprites/mod.ts";
 export { Text } from "./text/mod.ts";
-export { Group } from './containers/mod.ts';
-export * from "./textures/mod.ts";
+export { Group } from "./containers/mod.ts";
+export * from "./textures/mod.ts";

src/entities/sprites/Animation.ts

@@ -0,0 +1,15 @@
+import { Entity, Atlas } from "../mod.ts";
+import { World } from '../../../mod.ts';
+
+export class Animation  extends Entity {
+
+    public atlas: Atlas;
+    public frames: Array<string>;
+    public currentFrame = 0;
+
+    constructor(_world: World, x: number, y: number, atlas: Atlas, frames: Array<string>) { 
+        super(x, y);
+        this.atlas = atlas;
+        this.frames = frames;
+    }
+}

src/entities/sprites/mod.ts

@@ -1,4 +1,5 @@
-export { Image } from './Image.ts';
-export { Sprite } from './Sprite.ts';
-export { Atlas } from './Atlas.ts';
-export { AtlasSprite } from './AtlasSprite.ts';
+export { Image } from "./Image.ts";
+export { Sprite } from "./Sprite.ts";
+export { Atlas } from "./Atlas.ts";
+export { AtlasSprite } from "./AtlasSprite.ts";
+export { Animation } from "./Animation.ts";

src/utils/mod.ts

@@ -1,4 +1,3 @@
-export { FPS } from "./FPS.ts";
 export { Keys } from "./Keycodes.ts";
 export { atlas, PhaserAtlas } from "./atlas/mod.ts";
 export { hexToRGBA } from "./HexToRGBA.ts";