noby
/
workadventure
2
2
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

the joystick is now visible only when pointer is down

This commit is contained in:
kharhamel 2021-04-20 10:52:06 +02:00
parent 56287a2958
commit 415d8f9466
2 changed files with 13 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
front/src/Phaser/Game/GameScene.ts
View File

@ -51,8 +51,6 @@ import {Room} from "../../Connexion/Room";
import {jitsiFactory} from "../../WebRtc/JitsiFactory";
import {urlManager} from "../../Url/UrlManager";
import {audioManager} from "../../WebRtc/AudioManager";
import {IVirtualJoystick} from "../../types";
import VirtualJoystick from 'phaser3-rex-plugins/plugins/virtualjoystick.js';
import {PresentationModeIcon} from "../Components/PresentationModeIcon";
import {ChatModeIcon} from "../Components/ChatModeIcon";
import {OpenChatIcon, openChatIconName} from "../Components/OpenChatIcon";
@ -168,7 +166,6 @@ export class GameScene extends ResizableScene implements CenterListener {
private messageSubscription: Subscription|null = null;
private popUpElements : Map<number, DOMElement> = new Map<number, Phaser.GameObjects.DOMElement>();
private originalMapUrl: string|undefined;
public virtualJoystick!: IVirtualJoystick;
constructor(private room: Room, MapUrlFile: string, customKey?: string|undefined) {
super({

23
front/src/Phaser/UserInput/UserInputManager.ts
View File

@ -1,9 +1,7 @@
import { Direction, IVirtualJoystick } from "../../types";
import {GameScene} from "../Game/GameScene";
import {touchScreenManager} from "../../Touch/TouchScreenManager";
const {
default: VirtualJoystick,
} = require("phaser3-rex-plugins/plugins/virtualjoystick.js");
import VirtualJoystick from 'phaser3-rex-plugins/plugins/virtualjoystick.js';
interface UserInputManagerDatum {
keyInstance: Phaser.Input.Keyboard.Key;
@ -21,6 +19,9 @@ export enum UserInputEvent {
JoystickMove,
}
const outOfScreenX = -1000;
const outOfScreenY = -1000;
//we cannot use a map structure so we have to create a replacment
export class ActiveEventList {
private eventMap : Map<UserInputEvent, boolean> = new Map<UserInputEvent, boolean>();
@ -62,22 +63,23 @@ export class UserInputManager {
initVirtualJoystick() {
this.joystick = new VirtualJoystick(this, {
x: this.Scene.game.renderer.width / 2,
y: this.Scene.game.renderer.height / 2,
x: outOfScreenX,
y: outOfScreenY,
radius: 20,
base: this.Scene.add.circle(0, 0, 20),
thumb: this.Scene.add.circle(0, 0, 10),
base: this.Scene.add.circle(0, 0, 20, 0xdddddd),
thumb: this.Scene.add.circle(0, 0, 10, 0x000000),
enable: true,
dir: "8dir",
});
this.joystick.visible = true;
// Listener event to reposition virtual joystick
// whatever place you click in game area
this.Scene.input.on('pointerdown', (pointer: { x: number; y: number; }) => {
this.joystick.x = pointer.x;
this.joystick.y = pointer.y;
});
this.Scene.input.on('pointerup', (pointer: { x: number; y: number; }) => {
this.joystick.x = outOfScreenX;
this.joystick.y = outOfScreenY;
});
this.joystick.on("update", () => {
this.joystickForceAccuX = this.joystick.forceX ? this.joystickForceAccuX : 0;
this.joystickForceAccuY = this.joystick.forceY ? this.joystickForceAccuY : 0;
@ -128,6 +130,7 @@ export class UserInputManager {
this.Scene.input.keyboard.removeAllListeners();
}
//todo: should we also disable the joystick?
disableControls(){
this.Scene.input.keyboard.removeAllKeys();
this.isInputDisabled = true;