noby/workadventure
2
2
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix to move the camera only in the map. The camera stops on the border map.

Browse Source
This commit is contained in:
gparant 2020-04-06 22:55:09 +02:00
parent 8c3d62496b
commit ddc39d6e50
3 changed files with 39 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
front/src/Enum/EnvironmentVariable.ts
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
} }

42
front/src/GameScene.ts
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,8 @@ 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;
constructor() { constructor() {
super({ super({
key: "GameScene" key: "GameScene"
@ -47,11 +50,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({
@ -87,26 +90,43 @@ export class GameScene extends Phaser.Scene {
//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(450, 450, '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.keyUp.isDown) { if (this.keyUp.isDown) {
this.moveCamera(0, -1, speedMultiplier); if(yCameraPosition > 0) {
this.moveCamera(0, -1, speedMultiplier);
}else {
this.cameras.main.scrollY = 0;
}
} }
if (this.keyLeft.isDown) { if (this.keyLeft.isDown) {
this.moveCamera(-1, 0, speedMultiplier); if(xCameraPosition > 0) {
this.moveCamera(-1, 0, speedMultiplier);
}else{
this.cameras.main.scrollX = 0;
}
} }
if (this.keyDown.isDown) { if (this.keyDown.isDown) {
this.moveCamera(0, 1, speedMultiplier); if(this.Mappy.heightInPixels > (yCameraPosition + (window.innerHeight / RESOLUTION))) {
this.moveCamera(0, 1, speedMultiplier);
}else{
this.cameras.main.scrollY = (this.Mappy.heightInPixels - (window.innerHeight / RESOLUTION));
}
} }
if (this.keyRight.isDown) { if (this.keyRight.isDown) {
this.moveCamera(1, 0, speedMultiplier); if(this.Mappy.widthInPixels > (xCameraPosition + (window.innerWidth / RESOLUTION))) {
this.moveCamera(1, 0, speedMultiplier);
}else{
this.cameras.main.scrollX = (this.Mappy.widthInPixels - (window.innerWidth / RESOLUTION));
}
} }
if (this.keyZ.isDown) { if (this.keyZ.isDown) {

11
front/src/index.ts
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");