Add autoconnect

This commit is contained in:
Drew DeVault 2017-09-08 14:07:31 +09:00
parent 589150b817
commit a3e05119fa
3 changed files with 29 additions and 14 deletions

View File

@ -41,3 +41,7 @@ export function ws_init(uri, open, close) {
ws.addEventListener("message", ws_recv);
ws.addEventListener("close", close);
}
export function ws_disconnect() {
ws.close();
}

View File

@ -16,14 +16,18 @@ import { SOCKET_STATE } from '../actions/socket';
class ConnectionOverlay extends Component {
constructor() {
super();
this.state = {
uri: "ws://127.0.0.1:8412",
autoconnect: false,
connecting: false
};
// TODO: "connecting..." UI
// TODO: autoconnect
// TODO: gracefully handle dis/reconnections
const uri = localStorage.getItem("autoconnect");
this.state = { uri: uri || "ws://127.0.0.1:8412", autoconnect: !!uri };
if (uri) {
initialize(this.state.uri);
}
}
connect() {
if (this.state.autoconnect) {
localStorage.setItem("autoconnect", this.state.uri);
}
initialize(this.state.uri);
}
render() {
@ -72,7 +76,7 @@ class ConnectionOverlay extends Component {
</FormGroup>
<button
className="btn btn-primary"
onClick={() => initialize(this.state.uri)}
onClick={this.connect.bind(this)}
>{socket.reason ? "Reconnect" : "Connect"}</button>
</CardBlock>
</Card>

View File

@ -1,19 +1,26 @@
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { formatBitrate } from '../bitrate';
import { ws_disconnect } from '../socket';
function throttle(v) {
return v === null ? "Unlimited" : formatBitrate(v);
}
const throttle = _ => _ === null ? "Unlimited" : formatBitrate(_);
function Server({ server }) {
if (!server.id) {
// TODO: websocket status?
return null;
}
return (
<div>
<h3>Server</h3>
<h3>
Server
<button
className="btn btn-sm btn-outline-danger pull-right"
onClick={() => {
localStorage.removeItem("autoconnect");
ws_disconnect();
}}
>Disconnect</button>
</h3>
<dl>
<dt>Running since</dt>
{/* TODO: pretty print dates */}