// Copyright (C) 2024 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial

import QtQuick 2.0
import StyleModule 1.0

/*
    This component controls the positioning and transitions of the configuration views
*/

Item {
    id: root

    function addHighscore() {
        highscoreView.addHighscore()
    }

    function setState(newState : string) {
        root.state = newState
    }

    signal startRequested()

    implicitWidth: Style.appSize
    implicitHeight: Style.appSize

    clip: true
    state: "Start"
    states: [
        State {
            name: "Start"
            PropertyChanges { target: viewContainer; x: 0; y: 0 }
        },
        State {
            name: "Config"
            PropertyChanges { target: viewContainer; x: 0; y: viewContainer.height }
        },
        State {
            name: "Highscore"
            PropertyChanges { target: viewContainer; x: 0; y: -viewContainer.height }
        },
        State {
            name: "Time"
            PropertyChanges { target: viewContainer; x: viewContainer.width; y: 0 }
        },
        State {
            name: "Number"
            PropertyChanges { target: viewContainer; x: -viewContainer.width; y: 0 }
        }
    ]

    Item {
        id: viewContainer

        width: Style.appSize
        height: Style.appSize

        Behavior on x {
            NumberAnimation { duration: Globals.useViewAnimations ? Style.animationDuration : 0 }
        }
        Behavior on y {
            NumberAnimation { duration: Globals.useViewAnimations ? Style.animationDuration : 0 }
        }

        StartView {
            id: startView

            onSwipeDownTriggered: setState("Config")
            onSwipeUpTriggered: setState("Highscore")
            onSwipeLeftTriggered: setState("Number")
            onSwipeRightTriggered: setState("Time")
            onStartRequested: root.startRequested()
        }

        ConfigView {
            id: configView

            y: -height
            onSwipeTriggered: setState("Start")
        }

        HighscoreView {
            id: highscoreView

            y: height
            onSwipeTriggered: setState("Start")
        }

        TimeView {
            id: timeView

            x: -width
            onSwipeTriggered: setState("Start")
        }

        NumberView {
            id: numberView

            x: width
            onSwipeTriggered: setState("Start")
        }
    }
}