Skip to content

Commit 1862d43

Browse files
committed
added logout, improved login and logout ui
1 parent 345bdc6 commit 1862d43

File tree

11 files changed

+116
-59
lines changed

11 files changed

+116
-59
lines changed

app/dist/dist/css/AdminLTE.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4918,3 +4918,8 @@ table.text-center th {
49184918
white-space: normal !important;
49194919
}
49204920
}
4921+
4922+
.col-centered {
4923+
float: none;
4924+
margin: 0 auto;
4925+
}
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
/* Custom CSS for Factorio Server Manager */
2+
3+
.col-centered {
4+
float: none;
5+
margin: 0 auto;
6+
}
7+
8+
.absolute-center {
9+
margin: auto;
10+
position: absolute;
11+
top: 0; left: 0; bottom: 0; right: 0;
12+
}

app/index.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,8 @@
1616
<link rel="stylesheet" href="./dist/dist/css/AdminLTE.css">
1717
<!-- AdminLTE Skins. -->
1818
<link rel="stylesheet" href="./dist/dist/css/skins/skin-blue.css">
19+
<!-- Extra CSS tweaks -->
20+
<link rel="stylesheet" href="./dist/dist/css/factorio-server-manager.css">
1921

2022
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
2123
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->

auth.go

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ func (auth *AuthHTTP) createRoles() {
4747
}
4848
}
4949

50-
func (auth *AuthHTTP) createUser(username, password, role, email string) error {
50+
func (auth *AuthHTTP) createInitialUser(username, password, role, email string) error {
5151
user := httpauth.UserData{Username: username, Role: role, Email: email}
5252
err := auth.backend.SaveUser(user)
5353
if err != nil {

handlers.go

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -649,7 +649,7 @@ func GetCurrentLogin(w http.ResponseWriter, r *http.Request) {
649649
}
650650
return
651651
}
652-
fmt.Println(user, err)
652+
653653
resp.Success = true
654654
resp.Data = user
655655

main.go

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ func main() {
7979
Auth = initAuth()
8080
Auth.createAuthDb(config.DatabaseFile)
8181
Auth.createRoles()
82-
err := Auth.createUser(config.Username, config.Password, "admin", "")
82+
err := Auth.createInitialUser(config.Username, config.Password, "admin", "")
8383
if err != nil {
8484
log.Printf("Error creating user: %s", err)
8585
}

ui/App/App.jsx

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ class App extends React.Component {
1818
serverStatus: {},
1919
saves: [],
2020
loggedIn: false,
21+
username: "",
2122
}
2223
}
2324

@@ -31,14 +32,13 @@ class App extends React.Component {
3132
}
3233

3334
checkLogin() {
34-
console.log(this.state);
3535
$.ajax({
3636
url: "/api/user/status",
3737
dataType: "json",
3838
success: (data) => {
39-
console.log(data.success);
4039
if (data.success === true) {
41-
this.setState({loggedIn: true})
40+
this.setState({loggedIn: true,
41+
username: data.data.Username})
4242
}
4343
}
4444
})
@@ -87,7 +87,10 @@ class App extends React.Component {
8787
if (this.state.loggedIn) {
8888
var resp =
8989
<div>
90-
<Header />
90+
<Header
91+
username={this.state.username}
92+
loggedIn={this.state.loggedIn}
93+
/>
9194

9295
<Sidebar
9396
serverStatus={this.facServStatus}
@@ -101,18 +104,21 @@ class App extends React.Component {
101104
serverStatus: this.state.serverStatus,
102105
getStatus: this.getStatus,
103106
saves: this.state.saves,
104-
getSaves: this.getSaves}
107+
getSaves: this.getSaves,
108+
username: this.state.username}
105109
)}
106110

107111
<Footer />
108112

109113
<HiddenSidebar
110114
serverStatus={this.state.serverStatus}
111-
/>;
115+
username={this.state.username}
116+
loggedIn={this.state.loggedIn}
117+
checkLogin={this.checkLogin}
118+
/>
112119
</div>
113120
} else {
114121
var resp = <div><p>Not Logged in</p></div>;
115-
console.log(resp);
116122
}
117123

118124
return(

ui/App/components/Header.jsx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,4 +25,9 @@ class Header extends React.Component {
2525
}
2626
}
2727

28+
Header.propTypes = {
29+
username: React.PropTypes.string.isRequired,
30+
loggedIn: React.PropTypes.bool.isRequired,
31+
}
32+
2833
export default Header

ui/App/components/HiddenSidebar.jsx

Lines changed: 27 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,37 @@
11
import React from 'react';
2-
import {Link} from 'react-router';
2+
import {Link, browserHistory} from 'react-router';
33

44
class HiddenSidebar extends React.Component {
55
constructor(props) {
66
super(props);
7+
this.onLogout = this.onLogout.bind(this);
78
}
89

910
capitalizeFirstLetter(string) {
1011
return string.charAt(0).toUpperCase() + string.slice(1);
1112
}
1213

14+
onLogout(e) {
15+
e.preventDefault();
16+
$.ajax({
17+
url: "/api/logout",
18+
dataType: "json",
19+
success: (resp) => {
20+
alert(resp)
21+
}
22+
});
23+
// Wait for 1 second for logout callback to complete
24+
setTimeout(() => {
25+
browserHistory.push("/login");
26+
}, 1000);
27+
}
28+
1329
render() {
30+
var username;
31+
if (this.props.loggedIn) {
32+
username = <p>{this.props.username}</p>
33+
}
34+
1435
return(
1536
<aside className="control-sidebar control-sidebar-dark">
1637
<ul className="control-sidebar-menu">
@@ -21,12 +42,13 @@ class HiddenSidebar extends React.Component {
2142
</Link>
2243
</li>
2344
<li>
24-
<a href="/api/logout">
45+
<a onClick={this.onLogout}>
2546
<i className="menu-icon fa fa-lock bg-red"></i>
2647
Login
2748
</a>
2849
</li>
2950
</ul>
51+
Current user: {username}
3052
<div className="table-responsive">
3153
<table className="table table-border">
3254
<thead>
@@ -53,6 +75,9 @@ class HiddenSidebar extends React.Component {
5375

5476
HiddenSidebar.propTypes = {
5577
serverStatus: React.PropTypes.object.isRequired,
78+
username: React.PropTypes.string.isRequired,
79+
loggedIn: React.PropTypes.bool.isRequired,
80+
checkLogin: React.PropTypes.func.isRequired,
5681
}
5782

5883

ui/App/components/LoginContent.jsx

Lines changed: 48 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@ class LoginContent extends React.Component {
1313

1414
loginUser(e) {
1515
e.preventDefault();
16-
console.log(this)
1716
let user = {
1817
username: this.refs.username.value,
1918
password: this.refs.password.value,
@@ -26,62 +25,65 @@ class LoginContent extends React.Component {
2625
data: JSON.stringify(user),
2726
success: (resp) => {
2827
console.log(resp);
29-
if (resp.success === true) {
30-
browserHistory.push("/")
31-
}
28+
browserHistory.push("/");
3229
}
33-
})
30+
});
31+
setTimeout(() => {
32+
browserHistory.push("/");
33+
}, 1000);
3434
}
3535

3636
render() {
3737
return(
38-
<div className="container center-block">
38+
<div className="container ">
3939
<div className="row">
40-
<div className="col-xs-6">
41-
<div className="center-block">
42-
<section className="content-header">
43-
<h1>
44-
Login
45-
<small>Login to manage Factorio</small>
46-
</h1>
47-
</section>
40+
<div className="absolute-center is-responsive">
41+
<div className="col-centered col-md-4 col-mod-offset-2">
42+
<div className="center-block">
43+
<section className="content-header">
44+
<h1>
45+
Factorio Server Manager
46+
<small>Login to manage Factorio</small>
47+
</h1>
48+
</section>
4849

49-
<section className="content">
50-
<div className="row">
51-
<div className="login-box-body">
50+
<section className="content">
51+
<div className="row">
52+
<div className="login-box-body">
5253

53-
<form onSubmit={this.loginUser}>
54-
<div className="form-group has-feedback">
55-
<input type="text" ref="username" className="form-control" placeholder="Username" />
56-
<span className="fa fa-envelope form-control-feedback"></span>
57-
</div>
58-
<div className="form-group has-feedback">
59-
<input type="password" ref="password" className="form-control" placeholder="Password" />
60-
<span className="fa fa-lock form-control-feedback"></span>
61-
</div>
62-
<div className="row">
63-
<div className="col-xs-8">
64-
<div className="checkbox">
65-
<label className="">
66-
<div className="" aria-checked="false" aria-disabled="false" style={{position: "relative"}}>
67-
<input type="checkbox"/>
68-
</div> Remember Me
69-
</label>
54+
<form onSubmit={this.loginUser}>
55+
<div className="form-group has-feedback">
56+
<input type="text" ref="username" className="form-control" placeholder="Username" />
57+
<span className="fa fa-envelope form-control-feedback"></span>
7058
</div>
71-
</div>
72-
</div>
73-
<div className="row">
74-
<div className="col-xs-4">
75-
<button type="submit" className="btn btn-primary btn-block btn-flat">Sign In</button>
76-
</div>
77-
</div>
78-
</form>
59+
<div className="form-group has-feedback">
60+
<input type="password" ref="password" className="form-control" placeholder="Password" />
61+
<span className="fa fa-lock form-control-feedback"></span>
62+
</div>
63+
<div className="row">
64+
<div className="col-xs-8">
65+
<div className="checkbox">
66+
<label className="">
67+
<div className="" aria-checked="false" aria-disabled="false" style={{position: "relative"}}>
68+
<input type="checkbox"/>
69+
</div> Remember Me
70+
</label>
71+
</div>
72+
</div>
73+
</div>
74+
<div className="row">
75+
<div className="col-xs-4">
76+
<button type="submit" className="btn btn-primary btn-block btn-flat">Sign In</button>
77+
</div>
78+
</div>
79+
</form>
7980

80-
<a href="#">I forgot my password</a><br />
81-
</div>
81+
<a href="#">I forgot my password</a><br />
82+
</div>
83+
</div>
84+
</section>
85+
</div>
8286
</div>
83-
</section>
84-
</div>
8587
</div>
8688
</div>
8789
</div>

0 commit comments

Comments
 (0)