diff --git a/front/src/Components/Menu/MenuIcon.svelte b/front/src/Components/Menu/MenuIcon.svelte
index f8986968..87d71476 100644
--- a/front/src/Components/Menu/MenuIcon.svelte
+++ b/front/src/Components/Menu/MenuIcon.svelte
@@ -1,11 +1,9 @@
@@ -49,6 +37,10 @@
.menuIcon img:hover{
transform: scale(1.2);
}
+
+ .menuIcon .woka:hover{
+ transform: scale(1.2);
+ }
@media only screen and (max-width: 800px), only screen and (max-height: 800px) {
.menuIcon {
margin: 3px;
diff --git a/front/src/Components/Video/VideoMediaBox.svelte b/front/src/Components/Video/VideoMediaBox.svelte
index 0156f101..3f64b0c1 100644
--- a/front/src/Components/Video/VideoMediaBox.svelte
+++ b/front/src/Components/Video/VideoMediaBox.svelte
@@ -6,9 +6,9 @@
import blockSignImg from "./images/blockSign.svg";
import { videoFocusStore } from "../../Stores/VideoFocusStore";
import { showReportScreenStore } from "../../Stores/ShowReportScreenStore";
- import { userWokaPictureStore } from "../../Stores/UserWokaPictureStore";
import { getColorByString, srcObject } from "./utils";
- import { onDestroy } from "svelte";
+
+ import Woka from '../Woka/Woka.svelte';
export let peer: VideoPeer;
let streamStore = peer.streamStore;
@@ -16,18 +16,9 @@
let statusStore = peer.statusStore;
let constraintStore = peer.constraintsStore;
- let userWokaPictureSrc: string | undefined = undefined;
-
- const unsubscribeFromUserWokaPictureStore = userWokaPictureStore.subscribe((playersAvatars) => {
- userWokaPictureSrc = playersAvatars.get(peer.userId);
- console.log(userWokaPictureSrc);
- });
-
function openReport(peer: VideoPeer): void {
showReportScreenStore.set({ userId: peer.userId, userName: peer.userName });
}
-
- onDestroy(unsubscribeFromUserWokaPictureStore);
@@ -39,11 +30,7 @@
{/if}
{#if !$constraintStore || $constraintStore.video === false}
- {#if !userWokaPictureSrc}
- {name}
- {:else}
-
- {/if}
+
{/if}
{#if $constraintStore && $constraintStore.audio === false}
@@ -61,12 +48,10 @@
\ No newline at end of file
diff --git a/front/src/Components/Woka/Woka.svelte b/front/src/Components/Woka/Woka.svelte
new file mode 100644
index 00000000..badf48bf
--- /dev/null
+++ b/front/src/Components/Woka/Woka.svelte
@@ -0,0 +1,31 @@
+
+
+
+
+
\ No newline at end of file
diff --git a/front/src/Phaser/Entity/Character.ts b/front/src/Phaser/Entity/Character.ts
index 01122975..1f7b80ed 100644
--- a/front/src/Phaser/Entity/Character.ts
+++ b/front/src/Phaser/Entity/Character.ts
@@ -8,7 +8,6 @@ import { TextureError } from "../../Exception/TextureError";
import { Companion } from "../Companion/Companion";
import type { GameScene } from "../Game/GameScene";
import { DEPTH_INGAME_TEXT_INDEX } from "../Game/DepthIndexes";
-import { waScaleManager } from "../Services/WaScaleManager";
import type OutlinePipelinePlugin from "phaser3-rex-plugins/plugins/outlinepipeline-plugin.js";
import { isSilentStore } from "../../Stores/MediaStore";
import { lazyLoadPlayerCharacterTextures } from "./PlayerTexturesLoadingManager";
diff --git a/front/src/Phaser/Game/GameScene.ts b/front/src/Phaser/Game/GameScene.ts
index 01b8544c..95604c2c 100644
--- a/front/src/Phaser/Game/GameScene.ts
+++ b/front/src/Phaser/Game/GameScene.ts
@@ -72,11 +72,11 @@ import { peerStore } from "../../Stores/PeerStore";
import { biggestAvailableAreaStore } from "../../Stores/BiggestAvailableAreaStore";
import { layoutManagerActionStore } from "../../Stores/LayoutManagerStore";
import { playersStore } from "../../Stores/PlayersStore";
-import { userWokaPictureStore } from "../../Stores/UserWokaPictureStore";
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 EVENT_TYPE = Phaser.Scenes.Events;
import Texture = Phaser.Textures.Texture;
@@ -201,6 +201,7 @@ export class GameScene extends DirtyScene {
private objectsByType = new Map();
private embeddedWebsiteManager!: EmbeddedWebsiteManager;
private loader: Loader;
+ private userWokaPictureStores: Map = new Map();
constructor(private room: Room, MapUrlFile: string, customKey?: string | undefined) {
super({
@@ -333,6 +334,15 @@ 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;
+ }
+
// 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 {
@@ -662,8 +672,6 @@ export class GameScene extends DirtyScene {
this.connection = onConnect.connection;
playersStore.connectToRoomConnection(this.connection);
- userWokaPictureStore.connectToRoomConnection(this.connection);
-
userIsAdminStore.set(this.connection.hasTag("admin"));
this.connection.onUserJoins((message: MessageUserJoined) => {
@@ -1497,7 +1505,6 @@ ${escapedMessage}
this.companion !== null ? lazyLoadCompanionResource(this.load, this.companion) : undefined
);
this.CurrentPlayer.once("textures-loaded", () => {
- // TODO: How to be sure we always get hero id?
this.savePlayerWokaPicture(this.CurrentPlayer, -1);
});
this.CurrentPlayer.on("pointerdown", (pointer: Phaser.Input.Pointer) => {
@@ -1529,7 +1536,7 @@ ${escapedMessage}
private async savePlayerWokaPicture(character: Character, userId: number): Promise {
const htmlImageElement = await character.getSnapshot();
- userWokaPictureStore.setWokaPicture(userId, htmlImageElement.src);
+ this.getUserWokaPictureStore(userId).picture.set(htmlImageElement);
}
pushPlayerPosition(event: HasPlayerMovedEvent) {
diff --git a/front/src/Stores/UserWokaPictureStore.ts b/front/src/Stores/UserWokaPictureStore.ts
index 30863e44..8f5cb64f 100644
--- a/front/src/Stores/UserWokaPictureStore.ts
+++ b/front/src/Stores/UserWokaPictureStore.ts
@@ -1,34 +1,8 @@
-import { writable } from "svelte/store";
-import type { RoomConnection } from "../Connexion/RoomConnection";
+import { writable, Writable } from "svelte/store";
/**
- * A store that contains the players avatars pictures
+ * A store that contains the player avatar picture
*/
-function createUserWokaPictureStore() {
- const players = new Map();
-
- const { subscribe, update } = writable(players);
-
- return {
- subscribe,
- connectToRoomConnection: (roomConnection: RoomConnection) => {
- roomConnection.onUserLeft((userId) => {
- update((users) => {
- users.delete(userId);
- return users;
- });
- });
- },
- setWokaPicture(userId: number, url: string) {
- update((users) => {
- users.set(userId, url);
- return users;
- });
- },
- getWokaPictureById(userId: number): string | undefined {
- return players.get(userId);
- },
- };
-}
-
-export const userWokaPictureStore = createUserWokaPictureStore();
+export class UserWokaPictureStore {
+ constructor(public picture: Writable = writable(undefined)) {}
+}
\ No newline at end of file