uiux: revamp advanced settings panel

Closes #1623
This commit is contained in:
Pascal Precht 2021-01-14 15:12:37 +01:00 committed by Iuri Matias
parent 7102596b3f
commit 085f5901ac
3 changed files with 62 additions and 214 deletions

View File

@ -11,234 +11,80 @@ Item {
Layout.fillHeight: true
Layout.fillWidth: true
StyledText {
id: title
//% "Advanced settings"
text: qsTrId("advanced-settings")
anchors.left: parent.left
anchors.leftMargin: 24
Column {
id: generalColumn
spacing: Style.current.bigPadding
anchors.top: parent.top
anchors.topMargin: 24
font.weight: Font.Bold
font.pixelSize: 20
}
RowLayout {
id: communitiesTabSettings
anchors.top: title.bottom
anchors.topMargin: 20
anchors.topMargin: 46
anchors.left: parent.left
anchors.leftMargin: 24
anchors.leftMargin: contentMargin
anchors.right: parent.right
anchors.rightMargin: contentMargin
StyledText {
text: qsTr("Enable Communities")
}
StatusSwitch {
checked: appSettings.communitiesEnabled
onCheckedChanged: {
appSettings.communitiesEnabled = this.checked
}
}
StyledText {
text: qsTr("Currently WIP")
}
}
RowLayout {
id: walletTabSettings
anchors.top: communitiesTabSettings.bottom
anchors.topMargin: 20
anchors.left: parent.left
anchors.leftMargin: 24
StyledText {
//% "Wallet Tab"
text: qsTrId("wallet-tab")
}
StatusSwitch {
checked: appSettings.walletEnabled
onCheckedChanged: function(value) {
appSettings.walletEnabled = this.checked
}
}
StyledText {
//% "NOT RECOMMENDED - Use at your own risk"
text: qsTrId("not-recommended---use-at-your-own-risk")
}
}
RowLayout {
id: browserTabSettings
anchors.top: walletTabSettings.bottom
anchors.topMargin: 20
anchors.left: parent.left
anchors.leftMargin: 24
StyledText {
//% "Browser Tab"
text: qsTrId("browser-tab")
}
StatusSwitch {
checked: appSettings.browserEnabled
onCheckedChanged: function(value) {
appSettings.browserEnabled = this.checked
}
}
StyledText {
//% "experimental (web3 not supported yet)"
text: qsTrId("experimental-(web3-not-supported-yet)")
}
}
RowLayout {
id: nodeTabSettings
anchors.top: browserTabSettings.bottom
anchors.topMargin: 20
anchors.left: parent.left
anchors.leftMargin: 24
StyledText {
//% "Node Management Tab"
text: qsTrId("node-management-tab")
}
StatusSwitch {
checked: nodeBtn.enabled
onCheckedChanged: function(value) {
nodeBtn.enabled = this.checked
}
}
StyledText {
//% "under development"
text: qsTrId("under-development")
}
}
Item {
id: networkTabSettings
anchors.top: nodeTabSettings.bottom
anchors.topMargin: 20
anchors.left: parent.left
anchors.leftMargin: 24
width: parent.width - 20
height: networkText.height
StyledText {
id: networkText
text: qsTr("Network")
font.pixelSize: 15
}
StyledText {
text: utilsModel.getNetworkName()
font.pixelSize: 15
anchors.right: caret3.left
anchors.rightMargin: Style.current.padding
}
SVGImage {
id: caret3
anchors.right: parent.right
anchors.rightMargin: 0
anchors.verticalCenter: networkText.verticalCenter
source: "../../../img/caret.svg"
width: 13
height: 7
rotation: -90
}
ColorOverlay {
anchors.fill: caret3
source: caret2
color: Style.current.darkGrey
rotation: -90
}
NetworksModal {
id: networksModal
}
MouseArea {
anchors.fill: parent
StatusSectionMenuItem {
label: qsTr("Network")
info: utilsModel.getNetworkName()
onClicked: networksModal.open()
cursorShape: Qt.PointingHandCursor
}
}
Item {
id: fleetSetting
anchors.top: networkTabSettings.bottom
anchors.topMargin: 20
anchors.left: parent.left
anchors.leftMargin: 24
width: parent.width - 20
height: fleetText.height
StyledText {
id: fleetText
text: qsTr("Fleet")
font.pixelSize: 15
}
StyledText {
text: profileModel.fleets.fleet
font.pixelSize: 15
anchors.right: caret2.left
anchors.rightMargin: Style.current.padding
}
SVGImage {
id: caret2
anchors.right: parent.right
anchors.rightMargin: 0
anchors.verticalCenter: fleetText.verticalCenter
source: "../../../img/caret.svg"
width: 13
height: 7
rotation: -90
}
ColorOverlay {
anchors.fill: caret2
source: caret2
color: Style.current.darkGrey
rotation: -90
}
FleetsModal {
id: fleetModal
}
MouseArea {
anchors.fill: parent
StatusSectionMenuItem {
label: qsTr("Fleet")
info: profileModel.fleets.fleet
onClicked: fleetModal.open()
cursorShape: Qt.PointingHandCursor
}
}
RowLayout {
id: uiCatalog
anchors.top: fleetSetting.bottom
anchors.topMargin: 20
anchors.left: parent.left
anchors.leftMargin: 24
Component.onCompleted: {
uiComponentBtn.enabled = false
}
StyledText {
//% "UI Components"
text: qsTrId("ui-components")
Separator {}
StatusSectionHeadline {
text: qsTr("Experimental features")
}
StatusSwitch {
checked: uiComponentBtn.enabled
onCheckedChanged: function(value) {
uiComponentBtn.enabled = this.checked
StatusSettingsLineButton {
text: qsTr("Wallet")
isSwitch: true
switchChecked: appSettings.walletEnabled
onClicked: function (checked) {
appSettings.walletEnabled = checked
}
}
StyledText {
//% "Developer setting"
text: qsTrId("developer-setting")
StatusSettingsLineButton {
text: qsTr("Dapp Browser")
isSwitch: true
switchChecked: appSettings.browserEnabled
onClicked: function (checked) {
appSettings.browserEnabled = checked
}
}
StatusSettingsLineButton {
text: qsTr("Communities")
isSwitch: true
switchChecked: appSettings.communitiesEnabled
onClicked: function (checked) {
appSettings.communitiesEnabled = checked
}
}
StatusSettingsLineButton {
text: qsTr("Node Management")
isSwitch: true
switchChecked: appSettings.nodeManagementEnabled
onClicked: function (checked) {
appSettings.nodeManagementEnabled = checked
}
}
}
NetworksModal {
id: networksModal
}
FleetsModal {
id: fleetModal
}
}
/*##^##

View File

@ -262,7 +262,7 @@ RowLayout {
StatusIconTabButton {
id: nodeBtn
enabled: isExperimental === "1"
enabled: isExperimental === "1" && appSettings.nodeManagementEnabled
anchors.top: profileBtn.top
icon.name: "node"
}

View File

@ -95,6 +95,7 @@ ApplicationWindow {
id: defaultAppSettings
property bool communitiesEnabled: false
property bool walletEnabled: false
property bool nodeManagementEnabled: false
property bool browserEnabled: false
property bool displayChatImages: false
property bool timelineEnabled: true
@ -141,6 +142,7 @@ ApplicationWindow {
property var profileSplitView
property bool communitiesEnabled: defaultAppSettings.communitiesEnabled
property bool walletEnabled: defaultAppSettings.walletEnabled
property bool nodeManagementEnabled: defaultAppSettings.nodeManagementEnabled
property bool browserEnabled: defaultAppSettings.browserEnabled
property bool displayChatImages: defaultAppSettings.displayChatImages
property bool compactMode: defaultAppSettings.compactMode