logins back
This commit is contained in:
ntr
parent
c44d2d7d14
commit
995eae0e4d
@ -16,6 +16,7 @@ function registerEvents(registry, events) {
|
||||
|
||||
function setAccount(account) {
|
||||
registry.set('account', account);
|
||||
events.emit('ACCOUNT', account);
|
||||
}
|
||||
|
||||
function setActiveSkill(skill) {
|
||||
@ -69,7 +70,84 @@ function registerEvents(registry, events) {
|
||||
return setCryps(cryps);
|
||||
});
|
||||
|
||||
function loginPrompt() {
|
||||
const USER_INPUT = '<input className="input" type="email" placeholder="username" />';
|
||||
const PASSWORD_INPUT = '<input className="input" type="password" placeholder="password" />';
|
||||
const LOGIN_BUTTON = '<button type="submit">Login</button>';
|
||||
const REGISTER_BUTTON = '<button type="submit">Register</button>';
|
||||
|
||||
const ws = registry.get('ws');
|
||||
|
||||
function submitLogin(instance, thisToast, button, e, inputs) {
|
||||
const USERNAME = inputs[0].value;
|
||||
const PASSWORD = inputs[1].value;
|
||||
ws.sendAccountLogin(USERNAME, PASSWORD);
|
||||
}
|
||||
|
||||
function submitRegister(instance, thisToast, button, e, inputs) {
|
||||
const USERNAME = inputs[0].value;
|
||||
const PASSWORD = inputs[1].value;
|
||||
ws.sendAccountCreate(USERNAME, PASSWORD);
|
||||
}
|
||||
|
||||
toast.question({
|
||||
id: 'login',
|
||||
theme: 'dark',
|
||||
color: 'black',
|
||||
timeout: false,
|
||||
// overlay: true,
|
||||
drag: false,
|
||||
close: false,
|
||||
title: 'LOGIN',
|
||||
position: 'center',
|
||||
inputs: [
|
||||
[USER_INPUT, 'change', null, true], // true to focus
|
||||
[PASSWORD_INPUT, 'change', null],
|
||||
],
|
||||
buttons: [
|
||||
[LOGIN_BUTTON, submitLogin], // true to focus
|
||||
[REGISTER_BUTTON, submitRegister], // true to focus
|
||||
],
|
||||
});
|
||||
|
||||
const prompt = document.querySelector('#login'); // Selector of your toast
|
||||
events.once('ACCOUNT', function closeLoginCb() {
|
||||
toast.hide({ transitionOut: 'fadeOut' }, prompt, 'event');
|
||||
});
|
||||
}
|
||||
|
||||
events.on('CRYP_SPAWN', function spawnPrompt() {
|
||||
const NAME_INPUT = '<input className="input" type="email" placeholder="name" />';
|
||||
const SPAWN_BUTTON = '<button type="submit">SPAWN</button>';
|
||||
|
||||
const ws = registry.get('ws');
|
||||
|
||||
function submitSpawn(instance, thisToast, button, e, inputs) {
|
||||
const NAME = inputs[0].value;
|
||||
ws.sendCrypSpawn(NAME);
|
||||
instance.hide({ transitionOut: 'fadeOut' }, thisToast, 'button');
|
||||
}
|
||||
|
||||
toast.question({
|
||||
theme: 'dark',
|
||||
color: 'black',
|
||||
timeout: false,
|
||||
// overlay: true,
|
||||
drag: false,
|
||||
close: false,
|
||||
title: 'SPAWN CRYP',
|
||||
position: 'center',
|
||||
inputs: [
|
||||
[NAME_INPUT, 'change', null, true], // true to focus
|
||||
],
|
||||
buttons: [
|
||||
[SPAWN_BUTTON, submitSpawn], // true to focus
|
||||
],
|
||||
});
|
||||
});
|
||||
|
||||
return {
|
||||
loginPrompt,
|
||||
setAccount,
|
||||
setActiveSkill,
|
||||
setCryps,
|
||||
|
||||
@ -56,7 +56,7 @@ class CrypList extends Phaser.Scene {
|
||||
this.gameList.destroy(true);
|
||||
}
|
||||
|
||||
this.gameList = new GameList({ list: this, ws, cryps, gameList });
|
||||
this.gameList = new GameList({ list: this, ws, cryps, gameList, events: this.game.events });
|
||||
}
|
||||
|
||||
displaySkills(cryp) {
|
||||
|
||||
@ -10,29 +10,36 @@ class GameList extends Phaser.GameObjects.Group {
|
||||
constructor(args) {
|
||||
super(list);
|
||||
|
||||
const { list, ws, cryps, gameList } = args;
|
||||
const { list, events, ws, cryps, gameList } = args;
|
||||
|
||||
const X = GAME_LIST.x();
|
||||
const WIDTH = GAME_LIST.width();
|
||||
const WIDTH = Math.floor(GAME_LIST.width() / 2);
|
||||
const HEIGHT = GAME_LIST.height();
|
||||
const TEXT_MARGIN = 24;
|
||||
|
||||
const pvp = list.add
|
||||
.rectangle(X, GAME_LIST.y(0), WIDTH, HEIGHT, 0x440000)
|
||||
const spawn = list.add
|
||||
.rectangle(X, GAME_LIST.y(0), WIDTH, HEIGHT, 0x888888)
|
||||
.setInteractive()
|
||||
.setOrigin(0);
|
||||
|
||||
this.add(list.add.text(pvp.getCenter().x, pvp.getCenter().y, 'NEW', TEXT.HEADER));
|
||||
this.add(list.add.text(spawn.getCenter().x, spawn.getCenter().y, 'SPAWN', TEXT.HEADER));
|
||||
|
||||
const pvp = list.add
|
||||
.rectangle(X + WIDTH, GAME_LIST.y(0), WIDTH, HEIGHT, 0x440000)
|
||||
.setInteractive()
|
||||
.setOrigin(0);
|
||||
|
||||
this.add(list.add.text(pvp.getCenter().x, pvp.getCenter().y, 'PVP', TEXT.HEADER));
|
||||
|
||||
const pve = list.add
|
||||
.rectangle(X, GAME_LIST.y(1), Math.floor(WIDTH / 2), HEIGHT, 0x004400)
|
||||
.rectangle(X, GAME_LIST.y(1), WIDTH, HEIGHT, 0x004400)
|
||||
.setInteractive()
|
||||
.setOrigin(0);
|
||||
|
||||
this.add(list.add.text(pve.getCenter().x, pve.getCenter().y, 'PVE', TEXT.HEADER));
|
||||
|
||||
const refresh = list.add
|
||||
.rectangle(X + Math.floor(WIDTH / 2), GAME_LIST.y(1), Math.floor(WIDTH / 2), HEIGHT, 0x000044)
|
||||
.rectangle(X + WIDTH, GAME_LIST.y(1), WIDTH, HEIGHT, 0x000044)
|
||||
.setInteractive()
|
||||
.setOrigin(0);
|
||||
|
||||
@ -44,7 +51,7 @@ class GameList extends Phaser.GameObjects.Group {
|
||||
const GAME_Y = GAME_LIST.rowY(i);
|
||||
|
||||
const gameBox = list.add
|
||||
.rectangle(GAME_X, GAME_Y, WIDTH, HEIGHT, 0x111111)
|
||||
.rectangle(GAME_X, GAME_Y, WIDTH * 2, HEIGHT, 0x111111)
|
||||
.setInteractive()
|
||||
.setOrigin(0);
|
||||
|
||||
@ -59,6 +66,10 @@ class GameList extends Phaser.GameObjects.Group {
|
||||
|
||||
gameList.forEach(gameRow);
|
||||
|
||||
spawn.on('pointerdown', () => {
|
||||
events.emit('CRYP_SPAWN');
|
||||
});
|
||||
|
||||
pvp.on('pointerdown', () => {
|
||||
const team = cryps.filter(c => c.active).map(c => c.id);
|
||||
return ws.sendGamePvp(team);
|
||||
|
||||
@ -39,37 +39,12 @@ function createSocket(events) {
|
||||
|
||||
// Connection opened
|
||||
ws.addEventListener('open', (event) => {
|
||||
// toast.info({
|
||||
// message: 'connected',
|
||||
// });
|
||||
|
||||
iziToast.question({
|
||||
drag: false,
|
||||
close: false,
|
||||
overlay: true,
|
||||
title: 'Login',
|
||||
message: 'Enter login details',
|
||||
position: 'center',
|
||||
inputs: [
|
||||
['<input type="text">', 'keyup', function (instance, toast, input, e) {
|
||||
console.info(input.value);
|
||||
}, true], // true to focus
|
||||
['<input type="text">', 'change', function (instance, toast, select, e) {
|
||||
console.info(select.options[select.selectedIndex].value);
|
||||
}]
|
||||
],
|
||||
buttons: [
|
||||
['<button><b>Confirm</b></button>', function (instance, toast, button, e, inputs) {
|
||||
|
||||
alert('First field: ' + inputs[0].value)
|
||||
alert('Second field: ' + inputs[1].options[inputs[1].selectedIndex].value)
|
||||
|
||||
instance.hide({ transitionOut: 'fadeOut' }, toast, 'button');
|
||||
}, false], // true to focus
|
||||
]
|
||||
toast.info({
|
||||
message: 'connected',
|
||||
});
|
||||
|
||||
send({ method: 'account_login', params: { name: 'ntr', password: 'grepgrepgrep' } });
|
||||
events.loginPrompt();
|
||||
// send({ method: 'account_login', params: { name: 'ntr', password: 'grepgrepgrep' } });
|
||||
});
|
||||
|
||||
// Listen for messages
|
||||
@ -152,7 +127,7 @@ function createSocket(events) {
|
||||
send({ method: 'account_login', params: { name, password } });
|
||||
}
|
||||
|
||||
function sendAccountRegister(name, password) {
|
||||
function sendAccountCreate(name, password) {
|
||||
send({ method: 'account_create', params: { name, password } });
|
||||
}
|
||||
|
||||
@ -253,7 +228,7 @@ function createSocket(events) {
|
||||
return {
|
||||
clearGameStateInterval,
|
||||
sendAccountLogin,
|
||||
sendAccountRegister,
|
||||
sendAccountCreate,
|
||||
sendGameState,
|
||||
sendGamePve,
|
||||
sendGamePvp,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user