Skip to content

Commit

Permalink
feature: added ui for DefaultVPN
Browse files Browse the repository at this point in the history
  • Loading branch information
Nethius committed Dec 13, 2024
1 parent d06924c commit 71e33f7
Show file tree
Hide file tree
Showing 25 changed files with 1,445 additions and 4 deletions.
6 changes: 3 additions & 3 deletions client/amnezia_application.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,7 @@ void AmneziaApplication::init()
{
m_engine = new QQmlApplicationEngine;

const QUrl url(QStringLiteral("qrc:/ui/qml/main2.qml"));
const QUrl url(QStringLiteral("qrc:/ui/qml/DefaultVpn/main.qml"));
QObject::connect(
m_engine, &QQmlApplicationEngine::objectCreated, this,
[url](QObject *obj, const QUrl &objUrl) {
Expand Down Expand Up @@ -154,7 +154,7 @@ void AmneziaApplication::init()
connect(this, &AmneziaApplication::translationsUpdated, m_notificationHandler.get(), &NotificationHandler::onTranslationsUpdated);
#endif

m_engine->addImportPath("qrc:/ui/qml/Modules/");
m_engine->addImportPath("qrc:/ui/qml/DefaultVpn");
m_engine->load(url);
m_systemController->setQmlRoot(m_engine->rootObjects().value(0));

Expand Down Expand Up @@ -228,7 +228,7 @@ void AmneziaApplication::loadFonts()
{
QQuickStyle::setStyle("Basic");

QFontDatabase::addApplicationFont(":/fonts/pt-root-ui_vf.ttf");
QFontDatabase::addApplicationFont(":/fonts/VelaSans-GX.ttf");
}

void AmneziaApplication::loadTranslator()
Expand Down
Binary file added client/fonts/VelaSans-GX.ttf
Binary file not shown.
4 changes: 4 additions & 0 deletions client/images/controls/connect-button.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
22 changes: 22 additions & 0 deletions client/resources.qrc
Original file line number Diff line number Diff line change
Expand Up @@ -220,6 +220,28 @@
<file>ui/qml/Pages2/PageSettingsApiLanguageList.qml</file>
<file>images/controls/archive-restore.svg</file>
<file>images/controls/help-circle.svg</file>
<file>ui/qml/DefaultVpn/Controls/DropDownType.qml</file>
<file>ui/qml/DefaultVpn/main.qml</file>
<file>ui/qml/DefaultVpn/Pages/PageHome.qml</file>
<file>ui/qml/DefaultVpn/Controls/TextTypes/MediumTextType.qml</file>
<file>ui/qml/DefaultVpn/Config/DeviceInfo.qml</file>
<file>ui/qml/DefaultVpn/Config/qmldir</file>
<file>ui/qml/DefaultVpn/Controls/TextTypes/XSmallTextType.qml</file>
<file>ui/qml/DefaultVpn/Controls/ButtonType.qml</file>
<file>ui/qml/DefaultVpn/Pages/PageSettingsServersList.qml</file>
<file>ui/qml/DefaultVpn/Controls/TextTypes/Header1TextType.qml</file>
<file>ui/qml/DefaultVpn/Controls/TextTypes/Header3TextType.qml</file>
<file>ui/qml/DefaultVpn/Config/Style.qml</file>
<file>ui/qml/DefaultVpn/Components/WhiteButtonWithBorder.qml</file>
<file>ui/qml/DefaultVpn/Components/WhiteButtonNoBorder.qml</file>
<file>ui/qml/DefaultVpn/Pages/PageSetupWizardConfigSource.qml</file>
<file>ui/qml/DefaultVpn/Components/BlueButtonNoBorder.qml</file>
<file>ui/qml/DefaultVpn/Controls/InputType.qml</file>
<file>ui/qml/DefaultVpn/Controls/PopupType.qml</file>
<file>ui/qml/DefaultVpn/Pages/PageSettingsServerInfo.qml</file>
<file>ui/qml/DefaultVpn/Controls/BusyIndicatorType.qml</file>
<file>images/controls/connect-button.svg</file>
<file>fonts/VelaSans-GX.ttf</file>
</qresource>
<qresource prefix="/countriesFlags">
<file>images/flagKit/ZW.svg</file>
Expand Down
2 changes: 1 addition & 1 deletion client/ui/controllers/pageController.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ QString PageController::getPagePath(PageLoader::PageEnum page)
{
QMetaEnum metaEnum = QMetaEnum::fromType<PageLoader::PageEnum>();
QString pageName = metaEnum.valueToKey(static_cast<int>(page));
return "qrc:/ui/qml/Pages2/" + pageName + ".qml";
return "qrc:/ui/qml/DefaultVpn/Pages/" + pageName + ".qml";
}

void PageController::closeWindow()
Expand Down
36 changes: 36 additions & 0 deletions client/ui/qml/DefaultVpn/Components/BlueButtonNoBorder.qml
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
pragma ComponentBehavior: Bound

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects

import Config 1.0

import "../Controls/TextTypes"
import "../Controls"

ButtonType {
defaultBackgroundColor: Style.color.accent1
defaultBorderColor: Style.color.gray3
defaultTextColor: Style.color.white
defaultImageColor: Style.color.white

hoveredBackgroundColor: Style.color.accent2
hoveredBorderColor: Style.color.gray3
hoveredTextColor: Style.color.white
hoveredImageColor: Style.color.white

pressedBackgroundColor: Style.color.accent3
pressedBorderColor: Style.color.gray3
pressedTextColor: Style.color.white
pressedImageColor: Style.color.white

disabledBackgroundColor: Style.color.gray6
disabledBorderColor: Style.color.gray3
disabledTextColor: Style.color.gray2
disabledImageColor: Style.color.gray2

defaultBorderWidth: 0
disabledBorderWidth: 0
}
36 changes: 36 additions & 0 deletions client/ui/qml/DefaultVpn/Components/WhiteButtonNoBorder.qml
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
pragma ComponentBehavior: Bound

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects

import Config 1.0

import "../Controls/TextTypes"
import "../Controls"

ButtonType {
defaultBackgroundColor: Style.color.white
defaultBorderColor: Style.color.gray3
defaultTextColor: Style.color.accent1
defaultImageColor: Style.color.accent1

hoveredBackgroundColor: Style.color.gray1
hoveredBorderColor: Style.color.gray3
hoveredTextColor: Style.color.accent2
hoveredImageColor: Style.color.accent2

pressedBackgroundColor: Style.color.gray2
pressedBorderColor: Style.color.gray3
pressedTextColor: Style.color.accent3
pressedImageColor: Style.color.accent3

disabledBackgroundColor: Style.color.white
disabledBorderColor: Style.color.gray3
disabledTextColor: Style.color.gray8
disabledImageColor: Style.color.gray8

defaultBorderWidth: 0
disabledBorderWidth: 0
}
37 changes: 37 additions & 0 deletions client/ui/qml/DefaultVpn/Components/WhiteButtonWithBorder.qml
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
pragma ComponentBehavior: Bound

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects

import Config 1.0

import "../Controls/TextTypes"
import "../Controls"

ButtonType {
defaultBackgroundColor: Style.color.white
defaultBorderColor: Style.color.gray3
defaultTextColor: Style.color.black
defaultImageColor: Style.color.black

hoveredBackgroundColor: Style.color.white
hoveredBorderColor: Style.color.gray6
hoveredTextColor: Style.color.black
hoveredImageColor: Style.color.black

pressedBackgroundColor: Style.color.gray1
pressedBorderColor: Style.color.gray6
pressedTextColor: Style.color.black
pressedImageColor: Style.color.black

disabledBackgroundColor: Style.color.gray3
disabledBorderColor: Style.color.gray2
disabledTextColor: Style.color.gray9
disabledImageColor: Style.color.gray9

defaultBorderWidth: 1
disabledBorderWidth: 1
hoveredBorderWidth: 1
}
37 changes: 37 additions & 0 deletions client/ui/qml/DefaultVpn/Config/DeviceInfo.qml
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
pragma Singleton

import QtQuick

Item {
readonly property int screenWidth: 380
readonly property int screenHeight: 680

function isMobile() {
if (Qt.platform.os === "android" ||
Qt.platform.os === "ios") {
return true
}
return false
}

function isDesktop() {
if (Qt.platform.os === "windows" ||
Qt.platform.os === "linux" ||
Qt.platform.os === "osx") {
return true
}
return false
}

TextEdit {
id: clipboard
visible: false
}

function copyToClipBoard(text) {
clipboard.text = text
clipboard.selectAll()
clipboard.copy()
clipboard.select(0, 0)
}
}
30 changes: 30 additions & 0 deletions client/ui/qml/DefaultVpn/Config/Style.qml
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
pragma Singleton

import QtQuick

QtObject {
property QtObject color: QtObject {
readonly property color transparent: 'transparent'
readonly property color gray1: '#F2F2F7'
readonly property color gray2: '#E5E5EA'
readonly property color gray3: '#D1D1D6'
readonly property color gray4: '#C7C7CC'
readonly property color gray5: '#AEAEB2'
readonly property color gray6: '#8E8E93'
readonly property color gray7: '#7C7C83'
readonly property color gray8: '#707075'
readonly property color gray9: '#57575B'
readonly property color accent1: '#007AFF'
readonly property color accent2: '#0B6EDA'
readonly property color accent3: '#1256A1'
readonly property color error: '#FF3B30'
readonly property color warning: '#FF9500'
readonly property color success: '#34C759'
readonly property color black: '#000000'
readonly property color white: '#FFFFFF'

readonly property color transparentBlack: Qt.rgba(14/255, 14/255, 17/255, 0.8)
}

readonly property string font: "Vela Sans GX"
}
4 changes: 4 additions & 0 deletions client/ui/qml/DefaultVpn/Config/qmldir
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
module Config

singleton DeviceInfo 1.0 DeviceInfo.qml
singleton Style 1.0 Style.qml
70 changes: 70 additions & 0 deletions client/ui/qml/DefaultVpn/Controls/BusyIndicatorType.qml
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Shapes

import Config 1.0

Popup {
id: root
anchors.centerIn: parent

modal: true
closePolicy: Popup.NoAutoClose

visible: false

Overlay.modal: Rectangle {
color: Style.color.transparentBlack
}

background: Rectangle {
color: Style.color.transparent
}

BusyIndicator {
id: busyIndicator

visible: true
running: true

contentItem: Item {
implicitWidth: 46
implicitHeight: 46
transformOrigin: Item.Center

Shape {
id: shape
width: parent.implicitWidth
height: parent.implicitHeight
anchors.bottom: parent.bottom
anchors.right: parent.right
layer.enabled: true
layer.samples: 4

ShapePath {
fillColor: Style.color.transparent
strokeColor: Style.color.gray3
strokeWidth: 3
capStyle: ShapePath.RoundCap

PathAngleArc {
centerX: shape.width / 2
centerY: shape.height / 2
radiusX: 18
radiusY: 18
startAngle: 225
sweepAngle: -90
}
}
RotationAnimator {
target: shape
running: busyIndicator.visible && busyIndicator.running
from: 0
to: 360
loops: Animation.Infinite
duration: 1250
}
}
}
}
}
Loading

0 comments on commit 71e33f7

Please sign in to comment.