correction of resize select character and companion
This commit is contained in:
parent
474323b95f
commit
645af32b4c
@ -10,8 +10,8 @@
|
|||||||
color: #ebeeee;
|
color: #ebeeee;
|
||||||
width: 42vw;
|
width: 42vw;
|
||||||
height: 48vh;
|
height: 48vh;
|
||||||
/*max-width: 300px;
|
max-width: 350px;
|
||||||
max-height: 48vh;*/
|
/*max-height: 48vh;*/
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
#customizeScene h1 {
|
#customizeScene h1 {
|
||||||
|
@ -69,7 +69,7 @@ export abstract class DirtyScene extends ResizableScene {
|
|||||||
return this.dirty || this.objectListChanged;
|
return this.dirty || this.objectListChanged;
|
||||||
}
|
}
|
||||||
|
|
||||||
public onResize(ev: UIEvent): void {
|
public onResize(): void {
|
||||||
this.objectListChanged = true;
|
this.objectListChanged = true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -21,14 +21,22 @@ export class Game extends Phaser.Game {
|
|||||||
constructor(GameConfig: Phaser.Types.Core.GameConfig) {
|
constructor(GameConfig: Phaser.Types.Core.GameConfig) {
|
||||||
super(GameConfig);
|
super(GameConfig);
|
||||||
|
|
||||||
window.addEventListener('resize', (event) => {
|
this.scale.on(Phaser.Scale.Events.RESIZE, () => {
|
||||||
|
for (const scene of this.scene.getScenes(true)) {
|
||||||
|
if (scene instanceof ResizableScene) {
|
||||||
|
scene.onResize();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
/*window.addEventListener('resize', (event) => {
|
||||||
// Let's trigger the onResize method of any active scene that is a ResizableScene
|
// Let's trigger the onResize method of any active scene that is a ResizableScene
|
||||||
for (const scene of this.scene.getScenes(true)) {
|
for (const scene of this.scene.getScenes(true)) {
|
||||||
if (scene instanceof ResizableScene) {
|
if (scene instanceof ResizableScene) {
|
||||||
scene.onResize(event);
|
scene.onResize(event);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});*/
|
||||||
}
|
}
|
||||||
|
|
||||||
public step(time: number, delta: number)
|
public step(time: number, delta: number)
|
||||||
|
@ -1452,8 +1452,8 @@ ${escapedMessage}
|
|||||||
this.connection?.emitActionableEvent(itemId, eventName, state, parameters);
|
this.connection?.emitActionableEvent(itemId, eventName, state, parameters);
|
||||||
}
|
}
|
||||||
|
|
||||||
public onResize(ev: UIEvent): void {
|
public onResize(): void {
|
||||||
super.onResize(ev);
|
super.onResize();
|
||||||
this.reposition();
|
this.reposition();
|
||||||
|
|
||||||
// Send new viewport to server
|
// Send new viewport to server
|
||||||
|
@ -52,7 +52,7 @@ export class CustomizeScene extends AbstractCharacterScene {
|
|||||||
|
|
||||||
create() {
|
create() {
|
||||||
this.customizeSceneElement = this.add.dom(-1000, 0).createFromCache(customizeSceneKey);
|
this.customizeSceneElement = this.add.dom(-1000, 0).createFromCache(customizeSceneKey);
|
||||||
this.centerXDomElement(this.customizeSceneElement, 150);
|
this.centerXDomElement(this.customizeSceneElement, 350);
|
||||||
MenuScene.revealMenusAfterInit(this.customizeSceneElement, customizeSceneKey);
|
MenuScene.revealMenusAfterInit(this.customizeSceneElement, customizeSceneKey);
|
||||||
|
|
||||||
this.customizeSceneElement.addListener('click');
|
this.customizeSceneElement.addListener('click');
|
||||||
@ -270,7 +270,7 @@ export class CustomizeScene extends AbstractCharacterScene {
|
|||||||
this.Rectangle.x = this.cameras.main.worldView.x + this.cameras.main.width / 2;
|
this.Rectangle.x = this.cameras.main.worldView.x + this.cameras.main.width / 2;
|
||||||
this.Rectangle.y = this.cameras.main.worldView.y + this.cameras.main.height / 3;
|
this.Rectangle.y = this.cameras.main.worldView.y + this.cameras.main.height / 3;
|
||||||
|
|
||||||
this.centerXDomElement(this.customizeSceneElement, 150);
|
this.centerXDomElement(this.customizeSceneElement, 350);
|
||||||
}
|
}
|
||||||
|
|
||||||
private nextSceneToCamera(){
|
private nextSceneToCamera(){
|
||||||
|
@ -80,7 +80,7 @@ export class LoginScene extends ResizableScene {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public onResize(ev: UIEvent): void {
|
public onResize(): void {
|
||||||
this.centerXDomElement(this.loginSceneElement, 200);
|
this.centerXDomElement(this.loginSceneElement, 200);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -2,7 +2,7 @@ import {Scene} from "phaser";
|
|||||||
import DOMElement = Phaser.GameObjects.DOMElement;
|
import DOMElement = Phaser.GameObjects.DOMElement;
|
||||||
|
|
||||||
export abstract class ResizableScene extends Scene {
|
export abstract class ResizableScene extends Scene {
|
||||||
public abstract onResize(ev: UIEvent): void;
|
public abstract onResize(): void;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Centers the DOM element on the X axis.
|
* Centers the DOM element on the X axis.
|
||||||
@ -17,7 +17,7 @@ export abstract class ResizableScene extends Scene {
|
|||||||
&& object.node
|
&& object.node
|
||||||
&& object.node.getBoundingClientRect().width > 0
|
&& object.node.getBoundingClientRect().width > 0
|
||||||
? (object.node.getBoundingClientRect().width / 2 / this.scale.zoom)
|
? (object.node.getBoundingClientRect().width / 2 / this.scale.zoom)
|
||||||
: (300 / this.scale.zoom)
|
: (defaultWidth / this.scale.zoom)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -51,7 +51,7 @@ export class SelectCharacterScene extends AbstractCharacterScene {
|
|||||||
create() {
|
create() {
|
||||||
|
|
||||||
this.selectCharacterSceneElement = this.add.dom(-1000, 0).createFromCache(selectCharacterKey);
|
this.selectCharacterSceneElement = this.add.dom(-1000, 0).createFromCache(selectCharacterKey);
|
||||||
this.centerXDomElement(this.selectCharacterSceneElement, 150);
|
this.centerXDomElement(this.selectCharacterSceneElement, 300);
|
||||||
MenuScene.revealMenusAfterInit(this.selectCharacterSceneElement, selectCharacterKey);
|
MenuScene.revealMenusAfterInit(this.selectCharacterSceneElement, selectCharacterKey);
|
||||||
|
|
||||||
this.selectCharacterSceneElement.addListener('click');
|
this.selectCharacterSceneElement.addListener('click');
|
||||||
@ -211,7 +211,7 @@ export class SelectCharacterScene extends AbstractCharacterScene {
|
|||||||
|
|
||||||
const {playerX, playerY, playerScale, playserOpactity, playerVisible} = this.defineSetupPlayer(numero);
|
const {playerX, playerY, playerScale, playserOpactity, playerVisible} = this.defineSetupPlayer(numero);
|
||||||
player.setBounce(0.2);
|
player.setBounce(0.2);
|
||||||
player.setCollideWorldBounds(true);
|
player.setCollideWorldBounds(false);
|
||||||
player.setVisible( playerVisible );
|
player.setVisible( playerVisible );
|
||||||
player.setScale(playerScale, playerScale);
|
player.setScale(playerScale, playerScale);
|
||||||
player.setAlpha(playserOpactity);
|
player.setAlpha(playserOpactity);
|
||||||
@ -240,10 +240,10 @@ export class SelectCharacterScene extends AbstractCharacterScene {
|
|||||||
update(time: number, delta: number): void {
|
update(time: number, delta: number): void {
|
||||||
}
|
}
|
||||||
|
|
||||||
public onResize(ev: UIEvent): void {
|
public onResize(): void {
|
||||||
//move position of user
|
//move position of user
|
||||||
this.moveUser();
|
this.moveUser();
|
||||||
|
|
||||||
this.centerXDomElement(this.selectCharacterSceneElement, 150);
|
this.centerXDomElement(this.selectCharacterSceneElement, 300);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -43,7 +43,7 @@ export class SelectCompanionScene extends ResizableScene {
|
|||||||
create() {
|
create() {
|
||||||
|
|
||||||
this.selectCompanionSceneElement = this.add.dom(-1000, 0).createFromCache(selectCompanionSceneKey);
|
this.selectCompanionSceneElement = this.add.dom(-1000, 0).createFromCache(selectCompanionSceneKey);
|
||||||
this.centerXDomElement(this.selectCompanionSceneElement, 150);
|
this.centerXDomElement(this.selectCompanionSceneElement, 300);
|
||||||
MenuScene.revealMenusAfterInit(this.selectCompanionSceneElement, selectCompanionSceneKey);
|
MenuScene.revealMenusAfterInit(this.selectCompanionSceneElement, selectCompanionSceneKey);
|
||||||
|
|
||||||
this.selectCompanionSceneElement.addListener('click');
|
this.selectCompanionSceneElement.addListener('click');
|
||||||
@ -126,10 +126,10 @@ export class SelectCompanionScene extends ResizableScene {
|
|||||||
this.selectedCompanion = this.companions[this.currentCompanion];
|
this.selectedCompanion = this.companions[this.currentCompanion];
|
||||||
}
|
}
|
||||||
|
|
||||||
public onResize(ev: UIEvent): void {
|
public onResize(): void {
|
||||||
this.moveCompanion();
|
this.moveCompanion();
|
||||||
|
|
||||||
this.centerXDomElement(this.selectCompanionSceneElement, 150);
|
this.centerXDomElement(this.selectCompanionSceneElement, 300);
|
||||||
}
|
}
|
||||||
|
|
||||||
private updateSelectedCompanion(): void {
|
private updateSelectedCompanion(): void {
|
||||||
|
@ -109,8 +109,10 @@ export class HelpCameraSettingsScene extends DirtyScene {
|
|||||||
this.dirty = false;
|
this.dirty = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
public onResize(ev: UIEvent): void {
|
public onResize(): void {
|
||||||
super.onResize(ev);
|
super.onResize(
|
||||||
|
|
||||||
|
);
|
||||||
if (this.helpCameraSettingsOpened) {
|
if (this.helpCameraSettingsOpened) {
|
||||||
const middleX = this.getMiddleX();
|
const middleX = this.getMiddleX();
|
||||||
const middleY = this.getMiddleY();
|
const middleY = this.getMiddleY();
|
||||||
|
Loading…
Reference in New Issue
Block a user