Only connect to snapcast when enabled; App placeholder

src/js/App.js

@@ -93,7 +93,8 @@ class App extends React.Component{
 			}
 
 			// Scroll to bottom, only if we've PUSHed to a new route
-			if (nextProps.location.action == 'PUSH'){
+			// We also prevent scroll reset for any sub_view routes (like tabs, services, etc)
+			if (nextProps.location.action == 'PUSH' && nextProps.params.sub_view === undefined){
 				window.scrollTo(0, 0);
 			}
 		}

src/js/components/Snapcast.js

@@ -32,11 +32,7 @@ class Snapcast extends React.Component{
 	componentWillReceiveProps(newProps){
 
 		// Just connected
-		if (!this.props.pusher_connected && newProps.pusher_connected){
-			this.props.pusherActions.getSnapcast();
-
-		// Just enabled (well, identified as being enabled)
-		} else if (!this.props.pusher_enabled && newProps.pusher_enabled && newProps.pusher_connected){
+		if (newProps.snapcast_enabled && !this.props.pusher_connected && newProps.pusher_connected){
 			this.props.pusherActions.getSnapcast();
 		}
 	}
@@ -47,8 +43,20 @@ class Snapcast extends React.Component{
 	}
 
 	render(){
+		if (!this.props.snapcast_enabled){
+			return (
+				<div>
+					To enable Snapcast, edit your <code>mopidy.conf</code> file
+				</div>
+			)
+		}
+
 		if (!this.props.snapcast_clients || !this.props.snapcast_groups){
-			return null;
+			return (
+				<div className="lazy-loader body-loader loading">
+					<div className="loader"></div>
+				</div>
+			)
 		}
 
 		// Construct a simple array of our groups index

src/js/index.js

@@ -62,7 +62,7 @@ ReactDOM.render(
 				<Route path="queue" component={Queue} />
 				<Route path="queue/history" component={QueueHistory} />
 				<Route path="settings/debug" component={Debug} />
-				<Route path="settings(/service/:service)" component={Settings} />
+				<Route path="settings(/service/:sub_view)" component={Settings} />
 				
 				<Route path="search(/:query)" component={Search} />
 				<Route path="album/:uri" component={Album} />

src/js/views/Settings.js

@@ -225,7 +225,7 @@ class Settings extends React.Component {
 					</form>
 
 					<h4 className="underline">Services</h4>
-					<Services active={this.props.params.service} />
+					<Services active={this.props.params.sub_view} />
 
 					<h4 className="underline">Advanced</h4>