diff --git a/front/src/Components/EmbedScreens/Layouts/MozaicLayout.svelte b/front/src/Components/EmbedScreens/Layouts/MozaicLayout.svelte index 25ff16c8..846a0432 100644 --- a/front/src/Components/EmbedScreens/Layouts/MozaicLayout.svelte +++ b/front/src/Components/EmbedScreens/Layouts/MozaicLayout.svelte @@ -23,8 +23,9 @@ {#each [...$streamableCollectionStore.values()] as peer (peer.uniqueId)} = 4} /> {/each} diff --git a/front/src/Components/Video/MediaBox.svelte b/front/src/Components/Video/MediaBox.svelte index 4118f34e..831ab04d 100644 --- a/front/src/Components/Video/MediaBox.svelte +++ b/front/src/Components/Video/MediaBox.svelte @@ -9,6 +9,7 @@ export let streamable: Streamable; export let isHightlighted = false; export let isClickable = false; + export let mozaicSolo = false; export let mozaicFullWidth = false; export let mozaicQuarter = false; @@ -16,6 +17,7 @@
@@ -66,6 +68,11 @@ } } + &.mozaic-solo { + max-height: inherit !important; + width: 90% !important; + } + &.mozaic-full-width { width: 95%; max-width: 95%; @@ -73,6 +80,7 @@ margin-right: 3%; margin-top: auto; margin-bottom: auto; + max-height: 95%; &:hover { margin-top: auto; @@ -85,6 +93,7 @@ max-width: 95%; margin-top: auto; margin-bottom: auto; + max-height: 95%; &:hover { margin-top: auto; diff --git a/front/src/Phaser/Companion/Companion.ts b/front/src/Phaser/Companion/Companion.ts index 6157ebaa..1a69c879 100644 --- a/front/src/Phaser/Companion/Companion.ts +++ b/front/src/Phaser/Companion/Companion.ts @@ -4,6 +4,7 @@ import { PlayerAnimationDirections, PlayerAnimationTypes } from "../Player/Anima import { TexturesHelper } from "../Helpers/TexturesHelper"; import { Writable, writable } from "svelte/store"; import type { PictureStore } from "../../Stores/PictureStore"; +import type CancelablePromise from "cancelable-promise"; export interface CompanionStatus { x: number; @@ -25,8 +26,9 @@ export class Companion extends Container { private direction: PlayerAnimationDirections; private animationType: PlayerAnimationTypes; private readonly _pictureStore: Writable; + private texturePromise: CancelablePromise | undefined; - constructor(scene: Phaser.Scene, x: number, y: number, name: string, texturePromise: Promise) { + constructor(scene: Phaser.Scene, x: number, y: number, name: string, texturePromise: CancelablePromise) { super(scene, x + 14, y + 4); this.sprites = new Map(); @@ -41,7 +43,7 @@ export class Companion extends Container { this.companionName = name; this._pictureStore = writable(undefined); - texturePromise + this.texturePromise = texturePromise .then((resource) => { this.addResource(resource); this.invisible = false; @@ -234,6 +236,7 @@ export class Companion extends Container { } public destroy(): void { + this.texturePromise?.cancel(); for (const sprite of this.sprites.values()) { if (this.scene) { this.scene.sys.updateList.remove(sprite); diff --git a/front/src/Phaser/Companion/CompanionTexturesLoadingManager.ts b/front/src/Phaser/Companion/CompanionTexturesLoadingManager.ts index 98cceafa..fee51ca3 100644 --- a/front/src/Phaser/Companion/CompanionTexturesLoadingManager.ts +++ b/front/src/Phaser/Companion/CompanionTexturesLoadingManager.ts @@ -1,5 +1,6 @@ import LoaderPlugin = Phaser.Loader.LoaderPlugin; import { COMPANION_RESOURCES, CompanionResourceDescriptionInterface } from "./CompanionTextures"; +import CancelablePromise from "cancelable-promise"; export const getAllCompanionResources = (loader: LoaderPlugin): CompanionResourceDescriptionInterface[] => { COMPANION_RESOURCES.forEach((resource: CompanionResourceDescriptionInterface) => { @@ -9,8 +10,12 @@ export const getAllCompanionResources = (loader: LoaderPlugin): CompanionResourc return COMPANION_RESOURCES; }; -export const lazyLoadCompanionResource = (loader: LoaderPlugin, name: string): Promise => { - return new Promise((resolve, reject) => { +export const lazyLoadCompanionResource = (loader: LoaderPlugin, name: string): CancelablePromise => { + return new CancelablePromise((resolve, reject, cancel) => { + cancel(() => { + return; + }); + const resource = COMPANION_RESOURCES.find((item) => item.name === name); if (typeof resource === "undefined") { diff --git a/front/src/Phaser/Entity/Character.ts b/front/src/Phaser/Entity/Character.ts index 4add67de..7b292ca8 100644 --- a/front/src/Phaser/Entity/Character.ts +++ b/front/src/Phaser/Entity/Character.ts @@ -59,7 +59,7 @@ export abstract class Character extends Container implements OutlineableInterfac frame: string | number, isClickable: boolean, companion: string | null, - companionTexturePromise?: Promise + companionTexturePromise?: CancelablePromise ) { super(scene, x, y /*, texture, frame*/); this.scene = scene; @@ -179,7 +179,7 @@ export abstract class Character extends Container implements OutlineableInterfac }); } - public addCompanion(name: string, texturePromise?: Promise): void { + public addCompanion(name: string, texturePromise?: CancelablePromise): void { if (typeof texturePromise !== "undefined") { this.companion = new Companion(this.scene, this.x, this.y, name, texturePromise); } diff --git a/front/src/Phaser/Entity/RemotePlayer.ts b/front/src/Phaser/Entity/RemotePlayer.ts index f1c47bdd..7af6da2e 100644 --- a/front/src/Phaser/Entity/RemotePlayer.ts +++ b/front/src/Phaser/Entity/RemotePlayer.ts @@ -31,7 +31,7 @@ export class RemotePlayer extends Character implements ActivatableInterface { moving: boolean, visitCardUrl: string | null, companion: string | null, - companionTexturePromise?: Promise, + companionTexturePromise?: CancelablePromise, activationRadius?: number ) { super(Scene, x, y, texturesPromise, name, direction, moving, 1, true, companion, companionTexturePromise); diff --git a/front/src/Phaser/Player/Player.ts b/front/src/Phaser/Player/Player.ts index a6fe29a1..514aa7d5 100644 --- a/front/src/Phaser/Player/Player.ts +++ b/front/src/Phaser/Player/Player.ts @@ -25,7 +25,7 @@ export class Player extends Character { direction: PlayerAnimationDirections, moving: boolean, companion: string | null, - companionTexturePromise?: Promise + companionTexturePromise?: CancelablePromise ) { super(Scene, x, y, texturesPromise, name, direction, moving, 1, true, companion, companionTexturePromise);