ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

login and style fixes

Browse Source
This commit is contained in:
ntr 2019-05-31 12:25:50 +10:00
parent 5e2425a83c
commit ca036ed9e0
14 changed files with 110 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/assets/styles/skeleton.css vendored
View File

@ -172,7 +172,7 @@ input[type="reset"],
input[type="button"] {
display: inline-block;
height: 38px;
padding: 0 30px;
/*padding: 0 2em;*/
color: #555;
text-align: center;
font-size: 11px;

1
client/src/actions.jsx
View File

@ -8,6 +8,7 @@ export const setNav = value => ({ type: 'SET_NAV', value });
export const setShowNav = value => ({ type: 'SET_SHOW_NAV', value });
export const setInstance = value => ({ type: 'SET_INSTANCE', value });
export const setPing = value => ({ type: 'SET_PING', value });
export const setPlayer = value => ({ type: 'SET_PLAYER', value });
export const setGame = value => ({ type: 'SET_GAME', value });
export const setResolution = value => ({ type: 'SET_RESOLUTION', value });
export const setShowLog = value => ({ type: 'SET_SHOW_LOG', value });

5
client/src/components/info.component.jsx
View File

@ -11,12 +11,9 @@ function InfoComponent(args) {
itemInfo,
combiner,
instance,
account,
player,
} = args;
const player = instance.players.find(p => p.id === account.id);
function Info() {
if (!info) return false;
const fullInfo = itemInfo.items.find(i => i.item === info) || INFO[info];

2
client/src/components/info.container.jsx
View File

@ -11,6 +11,7 @@ const addState = connect(
info,
itemInfo,
instance,
player,
account,
} = state;
@ -20,6 +21,7 @@ const addState = connect(
info,
itemInfo,
instance,
player,
account,
};
},

3
client/src/components/instance.component.jsx
View File

@ -10,8 +10,7 @@ const actions = require('../actions');
const addState = connect(
function receiveState(state) {
const { ws, instance, account, nav } = state;
const player = instance.players.find(p => p.id === account.id);
const { ws, instance, player, account, nav } = state;
function sendInstanceReady() {
return ws.sendInstanceReady(instance.id);

3
client/src/components/instance.constructs.jsx
View File

@ -8,8 +8,7 @@ const actions = require('../actions');
const addState = connect(
function receiveState(state) {
const { ws, instance, account, itemInfo, itemEquip, activeConstruct } = state;
const player = instance.players.find(p => p.id === account.id);
const { ws, instance, player, account, itemInfo, itemEquip, activeConstruct } = state;
function sendInstanceReady() {
return ws.sendInstanceReady(instance.id);

3
client/src/components/instance.equip.jsx
View File

@ -8,8 +8,7 @@ const { convertItem } = require('./../utils');
const addState = connect(
function receiveState(state) {
const { account, activeConstruct, itemInfo, info, ws, instance, itemUnequip } = state;
const player = instance.players.find(p => p.id === account.id);
const { account, activeConstruct, itemInfo, info, ws, instance, player, itemUnequip } = state;
function sendUnequip(constructId, item) {
return ws.sendVboxUnequip(instance.id, constructId, item);

45
client/src/components/login.component.jsx
View File

@ -1,45 +0,0 @@
// eslint-disable-next-line
const preact = require('preact');
function renderLogin({ submitLogin, submitRegister }) {
const details = {
name: '',
password: '',
};
return (
<main>
<div className="login">
<input
className="login-input"
type="email"
placeholder="username"
onInput={e => (details.name = e.target.value)}
/>
<input
className="login-input"
type="password"
placeholder="password"
onInput={e => (details.password = e.target.value)}
/>
<button
className="login-btn"
onClick={() => submitLogin(details.name, details.password)}>
Login
</button>
<button
className="login-btn"
onClick={() => submitRegister(details.name, details.password)}>
Register
</button>
<button
className="login-btn"
onClick={() => document.location.assign('https://discord.gg/YJJgurM')}>
Discord + Invites
</button>
</div>
</main>
);
}
module.exports = renderLogin;

19
client/src/components/login.container.jsx
View File

@ -1,19 +0,0 @@
const { connect } = require('preact-redux');
const Login = require('./login.component');
const addState = connect(
(state) => {
const { ws, account } = state;
function submitLogin(name, password) {
return ws.sendAccountLogin(name, password);
}
function submitRegister(name, password) {
console.log(name, password);
return ws.sendAccountCreate(name, password);
}
return { account, submitLogin, submitRegister };
},
);
module.exports = addState(Login);

93
client/src/components/login.jsx Normal file
View File

@ -0,0 +1,93 @@
// eslint-disable-next-line
const preact = require('preact');
const { Component } = require('preact')
const { connect } = require('preact-redux');
const addState = connect(
(state) => {
const { ws, account } = state;
function submitLogin(name, password) {
return ws.sendAccountLogin(name, password);
}
function submitRegister(name, password) {
console.log(name, password);
return ws.sendAccountCreate(name, password);
}
return { account, submitLogin, submitRegister };
},
);
class Login extends Component {
constructor(props) {
super(props);
this.state = { name: '', password: '' };
this.nameInput = this.nameInput.bind(this);
this.passwordInput = this.passwordInput.bind(this);
this.loginSubmit = this.loginSubmit.bind(this);
this.registerSubmit = this.registerSubmit.bind(this);
}
nameInput(event) {
console.log(event.target.value);
this.setState({ name: event.target.value });
}
passwordInput(event) {
this.setState({ password: event.target.value });
}
loginSubmit(event) {
event.preventDefault();
console.log(this.state);
this.props.submitLogin(this.state.name, this.state.password);
this.setState({ name: '', password: '' });
}
registerSubmit(event) {
event.preventDefault();
this.props.submitRegister(this.state.name, this.state.password);
console.log(this.state);
this.setState({ name: '', password: '' });
}
render() {
return (
<main>
<div className="login">
<input
className="login-input"
type="email"
placeholder="username"
onInput={this.nameInput}
/>
<input
className="login-input"
type="password"
placeholder="password"
onInput={this.passwordInput}
/>
<button
className="login-btn"
onClick={this.loginSubmit}>
Login
</button>
<button
className="login-btn"
onClick={this.registerSubmit}>
Register
</button>
<button
className="login-btn"
onClick={() => document.location.assign('https://discord.gg/YJJgurM')}>
Discord + Invites
</button>
</div>
</main>
);
}
}
module.exports = addState(Login);

6
client/src/components/main.jsx
View File

@ -2,7 +2,7 @@
const preact = require('preact');
const { connect } = require('preact-redux');
const LoginContainer = require('./login.container');
const Login = require('./login');
const GameContainer = require('./game.container');
const Instance = require('./instance.component');
const Team = require('./team');
@ -24,7 +24,7 @@ function Main(props) {
} = props;
if (!account) {
return <LoginContainer />;
return <Login />;
}
if (game) {
@ -35,6 +35,8 @@ function Main(props) {
return <Instance />;
}
console.warn('nav', nav, instance, game)
if (nav === 'team') return <Team />;
if (nav === 'list') return <List />;

3
client/src/components/vbox.component.jsx
View File

@ -12,14 +12,13 @@ const addState = connect(
ws,
account,
instance,
player,
combiner,
reclaiming,
vboxHighlight,
itemInfo,
} = state;
const player = instance.players.find(p => p.id === account.id);
function sendVboxDiscard() {
return ws.sendVboxDiscard(instance.id);
}

4
client/src/events.jsx
View File

@ -125,7 +125,9 @@ function registerEvents(store) {
if (!instance || v.id !== instance.id) {
store.dispatch(actions.setNav('vbox'));
const first = v.players.find(p => p.id === account.id).constructs[0];
const player = v.players.find(p => p.id === account.id);
store.dispatch(actions.setPlayer(player));
const first = player.constructs[0];
store.dispatch(actions.setActiveConstruct(first));
}
}

1
client/src/reducers.jsx
View File

@ -27,6 +27,7 @@ module.exports = {
nav: createReducer(null, 'SET_NAV'),
showNav: createReducer(null, 'SET_SHOW_NAV'),
ping: createReducer(null, 'SET_PING'),
player: createReducer(null, 'SET_PLAYER'),
reclaiming: createReducer(false, 'SET_RECLAIMING'),
resolution: createReducer(null, 'SET_RESOLUTION'),
showLog: createReducer(false, 'SET_SHOW_LOG'),