import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
import QtGraphicalEffects 1.0

import Controls 1.0 as Controls
import Screens 1.0 as Screens
import Cubo 1.0
import Utils 1.0

ApplicationWindow {
    id: window
    title: qsTr("Cubo Verde BMS Tool")
    width: 1366
    height: 768
    visible: true

    RowLayout {
        anchors.fill: parent
        spacing: 0

        Rectangle {
            id: pane
            color: Palette.alternativeBackgroundColor
            implicitWidth: 300

            property bool minimized: false

            ColumnLayout {
                anchors.fill: parent
                spacing: 0

                Item {
                    Layout.preferredHeight: 40
                }

                Image {
                    source: "qrc:/Icons/cubo-logo.svg"
                    sourceSize.width: pane.minimized ? 80 : 115
                    sourceSize.height: pane.minimized ? 80 : 115
                    Layout.alignment: Qt.AlignCenter
                }

                Item {
                    Layout.preferredHeight: pane.minimized ? 75 : 40
                }

                ItemDelegate {
                    leftPadding: pane.minimized ? 0 : 40

                    contentItem: RowLayout {
                        height: 50
                        spacing: 25

                        Item {
                            visible: pane.minimized
                            Layout.fillWidth: true
                        }

                        Image {
                            source: "qrc:/Icons/hide-menu.svg"
                            mirror: pane.minimized
                            Layout.alignment: Qt.AlignCenter
                        }

                        Label {
                            text: qsTr("Hide menu")
                            color: Palette.alternativeTextColor
                            visible: !pane.minimized
                        }

                        Item {
                            Layout.fillWidth: true
                        }
                    }

                    background: Rectangle {
                        color: "transparent"
                    }

                    onClicked: if (pane.implicitWidth === 300) {
                                   animation.from = 300
                                   animation.to = 100
                                   animation.running = true
                                   pane.minimized = true
                               } else {
                                   animation.from = 100
                                   animation.to = 300
                                   animation.running = true
                                   pane.minimized = false
                               }

                    Layout.preferredHeight: 52
                    Layout.fillWidth: true
                }

                Item {
                    Layout.preferredHeight: 70
                }

                ListView {
                    id: menuView
                    model: [
                        {"text": qsTr("AKB monitor"), "icon": "qrc:/Icons/akb-monitor.svg"},
                        {"text": qsTr("Cell monitor"), "icon": "qrc:/Icons/cell-monitor.svg"},
                        {"text": qsTr("Configuration"), "icon": "qrc:/Icons/bms-configuration.svg"},
                        {"text": qsTr("Visualization"), "icon": "qrc:/Icons/visualization.svg"},
                        {"text": qsTr("History"), "icon": "qrc:/Icons/history.svg"},
                        {"text": qsTr("BMS service"), "icon": "qrc:/Icons/bms-service.svg"},
//                        {"text": qsTr("Exit"), "icon": "qrc:/Icons/exit.svg"},
                    ]

                    delegate: ItemDelegate {
                        id: menuDelegate
                        width: ListView.view.width
                        height: 52
                        leftPadding: pane.minimized ? 0 : 40
                        highlighted: ListView.isCurrentItem
                        onClicked: menuView.currentIndex = index

                        contentItem: RowLayout {
                            spacing: pane.minimized ? 0 : 25
                            height: 50

                            Item {
                                visible: pane.minimized
                                Layout.fillWidth: true
                            }

                            Image {
                                source: modelData.icon
                                Layout.alignment: Qt.AlignCenter
                            }

                            Label {
                                text: modelData.text
                                font.weight: Font.Bold
                                color: Palette.alternativeTextColor
                                visible: !pane.minimized
                            }

                            Item {
                                Layout.fillWidth: true
                            }
                        }

                        background: Rectangle {
                            color: menuDelegate.highlighted ? Palette.pressedButtonColor : Palette.buttonColor
                        }
                    }

                    Layout.fillHeight: true
                    Layout.fillWidth: true
                }

                ItemDelegate {
                    leftPadding: pane.minimized ? 0 : 40
                    onClicked: connectionDialog.open()

                    contentItem: RowLayout {
                        spacing: pane.minimized ? 0 : 25
                        height: 50

                        Item {
                            visible: pane.minimized
                            Layout.fillWidth: true
                        }

                        Image {
                            source: "qrc:/Icons/connection.svg"
                            sourceSize.width: 24
                            sourceSize.height: 24
                            Layout.alignment: Qt.AlignCenter

                            ColorOverlay {
                                anchors.fill: parent
                                source: parent
                                color: "#FFFFFF"
                            }
                        }

                        Label {
                            text: qsTr("Connection")
                            font.weight: Font.Bold
                            color: Palette.alternativeTextColor
                            visible: !pane.minimized
                        }

                        Item {
                            Layout.fillWidth: true
                        }
                    }

                    background: Rectangle {
                        color: parent.down ? Palette.pressedButtonColor : Palette.buttonColor
                    }

                    Layout.fillWidth: true
                }

                Item {
                    Layout.preferredHeight: 40
                }
            }

            PropertyAnimation {
                id: animation
                target: pane
                property: "implicitWidth"
                duration: 200
                easing.type: Easing.InQuad
            }

            Layout.preferredWidth: implicitWidth
            Layout.fillHeight: true
        }

        ColumnLayout {
            RowLayout {
                id: topBar

                property var labels: [
                    qsTr("AKB monitor"),
                    qsTr("Cell monitor"),
                    qsTr("BMS settings"),
                    qsTr("Visualization"),
                    qsTr("Information output"),
                    qsTr("Terminal"),
                    qsTr("Exit"),
                ]

                Label {
                    text: topBar.labels[stack.currentIndex]
                    font.pixelSize: 38
                    font.weight: Font.Bold
                }

                Item {
                    Layout.fillWidth: true
                }

                RowLayout {
                    ColumnLayout {
                        RowLayout {
                            Controls.ContentLabel {
                                id: connectionStatusLabel
                                text: qsTr("Disconnected")
                                Layout.alignment: Qt.AlignRight
                            }

                            Controls.AvailabilityIndicator {
                                id: connectionStatusIndicator
                                enabled: false
                                Layout.alignment: Qt.AlignCenter
                            }

                            Controls.ContentLabel {
                                text: qsTr("V1.3")
                                Layout.alignment: Qt.AlignRight
                            }

                            Layout.alignment: Qt.AlignRight
                        }

                        RowLayout {
                            Controls.ContentLabel {
                                text: qsTr("Serial number") + ":"
                                Layout.alignment: Qt.AlignRight
                            }

                            Controls.SubtitleLabel {
                                text: qsTr("9999997")
                                Layout.alignment: Qt.AlignRight
                            }

                            Layout.alignment: Qt.AlignRight
                        }
                    }
                }

                Layout.leftMargin: 45
                Layout.rightMargin: 45
            }

            StackLayout {
                id: stack
                currentIndex: menuView.currentIndex

                Layout.fillWidth: true
                Layout.fillHeight: true
                Layout.leftMargin: 45
                Layout.rightMargin: 45
                Layout.bottomMargin: 30

                Screens.AkbMonitorScreen {
                }

                Screens.CellMonitorScreen {
                }

                Screens.BmsSettingsScreen {
                }

                Screens.VisualizationScreen {
                }

                Screens.DebugInformationScreen {
                }

                Screens.BmsServiceScreen {
                }
            }
        }
    }

    Connections {
        target: BmsInterface

        onPortConnectedChanged: {
            connectionStatusLabel.text = BmsInterface.isPortConnected() ? qsTr("Connected") : qsTr("Disconnected")
            connectionStatusIndicator.enabled = BmsInterface.isPortConnected()
        }

        onMessageDialog: {
            if (!messageDialog.visible) {
                messageDialog.title = title
                messageDialog.description = msg
                messageDialog.good = isGood
                messageDialog.open()
            } else {
                messageDialog.queue.push({"title": title, "description": msg, "good": isGood})
            }
        }

        onStatusMessage: {
            for (var i = 0; i < statusPopup.filteredStatuses.length; ++i) {
                if (msg === statusPopup.filteredStatuses[i]) {
                    return
                }
            }

            if (!statusPopup.visible) {
                statusPopup.text = msg
                statusPopup.good = isGood
                statusPopup.open()
                hideStatusTimer.start()
            } else {
                if (statusPopup.text !== msg) {
                    statusPopup.queue.push({"text": msg, "good": isGood})
                }
            }
        }
    }

    Screens.ConnectionDialog {
        id: connectionDialog
    }

    Screens.MessageDialog {
        id: messageDialog
        property var queue: []
        onClosed: {
            if (queue.length > 0) {
                var message = queue.pop()
                messageDialog.title = message.title
                messageDialog.description = message.description
                messageDialog.good = message.good
                messageDialog.open()
            }
        }
    }

    Screens.StatusPopup {
        id: statusPopup

        property var filteredStatuses: [qsTr("BMS configuration updated")]
        property var queue: []

        onClosed: {
            if (queue.length > 0) {
                var message = queue.pop()
                statusPopup.text = message.text
                statusPopup.good = message.good
                statusPopup.open()
                hideStatusTimer.start()
            }
        }
    }

    Timer {
        id: hideStatusTimer
        interval: 3000
        onTriggered: statusPopup.close()
    }

    background: Rectangle {
        color: Palette.screenBackgroundColor
    }

    Component.onCompleted: {
//        BmsInterface.bmsConfig().loadParamsXml("://res/config.xml")
//        BmsInterface.infoConfig().loadParamsXml("://res/info.xml")

        connectionDialog.open()
    }
}
