summaryrefslogtreecommitdiff
path: root/gui
diff options
context:
space:
mode:
Diffstat (limited to 'gui')
-rw-r--r--gui/qml/VpnState.qml48
-rw-r--r--gui/qml/main.qml69
2 files changed, 61 insertions, 56 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 {