app/qml/SettingsDialog.qml

/*
    Speed Climbing Stopwatch - Simple Stopwatch for Climbers
    Copyright (C) 2018  Itsblue Development - Dorian Zeder

    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU Affero General Public License as published
    by the Free Software Foundation, version 3 of the License.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU Affero General Public License for more details.

    You should have received a copy of the GNU Affero General Public License
    along with this program.  If not, see <https://www.gnu.org/licenses/>.
*/

import QtQuick 2.9
import QtMultimedia 5.8
import QtQuick.Window 2.2
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import "./components"
import "./styles"

Popup {
    id: root
    x: startButt.x
    y: startButt.y
    width: startButt.width
    height: startButt.height
    modal: true
    dim: false
    scale: 0

    property var connections

    signal  connectRequested(var type)

    onConnectionsChanged: {
        //loop trough all connections
        for (var key in connections) {
            if(!connections[key])continue; //skip if empty to avoid errors
            //check if any connection is in the state "connecting"
            if(connections[key]["status"] === "connecting"){
                root.closePolicy = Popup.NoAutoClose //make the dalog non-closable
                return
            }
        }
        //if no connection is in "conecting" state make popup closable
        root.closePolicy = Popup.CloseOnPressOutside
    }

    function connect(type) {
        connectRequested(type)
    }

    enter: Transition {
        NumberAnimation { properties: "scale"; to: 1; duration: 300; easing.type: Easing.Linear }
    }

    exit: Transition {
        NumberAnimation { properties: "scale"; to: 0; duration: 300; easing.type: Easing.Linear }
    }

    background: Rectangle {
        radius: width * 0.5
        color: StyleSettings.viewColor
        border.color: StyleSettings.lineColor
        border.width: 1

        Label {
            id: head_text
            text: options_stack.currentItem.title
            font.pixelSize: headlineUnderline.width * 0.05
            color: enabled ? StyleSettings.textColor:StyleSettings.disabledTextColor
            anchors {
                horizontalCenter: parent.horizontalCenter
                top: parent.top
                topMargin: headlineUnderline.anchors.topMargin / 2 - height / 2
            }
        }

        Rectangle {
            id: headlineUnderline
            height: 1
            width: parent.width
            color: StyleSettings.lineColor
            anchors {
                top: parent.top
                left: parent.left
                right: parent.right
                topMargin: parent.height * 0.15
                rightMargin: parent.radius - Math.sqrt(Math.pow(parent.radius,2)-Math.pow(parent.radius-anchors.topMargin,2))
                leftMargin: parent.radius - Math.sqrt(Math.pow(parent.radius,2)-Math.pow(parent.radius-anchors.topMargin,2))
            }
        }

        Button {
            id: head_back
            anchors {
                left: parent.left
                leftMargin: parent.width * 0.17
                top:parent.top
                topMargin: parent.height * 0.01
            }

            height: parent.height * 0.13
            width: height
            opacity: root.closePolicy === Popup.NoAutoClose ? 0:1
            enabled: opacity > 0

            background: Rectangle {
                radius: width * 0.5
                color: parent.pressed ? StyleSettings.buttonPressedColor:StyleSettings.buttonColor
                border.color: StyleSettings.buttonBorderColor
                border.width: 1
                Image {
                    anchors.fill: parent
                    anchors.margins: parent.width * 0.2
                    source: StyleSettings.backIcon

                }
            }

            onClicked: {
                 options_stack.depth > 1 ? options_stack.pop():root.close()
            }

            Behavior on opacity {
                NumberAnimation {
                    duration: 200
                }
            }
        }

    }

    StackView {
        id: options_stack
        property int text_pixelSize: root.height * 0.06
        property int rowSpacing: root.height * 0.01
        initialItem: settings
        width: headlineUnderline.width

        enabled: opacity !== 0 //disable when not visible

        anchors  {
            top: parent.top
            left: parent.left
            leftMargin: ( parent.width - headlineUnderline.width ) / 2
            topMargin: headlineUnderline.anchors.topMargin * 0.8
            bottom: parent.bottom
        }

        Behavior on opacity {
            NumberAnimation {duration: 200}
        }

        /*-----start page of the settings-----*/
        Component {
            id: settings

            Column {
                property string title: qsTr("Options")
                id: settings_col
                spacing: options_stack.rowSpacing

                /*----Connect to external devices----*/
                NextPageDelegate {
                    id: connect_del
                    text: qsTr("extentions")
                    onClicked: {
                        options_stack.push(connect)
                    }
                }

                /*----Automated Start----*/
                NextPageDelegate {
                    id: autostart_del
                    text: qsTr("start sequence")

                    onClicked: {
                        options_stack.push(autostart)
                    }
                }

                /*----Style Settings----*/
                ItemDelegate {
                    id: style_del
                    text: qsTr("change style")
                    width: parent.width

                    contentItem: Text {
                        text: parent.text
                        color: StyleSettings.textColor
                        font.pixelSize: options_stack.text_pixelSize
                    }

                    onClicked: {
                        StyleSettings.setTheme()
                    }
                }

                /*----Error Dialog----*/
                ItemDelegate {
                    id: error_del
                    text: qsTr("open error popup")
                    width: parent.width

                    contentItem: Text {
                        text: parent.text
                        color: StyleSettings.textColor
                        font.pixelSize: options_stack.text_pixelSize
                    }

                    onClicked: {
                        errorDialog.open()
                    }
                }
            }
        }

        /*-----Page to connect to extenstions like a startpad or buzzer-----*/
        Component {
            id: connect
            Column {
                id: connect_col
                property string title: qsTr("extentions")
                property int delegateHeight: height*0.18

                NextPageDelegate {
                    id: baseConn_del
                    text: qsTr("Base Station")

                    onClicked: {
                        options_stack.push(baseStation)
                    }
                }

                ConnectionDelegate {
                    id: connect_buzz_del

                    status: root.connections.buzzer
                    connect: root.connect
                    type: "buzzer"

                    width: parent.width
                    font.pixelSize: options_stack.text_pixelSize
                }

                ConnectionDelegate {
                    id: connect_stap_del

                    status: root.connections.startpad
                    connect: root.connect
                    type: "startpad"

                    width: parent.width
                    font.pixelSize: options_stack.text_pixelSize
                }
            }
        }

        /*-----Page to setup automatc start sequence-----*/
        Component {
            id: autostart
            Column {
                id: autostart_col
                property string title: "Autostart"
                property int delegateHeight: height*0.18

                function updateSett(key, val, del){
                    del.enabled = false
                    _cppAppSettings.writeSetting(key, val)
                    if(baseConn.state === "connected"){
                        switch(key){
                        case "ready_en":
                            key = "READY_EN"
                            break
                        case "ready_delay":
                            key = "READY_DELAY"
                            break
                        case "at_marks_en":
                            key = "AT_MARKS_EN"
                            break
                        case "at_marks_delay":
                            key = "AT_MARKS_DELAY"
                            break
                        }
                        baseConn.sendCommand("SET_SETTING_"+key+"_"+val)
                    }
                    del.enabled = true
                }

                SwitchDelegate {
                    id: ready_del
                    text: qsTr("say 'ready'")
                    contentItem: Text {
                        text: parent.text
                        color: StyleSettings.textColor
                        font.pixelSize: options_stack.text_pixelSize
                    }

                    checked: _cppAppSettings.loadSetting("ready_en") === "true"
                    width: parent.width
                    height: parent.delegateHeight

                    font.pixelSize: options_stack.text_pixelSize

                    onCheckedChanged: {
                        parent.updateSett("ready_en",checked, ready_del)

                    }

                    indicator: SimpleIndicator{}
                }

                ItemDelegate {
                    id: ready_delay_del
                    text: qsTr("delay (ms)")
                    contentItem: Text {
                        text: parent.text
                        color: StyleSettings.textColor
                        font.pixelSize: options_stack.text_pixelSize
                    }

                    enabled: ready_del.checked
                    width: parent.width
                    font.pixelSize: options_stack.text_pixelSize
                    height: parent.delegateHeight

                    TextField {
                        focus: true
                        placeholderText: qsTr("time")
                        width: parent.width * 0.3
                        height: parent.height
                        anchors.right: parent.right
                        anchors.verticalCenter: parent.verticalCenter
                        inputMethodHints: Qt.ImhFormattedNumbersOnly

                        text: _cppAppSettings.loadSetting("ready_delay")

                        onTextChanged: {
                            autostart_col.updateSett("ready_delay", text, ready_delay_del)
                        }
                    }
                }

                SwitchDelegate {
                    id: at_marks_del
                    text: qsTr("say\n'at your marks'")
                    contentItem: Text {
                        text: parent.text
                        color: StyleSettings.textColor
                        font.pixelSize: options_stack.text_pixelSize
                    }

                    checked: _cppAppSettings.loadSetting("at_marks_en") === "true"
                    width: parent.width
                    //height: parent.delegateHeight * 1.5

                    font.pixelSize: options_stack.text_pixelSize

                    onCheckedChanged: {
                        parent.updateSett("at_marks_en",at_marks_del.checked, at_marks_del)
                    }

                    indicator: SimpleIndicator{}
                }

                ItemDelegate {
                    id: at_marks_delay_del
                    text: qsTr("delay (ms)")
                    contentItem: Text {
                        text: parent.text
                        color: StyleSettings.textColor
                        font.pixelSize: options_stack.text_pixelSize
                    }

                    enabled: at_marks_del.checked
                    width: parent.width
                    height: parent.delegateHeight

                    font.pixelSize: options_stack.text_pixelSize

                    TextField {
                        focus: true
                        placeholderText: qsTr("time")
                        width: parent.width * 0.3
                        height: parent.height
                        anchors.right: parent.right
                        anchors.verticalCenter: parent.verticalCenter
                        inputMethodHints: Qt.ImhFormattedNumbersOnly

                        text: _cppAppSettings.loadSetting("at_marks_delay")

                        onTextChanged: {
                            autostart_col.updateSett("at_marks_delay",text, at_marks_delay_del)
                        }
                    }
                }
            }
        }

        /*-----Page to connect to and manage the Base Station----*/
        Component {
            id: baseStation
            Column {
                id: baseStation_col
                property string title: qsTr("Base Station")
                property int delegateHeight: height*0.18

                ConnectionDelegate {
                    id: connect_base_del
                    text: "connect"

                    status: root.connections.baseStation
                    connect: root.connect
                    type: "baseStation"

                    width: parent.width
                    font.pixelSize: options_stack.text_pixelSize
                }

                NextPageDelegate {
                    id: baseStationConnections_del
                    text: qsTr("connected extentions")

                    onClicked: {
                        baseConn.refreshConnections()
                        options_stack.push(baseStationConnections)
                    }
                }
            }
        }

        /*-----Page to view devices that core connected to the pase startion-----*/
        Component{
            id: baseStationConnections
                ListView {
                    function getModel(){
                        var keys = Object.keys(baseConn.connections);

                        var len = keys.length
                        return(len)
                    }

                    function getDetails(index){
                        var ret = baseConn.connections[index]
                        var details = ret.split("|")
                        return(details)
                    }

                    id: baseStationConnections_list
                    property string title: qsTr("connections")
                    property int delegateHeight: height*0.18
                    model: getModel()
                    delegate: ConnectionDelegate {
                        enabled: false
                        font.pixelSize: options_stack.text_pixelSize
                        width: parent.width
                        height: baseStationConnections_list.delegateHeight

                        text: baseStationConnections_list.getDetails(index)[2]
                        status: {'status': baseStationConnections_list.getDetails(index)[4], 'progress': 0}
                    }
                }

        }

        /*-----Custom animations-----*/

        pushEnter: Transition {
            NumberAnimation {
                property: "opacity"
                from: 0
                to: 1
                duration: 200
                easing.type: Easing.InOutQuad
            }
        }
        pushExit: Transition {
            NumberAnimation {
                property: "opacity"
                from: 1
                to: 0
                duration: 200
                easing.type: Easing.InOutQuad
            }
        }

        popExit: Transition {
            NumberAnimation {
                property: "opacity"
                from: 1
                to: 0
                duration: 200
                easing.type: Easing.InOutQuad
            }
        }
        popEnter: Transition {
            NumberAnimation {
                property: "opacity"
                from: 0
                to: 1
                duration: 200
                easing.type: Easing.InOutQuad
            }
        }
    }


}