entity movement ready to go

example/rpg/MyAwesomeRpgGame.ts

@@ -89,8 +89,15 @@ class MyAwesomeRpgGame extends Client {
      */
     public update(myGame: Game, input: Input): void {
 
+        // get the arrow keys
+        const arrowKeys = input.getArrowKeys();
+
         // handle movement for link
-        this.link.handleMovement(input.getArrowKeys());
+        if (arrowKeys.right) this.link.translatePosition(5, 0);
+        else if (arrowKeys.left) this.link.translatePosition(-5, 0);
+        if (arrowKeys.up) this.link.translatePosition(0, -5);
+        else if (arrowKeys.down) this.link.translatePosition(0, 5);
+
     }
 }
 

example/rpg/entity/Link.ts

@@ -98,31 +98,28 @@ export class Link extends Entity implements CanCollide {
      */
     public handleMovement(arrowKeys: InputArrowKeys): void {
 
-        /*// get moveable directions
-        const blockedDirections = this.getBlockedDirections();
-
         // move the player
-        if (arrowKeys.left && !blockedDirections.Left) {
+        if (arrowKeys.left) {
 
             this.setPosition(this.position.add(
                 new Vector2D(-5, 0)
             ));
             this.playAnimation('run_left', true);
-        } else if (arrowKeys.right && !blockedDirections.Right) {
+        } else if (arrowKeys.right) {
 
             this.setPosition(this.position.add(
                 new Vector2D(5, 0)
             ));
             this.playAnimation('run_right', true);
         }
 
-        if (arrowKeys.down && !blockedDirections.Down) {
+        if (arrowKeys.down) {
 
             this.setPosition(this.position.add(
                 new Vector2D(0, 5)
             ));
             this.playAnimation('run_down', true);
-        } else if (arrowKeys.up && !blockedDirections.Up) {
+        } else if (arrowKeys.up) {
 
             this.setPosition(this.position.add(
                 new Vector2D(0, -5)
@@ -139,7 +136,7 @@ export class Link extends Entity implements CanCollide {
 
             // stop animation
             this.stopAnimation();
-        }*/
+        }
     }
 
 }

src/client/camera/OrthogonalCamera.ts

@@ -50,24 +50,8 @@ export class OrthogonalCamera extends BaseCamera {
      */
     public isEntityVisible(entity: Entity): boolean {
 
-        // get the size of the entity
-        const entityDimension = Vector2D.from(
-            entity.getWidth(),
-            entity.getHeight()
-        );
-
-        // calculate the position of the entity including camera scale
-        const entityPosition = entity.getPosition().multiply(
-            this.getScaleVector()
-        );
-
-        // substract entity position and size for a max offset vector
-        const entityScaledPoisition = entityPosition.substract(entityDimension);
-
-        // check
-        return this.drawingDimension.x >= entityScaledPoisition.x
-            &&
-            this.drawingDimension.y >= entityScaledPoisition.y;
+        // currently render all entities
+        return true;
     }
 
     /**

src/client/render/BaseEntityRenderer.ts

@@ -6,6 +6,7 @@
  */
 
 import { EntityRenderer } from './EntityRenderer';
+import { AssetStorage } from '../asset/AssetStorage';
 import { Singleton } from '../../shared/helper/Singleton';
 import { RenderableEntity } from '../entity';
 import { Camera } from '../camera/Camera';
@@ -22,6 +23,11 @@ export abstract class BaseEntityRenderer extends Singleton implements EntityRend
      */
     protected worldRenderer: WorldRenderer;
 
+    /**
+     * the asset storage for entity images
+     */
+    protected assetStorage = AssetStorage.getInstance<AssetStorage>();
+
     /**
      * logger instance
      */

src/client/render/BasicRenderer.ts

@@ -89,6 +89,14 @@ export abstract class BasicRenderer extends Singleton implements Renderer {
         return this.currentCamera;
     }
 
+    /**
+     * get the last drawing area update timestamp
+     */
+    public getLastUpdate(): number {
+
+        return this.fps.lastUpdate;
+    }
+
     /**
      * print the current fps on the canvas
      */

src/client/render/Renderer.ts

@@ -54,4 +54,9 @@ export interface Renderer {
      */
     setCamera(camera: Camera): void;
 
+    /**
+     * get the last drawing area update timestamp
+     */
+    getLastUpdate(): number;
+
 }

src/client/render/canvas/CanvasEntityRenderer.ts

@@ -7,12 +7,21 @@
 
 import { BaseEntityRenderer } from '../BaseEntityRenderer';
 import { RenderableEntity } from '../../entity/RenderableEntity';
+import { Image, AssetType } from '../../asset';
+import { Vector2D } from '../../../shared';
 
 /**
  * an entity renderer for canvas
  */
 export class CanvasEntityRenderer extends BaseEntityRenderer {
 
+    constructor(
+        drawingDimension: Vector2D,
+        protected ctx: CanvasRenderingContext2D
+    ) {
+        super(drawingDimension);
+    }
+
     /**
      * renders the given entity
      */
@@ -25,7 +34,30 @@ export class CanvasEntityRenderer extends BaseEntityRenderer {
         if (!entity.isVisible() || !camera.isEntityVisible(entity)) return;
 
         // get the position for the entity
-
+        const positionVector = camera.translatePosition(entity.getPosition());
+
+        // get image and scale vector
+        const entityImageName = entity.getImage();
+        let entityScaleVector = Vector2D.from(entity.getScale());
+
+        // get the image from the asset store
+        const entityImage = this.assetStorage.getAsset<Image>(
+            entityImageName, AssetType.Image
+        ).getData() as ImageBitmap;
+
+        // sacle the entity
+        entityScaleVector = entityScaleVector.multiply(Vector2D.from(
+            entityImage.width, entityImage.height
+        ));
+
+        // draw the image
+        this.ctx.drawImage(
+            entityImage,
+            0, 0,
+            entityImage.width, entityImage.height,
+            positionVector.x, positionVector.y,
+            entityScaleVector.x, entityScaleVector.y
+        );
     }
 
 }

src/client/render/canvas/CanvasRenderer.ts

@@ -62,7 +62,8 @@ export class CanvasRenderer extends BasicRenderer {
         this.entityRenderer = new CanvasEntityRenderer(
             Vector2D.from(
                 this.gameDimension.x, this.gameDimension.y
-            )
+            ),
+            this.ctx
         );
     }
 

src/shared/entity/Entity.ts

@@ -51,4 +51,28 @@ export abstract class Entity {
 
         this.position = position;
     }
+
+    /**
+     * changes the position of the position by applying
+     * a vector addition
+     *
+     * @param positionTranslation
+     * @param positionTranslationY
+     */
+    public translatePosition(
+        positionTranslation: Vector2D | number,
+        positionTranslationY?: number
+    ): void {
+
+        // number given?
+        if (isFinite(positionTranslation as number)) {
+
+            positionTranslation = Vector2D.from(
+                positionTranslation as number, positionTranslationY
+            );
+        }
+
+        // add the position
+        this.position = this.position.add(positionTranslation as Vector2D);
+    }
 }