Adding Outline capabilities and a ActionableItem notion.

front/src/Phaser/Items/ActionableItem.ts

@@ -0,0 +1,60 @@
+/**
+ * An actionable item represents an in-game object that can be activated using the space-bar.
+ * It has coordinates and an "activation radius"
+ */
+import Sprite = Phaser.GameObjects.Sprite;
+import {OutlinePipeline} from "../Shaders/OutlinePipeline";
+
+export class ActionableItem {
+    private readonly activationRadiusSquared : number;
+    private isSelectable: boolean = false;
+
+    public constructor(private sprite: Sprite, private activationRadius: number) {
+        this.activationRadiusSquared = activationRadius * activationRadius;
+    }
+
+    /**
+     * Returns the square of the distance to the object center IF we are in item action range
+     * OR null if we are out of range.
+     */
+    public actionableDistance(x: number, y: number): number|null {
+        let distanceSquared = (x - this.sprite.x)*(x - this.sprite.x) + (y - this.sprite.y)*(y - this.sprite.y);
+        if (distanceSquared < this.activationRadiusSquared) {
+            return distanceSquared;
+        } else {
+            return null;
+        }
+    }
+
+    /**
+     * Show the outline of the sprite.
+     */
+    public selectable(): void {
+        if (this.isSelectable) {
+            return;
+        }
+        this.isSelectable = true;
+        this.sprite.setPipeline(OutlinePipeline.KEY);
+        this.sprite.pipeline.setFloat2('uTextureSize',
+            this.sprite.texture.getSourceImage().width, this.sprite.texture.getSourceImage().height);
+    }
+
+    /**
+     * Hide the outline of the sprite
+     */
+    public notSelectable(): void {
+        if (!this.isSelectable) {
+            return;
+        }
+        this.isSelectable = false;
+        this.sprite.resetPipeline();
+    }
+
+    /**
+     * Triggered when the "space" key is pressed and the object is in range of being activated.
+     */
+    public activate(): void {
+
+    }
+}
+

front/src/Phaser/Items/Computer/computer.ts

@@ -0,0 +1,24 @@
+import * as Phaser from 'phaser';
+import {Scene} from "phaser";
+import Sprite = Phaser.GameObjects.Sprite;
+import {ITiledMapObject} from "../../Map/ITiledMap";
+import {ItemFactoryInterface} from "../ItemFactoryInterface";
+import {GameScene} from "../../Game/GameScene";
+import {ActionableItem} from "../ActionableItem";
+
+export default {
+    preload: (loader: Phaser.Loader.LoaderPlugin): void => {
+        loader.atlas('computer', 'http://maps.workadventure.localhost/computer/computer.png', 'http://maps.workadventure.localhost/computer/computer_atlas.json');
+    },
+    create: (scene: GameScene): void => {
+
+    },
+    factory: (scene: GameScene, object: ITiledMapObject): ActionableItem => {
+        // Idée: ESSAYER WebPack? https://paultavares.wordpress.com/2018/07/02/webpack-how-to-generate-an-es-module-bundle/
+        let foo = new Sprite(scene, object.x, object.y, 'computer');
+        scene.add.existing(foo);
+
+        return new ActionableItem(foo, 32);
+        //scene.add.sprite(object.x, object.y, 'computer');
+    }
+} as ItemFactoryInterface;

front/src/Phaser/Items/ItemFactoryInterface.ts

@@ -0,0 +1,10 @@
+import LoaderPlugin = Phaser.Loader.LoaderPlugin;
+import {GameScene} from "../Game/GameScene";
+import {ITiledMapObject} from "../Map/ITiledMap";
+import {ActionableItem} from "./ActionableItem";
+
+export interface ItemFactoryInterface {
+    preload: (loader: LoaderPlugin) => void;
+    create: (scene: GameScene) => void;
+    factory: (scene: GameScene, object: ITiledMapObject) => ActionableItem;
+}