Extract Authenticate
This commit is contained in:
parent
28ab115dbd
commit
5db0d9b683
3 changed files with 70 additions and 61 deletions
68
public/components/authenticate.js
Normal file
68
public/components/authenticate.js
Normal file
|
@ -0,0 +1,68 @@
|
||||||
|
'use strict';
|
||||||
|
var React = require('react');
|
||||||
|
var ReactBootstrap = require('react-bootstrap');
|
||||||
|
var $ = require('jquery');
|
||||||
|
|
||||||
|
var Authenticate = React.createClass({
|
||||||
|
logout: function () {
|
||||||
|
this.props.refreshAuth(null, null);
|
||||||
|
window.location.href = "/";
|
||||||
|
},
|
||||||
|
refreshToken: function (event) {
|
||||||
|
event.preventDefault();
|
||||||
|
var self = this;
|
||||||
|
$.ajax({
|
||||||
|
url: '/refresh_token',
|
||||||
|
data: {
|
||||||
|
'refresh_token': self.props.auth.refresh_token
|
||||||
|
},
|
||||||
|
success: function (data) {
|
||||||
|
self.props.refreshAuth(data.access_token, self.props.auth.refresh_token);
|
||||||
|
},
|
||||||
|
error: function (xhr, status, err) {
|
||||||
|
console.error(status, err);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
render: function () {
|
||||||
|
var auth;
|
||||||
|
var Nav = ReactBootstrap.Nav,
|
||||||
|
NavItem = ReactBootstrap.NavItem,
|
||||||
|
Navbar = ReactBootstrap.Navbar;
|
||||||
|
|
||||||
|
if (this.props.auth.access_token == null) {
|
||||||
|
auth = (
|
||||||
|
<Nav pullRight>
|
||||||
|
<NavItem eventKey={1} href="/login"><strong>Login With Spotify</strong></NavItem>
|
||||||
|
</Nav>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
auth = (
|
||||||
|
<Nav pullRight>
|
||||||
|
<NavItem eventKey={2} onClick={this.refreshToken} href="#">Refresh my token</NavItem>
|
||||||
|
<NavItem eventKey={3} onClick={this.logout} href="#"><strong>Logout</strong></NavItem>
|
||||||
|
</Nav>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Navbar fluid={true}>
|
||||||
|
<Navbar.Header>
|
||||||
|
<Navbar.Brand>
|
||||||
|
<a href="/">Duplicate Finder</a>
|
||||||
|
</Navbar.Brand>
|
||||||
|
<Navbar.Toggle />
|
||||||
|
</Navbar.Header>
|
||||||
|
<Navbar.Collapse>
|
||||||
|
<Nav>
|
||||||
|
<NavItem eventKey={1} href="/" active>Finder</NavItem>
|
||||||
|
</Nav>
|
||||||
|
{auth}
|
||||||
|
</Navbar.Collapse>
|
||||||
|
</Navbar>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
module.exports = Authenticate;
|
|
@ -1,6 +1,7 @@
|
||||||
'use strict';
|
'use strict';
|
||||||
var React = require('react');
|
var React = require('react');
|
||||||
var ReactBootstrap = require('react-bootstrap');
|
var ReactBootstrap = require('react-bootstrap');
|
||||||
|
var $ = require('jquery');
|
||||||
|
|
||||||
var DuplicatesBox = require('./duplicates-box');
|
var DuplicatesBox = require('./duplicates-box');
|
||||||
var PlaylistBox = require('./playlist-box');
|
var PlaylistBox = require('./playlist-box');
|
||||||
|
|
|
@ -22,67 +22,7 @@ function getHashParams() {
|
||||||
|
|
||||||
var DuplicateFinderBox = require('./components/duplicate-finder-box');
|
var DuplicateFinderBox = require('./components/duplicate-finder-box');
|
||||||
|
|
||||||
var Authenticate = React.createClass({
|
var Authenticate = require('./components/authenticate');
|
||||||
logout: function () {
|
|
||||||
this.props.refreshAuth(null, null);
|
|
||||||
window.location.href = "/";
|
|
||||||
},
|
|
||||||
refreshToken: function (event) {
|
|
||||||
event.preventDefault();
|
|
||||||
var self = this;
|
|
||||||
$.ajax({
|
|
||||||
url: '/refresh_token',
|
|
||||||
data: {
|
|
||||||
'refresh_token': self.props.auth.refresh_token
|
|
||||||
},
|
|
||||||
success: function (data) {
|
|
||||||
self.props.refreshAuth(data.access_token, self.props.auth.refresh_token);
|
|
||||||
},
|
|
||||||
error: function (xhr, status, err) {
|
|
||||||
console.error(status, err);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
render: function () {
|
|
||||||
var auth;
|
|
||||||
var Nav = ReactBootstrap.Nav,
|
|
||||||
NavItem = ReactBootstrap.NavItem,
|
|
||||||
Navbar = ReactBootstrap.Navbar;
|
|
||||||
|
|
||||||
if (this.props.auth.access_token == null) {
|
|
||||||
auth = (
|
|
||||||
<Nav pullRight>
|
|
||||||
<NavItem eventKey={1} href="/login"><strong>Login With Spotify</strong></NavItem>
|
|
||||||
</Nav>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
auth = (
|
|
||||||
<Nav pullRight>
|
|
||||||
<NavItem eventKey={2} onClick={this.refreshToken} href="#">Refresh my token</NavItem>
|
|
||||||
<NavItem eventKey={3} onClick={this.logout} href="#"><strong>Logout</strong></NavItem>
|
|
||||||
</Nav>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Navbar fluid={true}>
|
|
||||||
<Navbar.Header>
|
|
||||||
<Navbar.Brand>
|
|
||||||
<a href="#">Duplicate Finder</a>
|
|
||||||
</Navbar.Brand>
|
|
||||||
<Navbar.Toggle />
|
|
||||||
</Navbar.Header>
|
|
||||||
<Navbar.Collapse>
|
|
||||||
<Nav>
|
|
||||||
<NavItem eventKey={1} href="#" active>Finder</NavItem>
|
|
||||||
</Nav>
|
|
||||||
{auth}
|
|
||||||
</Navbar.Collapse>
|
|
||||||
</Navbar>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
var App = React.createClass({
|
var App = React.createClass({
|
||||||
getInitialState: function () {
|
getInitialState: function () {
|
||||||
|
|
Loading…
Reference in a new issue