import QtQuick 2.2
import Sailfish.Silica 1.0
import "../js/i18n.js" as I18N

// Lingua dell'applicazione: le quattro dell'originale (EN/IT/FR/DE).
// A differenza di QTranslator, la tabella di traduzione in i18n.js si applica
// subito: le pagine che si riaprono usano la lingua nuova senza riavviare.
Page {
    id: page
    allowedOrientations: Orientation.All

    property string lang: "en"

    function tr(key, arg) { return I18N.t(key, arg, page.lang) }

    ListModel { id: langModel }

    readonly property var codes: [ "en", "it", "fr", "de" ]
    readonly property var names: [ "English", "Italiano", "Français", "Deutsch" ]

    function reload() {
        page.lang = I18N.langFor(appSettings.language, Qt.locale().name)
        langModel.clear()
        for (var i = 0; i < page.codes.length; i++) {
            langModel.append({
                "n": i,
                "name": page.names[i],
                "current": page.codes[i] === page.lang
            })
        }
    }

    function choose(index) {
        var code = page.codes[index]
        if (appSettings.language === code) {
            pageStack.pop()
            return
        }
        appSettings.language = code
        page.reload()
    }

    Component.onCompleted: page.reload()

    SilicaListView {
        id: listView
        anchors.fill: parent

        header: PageHeader { title: page.tr("language") }
        model: langModel

        delegate: ListItem {
            id: langItem

            Label {
                anchors {
                    left: parent.left
                    leftMargin: Theme.horizontalPageMargin
                    verticalCenter: parent.verticalCenter
                }
                text: model.name
                color: langItem.highlighted ? Theme.highlightColor
                       : (model.current ? Theme.highlightColor : Theme.primaryColor)
            }

            Icon {
                anchors {
                    right: parent.right
                    rightMargin: Theme.horizontalPageMargin
                    verticalCenter: parent.verticalCenter
                }
                source: "image://theme/icon-m-accept"
                visible: model.current
            }

            onClicked: page.choose(index)
        }

        VerticalScrollDecorator {}
    }
}