Initial setup not reflecting state; Adding service worker

This commit is contained in:
James Barnsley
2018-07-21 22:00:12 +12:00
parent fff37848d8
commit 618d03e42d
11 changed files with 124 additions and 76 deletions

View File

@ -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;

View File

@ -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)
};
};

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -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

View File

@ -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

0
src/js/service-worker.js Executable file
View File

View File

@ -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)
}
}

View File

@ -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">

View File

@ -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;