From 82b13707f9d904f083320ef58ac8435b96a33430 Mon Sep 17 00:00:00 2001
From: James Barnsley <james@barnsley.nz>
Date: Tue, 18 Oct 2016 08:56:53 +1300
Subject: [PATCH] Not storing everything in localstorage

---
 src/js/bootstrap.js                        | 16 +++++++++++----
 src/js/services/localstorage/middleware.js |  2 +-
 src/js/services/mopidy/actions.js          |  8 ++++++++
 src/js/services/mopidy/middleware.js       | 12 +++++++----
 src/js/services/mopidy/reducer.js          |  6 ++++++
 src/js/services/spotify/middleware.js      |  5 +++++
 src/js/views/Settings.js                   | 23 ++++++++++++++++++++++
 7 files changed, 63 insertions(+), 9 deletions(-)

diff --git a/src/js/bootstrap.js b/src/js/bootstrap.js
index da589852..d4cc7f96 100755
--- a/src/js/bootstrap.js
+++ b/src/js/bootstrap.js
@@ -16,10 +16,18 @@ let reducers = combineReducers({
     spotify
 });
 
-// load our state from localStorage
-var initialState = {};
-if( localStorage.getItem('state') ){
-	initialState = JSON.parse( localStorage.getItem('state') );
+// set application defaults
+var initialState = {
+	mopidy: {
+		host: window.location.hostname,
+		port: 6680
+	}
+};
+
+// if we've got a stored version of mopidy state, load and merge
+if( localStorage.getItem('mopidy') ){
+	var storedMopidy = JSON.parse( localStorage.getItem('mopidy') );
+	Object.assign(initialState, { mopidy: storedMopidy } );
 }
 
 let store = createStore(
diff --git a/src/js/services/localstorage/middleware.js b/src/js/services/localstorage/middleware.js
index cfcaa2dc..06544156 100755
--- a/src/js/services/localstorage/middleware.js
+++ b/src/js/services/localstorage/middleware.js
@@ -12,7 +12,7 @@ const localstorageMiddleware = (function(){
 
         // get the state, and plug it in to our localStorage
         var state = store.getState();
-        localStorage.setItem('state', JSON.stringify(state));
+        //localStorage.setItem('state', JSON.stringify(state));
     }
 
 })();
diff --git a/src/js/services/mopidy/actions.js b/src/js/services/mopidy/actions.js
index b00a8b65..91766e58 100755
--- a/src/js/services/mopidy/actions.js
+++ b/src/js/services/mopidy/actions.js
@@ -15,6 +15,14 @@ export function disconnect(){
 	}
 }
 
+export function setConfig( host, port ){
+	return {
+		type: 'MOPIDY_SET_CONFIG',
+		host: host,
+		port: port
+	}
+}
+
 export function changeTrack( tlid ){
 	return {
 		type: 'MOPIDY_CHANGE_TRACK',
diff --git a/src/js/services/mopidy/middleware.js b/src/js/services/mopidy/middleware.js
index 54b590f2..5bd9bcfa 100755
--- a/src/js/services/mopidy/middleware.js
+++ b/src/js/services/mopidy/middleware.js
@@ -104,11 +104,10 @@ const MopidyMiddleware = (function(){
                 if(socket != null) socket.close();
                 store.dispatch({ type: 'MOPIDY_CONNECTING' });
 
-                var domain = "tv.barnsley.nz";
-                if( window.location.hostname == 'iris.james' ) domain = 'music.james';
-                
+                var state = store.getState();
+
                 socket = new Mopidy({
-                    webSocketUrl: 'ws://'+domain+':6680/mopidy/ws',
+                    webSocketUrl: 'ws://'+state.mopidy.host+':'+state.mopidy.port+'/mopidy/ws',
                     callingConvention: 'by-position-or-by-name'
                 });
 
@@ -129,6 +128,11 @@ const MopidyMiddleware = (function(){
                 instruct( socket, store, action.call, action.value )
                 break;
 
+            case 'MOPIDY_SET_CONFIG':
+                next(action);
+                localStorage.setItem('mopidy', JSON.stringify({ host: action.host, port: action.port }));
+                break;
+
             // This action is irrelevant to us, pass it on to the next middleware
             default:
                 return next(action);
diff --git a/src/js/services/mopidy/reducer.js b/src/js/services/mopidy/reducer.js
index beafffc9..dafd0280 100755
--- a/src/js/services/mopidy/reducer.js
+++ b/src/js/services/mopidy/reducer.js
@@ -11,6 +11,12 @@ export default function reducer(mopidy = {}, action){
         case 'MOPIDY_DISCONNECTED':
             return Object.assign({}, mopidy, { connected: false, connecting: false });
 
+        case 'MOPIDY_SET_CONFIG':
+            return Object.assign({}, mopidy, {
+                host: action.host, 
+                port: action.port
+            });
+
         case 'MOPIDY_CHANGE_TRACK':
             return Object.assign({}, mopidy, {
             	tlid: action.tlid	
diff --git a/src/js/services/spotify/middleware.js b/src/js/services/spotify/middleware.js
index a3a25fa2..d6d23ea4 100755
--- a/src/js/services/spotify/middleware.js
+++ b/src/js/services/spotify/middleware.js
@@ -80,6 +80,11 @@ const SpotifyMiddleware = (function(){
                 console.log('Spotify wants to DISconnect')
                 break;
 
+            case 'SPOTIFY_COMPLETE_AUTHORIZATION':
+                next(action);
+                localStorage.setItem('spotify', JSON.stringify({ access_token: action.data.access_token, refresh_token: action.data.refresh_token }));
+                break;
+
             // This action is irrelevant to us, pass it on to the next middleware
             default:
                 return next(action);
diff --git a/src/js/views/Settings.js b/src/js/views/Settings.js
index fb0a34e5..4cb17766 100755
--- a/src/js/views/Settings.js
+++ b/src/js/views/Settings.js
@@ -14,6 +14,11 @@ class Settings extends React.Component{
 
 	constructor(props) {
 		super(props);
+
+		this.state = {
+			mopidy_host: this.props.mopidy.host,
+			mopidy_port: this.props.mopidy.port
+		};
 	}
 
 	resetAllSettings(){
@@ -21,10 +26,28 @@ class Settings extends React.Component{
 		window.location.reload(true);
 	}
 
+	setConfig(){
+		this.props.mopidyActions.setConfig( this.state.mopidy_host, this.state.mopidy_port );
+		window.location.reload(true);
+	}
+
 	render(){
 		return (
 			<div>
 				<h3>Settings</h3>
+				<h4>Mopidy</h4>
+				<form onSubmit={() => this.setConfig()}>
+					<label>
+						<span className="label">Host</span>
+						<input onChange={ e => this.setState({ mopidy_host: e.target.value })} value={ this.state.mopidy_host } />
+					</label>
+					<label>
+						<span className="label">Port</span>
+						<input onChange={ e => this.setState({ mopidy_port: e.target.value })} value={ this.state.mopidy_port } />
+					</label>
+					<button type="submit">Apply</button>
+				</form>
+				<h4>Spotify</h4>
 		        <SpotifyAuthenticationFrame />
 		        <ConfirmationButton content="Reset all settings" confirmingContent="Are you sure?" onConfirm={() => this.resetAllSettings()} />
 			</div>