tanner/Notica
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add connection error checking to notification page

Browse Source
This commit is contained in:
Tanner Collin 2016-12-23 22:50:07 -07:00
parent 33f081e804
commit 4efaf30165
1 changed files with 21 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/ui/NotifPage.js
View File

@ -7,17 +7,27 @@ export default class NotifPage extends React.Component {
super(props); super(props);
this.state = { this.state = {
haveperm: false haveperm: false,
connected: false
} }
} }
componentDidMount() { componentDidMount() {
this.connect();
}
connect() {
let socket = io.connect(); let socket = io.connect();
let room = this.props.urlid; let room = this.props.urlid;
socket.on('connect', () => { socket.on('connect', () => {
socket.emit('room', room); socket.emit('room', room);
this.setState({connected: true});
socket.on('disconnect', () => {
this.setState({connected: false});
});
}); });
socket.on('message', (data) => { socket.on('message', (data) => {
@ -56,8 +66,16 @@ export default class NotifPage extends React.Component {
Check Again Check Again
</a> </a>
</div>} </div>}
{ this.state.haveperm && supported && <p> { !this.state.connected && supported && <div className="error">
This page is now monitoring for notifications. <p>
Error: Unable to connect to the Notica server :(
</p>
<p>
Attempting to reconnect...
</p>
</div>}
{ this.state.haveperm && this.state.connected && supported && <p>
This page is monitoring for notifications.
</p>} </p>}
</div> </div>
</div> </div>