lbehm/workadventure
1
0
Fork 0
Code Issues Pull requests Releases Activity

prettier login page

Browse source
This commit is contained in:
kharhamel 2020-04-26 18:48:41 +02:00
parent d691b58d0b
commit 25ac579a90
3 changed files with 28 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
front/src/Phaser/Components/TextField.ts
View file

@ -1,7 +1,7 @@
export class TextField extends Phaser.GameObjects.Text {
constructor(scene: Phaser.Scene, x: number, y: number, text: string | string[]) {
super(scene, x, y, text, { fontSize: '32px', fontStyle: 'Courier', color: '#ffffff'});
super(scene, x, y, text, { fontFamily: 'Arial', fontSize: "20px", color: '#ffffff'});
this.scene.add.existing(this)
}
}

25
front/src/Phaser/Components/TextInput.ts
View file

@ -1,21 +1,40 @@
export class TextInput extends Phaser.GameObjects.Text {
private underLineLength = 10;
private underLine: Phaser.GameObjects.Text;
constructor(scene: Phaser.Scene, x: number, y: number) {
super(scene, x, y, '', { fontSize: '32px', fontStyle: 'Courier', color: '#fff'});
super(scene, x, y, '', { fontFamily: 'Arial', fontSize: "20px", color: '#ffffff'});
this.scene.add.existing(this);
this.underLine = this.scene.add.text(x, y+1, '__________', { fontFamily: 'Arial', fontSize: "20px", color: '#ffffff'})
let keySpace = this.scene.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.SPACE);
let keyBackspace = this.scene.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.BACKSPACE);
this.scene.input.keyboard.on('keydown', (event: any) => {
if (event.keyCode === 8 && this.text.length > 0) {
this.text = this.text.substr(0, this.text.length - 1);
this.deleteLetter();
} else if (event.keyCode === 32 || (event.keyCode >= 48 && event.keyCode < 90)) {
this.text += event.key;
this.addLetter(event.key);
}
});
}
private deleteLetter() {
this.text = this.text.substr(0, this.text.length - 1);
if (this.underLine.text.length > this.underLineLength) {
this.underLine.text = this.underLine.text.substr(0, this.underLine.text.length - 1);
}
}
private addLetter(letter: string) {
this.text += letter;
if (this.text.length > this.underLineLength) {
this.underLine.text += '_';
}
}
getText(): string {
return this.text;
}

6
front/src/Phaser/Login/LogincScene.ts
View file

@ -15,6 +15,7 @@ export class LogincScene extends Phaser.Scene {
private emailInput: TextInput;
private textField: TextField;
private playButton: ClickButton;
private infoTextField: TextField;
constructor() {
super({
key: LoginSceneName
@ -28,10 +29,13 @@ export class LogincScene extends Phaser.Scene {
create() {
this.textField = new TextField(this, 10, 10, 'Enter your email:');
this.emailInput = new TextInput(this, 10, 50);
let x = this.game.renderer.width / 2;
let y = this.game.renderer.height / 2;
this.playButton = new ClickButton(this, x, y, LoginTextures.playButton, this.login.bind(this));
let infoText = "Commandes de base: \n - Z,Q,S,D (ou les flèches de direction) pour bouger\n - SHIFT pour accélerer";
this.infoTextField = new TextField(this, 10, 300, infoText);
}
update(time: number, delta: number): void {