diff --git a/client/resources.qrc b/client/resources.qrc
index f95ef585..f14c28ae 100644
--- a/client/resources.qrc
+++ b/client/resources.qrc
@@ -185,8 +185,10 @@
ui/qml/Controls2/BodyTextType.qml
ui/qml/Controls2/FlickableType.qml
ui/qml/Controls2/Header2TextType.qml
- ui/qml/Pages2/PageCredentials.qml
+ ui/qml/Pages2/PageSetupWizardCredentials.qml
ui/qml/Controls2/HeaderTextType.qml
images/controls/arrow-left.svg
+ ui/qml/Pages2/PageSetupWizardProtocols.qml
+ ui/qml/Pages2/PageSetupWizardEasy.qml
diff --git a/client/ui/pages.h b/client/ui/pages.h
index c33289bb..4aba79f2 100644
--- a/client/ui/pages.h
+++ b/client/ui/pages.h
@@ -24,7 +24,9 @@ enum class Page {Start = 0, NewServer, NewServerProtocols, Vpn,
Wizard, WizardLow, WizardMedium, WizardHigh, WizardVpnMode, ServerConfiguringProgress,
GeneralSettings, AppSettings, NetworkSettings, ServerSettings,
ServerContainers, ServersList, ShareConnection, Sites,
- ProtocolSettings, ProtocolShare, QrDecoder, QrDecoderIos, About, ViewConfig, AdvancedServerSettings, Test, Credentials};
+ ProtocolSettings, ProtocolShare, QrDecoder, QrDecoderIos, About, ViewConfig, AdvancedServerSettings,
+
+ Test, WizardCredentials, WizardProtocols, WizardEasySetup};
Q_ENUM_NS(Page)
static void declareQmlPageEnum() {
diff --git a/client/ui/qml/Controls2/CardType.qml b/client/ui/qml/Controls2/CardType.qml
index 31b51f31..fa7ee514 100644
--- a/client/ui/qml/Controls2/CardType.qml
+++ b/client/ui/qml/Controls2/CardType.qml
@@ -9,16 +9,17 @@ RadioButton {
property string bodyText
property string footerText
- property string hoveredColor: Qt.rgba(255, 255, 255, 0.05)
- property string defaultColor: Qt.rgba(255, 255, 255, 0)
- property string disabledColor: Qt.rgba(255, 255, 255, 0)
- property string pressedColor: Qt.rgba(255, 255, 255, 0.05)
+ property string hoveredColor: Qt.rgba(1, 1, 1, 0.05)
+ property string defaultColor: Qt.rgba(1, 1, 1, 0)
+ property string disabledColor: Qt.rgba(1, 1, 1, 0)
+ property string pressedColor: Qt.rgba(1, 1, 1, 0.05)
+ property string selectedColor: Qt.rgba(1, 1, 1, 0)
property string textColor: "#0E0E11"
- property string pressedBorderColor: Qt.rgba(251, 178, 106, 0.3)
- property string hoveredBorderColor: "transparent"
- property string defaultBodredColor: "#FBB26A"
+ property string pressedBorderColor: Qt.rgba(251/255, 178/255, 106/255, 0.3)
+ property string selectedBorderColor: "#FBB26A"
+ property string defaultBodredColor: "transparent"
property int borderWidth: 0
implicitWidth: content.implicitWidth
@@ -32,30 +33,34 @@ RadioButton {
color: {
if (root.enabled) {
- if(root.checked) {
- return pressedColor
+ if (root.hovered) {
+ return hoveredColor
+ } else if (root.checked) {
+ return selectedColor
}
- return hovered ? hoveredColor : defaultColor
+ return defaultColor
} else {
return disabledColor
}
}
+
border.color: {
if (root.enabled) {
- if(root.checked) {
+ if (root.pressed) {
return pressedBorderColor
+ } else if (root.checked) {
+ return selectedBorderColor
}
- return hovered ? hoveredBorderColor : defaultBodredColor
- } else {
- return defaultBodredColor
}
+ return defaultBodredColor
}
+
border.width: {
if (root.enabled) {
if(root.checked) {
return 1
}
- return hovered ? 0 : 1
+ return root.pressed ? 1 : 0
} else {
return 0
}
@@ -64,6 +69,9 @@ RadioButton {
Behavior on color {
PropertyAnimation { duration: 200 }
}
+ Behavior on border.color {
+ PropertyAnimation { duration: 200 }
+ }
}
ColumnLayout {
diff --git a/client/ui/qml/Controls2/CheckBoxType.qml b/client/ui/qml/Controls2/CheckBoxType.qml
index c547a8e4..a432f7b8 100644
--- a/client/ui/qml/Controls2/CheckBoxType.qml
+++ b/client/ui/qml/Controls2/CheckBoxType.qml
@@ -6,9 +6,9 @@ import Qt5Compat.GraphicalEffects
Item {
id: root
- property string hoveredColor: Qt.rgba(255, 255, 255, 0.05)
+ property string hoveredColor: Qt.rgba(1, 1, 1, 0.05)
property string defaultColor: "transparent"
- property string pressedColor: Qt.rgba(255, 255, 255, 0.05)
+ property string pressedColor: Qt.rgba(1, 1, 1, 0.05)
property string defaultBorderColor: "#D7D8DB"
property string checkedBorderColor: "#FBB26A"
diff --git a/client/ui/qml/Controls2/HeaderTextType.qml b/client/ui/qml/Controls2/HeaderTextType.qml
index 60fa4e95..b60ccce4 100644
--- a/client/ui/qml/Controls2/HeaderTextType.qml
+++ b/client/ui/qml/Controls2/HeaderTextType.qml
@@ -1,40 +1,64 @@
import QtQuick
import QtQuick.Layouts
-ColumnLayout {
+Item {
id: root
property string buttonImage
property string headerText
- property var wrapMode
+ property string descriptionText
- ImageButtonType {
- id: button
+ implicitWidth: content.implicitWidth
+ implicitHeight: content.implicitHeight
- Layout.leftMargin: -6
+ ColumnLayout {
+ id: content
+ anchors.fill: parent
- hoverEnabled: false
- image: root.buttonImage
- onClicked: {
- if (onClickedFunc && typeof onClickedFunc === "function") {
- onClickedFunc()
+ ImageButtonType {
+ id: backButton
+
+ Layout.leftMargin: -6
+
+ image: root.buttonImage
+ imageColor: "#D7D8DB"
+ onClicked: {
+ UiLogic.closePage()
}
}
- }
- Text {
- id: header
+ Text {
+ id: header
- text: root.headerText
+ text: root.headerText
- color: "#D7D8DB"
- font.pixelSize: 36
- font.weight: 700
- font.family: "PT Root UI VF"
- font.letterSpacing: -0.03
+ color: "#D7D8DB"
+ font.pixelSize: 36
+ font.weight: 700
+ font.family: "PT Root UI VF"
+ font.letterSpacing: -0.03
- wrapMode: Text.WordWrap
+ wrapMode: Text.WordWrap
- height: 38
+ height: 38
+ Layout.fillWidth: true
+ }
+
+ Text {
+ id: description
+
+ text: root.descriptionText
+
+ color: "#878B91"
+ font.pixelSize: 16
+ font.weight: 400
+ font.family: "PT Root UI VF"
+ font.letterSpacing: -0.03
+
+ wrapMode: Text.WordWrap
+
+ height: 24
+ Layout.fillWidth: true
+ }
}
}
diff --git a/client/ui/qml/Controls2/ImageButtonType.qml b/client/ui/qml/Controls2/ImageButtonType.qml
index b6262906..72c78342 100644
--- a/client/ui/qml/Controls2/ImageButtonType.qml
+++ b/client/ui/qml/Controls2/ImageButtonType.qml
@@ -7,9 +7,9 @@ Button {
property string image
- property string hoveredColor: Qt.rgba(255, 255, 255, 0.08)
+ property string hoveredColor: Qt.rgba(1, 1, 1, 0.08)
property string defaultColor: "transparent"
- property string pressedColor: Qt.rgba(255, 255, 255, 0.12)
+ property string pressedColor: Qt.rgba(1, 1, 1, 0.12)
property string imageColor: "#878B91"
diff --git a/client/ui/qml/Controls2/LabelWithButtonType.qml b/client/ui/qml/Controls2/LabelWithButtonType.qml
index 5da4db5f..60c48569 100644
--- a/client/ui/qml/Controls2/LabelWithButtonType.qml
+++ b/client/ui/qml/Controls2/LabelWithButtonType.qml
@@ -6,24 +6,48 @@ Item {
id: root
property string text
+ property string descriptionText
property var onClickedFunc
property alias buttonImage : button.image
- implicitWidth: 360
- implicitHeight: 72
+ implicitWidth: content.implicitWidth
+ implicitHeight: content.implicitHeight
RowLayout {
+ id: content
anchors.fill: parent
- Text {
- font.family: "PT Root UI"
- font.styleName: "normal"
- font.pixelSize: 18
- color: "#d7d8db"
- text: root.text
- horizontalAlignment: Text.AlignLeft
- verticalAlignment: Text.AlignVCenter
+ ColumnLayout {
+ Text {
+ font.family: "PT Root UI"
+ font.styleName: "normal"
+ font.pixelSize: 18
+ color: "#d7d8db"
+ text: root.text
+
+ Layout.fillWidth: true
+ height: 22
+
+ horizontalAlignment: Text.AlignLeft
+ verticalAlignment: Text.AlignVCenter
+ }
+
+ Text {
+ font.family: "PT Root UI"
+ font.styleName: "normal"
+ font.pixelSize: 13
+ font.letterSpacing: 0.02
+ color: "#878B91"
+ text: root.descriptionText
+ wrapMode: Text.WordWrap
+
+ Layout.fillWidth: true
+ height: 16
+
+ horizontalAlignment: Text.AlignLeft
+ verticalAlignment: Text.AlignVCenter
+ }
}
ImageButtonType {
diff --git a/client/ui/qml/Controls2/TextFieldWithHeaderType.qml b/client/ui/qml/Controls2/TextFieldWithHeaderType.qml
index dd0d2907..350306bb 100644
--- a/client/ui/qml/Controls2/TextFieldWithHeaderType.qml
+++ b/client/ui/qml/Controls2/TextFieldWithHeaderType.qml
@@ -18,8 +18,12 @@ Item {
anchors.fill: parent
color: "#1c1d21"
radius: 16
- border.color: "#d7d8db"
- border.width: textField.focus ? 1 : 0
+ border.color: textField.focus ? "#d7d8db" : "#2C2D30"
+ border.width: 1
+
+ Behavior on border.color {
+ PropertyAnimation { duration: 200 }
+ }
}
ColumnLayout {
diff --git a/client/ui/qml/Pages2/PageCredentials.qml b/client/ui/qml/Pages2/PageSetupWizardCredentials.qml
similarity index 78%
rename from client/ui/qml/Pages2/PageCredentials.qml
rename to client/ui/qml/Pages2/PageSetupWizardCredentials.qml
index 509ee6a6..65c390ab 100644
--- a/client/ui/qml/Pages2/PageCredentials.qml
+++ b/client/ui/qml/Pages2/PageSetupWizardCredentials.qml
@@ -11,7 +11,7 @@ import "../Config"
PageBase {
id: root
- page: PageEnum.Credentials
+ page: PageEnum.WizardCredentials
FlickableType {
id: fl
@@ -32,15 +32,11 @@ PageBase {
HeaderTextType {
Layout.fillWidth: true
- Layout.bottomMargin: 16
- Layout.topMargin: 66
-
- Layout.preferredWidth: 328
+ Layout.topMargin: 20
buttonImage: "qrc:/images/controls/arrow-left.svg"
headerText: "Подключение к серверу"
- wrapMode: Text.WordWrap
}
TextFieldWithHeaderType {
@@ -60,23 +56,31 @@ PageBase {
BasicButtonType {
Layout.fillWidth: true
- Layout.topMargin: 40
+ Layout.topMargin: 24
text: qsTr("Настроить сервер простым образом")
+
+ onClicked: function() {
+ UiLogic.goToPage(PageEnum.WizardEasySetup)
+ }
}
BasicButtonType {
Layout.fillWidth: true
- Layout.topMargin: 8
+ Layout.topMargin: -8
defaultColor: "transparent"
- hoveredColor: Qt.rgba(255, 255, 255, 0.08)
- pressedColor: Qt.rgba(255, 255, 255, 0.12)
+ hoveredColor: Qt.rgba(1, 1, 1, 0.08)
+ pressedColor: Qt.rgba(1, 1, 1, 0.12)
disabledColor: "#878B91"
textColor: "#D7D8DB"
borderWidth: 1
text: qsTr("Выбрать протокол для установки")
+
+ onClicked: function() {
+ UiLogic.goToPage(PageEnum.WizardProtocols)
+ }
}
}
}
diff --git a/client/ui/qml/Pages2/PageSetupWizardEasy.qml b/client/ui/qml/Pages2/PageSetupWizardEasy.qml
new file mode 100644
index 00000000..80962974
--- /dev/null
+++ b/client/ui/qml/Pages2/PageSetupWizardEasy.qml
@@ -0,0 +1,74 @@
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+
+import PageEnum 1.0
+
+import "./"
+import "../Pages"
+import "../Controls2"
+import "../Config"
+
+PageBase {
+ id: root
+ page: PageEnum.WizardEasySetup
+
+ FlickableType {
+ id: fl
+ anchors.top: root.top
+ anchors.bottom: root.bottom
+ contentHeight: content.height
+
+ ColumnLayout {
+ id: content
+
+ anchors.top: parent.top
+ anchors.left: parent.left
+ anchors.right: parent.right
+ anchors.rightMargin: 16
+ anchors.leftMargin: 16
+
+ spacing: 16
+
+ HeaderTextType {
+ Layout.fillWidth: true
+ Layout.topMargin: 20
+
+ buttonImage: "qrc:/images/controls/arrow-left.svg"
+
+ headerText: "Какой уровень контроля интернета в вашем регионе?"
+ }
+
+ CardType {
+ Layout.fillWidth: true
+
+ headerText: "Высокий"
+ bodyText: "Многие иностранные сайты и VPN-провайдеры заблокированы"
+ }
+
+ CardType {
+ Layout.fillWidth: true
+
+ checked: true
+
+ headerText: "Средний"
+ bodyText: "Некоторые иностранные сайты заблокированы, но VPN-провайдеры не блокируются"
+ }
+
+ CardType {
+ Layout.fillWidth: true
+
+ headerText: "Низкий"
+ bodyText: "Хочу просто повысить уровень приватности"
+ }
+
+ BasicButtonType {
+ Layout.fillWidth: true
+ Layout.topMargin: 24
+ Layout.bottomMargin: 32
+
+ text: qsTr("Продолжить")
+ }
+ }
+ }
+}
diff --git a/client/ui/qml/Pages2/PageSetupWizardProtocols.qml b/client/ui/qml/Pages2/PageSetupWizardProtocols.qml
new file mode 100644
index 00000000..b2fb7d57
--- /dev/null
+++ b/client/ui/qml/Pages2/PageSetupWizardProtocols.qml
@@ -0,0 +1,102 @@
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+
+import SortFilterProxyModel 0.2
+
+import PageEnum 1.0
+import ProtocolEnum 1.0
+
+import "./"
+import "../Pages"
+import "../Controls2"
+import "../Config"
+
+PageBase {
+ id: root
+ page: PageEnum.WizardProtocols
+
+ SortFilterProxyModel {
+ id: containersModel
+ sourceModel: UiLogic.containersModel
+ filters: [
+ ValueFilter {
+ roleName: "is_installed_role"
+ value: false
+ },
+ ValueFilter {
+ roleName: "service_type_role"
+ value: ProtocolEnum.Vpn
+ }
+ ]
+ }
+
+ FlickableType {
+ id: fl
+ anchors.top: root.top
+ anchors.bottom: root.bottom
+ contentHeight: content.height
+
+ Column {
+ id: content
+
+ anchors.top: parent.top
+ anchors.left: parent.left
+ anchors.right: parent.right
+ anchors.rightMargin: 16
+ anchors.leftMargin: 16
+ anchors.topMargin: 20
+
+ spacing: 16
+
+ HeaderTextType {
+ width: parent.width
+ buttonImage: "qrc:/images/controls/arrow-left.svg"
+
+ headerText: "Протокол подключения"
+ descriptionText: "Выберите более приоритетный для вас. Позже можно будет установить остальные протоколы и доп сервисы, вроде DNS-прокси и SFTP."
+ }
+
+ ListView {
+ id: containers
+ width: parent.width
+ height: containers.contentItem.height
+ currentIndex: -1
+ clip: true
+ interactive: false
+ model: containersModel
+
+ delegate: Item {
+ implicitWidth: containers.width
+ implicitHeight: delegateContent.implicitHeight
+
+ ColumnLayout {
+ id: delegateContent
+
+ anchors.top: parent.top
+ anchors.left: parent.left
+ anchors.right: parent.right
+
+ LabelWithButtonType {
+ id: container
+ Layout.fillWidth: true
+ Layout.topMargin: 16
+ Layout.bottomMargin: 16
+
+ text: name_role
+ descriptionText: desc_role
+ buttonImage: "qrc:/images/controls/chevron-right.svg"
+
+ }
+
+ Rectangle {
+ Layout.fillWidth: true
+ height: 1
+ color: "#2C2D30"
+ }
+ }
+ }
+ }
+ }
+ }
+}
diff --git a/client/ui/qml/Pages2/PageStart.qml b/client/ui/qml/Pages2/PageStart.qml
index 6f8f0356..5d303cb8 100644
--- a/client/ui/qml/Pages2/PageStart.qml
+++ b/client/ui/qml/Pages2/PageStart.qml
@@ -31,7 +31,7 @@ PageBase {
source: "qrc:/images/amneziaBigLogo.png"
Layout.alignment: Qt.AlignCenter
- Layout.topMargin: 80
+ Layout.topMargin: 32
Layout.leftMargin: 8
Layout.rightMargin: 8
Layout.preferredWidth: 344
@@ -67,8 +67,8 @@ PageBase {
Layout.rightMargin: 16
defaultColor: "transparent"
- hoveredColor: Qt.rgba(255, 255, 255, 0.08)
- pressedColor: Qt.rgba(255, 255, 255, 0.12)
+ hoveredColor: Qt.rgba(1, 1, 1, 0.08)
+ pressedColor: Qt.rgba(1, 1, 1, 0.12)
disabledColor: "#878B91"
textColor: "#D7D8DB"
borderWidth: 1
@@ -123,6 +123,7 @@ PageBase {
Layout.alignment: Qt.AlignHCenter
text: "Данные для подключения"
+ wrapMode: Text.WordWrap
}
LabelWithButtonType {
@@ -134,7 +135,8 @@ PageBase {
buttonImage: "qrc:/images/controls/chevron-right.svg"
onClickedFunc: function() {
- UiLogic.goToPage(PageEnum.Credentials)
+ UiLogic.goToPage(PageEnum.WizardCredentials)
+ drawer.visible = false
}
}
Rectangle {