Kraut.World/server
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'feature-picture-of-user' into feature-picture-of-user-merge

Browse source
This commit is contained in:
David Négrier 2021-12-14 16:06:35 +01:00
commit ea7fc62c00
11 changed files with 277 additions and 83 deletions
Download patch file Download diff file Expand all files Collapse all files

12
front/src/Phaser/Companion/Companion.ts
View file

@ -2,6 +2,8 @@ import Sprite = Phaser.GameObjects.Sprite;
import Container = Phaser.GameObjects.Container;
import { PlayerAnimationDirections, PlayerAnimationTypes } from "../Player/Animation";
import { TexturesHelper } from "../Helpers/TexturesHelper";
import { Writable, writable } from "svelte/store";
import type { PictureStore } from "../../Stores/PictureStore";
export interface CompanionStatus {
x: number;
@ -22,6 +24,7 @@ export class Companion extends Container {
private companionName: string;
private direction: PlayerAnimationDirections;
private animationType: PlayerAnimationTypes;
private readonly _pictureStore: Writable<string | undefined>;
constructor(scene: Phaser.Scene, x: number, y: number, name: string, texturePromise: Promise<string>) {
super(scene, x + 14, y + 4);
@ -36,11 +39,14 @@ export class Companion extends Container {
this.animationType = PlayerAnimationTypes.Idle;
this.companionName = name;
this._pictureStore = writable(undefined);
texturePromise.then((resource) => {
this.addResource(resource);
this.invisible = false;
this.emit("texture-loaded");
return this.getSnapshot().then((htmlImageElementSrc) => {
this._pictureStore.set(htmlImageElementSrc);
});
});
this.scene.physics.world.enableBody(this);
@ -238,4 +244,8 @@ export class Companion extends Container {
super.destroy();
}
public get pictureStore(): PictureStore {
return this._pictureStore;
}
}

17
front/src/Phaser/Entity/Character.ts
View file

@ -12,6 +12,8 @@ import type OutlinePipelinePlugin from "phaser3-rex-plugins/plugins/outlinepipel
import { isSilentStore } from "../../Stores/MediaStore";
import { lazyLoadPlayerCharacterTextures, loadAllDefaultModels } from "./PlayerTexturesLoadingManager";
import { TexturesHelper } from "../Helpers/TexturesHelper";
import type { PictureStore } from "../../Stores/PictureStore";
import { Writable, writable } from "svelte/store";
const playerNameY = -25;
@ -37,6 +39,7 @@ export abstract class Character extends Container {
private emote: Phaser.GameObjects.DOMElement | null = null;
private emoteTween: Phaser.Tweens.Tween | null = null;
scene: GameScene;
private readonly _pictureStore: Writable<string | undefined>;
constructor(
scene: GameScene,
@ -57,6 +60,7 @@ export abstract class Character extends Container {
this.invisible = true;
this.sprites = new Map<string, Sprite>();
this._pictureStore = writable(undefined);
//textures are inside a Promise in case they need to be lazyloaded before use.
texturesPromise
@ -64,7 +68,9 @@ export abstract class Character extends Container {
this.addTextures(textures, frame);
this.invisible = false;
this.playAnimation(direction, moving);
this.emit("woka-textures-loaded");
return this.getSnapshot().then((htmlImageElementSrc) => {
this._pictureStore.set(htmlImageElementSrc);
});
})
.catch(() => {
return lazyLoadPlayerCharacterTextures(scene.load, ["color_22", "eyes_23"]).then((textures) => {
@ -118,7 +124,7 @@ export abstract class Character extends Container {
}
}
public async getSnapshot(): Promise<string> {
private async getSnapshot(): Promise<string> {
const sprites = Array.from(this.sprites.values()).map((sprite) => {
return { sprite, frame: 1 };
});
@ -137,9 +143,6 @@ export abstract class Character extends Container {
public addCompanion(name: string, texturePromise?: Promise<string>): void {
if (typeof texturePromise !== "undefined") {
this.companion = new Companion(this.scene, this.x, this.y, name, texturePromise);
this.companion.once("texture-loaded", () => {
this.emit("companion-texture-loaded", this.companion?.getSnapshot());
});
}
}
@ -394,4 +397,8 @@ export abstract class Character extends Container {
this.emote = null;
this.playerName.setVisible(true);
}
public get pictureStore(): PictureStore {
return this._pictureStore;
}
}

50
front/src/Phaser/Game/GameScene.ts
View file

@ -77,8 +77,6 @@ import { emoteStore, emoteMenuStore } from "../../Stores/EmoteStore";
import { userIsAdminStore } from "../../Stores/GameStore";
import { contactPageStore } from "../../Stores/MenuStore";
import { audioManagerFileStore, audioManagerVisibilityStore } from "../../Stores/AudioManagerStore";
import { UserWokaPictureStore } from "../../Stores/UserWokaPictureStore";
import { UserCompanionPictureStore } from "../../Stores/UserCompanionPictureStore";
import EVENT_TYPE = Phaser.Scenes.Events;
import Texture = Phaser.Textures.Texture;
@ -89,6 +87,7 @@ import DOMElement = Phaser.GameObjects.DOMElement;
import Tileset = Phaser.Tilemaps.Tileset;
import SpriteSheetFile = Phaser.Loader.FileTypes.SpriteSheetFile;
import FILE_LOAD_ERROR = Phaser.Loader.Events.FILE_LOAD_ERROR;
import { MapStore } from "../../Stores/Utils/MapStore";
export interface GameSceneInitInterface {
initPosition: PointInterface | null;
reconnecting: boolean;
@ -128,7 +127,7 @@ export class GameScene extends DirtyScene {
Terrains: Array<Phaser.Tilemaps.Tileset>;
CurrentPlayer!: Player;
MapPlayers!: Phaser.Physics.Arcade.Group;
MapPlayersByKey: Map<number, RemotePlayer> = new Map<number, RemotePlayer>();
MapPlayersByKey: MapStore<number, RemotePlayer> = new MapStore<number, RemotePlayer>();
Map!: Phaser.Tilemaps.Tilemap;
Objects!: Array<Phaser.Physics.Arcade.Sprite>;
mapFile!: ITiledMap;
@ -204,11 +203,6 @@ export class GameScene extends DirtyScene {
private objectsByType = new Map<string, ITiledMapObject[]>();
private embeddedWebsiteManager!: EmbeddedWebsiteManager;
private loader: Loader;
private userWokaPictureStores: Map<number, UserWokaPictureStore> = new Map<number, UserWokaPictureStore>();
private userCompanionPictureStores: Map<number, UserCompanionPictureStore> = new Map<
number,
UserCompanionPictureStore
>();
constructor(private room: Room, MapUrlFile: string, customKey?: string | undefined) {
super({
@ -342,24 +336,6 @@ export class GameScene extends DirtyScene {
this.loader.addLoader();
}
public getUserWokaPictureStore(userId: number) {
let store = this.userWokaPictureStores.get(userId);
if (!store) {
store = new UserWokaPictureStore();
this.userWokaPictureStores.set(userId, store);
}
return store;
}
public getUserCompanionPictureStore(userId: number) {
let store = this.userCompanionPictureStores.get(userId);
if (!store) {
store = new UserCompanionPictureStore();
this.userCompanionPictureStores.set(userId, store);
}
return store;
}
// FIXME: we need to put a "unknown" instead of a "any" and validate the structure of the JSON we are receiving.
// eslint-disable-next-line @typescript-eslint/no-explicit-any
private async onMapLoad(data: any): Promise<void> {
@ -1466,7 +1442,7 @@ ${escapedMessage}
this.MapPlayers.remove(player);
});
this.MapPlayersByKey = new Map<number, RemotePlayer>();
this.MapPlayersByKey.clear();
}
private getExitUrl(layer: ITiledMapLayer): string | undefined {
@ -1559,14 +1535,6 @@ ${escapedMessage}
this.companion,
this.companion !== null ? lazyLoadCompanionResource(this.load, this.companion) : undefined
);
this.CurrentPlayer.once("woka-textures-loaded", () => {
this.savePlayerWokaPicture(this.CurrentPlayer, -1);
});
this.CurrentPlayer.once("companion-texture-loaded", (snapshotPromise: Promise<string>) => {
snapshotPromise.then((snapshot: string) => {
this.savePlayerCompanionPicture(-1, snapshot);
});
});
this.CurrentPlayer.on("pointerdown", (pointer: Phaser.Input.Pointer) => {
if (pointer.wasTouch && (pointer.event as TouchEvent).touches.length > 1) {
return; //we don't want the menu to open when pinching on a touch screen.
@ -1594,15 +1562,6 @@ ${escapedMessage}
this.createCollisionWithPlayer();
}
private async savePlayerWokaPicture(character: Character, userId: number): Promise<void> {
const htmlImageElementSrc = await character.getSnapshot();
this.getUserWokaPictureStore(userId).picture.set(htmlImageElementSrc);
}
private savePlayerCompanionPicture(userId: number, snapshot: string): void {
this.getUserCompanionPictureStore(userId).picture.set(snapshot);
}
pushPlayerPosition(event: HasPlayerMovedEvent) {
if (this.lastMoveEventSent === event) {
return;
@ -1790,9 +1749,6 @@ ${escapedMessage}
addPlayerData.companion,
addPlayerData.companion !== null ? lazyLoadCompanionResource(this.load, addPlayerData.companion) : undefined
);
player.once("woka-textures-loaded", () => {
this.savePlayerWokaPicture(player, addPlayerData.userId);
});
this.MapPlayers.add(player);
this.MapPlayersByKey.set(player.userId, player);
player.updatePosition(addPlayerData.position);