Fix to move the camera only in the map. The camera stops on the border map.
This commit is contained in:
parent
8c3d62496b
commit
ddc39d6e50
@ -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
|
||||||
}
|
}
|
@ -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) {
|
||||||
|
if(yCameraPosition > 0) {
|
||||||
this.moveCamera(0, -1, speedMultiplier);
|
this.moveCamera(0, -1, speedMultiplier);
|
||||||
|
}else {
|
||||||
|
this.cameras.main.scrollY = 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
if (this.keyLeft.isDown) {
|
if (this.keyLeft.isDown) {
|
||||||
|
if(xCameraPosition > 0) {
|
||||||
this.moveCamera(-1, 0, speedMultiplier);
|
this.moveCamera(-1, 0, speedMultiplier);
|
||||||
|
}else{
|
||||||
|
this.cameras.main.scrollX = 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
if (this.keyDown.isDown) {
|
if (this.keyDown.isDown) {
|
||||||
|
if(this.Mappy.heightInPixels > (yCameraPosition + (window.innerHeight / RESOLUTION))) {
|
||||||
this.moveCamera(0, 1, speedMultiplier);
|
this.moveCamera(0, 1, speedMultiplier);
|
||||||
|
}else{
|
||||||
|
this.cameras.main.scrollY = (this.Mappy.heightInPixels - (window.innerHeight / RESOLUTION));
|
||||||
|
}
|
||||||
}
|
}
|
||||||
if (this.keyRight.isDown) {
|
if (this.keyRight.isDown) {
|
||||||
|
if(this.Mappy.widthInPixels > (xCameraPosition + (window.innerWidth / RESOLUTION))) {
|
||||||
this.moveCamera(1, 0, speedMultiplier);
|
this.moveCamera(1, 0, speedMultiplier);
|
||||||
|
}else{
|
||||||
|
this.cameras.main.scrollX = (this.Mappy.widthInPixels - (window.innerWidth / RESOLUTION));
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.keyZ.isDown) {
|
if (this.keyZ.isDown) {
|
||||||
|
@ -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");
|
||||||
|
Loading…
Reference in New Issue
Block a user