import QtQuick 2.12
import QtMultimedia 5.8
import QtQuick.Window 2.2
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.3
import QtGraphicalEffects 1.0
import QtQuick.Controls.Styles 1.4
import QtQuick.Templates 2.12 as T


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

import "../components"

Column {
    id: control

    property string title: qsTr("base station")

    property bool baseConnected: speedBackend.scStwClient.state === ScStwClient.CONNECTED
    property var parentObj

    opacity: 0

    ConnectionDelegate {
        id: connectToBaseDel

        function clientStateToString(state) {
            switch(state) {
            case ScStwClient.DISCONNECTED:
                return "disconnected"
            case ScStwClient.CONNECTING:
                return "connecting"
            case ScStwClient.INITIALISING:
                return "connecting"
            case ScStwClient.CONNECTED:
                return "connected"
            }
        }

        text: status.status === "connected" ? qsTr("disconnect"): status.status === "disconnected" ? qsTr("connect"):qsTr("connecting...")

        status: { "status": clientStateToString(speedBackend.scStwClient.state), "progress": 100 }
        connect: speedBackend.scStwClient.connectToHost
        disconnect: speedBackend.scStwClient.closeConnection
        type: "baseStation"

        width: parent.width
        height: parentObj.delegateHeight
    }

    Item {
        width: parent.width
        height: parent.height * 0.05

        Rectangle {
            anchors {
                top: parent.top
                left: parent.left
                right: parent.right
            }

            height: 2
            color: appTheme.theme.colors.line
        }
    }

    StackView {
        id: baseStationOptionsLd

        width: parent.width
        height: parent.height

        property alias parentComp: control
        property Component sourceComponent: control.baseConnected ? baseStationConnectedOptionsComp : baseStationDisconnectedOptionsComp

        onSourceComponentChanged: {
            baseStationOptionsLd.replace(sourceComponent)
        }

        Component.onCompleted: {
            baseStationOptionsLd.replace(sourceComponent)
        }

        replaceExit: Transition {
            ParallelAnimation {
                id: disappearAnim

                NumberAnimation {
                    property: "opacity"
                    to: 0
                    duration: 100
                }

                NumberAnimation {
                    property: "scale"
                    to: 0.95
                    duration: 100
                }
            }
        }

        replaceEnter: Transition {
            ParallelAnimation {
                id: appearAnim

                NumberAnimation {
                    property: "opacity"
                    from: 0
                    to: 1
                    duration: 100
                }

                NumberAnimation {
                    property: "scale"
                    from: 0.95
                    to: 1
                    duration: 100
                }
            }
        }
    }

    Component {
        id: baseStationDisconnectedOptionsComp

        Column {
            id: baseStationDisconnectedOptions

            opacity: 0      // opacity and scale are adjusted by baseStationOptionsLd
            scale: 0.95

            InputDelegate {
                id: baseStationIpDel

                text: qsTr("IP")

                inputHint: "IP"
                inputText: scStwAppSettings.readSetting(ScStwAppSettings.BaseStationIpSetting)
                inputTextFieldWidth: width * 0.7

                onInputTextChanged: {
                    scStwAppSettings.writeSetting(ScStwAppSettings.BaseStationIpSetting, inputText)
                }

                width: parent.width
                height: parentObj.delegateHeight

                visible: height > 5

                Behavior on height {
                    NumberAnimation {
                        duration: 400
                        easing.type: Easing.Linear
                    }
                }
            }

            SmoothItemDelegate {
                id: baseStationHelpDel

                width: parent.width
                height: parentObj.delegateHeight

                text: qsTr("what is this for?")

                onClicked: {
                    Qt.openUrlExternally("https://itsblue.de/index.php/speed-climbing?ref=ScStwApp")
                }
            }

        }

    }

    Component {
        id: baseStationConnectedOptionsComp

        Column {
            id: baseStationConnectedOptions

            width: parentComp.width

            Label {
                id: headerLabel

                width: parent.width
                height: parentObj.delegateHeight

                scale: 0
                visible: false

                verticalAlignment: Text.AlignVCenter
                horizontalAlignment: Text.AlignHCenter

                fontSizeMode: Text.Fit
                font.pixelSize: height

                minimumPixelSize: 1

                color: appTheme.theme.colors.text

                text: "ScStwBaseStation"
            }

            Label {
                id: firmwareVersionLabel

                width: parent.width
                height: parentObj.delegateHeight * 0.3


                verticalAlignment: Text.AlignTop
                horizontalAlignment: Text.AlignHCenter

                fontSizeMode: Text.Fit
                font.pixelSize: height

                minimumPixelSize: 1

                color: appTheme.theme.colors.line

                text: "Firmware: " + speedBackend.scStwClient.getFirmwareVersion() + "    API: " + speedBackend.scStwClient.getApiVersion()
            }

            SmoothSliderDelegate {
                id: baseStationVolumeDel

                property ScStwSetting setting: scStwAppSettings.getSetting(ScStwSettings.SoundVolumeSetting, ScStwSettings.KeyLevel)

                text: qsTr("volume")

                width: parent.width
                height: parentObj.delegateHeight * 0.8

                font.pixelSize: height * 0.5

                sliderValue: setting.value

                onSliderFinished: {
                    enabled = false
                    setting.value = sliderValue
                    enabled = true
                }
            }

            SmoothSwitchDelegate {
                property ScStwSetting setting: scStwAppSettings.getSetting(ScStwSettings.CompetitionModeSetting, ScStwSettings.KeyLevel)

                width: parent.width
                height: parentObj.delegateHeight

                checked: setting.value

                onCheckedChanged: {
                    enabled = false
                    setting.value = checked
                    enabled = true
                }

                text: qsTr("competition mode")
            }

            NextPageDelegate {
                text: qsTr("extensions")

                width: parent.width
                height: parentObj.delegateHeight * 0.8

                font.pixelSize: height * 0.5

                onClicked: {
                    parentObj.push(extensions)
                }
            }
        }
    }
}