From 9a4a2576de301759500f4c7b9498a452fb3829a0 Mon Sep 17 00:00:00 2001 From: elijah Date: Wed, 15 Mar 2017 11:51:02 +0100 Subject: [feat] minimal vpn ui --- ui/app/components/main_panel/vpn_section.js | 90 +++++++++++++++++++++++++++-- 1 file changed, 86 insertions(+), 4 deletions(-) (limited to 'ui/app/components') diff --git a/ui/app/components/main_panel/vpn_section.js b/ui/app/components/main_panel/vpn_section.js index ece8d496..400d2133 100644 --- a/ui/app/components/main_panel/vpn_section.js +++ b/ui/app/components/main_panel/vpn_section.js @@ -16,7 +16,7 @@ export default class VPNSection extends React.Component { this.state = { error: null, expanded: false, - vpn: "down", + vpn: "waiting", } this.expand = this.expand.bind(this) this.connect = this.connect.bind(this) @@ -26,16 +26,72 @@ export default class VPNSection extends React.Component { this.location = this.location.bind(this) } + componentWillMount() { + bitmask.vpn.status().then( + status => { + console.log("status: ", status) + if (status.VPN == "OFF") { + this.setState({vpn: "down"}) + } else if (status.VPN == "ON") { + if (status.domain == this.props.account.domain) { + this.setState({vpn: "up"}) + } else { + this.setState({vpn: "down"}) + } + } else { + // this.setState({vpn: "????"}) + } + }, + error => { + this.setState({vpn: "failed", error: error}) + } + ) + } + expand() { this.setState({expanded: !this.state.expanded}) } + // turn on button pressed connect() { - this.setState({vpn: "up"}) + this.setState({vpn: "connecting", error: null}) + bitmask.vpn.check(this.props.account.domain).then( + status => { + console.log('check: ', status) + if (status.vpn_ready == true) { + this.startVPN() + } else if (status.vpn == "disabled") { + this.setState({vpn: "failed", error: "VPN support disabled"}) + } else { + bitmask.vpn.get_cert(this.props.account.id).then( + uid => { + this.startVPN() + }, + error => { + this.setState({vpn: "failed", error: error}) + } + ) + } + }, + error => { + this.setState({vpn: "failed", error: error}) + } + ) } + // turn off button pressed disconnect() { - this.setState({vpn: "down"}) + this.setState({vpn: "disconnecting", error: null}) + bitmask.vpn.stop().then( + success => { + console.log('stop:') + console.log(success) + this.setState({vpn: "down"}) + }, + error => { + this.setState({vpn: "failed", error: error}) + } + ) } cancel() { @@ -50,7 +106,25 @@ export default class VPNSection extends React.Component { } + // call startVPN() only when everything is ready + startVPN() { + bitmask.vpn.start(this.props.account.domain).then( + status => { + console.log('start: ', status) + if (status.result == "started") { + this.setState({vpn: "up", error: null}) + } else { + this.setState({vpn: "failed"}) + } + }, + error => { + this.setState({vpn: "failed", error: error}) + } + ) + } + render () { + console.log(this.state) let message = null let body = null let button = null @@ -87,10 +161,18 @@ export default class VPNSection extends React.Component { case "failed": button =
-
+ // icon = "off" break + case "disabled": + button =
Disabled
+ icon = "disabled" + break + case "waiting": + button = + icon = "wait" + break } return ( -- cgit v1.2.3