remove ugly on/off buttons

4 files changed, 63 insertions, 59 deletions

diff --git a/gui/qml/VpnState.qml b/gui/qml/VpnState.qml
index 9ee4ed8..886868f 100644
--- a/gui/qml/VpnState.qml
+++ b/gui/qml/VpnState.qml
@@ -17,6 +17,10 @@ StateGroup {
                 icon.source: icons["off"]
             }
             PropertyChanges {
+                target: vpntoggle
+                checked: false
+            }
+            PropertyChanges {
                 target: statusItem
                 text: toHuman("off")
             }
@@ -28,14 +32,6 @@ StateGroup {
                 target: mainCurrentGateway
                 text: ""
             }
-            PropertyChanges {
-                target: mainOnBtn
-                visible: true
-            }
-            PropertyChanges {
-                target: mainOffBtn
-                visible: false
-            }
         },
         State {
             name: "on"
@@ -45,6 +41,10 @@ StateGroup {
                 icon.source: icons["on"]
             }
             PropertyChanges {
+                target: vpntoggle
+                checked: true
+            }
+            PropertyChanges {
                 target: statusItem
                 text: toHumanWithLocation("on")
             }
@@ -56,14 +56,6 @@ StateGroup {
                 target: mainCurrentGateway
                 text: qsTr("Connected to ") + ctx.currentLocation
             }
-            PropertyChanges {
-                target: mainOnBtn
-                visible: false
-            }
-            PropertyChanges {
-                target: mainOffBtn
-                visible: true
-            }
         },
         State {
             name: "starting"
@@ -84,14 +76,6 @@ StateGroup {
                 target: mainCurrentGateway
                 text: ""
             }
-            PropertyChanges {
-                target: mainOnBtn
-                visible: false
-            }
-            PropertyChanges {
-                target: mainOffBtn
-                visible: true
-            }
         },
         State {
             name: "stopping"
@@ -112,14 +96,6 @@ StateGroup {
                 target: mainCurrentGateway
                 text: ""
             }
-            PropertyChanges {
-                target: mainOnBtn
-                visible: true
-            }
-            PropertyChanges {
-                target: mainOffBtn
-                visible: false
-            }
         },
         State {
             name: "failed"
@@ -140,14 +116,6 @@ StateGroup {
                 target: mainCurrentGateway
                 text: ""
             }
-            PropertyChanges {
-                target: mainOnBtn
-                visible: true
-            }
-            PropertyChanges {
-                target: mainOffBtn
-                visible: false
-            }
         }
     ]
 }
diff --git a/gui/qml/main.qml b/gui/qml/main.qml
index bcd1031..a4352e7 100644
--- a/gui/qml/main.qml
+++ b/gui/qml/main.qml
@@ -2,7 +2,7 @@ import QtQuick 2.9
 import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.0
-import QtQuick.Controls 1.4
+import QtQuick.Controls 2.12
 
 import Qt.labs.platform 1.0
 
@@ -51,22 +51,59 @@ Window {
                     Layout.alignment: Text.AlignHCenter
                 }
 
-                Button {
-                    id: mainOnBtn
-                    x: 80
-                    y: 200
-                    text: qsTr("on")
-                    visible: true
-                    onClicked: backend.switchOn()
-                }
+                SwitchDelegate {
+
+                    id: vpntoggle
+
+                    text: qsTr("")
+                    checked: false
+
+                    Connections {
+                        onCheckedChanged: {
+                            if (vpntoggle.checked == true && ctx.status == "off") {
+                                backend.switchOn()
+                            }
+                            if (vpntoggle.checked === false && ctx.status == "on") {
+                                backend.switchOff()
+                            }
+                        }
+                    }
 
-                Button {
-                    id: mainOffBtn
-                    x: 180
-                    y: 200
-                    text: qsTr("off")
-                    visible: false
-                    onClicked: backend.switchOff()
+                    contentItem: Text {
+                        rightPadding: vpntoggle.indicator.width + control.spacing
+                        text: vpntoggle.text
+                        font: vpntoggle.font
+                        opacity: enabled ? 1.0 : 0.3
+                        color: vpntoggle.down ? "#17a81a" : "#21be2b"
+                        elide: Text.ElideRight
+                        verticalAlignment: Text.AlignVCenter
+                    }
+
+                    indicator: Rectangle {
+                        implicitWidth: 48
+                        implicitHeight: 26
+                        x: vpntoggle.width - width - vpntoggle.rightPadding
+                        y: parent.height / 2 - height / 2
+                        radius: 13
+                        color: vpntoggle.checked ? "#17a81a" : "transparent"
+                        border.color: vpntoggle.checked ? "#17a81a" : "#cccccc"
+
+                        Rectangle {
+                            x: vpntoggle.checked ? parent.width - width : 0
+                            width: 26
+                            height: 26
+                            radius: 13
+                            color: vpntoggle.down ? "#cccccc" : "#ffffff"
+                            border.color: vpntoggle.checked ? (vpntoggle.down ? "#17a81a" : "#21be2b") : "#999999"
+                        }
+                    }
+
+                    background: Rectangle {
+                        implicitWidth: 100
+                        implicitHeight: 40
+                        visible: vpntoggle.down || vpntoggle.highlighted
+                        color: vpntoggle.down ? "#bdbebf" : "#eeeeee"
+                    }
                 }
 
                 ComboBox {
diff --git a/pkg/vpn/bonafide/auth_sip.go b/pkg/vpn/bonafide/auth_sip.go
index cc9d967..f44954e 100644
--- a/pkg/vpn/bonafide/auth_sip.go
+++ b/pkg/vpn/bonafide/auth_sip.go
@@ -52,9 +52,8 @@ func (a *sipAuthentication) getToken(user, password string) ([]byte, error) {
 		log.Println("ERROR: failed auth request", err)
 		if os.IsTimeout(err) {
 			return nil, fmt.Errorf("TokenErrTimeout")
-		} else {
-			return nil, fmt.Errorf("TokenErrBadPost")
 		}
+		return nil, fmt.Errorf("TokenErrBadPost")
 	}
 	defer resp.Body.Close()
 	if resp.StatusCode != 200 {
diff --git a/pkg/vpn/bonafide/bonafide.go b/pkg/vpn/bonafide/bonafide.go
index 9dadc99..321b47f 100644
--- a/pkg/vpn/bonafide/bonafide.go
+++ b/pkg/vpn/bonafide/bonafide.go
@@ -141,7 +141,7 @@ func (b *Bonafide) GetPemCertificate() ([]byte, error) {
 		/* try cached token */
 		token, err := b.auth.getToken("", "")
 		if err != nil {
-			return nil, errors.New("BUG: This service needs login, but we were not logged in.")
+			return nil, errors.New("bug: this service needs login, but we were not logged in")
 		}
 		b.token = token
 	}