status-desktop/ui/app/AppLayouts/Profile/views/LanguageView.qml

270 lines
9.6 KiB
QML
Raw Normal View History

import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick.Layouts 1.13
import utils 1.0
import shared.panels 1.0
import shared.popups 1.0
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Core.Utils 0.1 as StatusQUtils
import StatusQ.Components 0.1
import StatusQ.Controls 0.1
import "../popups"
import "../stores"
import SortFilterProxyModel 0.2
SettingsContentBase {
id: root
property LanguageStore languageStore
property var currencyStore
objectName: "languageView"
onVisibleChanged: { if(!visible) root.setViewIdleState()}
onBaseAreaClicked: { root.setViewIdleState() }
Component.onCompleted: {
root.currencyStore.updateCurrenciesModel()
}
function setViewIdleState() {
currencyPicker.close()
languagePicker.close()
}
function changeLanguage(key) {
languagePicker.newKey = key
languagePause.start()
}
ColumnLayout {
spacing: Constants.settingsSection.itemSpacing
width: root.contentWidth
Item {
id: currency
Layout.fillWidth: true
Layout.leftMargin: Style.current.padding
Layout.rightMargin: Style.current.padding
height: 38
z: root.z + 2
StatusBaseText {
text: qsTr("Set Display Currency")
anchors.left: parent.left
font.pixelSize: 15
color: Theme.palette.directColor1
}
StatusListPicker {
id: currencyPicker
property string newKey
Timer {
id: currencyPause
interval: 100
onTriggered: {
// updateCurrency function operation blocks a little bit the UI so getting around it with a small pause (timer) in order to get the desired visual behavior
root.currencyStore.updateCurrency(currencyPicker.newKey)
}
}
z: root.z + 2
width: 104
height: parent.height
anchors.right: parent.right
inputList: root.currencyStore.currenciesModel
printSymbol: true
placeholderSearchText: qsTr("Search Currencies")
maxPickerHeight: 350
onItemPickerChanged: {
if(selected) {
currencyPicker.newKey = key
currencyPause.start()
}
}
}
}
Item {
id: language
Layout.fillWidth: true
Layout.leftMargin: Style.current.padding
Layout.rightMargin: Style.current.padding
height: 38
z: root.z + 1
StatusBaseText {
text: qsTr("Language")
anchors.left: parent.left
font.pixelSize: 15
color: Theme.palette.directColor1
}
StatusListPicker {
id: languagePicker
property string newKey
function descriptionForState(state) {
if (state === Constants.translationsState.alpha) return qsTr("Alpha languages")
if (state === Constants.translationsState.beta) return qsTr("Beta languages")
return ""
}
Timer {
id: languagePause
interval: 100
onTriggered: {
// changeLanguage function operation blocks a little bit the UI so getting around it with a small pause (timer) in order to get the desired visual behavior
root.languageStore.changeLanguage(languagePicker.newKey)
}
}
objectName: "languagePicker"
inputList: SortFilterProxyModel {
sourceModel: root.languageStore.languageModel
// !Don't use proxy roles cause they harm performance a lot!
// "category" is the only role that can't be mocked by StatusListPicker::proxy
// due to StatusListPicker internal implementation limitation (ListView's section.property)
proxyRoles: [
ExpressionRole {
name: "category"
expression: languagePicker.descriptionForState(model.state)
}
]
sorters: [
RoleSorter {
roleName: "state"
sortOrder: Qt.DescendingOrder
},
StringSorter {
roleName: "name"
}
]
}
proxy {
key: (model) => model.locale
name: (model) => model.name
shortName: (model) => model.native
symbol: (model) => ""
imageSource: (model) => StatusQUtils.Emoji.iconSource(model.flag)
selected: (model) => model.locale === root.languageStore.currentLanguage
setSelected: (model, val) => null // readonly
}
z: root.z + 1
width: 104
height: parent.height
anchors.right: parent.right
placeholderSearchText: qsTr("Search Languages")
maxPickerHeight: 350
onItemPickerChanged: {
if(selected && root.languageStore.currentLanguage !== key) {
// IMPORTANT: Workaround to temporary resolve the crash we have when language is changed (`startupModule` is null and some qml bindings are still calling this dead pointer) so, change language will not retranslate
// and instead, also on mac and win, the app will quit to apply the new language
// TEMPORARY: It should be removed as it is only used in Linux OS but it must be investigated how to change language in execution time, as well, in Linux (will be addressed in another task)
//if (Qt.platform.os === Constants.linux) {
root.changeLanguage(key)
linuxConfirmationDialog.active = true
linuxConfirmationDialog.item.newLocale = key
linuxConfirmationDialog.item.open()
// }
//else {
// root.changeLanguage(key)
//}
}
}
}
}
Separator {
Layout.fillWidth: true
Layout.bottomMargin: Style.current.padding
}
// Date format options:
Column {
Layout.fillWidth: true
Layout.leftMargin: Style.current.padding
Layout.rightMargin: Style.current.padding
spacing: Style.current.padding
StatusBaseText {
text: qsTr("Date Format")
anchors.left: parent.left
font.pixelSize: 15
color: Theme.palette.directColor1
}
StatusRadioButton {
text: qsTr("DD/MM/YY")
font.pixelSize: 13
checked: root.languageStore.isDDMMYYDateFormat
onToggled: root.languageStore.setIsDDMMYYDateFormat(checked)
}
StatusRadioButton {
text: qsTr("MM/DD/YY")
font.pixelSize: 13
checked: !root.languageStore.isDDMMYYDateFormat
onToggled: root.languageStore.setIsDDMMYYDateFormat(!checked)
}
}
// Time format options:
Column {
Layout.fillWidth: true
Layout.leftMargin: Style.current.padding
Layout.rightMargin: Style.current.padding
Layout.topMargin: Style.current.padding
spacing: Style.current.padding
StatusBaseText {
text: qsTr("Time Format")
anchors.left: parent.left
font.pixelSize: 15
color: Theme.palette.directColor1
}
StatusRadioButton {
text: qsTr("24-Hour Time")
font.pixelSize: 13
checked: root.languageStore.is24hTimeFormat
onToggled: root.languageStore.setIs24hTimeFormat(checked)
}
StatusRadioButton {
text: qsTr("12-Hour Time")
font.pixelSize: 13
checked: !root.languageStore.is24hTimeFormat
onToggled: root.languageStore.setIs24hTimeFormat(!checked)
}
}
// TEMPORARY: It should be removed as it is only used in Linux OS but it must be investigated how to change language in execution time, as well, in Linux (will be addressed in another task)
Loader {
id: linuxConfirmationDialog
active: false
sourceComponent: ConfirmationDialog {
property string newLocale
header.title: qsTr("Change language")
confirmationText: qsTr("Display language has been changed. You must restart the application for changes to take effect.")
confirmButtonLabel: qsTr("Close the app now")
onConfirmButtonClicked: {
loader.active = false
Qt.quit()
}
}
}
}
}