Initial setup not reflecting state; Adding service worker

mopidy_iris/static/app.css

@@ -5564,6 +5564,20 @@ main header {
       background: #f16f19; }
     .notifications .notification--bad {
       background: #cf2d2d; }
+    .notifications .notification--shortcut {
+      position: fixed;
+      top: 50vh;
+      left: 50vw;
+      height: 400px;
+      width: 400px;
+      margin: -200px 0 0 -200px;
+      background: rgba(0, 0, 0, 0.88);
+      color: #FFFFFF;
+      border-radius: 10px;
+      text-align: center; }
+      .notifications .notification--shortcut .icon {
+        font-size: 140px;
+        line-height: 400px; }
     .notifications .notification--process {
       position: relative;
       padding-right: 18px;
@@ -5610,20 +5624,6 @@ main header {
   100% {
     opacity: 0;
     transform: translateY(5px); } }
-  .notifications .shortcut-notification {
-    position: fixed;
-    top: 50vh;
-    left: 50vw;
-    height: 400px;
-    width: 400px;
-    margin: -200px 0 0 -200px;
-    background: rgba(0, 0, 0, 0.88);
-    color: #FFFFFF;
-    border-radius: 10px;
-    text-align: center; }
-    .notifications .shortcut-notification .icon {
-      font-size: 140px;
-      line-height: 400px; }
   .notifications .loading {
     animation-name: pulse;
     animation-duration: 0.1s;

mopidy_iris/static/app.js

@@ -18472,7 +18472,7 @@ var Modal = function (_React$Component) {
 				_react2.default.createElement(
 					'div',
 					{ className: 'controls' },
-					_react2.default.createElement(
+					this.props.noclose ? null : _react2.default.createElement(
 						'div',
 						{ className: 'control close', onClick: function onClick(e) {
 								return window.history.back();
@@ -77286,6 +77286,14 @@ var _actions2 = __webpack_require__(3);
 
 var uiActions = _interopRequireWildcard(_actions2);
 
+var _actions3 = __webpack_require__(16);
+
+var pusherActions = _interopRequireWildcard(_actions3);
+
+var _actions4 = __webpack_require__(9);
+
+var mopidyActions = _interopRequireWildcard(_actions4);
+
 var _helpers = __webpack_require__(1);
 
 var helpers = _interopRequireWildcard(_helpers);
@@ -77309,7 +77317,7 @@ var InitialSetup = function (_React$Component) {
 		var _this = _possibleConstructorReturn(this, (InitialSetup.__proto__ || Object.getPrototypeOf(InitialSetup)).call(this, props));
 
 		_this.state = {
-			username: 'Anonymous',
+			username: _this.props.username ? _this.props.username : 'Anonymous',
 			allow_reporting: _this.props.allow_reporting,
 			host: _this.props.host,
 			port: _this.props.port,
@@ -77344,7 +77352,7 @@ var InitialSetup = function (_React$Component) {
 
 			this.setState({ saving: true });
 
-			// Wait a second to allow changes to apply to store
+			// Wait a jiffy to allow changes to apply to store
 			setTimeout(function () {
 
 				// We've changed a connection setting, so need to reload
@@ -77354,9 +77362,9 @@ var InitialSetup = function (_React$Component) {
 
 					// Safe to just close modal
 				} else {
-					window.history.back();
+					_reactRouter.hashHistory.push(global.baseURL);
 				}
-			}, 1000);
+			}, 200);
 
 			return false;
 		}
@@ -77367,7 +77375,7 @@ var InitialSetup = function (_React$Component) {
 
 			return _react2.default.createElement(
 				_Modal2.default,
-				{ className: 'modal--initial-setup' },
+				{ className: 'modal--initial-setup', noclose: true },
 				_react2.default.createElement(
 					'h1',
 					null,
@@ -77530,7 +77538,8 @@ var InitialSetup = function (_React$Component) {
 
 var mapStateToProps = function mapStateToProps(state, ownProps) {
 	return {
-		allow_reporting: state.core.allow_reporting,
+		allow_reporting: state.ui.allow_reporting,
+		username: state.pusher.username,
 		host: state.mopidy.host,
 		port: state.mopidy.port,
 		ssl: state.mopidy.ssl
@@ -77540,7 +77549,9 @@ var mapStateToProps = function mapStateToProps(state, ownProps) {
 var mapDispatchToProps = function mapDispatchToProps(dispatch) {
 	return {
 		coreActions: (0, _redux.bindActionCreators)(coreActions, dispatch),
-		uiActions: (0, _redux.bindActionCreators)(uiActions, dispatch)
+		uiActions: (0, _redux.bindActionCreators)(uiActions, dispatch),
+		pusherActions: (0, _redux.bindActionCreators)(pusherActions, dispatch),
+		mopidyActions: (0, _redux.bindActionCreators)(mopidyActions, dispatch)
 	};
 };
 

mopidy_iris/static/index.html

@@ -70,11 +70,27 @@
 
 </body>
 
+<script type="text/javascript">
+/*
+	// Check for browser support of service worker
+	if ('serviceWorker' in navigator){
+		navigator.serviceWorker.register('service-worker.js')
+			.then(function(registration) {
+				// Successful registration
+				console.log('Hooray. Registration successful, scope is:', registration.scope);
+			}).catch(function(err) {
+				// Failed registration, service worker won’t be installed
+				console.log('Whoops. Service worker registration failed, error:', error);
+			});
+	}*/
+
+</script>
+
 <script type="text/javascript">
 
 	// Release details
 	// These are automatically injected to built HTML
-	var build = "1532149028";
+	var build = "1532167036";
 	var version = "3.22.0";
 
 	// Construct the script tag

src/index.html

@@ -70,6 +70,22 @@
 
 </body>
 
+<script type="text/javascript">
+/*
+	// Check for browser support of service worker
+	if ('serviceWorker' in navigator){
+		navigator.serviceWorker.register('service-worker.js')
+			.then(function(registration) {
+				// Successful registration
+				console.log('Hooray. Registration successful, scope is:', registration.scope);
+			}).catch(function(err) {
+				// Failed registration, service worker won’t be installed
+				console.log('Whoops. Service worker registration failed, error:', error);
+			});
+	}*/
+
+</script>
+
 <script type="text/javascript">
 
 	// Release details

src/js/views/modals/InitialSetup.js

@@ -2,7 +2,7 @@
 import React, { PropTypes } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
-import { Link } from 'react-router';
+import { Link, hashHistory } from 'react-router';
 import ReactGA from 'react-ga';
 
 import Modal from './Modal';
@@ -12,6 +12,8 @@ import LastfmAuthenticationFrame from '../../components/Fields/LastfmAuthenticat
 
 import * as coreActions from '../../services/core/actions';
 import * as uiActions from '../../services/ui/actions';
+import * as pusherActions from '../../services/pusher/actions';
+import * as mopidyActions from '../../services/mopidy/actions';
 import * as helpers from '../../helpers';
 
 class InitialSetup extends React.Component{
@@ -19,7 +21,7 @@ class InitialSetup extends React.Component{
 		super(props);
 
 		this.state = {
-			username: 'Anonymous',
+			username: (this.props.username ? this.props.username : 'Anonymous'),
 			allow_reporting: this.props.allow_reporting,
 			host: this.props.host,
 			port: this.props.port,
@@ -50,7 +52,7 @@ class InitialSetup extends React.Component{
 
 		this.setState({saving: true});
 
-		// Wait a second to allow changes to apply to store
+		// Wait a jiffy to allow changes to apply to store
 		setTimeout(function(){
 
 			// We've changed a connection setting, so need to reload
@@ -60,16 +62,16 @@ class InitialSetup extends React.Component{
 
 			// Safe to just close modal
 			} else {
-				window.history.back();
+				hashHistory.push(global.baseURL);
 			}
-		}, 1000);
+		}, 200);
 
 		return false;
 	}
 
 	render(){
 		return (
-			<Modal className="modal--initial-setup">
+			<Modal className="modal--initial-setup" noclose>
 				<h1>Get started</h1>
 				<form onSubmit={(e) => this.handleSubmit(e)}>
 
@@ -152,7 +154,8 @@ class InitialSetup extends React.Component{
 
 const mapStateToProps = (state, ownProps) => {
 	return {
-		allow_reporting: state.core.allow_reporting,
+		allow_reporting: state.ui.allow_reporting,
+		username: state.pusher.username,
 		host: state.mopidy.host,
 		port: state.mopidy.port,
 		ssl: state.mopidy.ssl
@@ -162,7 +165,9 @@ const mapStateToProps = (state, ownProps) => {
 const mapDispatchToProps = (dispatch) => {
 	return {
 		coreActions: bindActionCreators(coreActions, dispatch),
-		uiActions: bindActionCreators(uiActions, dispatch)
+		uiActions: bindActionCreators(uiActions, dispatch),
+		pusherActions: bindActionCreators(pusherActions, dispatch),
+		mopidyActions: bindActionCreators(mopidyActions, dispatch)
 	}
 }
 

src/js/views/modals/Modal.js

@@ -40,9 +40,9 @@ class Modal extends React.Component{
 			<div className={className}>
 
 				<div className="controls">
-					<div className="control close" onClick={e => window.history.back()}>
+					{this.props.noclose ? null : <div className="control close" onClick={e => window.history.back()}>
 						<Icon name="close" className="white" />
-					</div>
+					</div> }
 				</div>
 
 				<div className="content">

src/scss/components/_notifications.scss

@@ -74,6 +74,24 @@
 			background: $red;
 		}
 
+		&--shortcut {
+			position: fixed;
+			top: 50vh;
+			left: 50vw;
+			height: 400px;
+			width: 400px;
+			margin: -200px 0 0 -200px;
+			background: $overlay_dark;
+			color: $white;
+			border-radius: 10px;
+			text-align: center;
+
+			.icon {
+				font-size: 140px;
+				line-height: 400px;
+			}
+		}
+
 		&--process {
 			position: relative;
 			padding-right: 18px;
@@ -127,24 +145,6 @@
 		}
 	}
 
-	.shortcut-notification {
-		position: fixed;
-		top: 50vh;
-		left: 50vw;
-		height: 400px;
-		width: 400px;
-		margin: -200px 0 0 -200px;
-		background: $overlay_dark;
-		color: $white;
-		border-radius: 10px;
-		text-align: center;
-
-		.icon {
-			font-size: 140px;
-			line-height: 400px;
-		}
-	}
-
 	.loading {
 		@include pulse(0.1s);
 		position: fixed;