secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Pusher username setting fully working

Browse Source
This commit is contained in:
James Barnsley
2016-10-28 15:58:07 +13:00
parent 64e5472e2c
commit f4ca6b7fde
10 changed files with 86 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/js/bootstrap.js vendored
View File

@ -32,6 +32,7 @@ var initialState = {
progress: 0
},
pusher: {
username: '',
connections: [],
connected: false,
port: 6681

4
src/js/components/PusherConnectionList.js
View File

@ -34,9 +34,11 @@ class PusherConnectionList extends React.Component{
<div className="pusher-connection-list">
{
this.props.pusher.connections.map( (connection, index) => {
var isMe = false;
if( connection.connectionid == this.props.pusher.connectionid ) isMe = true;
return (
<div className="connection cf" key={connection.connectionid}>
<div className="col w20 one-liner">{ connection.username }</div>
<div className="col w20">{ connection.username } { isMe ? <span>(you)</span> : null }</div>
<div className="col w20 one-liner">{ connection.ip }</div>
<div className="col w20 one-liner">{ connection.connectionid }</div>
</div>

2
src/js/components/SpotifyAuthenticationFrame.js
View File

@ -75,7 +75,7 @@ class SpotifyAuthenticationFrame extends React.Component{
}else if( this.props.spotify.authorized ){
return (
<div>
<button onClick={() => this.props.actions.removeAuthorization()}>Log out</button>
<button onClick={() => this.props.actions.authorizationRevoked()}>Log out</button>
{ this.renderMe() }
</div>
);

47
src/js/services/localstorage/middleware.js
View File

@ -6,7 +6,7 @@ const localstorageMiddleware = (function(){
**/
return store => next => action => {
console.log(action, store.getState())
console.log(action);//, store.getState())
// proceed as normal first
// this way, any reducers and middleware do their thing BEFORE we store our new state
@ -15,10 +15,14 @@ const localstorageMiddleware = (function(){
switch( action.type ){
case 'PUSHER_SET_CONFIG':
var pusher = {
username: action.config.username,
port: action.config.port
};
var pusher = JSON.parse( localStorage.getItem('pusher') );
if( !pusher ) pusher = {};
Object.assign(
pusher,{
username: action.config.username,
port: action.config.port
}
);
localStorage.setItem('pusher', JSON.stringify(pusher));
break;
@ -27,12 +31,20 @@ const localstorageMiddleware = (function(){
if( !pusher ) pusher = {};
Object.assign(
pusher,{
username: action.connection.username,
connectionid: action.connection.connectionid
}
);
localStorage.setItem('pusher', JSON.stringify(pusher));
break;
case 'PUSHER_CHANGE_USERNAME':
var pusher = JSON.parse( localStorage.getItem('pusher') );
if( !pusher ) pusher = {};
Object.assign( pusher,{ username: action.data.connection.username });
localStorage.setItem('pusher', JSON.stringify(pusher));
break;
case 'MOPIDY_SET_CONFIG':
var mopidy = {
host: action.config.host,
@ -63,6 +75,20 @@ const localstorageMiddleware = (function(){
localStorage.setItem('spotify', JSON.stringify(spotify));
break;
case 'SPOTIFY_AUTHORIZATION_REVOKED':
var spotify = JSON.parse( localStorage.getItem('spotify') );
if( !spotify ) spotify = {};
Object.assign(
spotify,{
authorized: false,
access_token: false,
refresh_token: false,
token_expiry: false
}
);
localStorage.setItem('spotify', JSON.stringify(spotify));
break;
case 'SPOTIFY_TOKEN_REFRESHED':
var spotify = JSON.parse( localStorage.getItem('spotify') );
if( !spotify ) spotify = {};
@ -74,6 +100,17 @@ const localstorageMiddleware = (function(){
);
localStorage.setItem('spotify', JSON.stringify(spotify));
break;
case 'SPOTIFY_ME_LOADED':
var spotify = JSON.parse( localStorage.getItem('spotify') );
if( !spotify ) spotify = {};
Object.assign(
spotify,{
me: action.data
}
);
localStorage.setItem('spotify', JSON.stringify(spotify));
break;
}
}

6
src/js/services/pusher/actions.js
View File

@ -10,11 +10,11 @@ export function setConfig( config ){
}
}
export function setUsername( username ){
export function changeUsername( username ){
return {
type: 'PUSHER_INSTRUCT',
action: 'set_username',
data: { username: username }
action: 'change_username',
data: username
}
}

3
src/js/services/pusher/middleware.js
View File

@ -45,7 +45,7 @@ const PusherMiddleware = (function(){
connectionid: helpers.generateGuid(),
username: Math.random().toString(36).substr(2, 9)
}
//if( state.pusher.username ) connection.username = state.pusher.username;
if( state.pusher.username ) connection.username = state.pusher.username;
socket = new WebSocket(
'ws://'+state.mopidy.host+':'+state.pusher.port+'/pusher',
@ -54,6 +54,7 @@ const PusherMiddleware = (function(){
socket.onopen = () => {
store.dispatch({ type: 'PUSHER_CONNECTED', connection: connection });
store.dispatch({ type: 'PUSHER_SET_USERNAME', username: connection.username });
};
socket.onmessage = (message) => {

11
src/js/services/pusher/reducer.js
View File

@ -3,17 +3,24 @@ export default function reducer(pusher = {}, action){
switch (action.type) {
case 'PUSHER_CONNECTED':
return Object.assign({}, pusher, { connected: true, connecting: false, connectionid: action.connection.connectionid });
return Object.assign({}, pusher, {
connected: true,
connecting: false,
connectionid: action.connection.connectionid,
username: action.connection.username
});
case 'PUSHER_DISCONNECTED':
return Object.assign({}, pusher, { connected: false, connecting: false });
case 'PUSHER_SET_CONFIG':
return Object.assign({}, pusher, {
username: action.username,
port: action.port
});
case 'PUSHER_CHANGE_USERNAME':
return Object.assign({}, pusher, { username: action.data.connection.username });
case 'PUSHER_CONNECTION_UPDATED':
function byID(connection){
return connection.connectionid == action.data.connections.connectionid;

4
src/js/services/spotify/actions.js
View File

@ -71,8 +71,8 @@ export function authorizationGranted( data ){
return { type: 'SPOTIFY_AUTHORIZATION_GRANTED', data: data }
}
export function removeAuthorization(){
return { type: 'SPOTIFY_REMOVE_AUTHORIZATION' }
export function authorizationRevoked(){
return { type: 'SPOTIFY_AUTHORIZATION_REVOKED' }
}

2
src/js/services/spotify/reducer.js
View File

@ -17,7 +17,7 @@ export default function reducer(spotify = {}, action){
token_expiry: action.data.token_expiry
});
case 'SPOTIFY_REMOVE_AUTHORIZATION':
case 'SPOTIFY_AUTHORIZATION_REVOKED':
return Object.assign({}, spotify, {
authorizing: false,
authorization: false,

29
src/js/views/Settings.js
View File

@ -30,20 +30,35 @@ class Settings extends React.Component{
resetAllSettings(){
localStorage.clear();
window.location.reload(true);
return false;
}
setMopidyConfig(){
setMopidyConfig(e){
e.preventDefault();
this.props.mopidyActions.setConfig({ host: this.state.mopidy_host, port: this.state.mopidy_port });
window.location.reload(true);
return false;
}
setPusherConfig(){
setPusherConfig(e){
e.preventDefault();
this.props.pusherActions.changeUsername( this.state.pusher_username );
this.props.pusherActions.setConfig({ port: this.state.pusher_port });
this.props.pusherActions.setUsername( this.state.pusher_username );
return false;
}
setSpotifyConfig(){
setSpotifyConfig(e){
e.preventDefault();
this.props.spotifyActions.setConfig({ country: this.state.spotify_country, locale: this.state.spotify_locale });
return false;
}
componentWillReceiveProps(newProps){
if( this.state.pusher_username != newProps.pusher.username ){
this.setState({
pusher_username: newProps.pusher.username
})
}
}
render(){
@ -57,7 +72,7 @@ class Settings extends React.Component{
<section>
<h3 className="underline">Mopidy</h3>
<form onSubmit={() => this.setMopidyConfig()}>
<form onSubmit={(e) => this.setMopidyConfig(e)}>
<label>
<div className="label">Host</div>
<div className="input">
@ -80,7 +95,7 @@ class Settings extends React.Component{
</form>
<h3 className="underline">Pusher</h3>
<form onSubmit={() => this.setPusherConfig()}>
<form onSubmit={(e) => this.setPusherConfig(e)}>
<label>
<div className="label">Username</div>
<div className="input">
@ -103,7 +118,7 @@ class Settings extends React.Component{
</form>
<h3 className="underline">Spotify</h3>
<form onSubmit={() => this.setSpotifyConfig()}>
<form onSubmit={(e) => this.setSpotifyConfig(e)}>
<label>
<div className="label">Country</div>
<div className="input">