From a66d42e158e16be4575f43df758303e9ab693ac1 Mon Sep 17 00:00:00 2001 From: kharhamel Date: Mon, 17 May 2021 15:49:18 +0200 Subject: [PATCH] FEATURE: we now allow a global zoom level of 1.5 --- front/src/Enum/EnvironmentVariable.ts | 4 +-- front/src/Phaser/Services/HdpiManager.ts | 36 +++++++++++-------- .../tests/Phaser/Services/HdpiManagerTest.ts | 2 +- 3 files changed, 24 insertions(+), 18 deletions(-) diff --git a/front/src/Enum/EnvironmentVariable.ts b/front/src/Enum/EnvironmentVariable.ts index 685b3c17..85b63335 100644 --- a/front/src/Enum/EnvironmentVariable.ts +++ b/front/src/Enum/EnvironmentVariable.ts @@ -4,8 +4,8 @@ const PUSHER_URL = process.env.PUSHER_URL || '//pusher.workadventure.localhost'; const UPLOADER_URL = process.env.UPLOADER_URL || '//uploader.workadventure.localhost'; const STUN_SERVER: string = process.env.STUN_SERVER || "stun:stun.l.google.com:19302"; const TURN_SERVER: string = process.env.TURN_SERVER || ""; -const SKIP_RENDER_OPTIMIZATIONS: boolean = !!(process.env.SKIP_RENDER_OPTIMIZATIONS); -const DISABLE_NOTIFICATIONS: boolean = !!(process.env.DISABLE_NOTIFICATIONS); +const SKIP_RENDER_OPTIMIZATIONS: boolean = process.env.SKIP_RENDER_OPTIMIZATIONS == "true"; +const DISABLE_NOTIFICATIONS: boolean = process.env.DISABLE_NOTIFICATIONS == "true"; const TURN_USER: string = process.env.TURN_USER || ''; const TURN_PASSWORD: string = process.env.TURN_PASSWORD || ''; const JITSI_URL : string|undefined = (process.env.JITSI_URL === '') ? undefined : process.env.JITSI_URL; diff --git a/front/src/Phaser/Services/HdpiManager.ts b/front/src/Phaser/Services/HdpiManager.ts index 867c7a53..33f7e3a8 100644 --- a/front/src/Phaser/Services/HdpiManager.ts +++ b/front/src/Phaser/Services/HdpiManager.ts @@ -1,4 +1,3 @@ -import ScaleManager = Phaser.Scale.ScaleManager; interface Size { width: number; @@ -13,8 +12,7 @@ export class HdpiManager { * @param minRecommendedGamePixelsNumber The minimum number of pixels we want to display "by default" to the user * @param absoluteMinPixelNumber The very minimum of game pixels to display. Below, we forbid zooming more */ - public constructor(private minRecommendedGamePixelsNumber: number, private absoluteMinPixelNumber: number) { - } + public constructor(private minRecommendedGamePixelsNumber: number, private absoluteMinPixelNumber: number) {} /** * Returns the optimal size in "game pixels" based on the screen size in "real pixels". @@ -36,16 +34,12 @@ export class HdpiManager { }; } - let i = 1; - - while (realPixelNumber > this.minRecommendedGamePixelsNumber * i * i) { - i++; - } + const optimalZoomLevel = this.getOptimalZoomLevel(realPixelNumber); // Has the canvas more pixels than the screen? This is forbidden - if ((i - 1) * this._zoomModifier < 1) { + if (optimalZoomLevel * this._zoomModifier < 1) { // Let's reset the zoom modifier (WARNING this is a SIDE EFFECT in a getter) - this._zoomModifier = 1 / (i - 1); + this._zoomModifier = 1 / optimalZoomLevel; return { game: { @@ -59,8 +53,8 @@ export class HdpiManager { } } - const gameWidth = Math.ceil(realPixelScreenSize.width / (i - 1) / this._zoomModifier); - const gameHeight = Math.ceil(realPixelScreenSize.height / (i - 1) / this._zoomModifier); + const gameWidth = Math.ceil(realPixelScreenSize.width / optimalZoomLevel / this._zoomModifier); + const gameHeight = Math.ceil(realPixelScreenSize.height / optimalZoomLevel / this._zoomModifier); // Let's ensure we display a minimum of pixels, even if crazily zoomed in. if (gameWidth * gameHeight < this.absoluteMinPixelNumber) { @@ -68,7 +62,7 @@ export class HdpiManager { const minGameWidth = Math.sqrt(this.absoluteMinPixelNumber * realPixelScreenSize.width / realPixelScreenSize.height); // Let's reset the zoom modifier (WARNING this is a SIDE EFFECT in a getter) - this._zoomModifier = realPixelScreenSize.width / minGameWidth / (i - 1); + this._zoomModifier = realPixelScreenSize.width / minGameWidth / optimalZoomLevel; return { game: { @@ -89,12 +83,24 @@ export class HdpiManager { height: gameHeight, }, real: { - width: Math.ceil(realPixelScreenSize.width / (i - 1)) * (i - 1), - height: Math.ceil(realPixelScreenSize.height / (i - 1)) * (i - 1), + width: Math.ceil(realPixelScreenSize.width / optimalZoomLevel) * optimalZoomLevel, + height: Math.ceil(realPixelScreenSize.height / optimalZoomLevel) * optimalZoomLevel, } } } + /** + * We only accept integer but we make an exception for 1.5 + */ + private getOptimalZoomLevel(realPixelNumber: number): number { + const result = Math.sqrt(realPixelNumber / this.minRecommendedGamePixelsNumber); + if (1.5 <= result && result < 2) { + return 1.5 + } else { + return Math.floor(result); + } + } + public get zoomModifier(): number { return this._zoomModifier; } diff --git a/front/tests/Phaser/Services/HdpiManagerTest.ts b/front/tests/Phaser/Services/HdpiManagerTest.ts index 32a6b03a..2d1fee70 100644 --- a/front/tests/Phaser/Services/HdpiManagerTest.ts +++ b/front/tests/Phaser/Services/HdpiManagerTest.ts @@ -50,6 +50,6 @@ describe("Test HdpiManager", () => { const result = hdpiManager.getOptimalGameSize({ width: 1280, height: 768 }); expect(result.game.width).toEqual(1280); expect(result.game.height).toEqual(768); - expect(hdpiManager.zoomModifier).toEqual(1); + expect(hdpiManager.zoomModifier).toEqual(2 / 3); }); });