Using auth token

This commit is contained in:
James Barnsley
2016-10-17 14:27:48 +13:00
parent 4bff7ee0a9
commit 53a4743902
8 changed files with 76 additions and 40 deletions

View File

@ -9,6 +9,8 @@ export default class ConfirmationButton extends React.Component{
this.state = {
confirming: false
}
this.confirming = false;
this.unconfirmTimer = false;
}
handleClick(e){
@ -20,6 +22,19 @@ export default class ConfirmationButton extends React.Component{
}
}
handleMouseEnter(e){
clearTimeout( this.unconfirmTimer );
}
handleMouseLeave(e){
this.unconfirmTimer = setTimeout(
function(){
this.setState({ confirming: false });
}.bind(this),
1500
);
}
render(){
var className = 'button';
@ -31,9 +46,13 @@ export default class ConfirmationButton extends React.Component{
}
return (
<span className={className} onClick={ (e) => this.handleClick(e) }>
{ content }
</span>
<button
className={className}
onClick={ (e) => this.handleClick(e) }
onMouseLeave={ (e) => this.handleMouseLeave(e) }
onMouseEnter={ (e) => this.handleMouseEnter(e) }>
{ content }
</button>
);
}
}

View File

@ -56,7 +56,7 @@ class SpotifyAuthenticationFrame extends React.Component{
return (
<div>
{ this.renderAuthorizeButton() }
<iframe src={src}></iframe>
<iframe src={src} style={{ display: 'none' }}></iframe>
</div>
);
}

View File

@ -48,3 +48,9 @@ export function loadArtist( uri ){
}
}
export function loadLibraryArtists(){
return {
type: 'SPOTIFY_LOAD_LIBRARY_ARTISTS'
}
}

View File

@ -11,13 +11,22 @@ const SpotifyMiddleware = (function(){
* @param data mixed = request payload
* @return ajax promise
**/
const sendRequest = (endpoint, method = 'GET', data = false) => {
return $.ajax({
const sendRequest = (token, endpoint, method = 'GET', data = false) => {
var options = {
method: method,
cache: true,
url: 'https://api.spotify.com/v1/'+endpoint,
data: data
});
};
if( token ){
options.headers = {
Authorization: 'Bearer '+ token
}
}
return $.ajax( options );
}
/**
@ -32,7 +41,7 @@ const SpotifyMiddleware = (function(){
store.dispatch({ type: 'SPOTIFY_ALBUM_LOADED', data: false })
var id = action.uri.replace('spotify:album:','');
sendRequest('albums/'+id)
sendRequest( false, 'albums/'+id )
.then( (response) => {
store.dispatch({ type: 'SPOTIFY_ALBUM_LOADED', data: response })
});
@ -44,13 +53,25 @@ const SpotifyMiddleware = (function(){
store.dispatch({ type: 'SPOTIFY_ARTIST_LOADED', data: false })
var id = action.uri.replace('spotify:artist:','');
sendRequest('artists/'+id)
sendRequest( false, 'artists/'+id )
.then( (response) => {
store.dispatch({ type: 'SPOTIFY_ARTIST_LOADED', data: response })
});
break;
case 'SPOTIFY_LOAD_LIBRARY_ARTISTS':
store.dispatch({ type: 'SPOTIFY_LIBRARY_ARTISTS_LOADED', data: false })
var token = store.getState().spotify.token;
sendRequest( token, 'me/following?type=artist' )
.then( (response) => {
store.dispatch({ type: 'SPOTIFY_LIBRARY_ARTISTS_LOADED', data: response })
});
break;
case 'SPOTIFY_CONNECT':
console.log('Spotify wants to connect')
break;

View File

@ -9,7 +9,7 @@ export default function reducer(spotify = {}, action){
return Object.assign({}, spotify, { authorizing: true });
case 'SPOTIFY_COMPLETE_AUTHORIZATION':
return Object.assign({}, spotify, { authorizing: false, authorization: action.data });
return Object.assign({}, spotify, { authorizing: false, authorization: action.data, token: action.data.access_token });
case 'SPOTIFY_REMOVE_AUTHORIZATION':
return Object.assign({}, spotify, { authorizing: false, authorization: false });
@ -27,7 +27,7 @@ export default function reducer(spotify = {}, action){
return Object.assign({}, spotify, { artist: action.data });
case 'SPOTIFY_LIBRARY_ARTISTS_LOADED':
return Object.assign({}, spotify, { library_artists: action.data });
return Object.assign({}, spotify, { libraryArtists: action.data });
default:
return spotify

View File

@ -24,22 +24,7 @@ class Album extends React.Component{
}
}
loadAlbum( uri ){
let self = this;
var id = uri.replace('spotify:album:','');
$.ajax({
method: 'GET',
cache: true,
url: 'https://api.spotify.com/v1/albums/'+id,
success: function(album){
self.setState({ album: album });
}
});
}
renderAlbum(){
render(){
if( this.props.spotify.album ){
return (
<div>
@ -50,15 +35,6 @@ class Album extends React.Component{
}
return null;
}
render(){
return (
<div>
<h3>Single album</h3>
{ this.renderAlbum() }
</div>
);
}
}

View File

@ -2,12 +2,11 @@
import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import { Link } from 'react-router'
import * as mopidyActions from '../services/mopidy/actions'
import * as spotifyActions from '../services/spotify/actions'
import TrackList from '../components/TrackList'
class LibraryArtists extends React.Component{
constructor(props) {
@ -20,6 +19,21 @@ class LibraryArtists extends React.Component{
}
render(){
if( this.props.spotify.libraryArtists ){
return (
<div>
<h3>My artists</h3>
<ul>
{
this.props.spotify.libraryArtists.artists.items.map( (artist, index) => {
var link = '/artist/' + artist.uri;
return <li key={index}><Link to={link}>{ artist.name }</Link></li>
})
}
</ul>
</div>
);
}
return null;
}
}

View File

@ -17,8 +17,8 @@ class Settings extends React.Component{
}
resetAllSettings(){
localStorage.removeItem('state');
window.location.reload();
localStorage.clear();
window.location.reload(true);
}
render(){