From 21e61d6a3ae64e87d20d9b6944218ca7cbd95e8b Mon Sep 17 00:00:00 2001 From: Mohsen Date: Sat, 8 Mar 2025 19:54:37 +0330 Subject: [PATCH 1/4] Add storageBar and storageText. --- src/qml/Nyuki.qml | 5 ++- src/qml/QFieldCloudScreen.qml | 78 ++++++++++++++++++++++++++++++--- src/qml/imports/Theme/Theme.qml | 1 + 3 files changed, 76 insertions(+), 8 deletions(-) diff --git a/src/qml/Nyuki.qml b/src/qml/Nyuki.qml index c78896cdf3..ee7f9ad447 100644 --- a/src/qml/Nyuki.qml +++ b/src/qml/Nyuki.qml @@ -1,5 +1,6 @@ import QtQuick import QtQuick.Controls +import Theme /** * \ingroup qml @@ -66,7 +67,7 @@ Item { id: nyukiLeft width: 10 height: 10 - color: "#4a6fae" + color: Theme.qfieldCloudBlue x: 84 y: 84 radius: 5 @@ -91,7 +92,7 @@ Item { id: nyukiRight width: 10 height: 10 - color: "#4a6fae" + color: Theme.qfieldCloudBlue x: 106 y: 84 radius: 5 diff --git a/src/qml/QFieldCloudScreen.qml b/src/qml/QFieldCloudScreen.qml index d6280a6cca..b374c7dbc8 100644 --- a/src/qml/QFieldCloudScreen.qml +++ b/src/qml/QFieldCloudScreen.qml @@ -36,15 +36,17 @@ Page { Layout.fillHeight: true spacing: 2 - RowLayout { + Item { id: connectionInformation - spacing: 2 Layout.fillWidth: true + Layout.minimumHeight: cloudAvatarRect.height + (storageBar.visible * storageBar.height) + 8 + Layout.leftMargin: 10 + Layout.rightMargin: 10 + Layout.topMargin: 12 visible: cloudConnection.status === QFieldCloudConnection.LoggedIn || table.count > 0 Label { - Layout.fillWidth: true - padding: 10 + anchors.left: parent.left opacity: projects.visible ? 1 : 0 text: switch (cloudConnection.status) { case 0: @@ -64,8 +66,7 @@ Page { Rectangle { id: cloudAvatarRect - Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter - Layout.margins: 10 + anchors.right: parent.right width: 48 height: 48 border.color: Theme.mainColor @@ -123,6 +124,45 @@ Page { } } } + + Label { + id: storageText + anchors.bottom: storageBar.top + anchors.bottomMargin: 4 + color: Theme.mainTextColor + font.italic: true + textFormat: Text.RichText + onLinkActivated: link => Qt.openUrlExternally(link) + } + + ProgressBar { + id: storageBar + anchors.top: cloudAvatarRect.bottom + anchors.topMargin: 8 + width: parent.width + visible: false + from: 0 + to: 1 + value: usage + + // The `value` property is being animated, so we need the actual value at all times. + property double usage: 0 + + Material.accent: { + if (usage < .9) + return Theme.qfieldCloudBlue; + else if (usage < .975) + return Theme.warningColor; + else + return Theme.bookmarkRed; + } + + Behavior on value { + NumberAnimation { + duration: 1000 + } + } + } } ColumnLayout { @@ -620,10 +660,36 @@ Page { } else { projects.visible = true; connectionSettings.visible = false; + + // uncomment when storage bar api is ready + // showStorageBar() } + } else + // uncomment when storage bar api is ready + // hideStorageBar() + { } } + function showStorageBar() { + const usedStorage = 1; + const totalStorage = 1; + storageBar.usage = usedStorage / totalStorage; + storageText.text = qsTr(`${usedStorage} GB of ${totalStorage} GB used`); + if (storageBar.usage >= .975) { + const upgradeStorageText = qsTr("upgrade to more storage here"); + storageText.text += `; ${upgradeStorageText}`; + } + storageText.visible = true; + storageBar.visible = true; + } + + function hideStorageBar() { + storageBar.usage = 0; + storageBar.visible = false; + storageText.visible = false; + } + Component.onCompleted: { prepareCloudLogin(); } diff --git a/src/qml/imports/Theme/Theme.qml b/src/qml/imports/Theme/Theme.qml index 22e4c24139..1233db321b 100644 --- a/src/qml/imports/Theme/Theme.qml +++ b/src/qml/imports/Theme/Theme.qml @@ -106,6 +106,7 @@ QtObject { property color bookmarkOrange: "orange" property color bookmarkRed: "#c0392b" property color bookmarkBlue: "#64b5f6" + property color qfieldCloudBlue: "#4a6fae" property color vertexColor: "#FF0000" property color vertexColorSemiOpaque: "#40FF0000" From 309fb8c3e4784b9c0825a35a3d10e0ab03a9d4c8 Mon Sep 17 00:00:00 2001 From: Mohsen Date: Mon, 10 Mar 2025 19:15:08 +0330 Subject: [PATCH 2/4] Address review. --- src/qml/QFieldCloudScreen.qml | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/qml/QFieldCloudScreen.qml b/src/qml/QFieldCloudScreen.qml index b374c7dbc8..1949fd3063 100644 --- a/src/qml/QFieldCloudScreen.qml +++ b/src/qml/QFieldCloudScreen.qml @@ -146,15 +146,16 @@ Page { value: usage // The `value` property is being animated, so we need the actual value at all times. - property double usage: 0 + property double usage: 0.0 Material.accent: { - if (usage < .9) + if (usage < .9) { return Theme.qfieldCloudBlue; - else if (usage < .975) + } else if (usage < .975) { return Theme.warningColor; - else + } else { return Theme.bookmarkRed; + } } Behavior on value { From 6a2cf42128f6957661487f7cae577ffaf90adad4 Mon Sep 17 00:00:00 2001 From: Mohsen Date: Tue, 11 Mar 2025 16:54:39 +0330 Subject: [PATCH 3/4] Use qfieldcloud string. --- src/qml/Nyuki.qml | 4 ++-- src/qml/QFieldCloudScreen.qml | 2 +- src/qml/imports/Theme/Theme.qml | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/qml/Nyuki.qml b/src/qml/Nyuki.qml index ee7f9ad447..9f619c0fc0 100644 --- a/src/qml/Nyuki.qml +++ b/src/qml/Nyuki.qml @@ -67,7 +67,7 @@ Item { id: nyukiLeft width: 10 height: 10 - color: Theme.qfieldCloudBlue + color: Theme.qfieldcloudBlue x: 84 y: 84 radius: 5 @@ -92,7 +92,7 @@ Item { id: nyukiRight width: 10 height: 10 - color: Theme.qfieldCloudBlue + color: Theme.qfieldcloudBlue x: 106 y: 84 radius: 5 diff --git a/src/qml/QFieldCloudScreen.qml b/src/qml/QFieldCloudScreen.qml index 1949fd3063..504c2d34ae 100644 --- a/src/qml/QFieldCloudScreen.qml +++ b/src/qml/QFieldCloudScreen.qml @@ -150,7 +150,7 @@ Page { Material.accent: { if (usage < .9) { - return Theme.qfieldCloudBlue; + return Theme.qfieldcloudBlue; } else if (usage < .975) { return Theme.warningColor; } else { diff --git a/src/qml/imports/Theme/Theme.qml b/src/qml/imports/Theme/Theme.qml index 1233db321b..7bcab48d80 100644 --- a/src/qml/imports/Theme/Theme.qml +++ b/src/qml/imports/Theme/Theme.qml @@ -106,7 +106,7 @@ QtObject { property color bookmarkOrange: "orange" property color bookmarkRed: "#c0392b" property color bookmarkBlue: "#64b5f6" - property color qfieldCloudBlue: "#4a6fae" + property color qfieldcloudBlue: "#4a6fae" property color vertexColor: "#FF0000" property color vertexColorSemiOpaque: "#40FF0000" From 24682145cffe71d4c8232277ff481db77ee7e92f Mon Sep 17 00:00:00 2001 From: Mohsen Date: Fri, 14 Mar 2025 16:40:48 +0330 Subject: [PATCH 4/4] Fix float/doubles that does not have leading 0. --- src/qml/QFieldCloudScreen.qml | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/qml/QFieldCloudScreen.qml b/src/qml/QFieldCloudScreen.qml index 504c2d34ae..e46dcb98c8 100644 --- a/src/qml/QFieldCloudScreen.qml +++ b/src/qml/QFieldCloudScreen.qml @@ -149,9 +149,9 @@ Page { property double usage: 0.0 Material.accent: { - if (usage < .9) { + if (usage < 0.9) { return Theme.qfieldcloudBlue; - } else if (usage < .975) { + } else if (usage < 0.975) { return Theme.warningColor; } else { return Theme.bookmarkRed; @@ -677,7 +677,7 @@ Page { const totalStorage = 1; storageBar.usage = usedStorage / totalStorage; storageText.text = qsTr(`${usedStorage} GB of ${totalStorage} GB used`); - if (storageBar.usage >= .975) { + if (storageBar.usage >= 0.975) { const upgradeStorageText = qsTr("upgrade to more storage here"); storageText.text += `; ${upgradeStorageText}`; }