app/resources/qml/main.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.0
import QtQuick.Controls 2.12
import QtGraphicalEffects 1.0
import QtQuick.Layouts 1.0

import "."
import "./components"
import "./ProfilesDialog"
import "./SettingsDialog"
import "./components/layout"
import "./MainPage"
//import QtQuick.Layouts 1.11

import de.itsblue.ScStw 2.0
import de.itsblue.ScStw.Styling 2.0
import de.itsblue.ScStw.Styling.Components 1.0
import de.itsblue.ScStwApp 2.0

Window {
    visible: true
    //width: 540
    //height: 960

    width: XscreenWidth
    height: XscreenHeight
    title: "ScStwApp"

    Page {
        id: app
        anchors.fill: parent

        //set default state to IDLE
        state: ScStwRace.IDLE

        Rectangle {
            id: backgroundRect
            anchors.fill: parent
            color: appTheme.theme.colors.background

            Behavior on color {
                ColorAnimation {
                    duration: 200
                }
            }
        }

        ScStw {
            id: scStw
        }

        SpeedBackend {
            id: speedBackend
        }

        Connections {
            target: speedBackend.race
            onStateChanged: {
                var stateString
                console.log("race state changed to: " + speedBackend.race.state)

                if(speedBackend.race.state != ScStwRace.IDLE) {
                    //settingsDialog.close()
                }

                app.state = speedBackend.race.state
            }
        }

        ScStwAppThemeManager {
            id: appTheme
            property ScStwSetting setting: speedBackend.settings.getSetting(ScStwAppSettings.AppThemeSetting, ScStwAppSettings.KeyLevel)
            themeName: setting.value
        }

        // ---------------
        // - Main layout -
        // ---------------

        GridLayout {
            id: mainLayout

            anchors.fill: parent

            columns: app.landscape() ? 3:1
            rows: app.landscape() ? 1:3

            TopToolBar {
                id: topToolBar

                state: app.state

                sizeMode: "large"
            }


            CenterContent {
                id: centerContent

                state: app.state

                Layout.fillWidth: true
                Layout.fillHeight: true
            }

            BottomToolBar {
                id: bottomToolBar

                sizeMode: "tiny"
            }

        }

        states: [
            State {
                name: ScStwRace.IDLE

                PropertyChanges {
                    target: topToolBar
                    sizeMode: "small"
                }

                PropertyChanges {
                    target: bottomToolBar
                    sizeMode: "small"
                }
            },

            State {
                name: ScStwRace.PREPAIRING

                PropertyChanges {
                    target: topToolBar
                    sizeMode: "medium"
                }

                PropertyChanges {
                    target: bottomToolBar
                    sizeMode: "tiny"
                }
            },

            State {
                name: ScStwRace.WAITING

                PropertyChanges {
                    target: topToolBar
                    sizeMode: "medium"
                }

                PropertyChanges {
                    target: bottomToolBar
                    sizeMode: "tiny"
                }
            },

            State {
                name: ScStwRace.STARTING

                PropertyChanges {
                    target: topToolBar
                    sizeMode: "medium"
                }

                PropertyChanges {
                    target: bottomToolBar
                    sizeMode: "tiny"
                }
            }
        ]


        /*------
          Popups
        ------
        SettingsDialog{
            id: settingsDialog

            x: startButt.x
            y: startButt.y
            width: startButt.width
            height: startButt.height
        }

        ProfilesDialog {
            id: profilesDialog

            property int margin: app.landscape() ? app.height * 0.05:app.width * 0.05

            x: app.landscape() ? topContainerItm.width + margin:topContainerItm.x + margin
            y: !app.landscape() ? topContainerItm.height + margin:topContainerItm.x + margin
            width: app.landscape() ? app.width - topContainerItm.width - menu_container.width - margin * 2 : app.width - margin * 2
            height: !app.landscape() ? app.height - topContainerItm.height - menu_container.height - margin * 2 : app.height - margin * 2
        }

        states: [
            State {
                name: "IDLE"
                //state for the start page
                PropertyChanges {
                    target: topContainerItm;
                    anchors.bottomMargin: app.landscape() ? undefined:parent.height * 0.1;
                    anchors.rightMargin: app.landscape() ? parent.height * 0.05:0
                }
                PropertyChanges {
                    target: startButt;
                    enabled: true;
                    text: "start";
                    size: app.landscape() ? parent.width * 0.5:parent.height * 0.5
                    anchors.bottomMargin: parent.height * 0.5 - startButt.height * 0.5
                    anchors.rightMargin: parent.width * 0.5 - startButt.width * 0.5
                }
                PropertyChanges {
                    target: topLa
                    text: "click start to start"
                }

            },
            State {
                name: "PREPAIRING"
                //state for the start sequence
                PropertyChanges { target: startButt; enabled: false; text: "starting...";
                    anchors.rightMargin: app.landscape() ? parent.width * 0.05:parent.width * 0.5 - startButt.width * 0.5 //put the button more to the right to hide the menu (only in landscape mode)
                    anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.1 //put the button lower to hide the menu (only in portrait mode)
                }
                PropertyChanges { target: cancelButt; scale: 1}
                PropertyChanges { target: menu_container; }
                PropertyChanges {
                    target: topLa
                    text: "At your marks"
                }
            },
            State {
                name: "WAITING"
                PropertyChanges {
                    target: startButt; enabled: false; text: "waiting...";
                    anchors.rightMargin: app.landscape() ? parent.width * 0.05:parent.width * 0.5 - startButt.width * 0.5 //put the button more to the right to hide the menu (only in landscape mode)
                    anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.1 //put the button lower to hide the menu (only in portrait mode)
                }
                PropertyChanges { target: cancelButt; scale: 0; enabled: false}
                PropertyChanges { target: menu_container; }
                PropertyChanges {
                    target: topLa
                    implicitText: "Ready"
                }
            },
            State {
                name: "STARTING"
                //state for the start sequence
                PropertyChanges { target: startButt; enabled: false; text: "starting...";
                    anchors.rightMargin: app.landscape() ? parent.width * 0.05:parent.width * 0.5 - startButt.width * 0.5 //put the button more to the right to hide the menu (only in landscape mode)
                    anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.1 //put the button lower to hide the menu (only in portrait mode)
                }
                PropertyChanges { target: cancelButt; scale: 1}
                PropertyChanges { target: menu_container; }
                PropertyChanges {
                    target: topLa
                    implicitText: "Starting"
                }

            },
            State {
                name: "RUNNING"
                //state when the timer is running
                PropertyChanges { target: startButt; enabled: true;
                    text: speedBackend.scStwClient.state === ScStwClient.CONNECTED ? "cancel":"stop"
                    anchors.rightMargin: app.landscape() ? parent.width * 0.05:parent.width * 0.5 - startButt.width * 0.5 //put the button more to the right to hide the menu (only in landscape mode)
                    anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.1 //put the button lower to hide the menu (only in portrait mode)
                }
                PropertyChanges {
                    target: topLa
                    implicitText: ""
                }
            },

            State {
                name: "STOPPED"
                //state when the meassuring is over
                PropertyChanges {
                    target: startButt;
                    enabled: true; text: "reset";
                    size: app.landscape() ? parent.height * 0.35:parent.height * 0.2;
                    anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.2 - startButt.height * 0.5
                    anchors.rightMargin: app.landscape() ? parent.height * 0.2 - startButt.height * 0.5:parent.width * 0.5 - startButt.width * 0.5
                }
                PropertyChanges {
                    target: topContainerItm;
                    anchors.rightMargin: app.landscape() ? 0-startButt.width/2:undefined
                    anchors.bottomMargin: app.landscape() ? undefined:0-startButt.height/2
                }
                PropertyChanges {
                    target: topLa
                    text: ""
                }
            },

            State {
                name: "INCIDENT"
                //state when the meassuring is over
                PropertyChanges {
                    target: startButt;
                    enabled: true; text: "reset";
                    size: app.landscape() ? parent.height * 0.35:parent.height * 0.2;
                    anchors.bottomMargin: app.landscape() ? parent.height * 0.5 - startButt.height * 0.5:parent.height * 0.2 - startButt.height * 0.5
                    anchors.rightMargin: app.landscape() ? parent.height * 0.2 - startButt.height * 0.5:parent.width * 0.5 - startButt.width * 0.5
                }
                PropertyChanges {
                    target: topContainerItm;
                    anchors.rightMargin: app.landscape() ? 0-startButt.width/2:undefined
                    anchors.bottomMargin: app.landscape() ? undefined:0-startButt.height/2
                }
                PropertyChanges {
                    target: topLa
                    text: ""
                }
            }
        ]

        /*----------------------
          Timer animations
        ----------------------*/
        /*transitions: [
            Transition {
                NumberAnimation { properties: "size,rightMargin,height,width,bottomMargin,font.pixelSize,pixelSize"; easing.type: Easing.InOutQuad; duration: 700 }
            },
            Transition {
                to: "STOPPED"
                NumberAnimation { properties: "size,rightMargin,height,width,bottomMargin,font.pixelSize,pixelSize"; easing.type: Easing.InOutQuad; duration: 700 }
            },
            Transition {
                to: "IDLE"
                NumberAnimation { properties: "size,rightMargin,height,width,bottomMargin,font.pixelSize,pixelSize"; easing.type: Easing.InOutQuad; duration: 700 }
            },

            Transition {
                from: "STARTING"
                to: "RUNNING"
                //disable transitions for the RUNNING state
            },
            Transition {
                from: "RUNNING"
                to: "WAITING"
                //disable transitions for the RUNNING state
            }
        ]*/

        /*----------------------
          Timer functions
        ----------------------*/
        function landscape(){
            return(app.height < app.width)
        }

        /*----Functions to control the stopwatch----*/
        function start(){
            var ret = speedBackend.race.start()
            if(ret !== 200){
                console.log("+ --- error starting race: " + ret)
            }
        }

        function cancel() {
            var ret = speedBackend.race.cancel()
            if(ret !== 200){
                console.log("+ --- error canellingr race: " + ret)
            }
        }

        function stop(){

            var ret = speedBackend.race.stop()

            if(ret !== 200){
                console.log("+ --- error stopping race: " + ret)
            }
        }

        function reset(){

            var ret = speedBackend.race.reset()

            if(ret !== 200){
                console.log("+ --- error resetting race: " + ret)
            }
        }
    }
}