Merge branch 'master' of https://github.com/thecodingmachine/workadventure into feature/back-players-proximity

This commit is contained in:
David MAECHLER 2020-04-07 10:08:16 +02:00
commit 6cca64e62e
3 changed files with 82 additions and 36 deletions

View File

@ -1,5 +1,7 @@
const API_URL = process.env.API_URL || "http://api.workadventure.localhost"; const API_URL = process.env.API_URL || "http://api.workadventure.localhost";
const RESOLUTION = 2;
export { export {
API_URL API_URL,
RESOLUTION
} }

View File

@ -1,3 +1,4 @@
import {RESOLUTION} from "./Enum/EnvironmentVariable";
export class GameScene extends Phaser.Scene { export class GameScene extends Phaser.Scene {
private player: Phaser.GameObjects.Sprite; private player: Phaser.GameObjects.Sprite;
@ -12,6 +13,11 @@ export class GameScene extends Phaser.Scene {
private keyDown: Phaser.Input.Keyboard.Key; private keyDown: Phaser.Input.Keyboard.Key;
private keyShift: Phaser.Input.Keyboard.Key; private keyShift: Phaser.Input.Keyboard.Key;
private Mappy : Phaser.Tilemaps.Tilemap;
private startX = ((window.innerWidth / 2) / RESOLUTION);
private startY = ((window.innerHeight / 2) / RESOLUTION);
constructor() { constructor() {
super({ super({
key: "GameScene" key: "GameScene"
@ -47,11 +53,11 @@ export class GameScene extends Phaser.Scene {
} }
create(): void { create(): void {
let mappy = this.add.tilemap("map"); this.Mappy = this.add.tilemap("map");
let terrain = mappy.addTilesetImage("tiles", "tiles"); let terrain = this.Mappy.addTilesetImage("tiles", "tiles");
let bottomLayer = mappy.createStaticLayer("Calque 1", [terrain], 0, 0); let bottomLayer = this.Mappy.createStaticLayer("Calque 1", [terrain], 0, 0);
let topLayer = mappy.createStaticLayer("Calque 2", [terrain], 0, 0); let topLayer = this.Mappy.createStaticLayer("Calque 2", [terrain], 0, 0);
// Let's manage animations of the player // Let's manage animations of the player
this.anims.create({ this.anims.create({
@ -86,41 +92,80 @@ export class GameScene extends Phaser.Scene {
//player.anims.play('down'); //player.anims.play('down');
//player.setBounce(0.2); //player.setBounce(0.2);
//player.setCollideWorldBounds(true); //player.setCollideWorldBounds(true);
this.player = this.add.sprite(450, 450, 'player'); this.player = this.add.sprite(this.startX, this.startY, 'player');
} }
private angle: number = 0; private angle: number = 0;
update(dt: number): void { update(dt: number): void {
let xCameraPosition = this.cameras.main.scrollX;
let yCameraPosition = this.cameras.main.scrollY;
let speedMultiplier = this.keyShift.isDown ? 5 : 1; let speedMultiplier = this.keyShift.isDown ? 5 : 1;
if (this.keyZ.isDown || this.keyUp.isDown) {
this.managePlayerAnimation('up');
if (this.player.y > 0) {
this.player.setY(this.player.y - 2);
} else {
this.player.setY(0);
}
if (this.keyUp.isDown) { if (yCameraPosition > 0) {
if (this.player.y < (this.Mappy.widthInPixels - this.startY)) {
this.moveCamera(0, -1, speedMultiplier); this.moveCamera(0, -1, speedMultiplier);
} }
if (this.keyLeft.isDown) { } else {
this.moveCamera(-1, 0, speedMultiplier); this.cameras.main.scrollY = 0;
} }
if (this.keyDown.isDown) { } else if (this.keyQ.isDown || this.keyLeft.isDown) {
this.moveCamera(0, 1, speedMultiplier);
} this.managePlayerAnimation('left');
if (this.keyRight.isDown) { if (this.player.x > 0) {
this.moveCamera(1, 0, speedMultiplier); this.player.setX(this.player.x - 2);
} else {
this.player.setX(0);
} }
if (this.keyZ.isDown) { if (xCameraPosition > 0) {
this.managePlayerAnimation('up'); if (this.player.x < (this.Mappy.heightInPixels - this.startX)) {
this.player.setY(this.player.y - 2) this.moveCamera(-1, 0, speedMultiplier);
} else if (this.keyQ.isDown) { }
this.managePlayerAnimation('left'); } else {
this.player.setX(this.player.x - 2) this.cameras.main.scrollX = 0;
} else if (this.keyS.isDown) { }
} else if (this.keyS.isDown || this.keyDown.isDown) {
this.managePlayerAnimation('down'); this.managePlayerAnimation('down');
this.player.setY(this.player.y + 2) if (this.Mappy.heightInPixels > this.player.y) {
} else if (this.keyD.isDown) { this.player.setY(this.player.y + 2);
} else {
this.player.setY(this.Mappy.heightInPixels);
}
if (this.Mappy.heightInPixels > (yCameraPosition + (window.innerHeight / RESOLUTION))) {
if (this.player.y > this.startY) {
this.moveCamera(0, 1, speedMultiplier);
}
} else {
this.cameras.main.scrollY = (this.Mappy.heightInPixels - (window.innerHeight / RESOLUTION));
}
} else if (this.keyD.isDown || this.keyRight.isDown) {
this.managePlayerAnimation('right'); this.managePlayerAnimation('right');
if (this.Mappy.widthInPixels > this.player.x) {
this.player.setX(this.player.x + 2) this.player.setX(this.player.x + 2)
} else {
this.player.setX(this.Mappy.widthInPixels)
}
if (this.Mappy.widthInPixels > (xCameraPosition + (window.innerWidth / RESOLUTION))) {
if (this.player.x > this.startX) {
this.moveCamera(1, 0, speedMultiplier);
}
} else {
this.cameras.main.scrollX = (this.Mappy.widthInPixels - (window.innerWidth / RESOLUTION));
}
} else { } else {
this.managePlayerAnimation('none'); this.managePlayerAnimation('none');
} }

View File

@ -2,22 +2,21 @@ import 'phaser';
import GameConfig = Phaser.Types.Core.GameConfig; import GameConfig = Phaser.Types.Core.GameConfig;
import {GameScene} from "./GameScene"; import {GameScene} from "./GameScene";
import {Connexion} from "./Connexion"; import {Connexion} from "./Connexion";
import {RESOLUTION} from "./Enum/EnvironmentVariable";
const resolution = 2;
const config: GameConfig = { const config: GameConfig = {
title: "Office game", title: "Office game",
width: window.innerWidth / resolution, width: window.innerWidth / RESOLUTION,
height: window.innerHeight / resolution, height: window.innerHeight / RESOLUTION,
parent: "game", parent: "game",
scene: [GameScene], scene: [GameScene],
zoom: resolution, zoom: RESOLUTION,
}; };
let game = new Phaser.Game(config); let game = new Phaser.Game(config);
window.addEventListener('resize', function (event) { window.addEventListener('resize', function (event) {
game.scale.resize(window.innerWidth / resolution, window.innerHeight / resolution); game.scale.resize(window.innerWidth / RESOLUTION, window.innerHeight / RESOLUTION);
}); });
const connexion = new Connexion("test@gmail.com"); const connexion = new Connexion("test@gmail.com");