tanner/pslockout
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add logging to the web client

Browse Source
This commit is contained in:
Tanner Collin 2019-05-23 20:31:46 +00:00
parent 9fd00d6442
commit 652ef3fb8d
1 changed files with 19 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
webclient/src/App.js
View File

@ -26,7 +26,7 @@ class App extends Component {
let token = this.storage ? localStorage.getItem('token') : null; let token = this.storage ? localStorage.getItem('token') : null;
this.state = { this.state = {
login: {token: token, error: null, username: '', password: '', confirmLogout: false}, login: {token: token, error: false, username: '', password: '', confirmLogout: false},
user: null, user: null,
toolData: null, toolData: null,
toolStatus: null, toolStatus: null,
@ -37,6 +37,13 @@ class App extends Component {
}; };
} }
log = (string) => {
if (this.state.connected) {
const username = this.state.login.username.replace('.', '') || this.state.user.username || 'unknown';
this.socket.emit('log', `${username} - Web client: ${string}`);
}
}
noNetwork = () => { noNetwork = () => {
this.setState({ network: false }); this.setState({ network: false });
this.socket.disconnect(); this.socket.disconnect();
@ -96,6 +103,7 @@ class App extends Component {
requestInterlock = change => { requestInterlock = change => {
this.socket.emit('requestInterlock', { this.socket.emit('requestInterlock', {
username: this.state.user.username,
token: this.state.login.token, token: this.state.login.token,
change: change, change: change,
}); });
@ -120,12 +128,16 @@ class App extends Component {
.then(response => { .then(response => {
if (response.ok) { if (response.ok) {
response.json().then(data => { response.json().then(data => {
this.log('Good login');
this.setState({ login: {...login, ...data, error: false} }); this.setState({ login: {...login, ...data, error: false} });
if (this.storage) localStorage.setItem('token', data.token); if (this.storage) localStorage.setItem('token', data.token);
this.getUser(); this.getUser();
}); });
} else { } else {
this.setState({ login: {...login, error: true} }); response.json().then(data => {
this.log('Bad login');
this.setState({ login: {...login, error: data.error} });
});
} }
}) })
.catch(error => { .catch(error => {
@ -149,6 +161,7 @@ class App extends Component {
} }
handleLogout = () => { handleLogout = () => {
this.log('Logout');
this.setState({ this.setState({
login: {...this.state.login, token: null, confirmLogout: false} login: {...this.state.login, token: null, confirmLogout: false}
}); });
@ -173,14 +186,16 @@ class App extends Component {
submitCourses = () => { submitCourses = () => {
const toolData = this.state.toolData; const toolData = this.state.toolData;
const selectedCourses = this.state.selectedCourses; const selectedCourses = this.state.selectedCourses;
const courseList = toolData.courses.map(x => x.slug).filter((x, i) => selectedCourses[i]);
fetch(AUTH_SERVER_URL + '/select-courses/', { fetch(AUTH_SERVER_URL + '/select-courses/', {
method: 'PUT', method: 'PUT',
headers: {'Authorization': 'Token ' + this.state.login.token, 'Content-Type': 'application/json; charset=utf-8'}, headers: {'Authorization': 'Token ' + this.state.login.token, 'Content-Type': 'application/json; charset=utf-8'},
body: JSON.stringify({'courses': toolData.courses.map(x => x.slug).filter((x, i) => selectedCourses[i]) }) body: JSON.stringify({ 'courses': courseList })
}) })
.then(response => { .then(response => {
if (response.ok) { if (response.ok) {
this.log('Selected courses ' + courseList.join(', '));
this.getUser(); this.getUser();
} else { } else {
this.noNetwork(); this.noNetwork();
@ -295,7 +310,7 @@ class App extends Component {
</Form.Field> </Form.Field>
<Button type='submit'>Submit</Button> <Button type='submit'>Submit</Button>
{login.error && <Label basic color='red' pointing='left'> {login.error && <Label basic color='red' pointing='left'>
Invalid username / password! {login.error}
</Label>} </Label>}
</Form> </Form>
</Container> </Container>