ui/qml/panes/SettingsPane.qml

import QtGraphicalEffects 1.0
import QtQuick 2.7
import QtQuick.Controls 2.4
import QtQuick.Controls.Material 2.0
import QtQuick.Layouts 1.3
import QtQuick.Window 2.11
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4

import "../opaque" as Opaque
import "../opaque/controls"
import "../opaque/theme"
import "../widgets" as Widgets
import "../utils.js" as Utils

Opaque.SettingsList { // settingsPane
    id: root
    anchors.fill: parent
    width: parent.width
    height: parent.height
    anchors.topMargin: 20
    contentHeight: settings.height

    Column {
        id: settings
        anchors.horizontalCenter: parent.horizontalCenter
        width: parent.width - 20
        parent: root.contentItem
        padding: Theme.paddingStandard
        spacing: Theme.paddingSmall

        Opaque.Setting {

            //: Language
            label: qsTr("setting-language")

            field: Opaque.ComboBox {
                id: cbLanguage
                anchors.right: parent.right
                anchors.left: parent.left

                property bool inited: false

                model: ListModel {
                    id: cbLangItems
                    ListElement { text: qsTr("locale-en"); value: "en" }
                    ListElement { text: qsTr("locale-fr"); value: "fr" }
                    ListElement { text: qsTr("locale-es"); value: "es" }
                    ListElement { text: qsTr("locale-de"); value: "de" }
                    ListElement { text: qsTr("locale-it"); value: "it" }
                    ListElement { text: qsTr("locale-pt"); value: "pt" }
                }

                onCurrentIndexChanged: {
                    var item = cbLangItems.get(cbLanguage.currentIndex)
                    // Comboboxes seem to fire one Change on load...
                    if (!cbLanguage.inited) {
                        cbLanguage.inited = true
                        return
                    }
                    gcd.locale = item["value"]
                }

            }
        }

        Opaque.Setting {
            //: Interface Zoom
            label: qsTr("setting-interface-zoom")

            field: Column {
                spacing: 10
                anchors.verticalCenter: parent.verticalCenter

                Opaque.Slider {
                    id: zoomSlider
                    from: 0
                    to: 4
                    value: gcd.themeScaleNew
                    snapMode: Slider.SnapAlways
                    stepSize: 1

                    onValueChanged: {
                    	windowItem.width = windowItem.width
                    	gcd.themeScale = 1.0
                    	gcd.themeScaleNew = zoomSlider.value
                    }
                    width: 200
                }

                Row {
					Opaque.Label {
						//: small text
						text: qsTr("small-text-label") + "  "
						size: Theme.textSmallPt
					}
					Opaque.Label {
						//: medium text
						text: qsTr("medium-text-label") + "  "
						size: Theme.textMediumPt
					}
					Opaque.Label {
						//: large text
						text: qsTr("large-text-label")
						size: Theme.textLargePt
					}
				}
            }
        }

        Opaque.Setting {
            //: Theme
            label: qsTr("setting-theme")

            field: Opaque.ComboBox {
                id: cbTheme
                property bool inited: false
                anchors.right: parent.right
                anchors.left: parent.left
                model: ListModel {
                    id: cbThemeItems
                    ListElement { text: qsTr("theme-light"); value: 'light' }
                    ListElement { text: qsTr("theme-dark"); value: 'dark' }
                }

                onCurrentIndexChanged: {
                    var item = cbThemeItems.get(cbTheme.currentIndex)
                    // Comboboxes seem to fire one Change on load...
                    if (!cbTheme.inited) {
                        cbTheme.inited = true
                        return
                    }
                    gcd.theme = item["value"]
                }
            }
        }

		Opaque.Setting {
			//: Enable experiments
			label: qsTr("experiments-enabled")

			field: Opaque.ToggleSwitch {
				anchors.right: parent.right
				id: experimentsEnabledToggle
				checked: gcd.experimentsEnabled
				onCheckedChanged: gcd.experimentsEnabled = checked
			}
		}

		Widgets.ExperimentToggle {
			name: "servers_enabled"
			experiment_id: "tapir-servers-experiment"
		}

		Widgets.ExperimentToggle {
			name: "groups_enabled"
			experiment_id: "tapir-groups-experiment"
		}

		Opaque.Collapser {
			textShow: qsTr("Text magnification reference")
			textHide: textShow

			Opaque.Label {
				text: "compact header"
				size: Theme.textHeaderPtBase[0]
				bold: true
			}
			Opaque.Label {
				text: "compact small text"
				size: Theme.textSmallPtBase[0]
			}
			Opaque.Label {
				text: "compact medium text"
				size: Theme.textMediumPtBase[0]
			}
			Opaque.Label {
				text: "compact large text"
				size: Theme.textLargePtBase[0]
			}
			Opaque.Label {
				text: "normal header"
				size: Theme.textHeaderPtBase[1]
				bold: true
			}
			Opaque.Label {
				text: "normal small text"
				size: Theme.textSmallPtBase[1]
			}
			Opaque.Label {
				text: "normal medium text"
				size: Theme.textMediumPtBase[1]
			}
			Opaque.Label {
				text: "normal large text"
				size: Theme.textLargePtBase[1]
			}
			Opaque.Label {
				text: "magnified header"
				size: Theme.textHeaderPtBase[2]
				bold: true
			}
			Opaque.Label {
				text: "magnified small text"
				size: Theme.textSmallPtBase[2]
			}
			Opaque.Label {
				text: "magnified medium text"
				size: Theme.textMediumPtBase[2]
			}
			Opaque.Label {
				text: "magnified large text"
				size: Theme.textLargePtBase[2]
			}
		}

		Opaque.Collapser {
			textShow: qsTr("Acknowledgements")
			textHide: textShow

			Opaque.Label {
				//: don't translate yet... we should come up with something to write here as a team<3
				text: qsTr("extra special thanks!!!!")
			}

			Opaque.Label {
				text: "dependencies, licenses?\nprofile icon pics\nfontawesome? other icon sources?\nmutant standard\nadobe blank\nopensans?"
			}
		}

		// todo: found this -60 by trial and error. not sure of derivation
		Opaque.HLine{width:parent.width-padding*2-60}

		Opaque.Label {
			id: versionLabel
			anchors.horizontalCenter: parent.horizontalCenter
			//: Version %1 with tor %2
			text: qsTr("version %1 tor %2").arg(gcd.version).arg(gcd.torVersion)
			size: Theme.textSmallPt
		}

		Opaque.Label {
			id: builddateLabel
			anchors.horizontalCenter: parent.horizontalCenter
			//: Built on: %2
			text: qsTr("builddate %2").arg(gcd.buildDate)
			size: Theme.textSmallPt
		}
    }


    Connections {
        target: gcd

        onSupplySettings: function(locale, zoom, theme) {
            for (var i=0; i < cbLangItems.count; i++) {
                var item = cbLangItems.get(i)
                if (item["value"] == locale) {
                    cbLanguage.currentIndex = i
                    break
                }
            }

            for (var i=0; i < cbThemeItems.count; i++) {
                var item = cbThemeItems.get(i)
                if (item["value"] == theme) {
                    cbTheme.currentIndex = i
                    break
                }
            }
        }
    }






    //end of flickable
}