import QtQuick 2.12
import QtQuick.Controls 2.12 // StackView

import "qrc:/components"
import "qrc:/globals"

Rectangle { id: _root

    property alias menuHidden               : _headerMenu.hidden
    property alias headerMenuIndex          : _headerMenu.index
    property alias loggedUser               : _loggedInUser.text
    readonly property int currentScreen     : _headerMenu.currentScreen
    property bool isCreateRx                : false     // This is to hide in the create rx icon in the screen only
    property bool isHeparinFeatured         : vSettings.heparinSyringePump
    property bool isHDFFeatured             : vTreatmentCreate.treatmentModality === HeaderBar.Mode_HDF
    property StackView activeStack          : null

    width   : Variables.applicationWidth
    height  : Variables.headerHeight
    clip    : true

    gradient: Gradient {
        GradientStop { position: 0.2; color: Qt.lighter(Colors.backgroundMain, 1.2) }
        GradientStop { position: 0.8; color: Qt.darker (Colors.backgroundMain, 1.2) }
    }

    enum TreatmentScreen {
        Treatment   = 0,
        Trends      = 1,
        Heparin     = 2,
        HDF         = 3
    }

    onIsHeparinFeaturedChanged  : vListModel.setHeaderbarVisible(HeaderBar.Heparin, _root.isHeparinFeatured)
    Component.onCompleted       : vListModel.setHeaderbarVisible(HeaderBar.Heparin, _root.isHeparinFeatured)

    function vitalsRecorded() { _vitalsButton.pulseAnimation.start() }

    MouseArea { id: _mouseArea
        anchors.fill    : parent
        property real lastClickTime: 0
        property int doubleClickThreshold: 500 // ms

        // had to implement my own double click because the onDoubleClicked was not user friednly for touch.
        // a 500 ms threshold between clicks has bee added
        onClicked : {
            const now = Date.now()
            if (now - _mouseArea.lastClickTime < _mouseArea.doubleClickThreshold) {
                if ( _GuiView.dryDemoMode ) {
                    let dryDemoTempID = 99
                    let id = vConfirm.id
                    vConfirm.id = dryDemoTempID
                    vConfirm.doConfirm( true  )
                    vConfirm.id = id
                }
                else {
                    _diagnosticsDialog.open()
                }
                lastClickTime = 0
            }
            else {
                lastClickTime = now
            }
        }
    }

    Text { id: _loggedInUser
        color                   : Colors.textMain
        anchors.top             : parent.top
        anchors.horizontalCenter: parent.horizontalCenter
        horizontalAlignment     : Text.AlignHCenter
        verticalAlignment       : Text.AlignVCenter
        font.pixelSize          : Fonts.fontHeaderbarUser
    }

    Text { id: _title
        color                   : Colors.textMain
        anchors {
            horizontalCenter    : parent.horizontalCenter
            bottom              : _headerMenu.top
        }
        height                  : parent.height
        horizontalAlignment     : Text.AlignHCenter
        verticalAlignment       : Text.AlignVCenter
        font.pixelSize          : Fonts.fontHeaderbarTitle
        font.weight             : Font.DemiBold
        text                    : _root.activeStack &&
                                  _root.activeStack.currentItem &&
                                  _root.activeStack.currentItem.headerTitle ? _root.activeStack.currentItem.headerTitle : ""
    }

    Item { id: _dateTimeItem
        width   : Variables.headerBarDateTimeWidth
        anchors {
            top     : parent.top
            left    : parent.left
            bottom  : parent.bottom
        }

        Column { id: _dateTimeColumn
            anchors.fill: parent

            Text { id: _timeText
                color   : Colors.textMain
                width   : parent.width
                height  : parent.height * 3/5
                horizontalAlignment : Text.AlignHCenter
                verticalAlignment   : Text.AlignVCenter
                text            : vDateTime.time
                font.pixelSize  : Fonts.fontHeaderbarTime
                font.weight     : Font.DemiBold

            }

            Text { id: _dateText
                color   : Colors.textMain
                width   : parent.width
                height  : parent.height * 2/5
                horizontalAlignment : Text.AlignHCenter
                verticalAlignment   : Text.AlignVCenter
                text    : vDateTime.date
                font.pixelSize: Fonts.fontHeaderbarDate
            }
        }
    }

    Text { id: _timeZone    // TEST : Current timezone
        color   : Colors.textMain
        anchors {
            top         : parent.top
            left        : parent.left
            leftMargin  : parent.width / 5
        }
        horizontalAlignment : Text.Alignleft
        verticalAlignment   : Text.AlignBottom

        height  : 15
        width   : _root.width / 5
        text    : vDateTime.timezone
        font.pixelSize: Fonts.fontHeaderbarTimezone
    }

    MainMenu { id: _headerMenu
        anchors {
            left        : _dateTimeItem.right
            bottom      : parent.bottom
            bottomMargin: hidden || disable ? height * -1 : 0
        }
        height          : parent.height
        width           : parent.width / 2 // gives the width of the headerbar menu
        hidden          : true
        titlePixelSize  : 32
        backgroundColor : Colors.transparent
        highlightHeight : 15
        model           : vListModel.headerbarModel
        onHiddenChanged : { if (hidden) { index = 0 } }
    }

    Row { id: _headerButtonRow
        height      : parent.height
        spacing     : 25
        anchors {
            verticalCenter: parent.verticalCenter
            right         : parent.right
            rightMargin   :  _headerButtonRow.spacing
        }

        TreatmentCompleteButton { id  : _treatmentCompleteButton
            extraSpace      : _headerButtonRow.spacing
            visible         : vTDTreatmentStates.txEnd

            onPressed       : _endTreatmentDialog.open()
        }

        IconButton { id  : _waterSample
            iconSize        : Variables.headerIconDiameter
            iconImageSource : "qrc:/images/iWaterSample"
            extraSpace      : _headerButtonRow.spacing

            onPressed       : _headerbarWaterSampleDialysate.open()
        }

        IconButton { id  : _prescriptionButton
            iconSize        : Variables.headerIconDiameter
            iconImageSource : "qrc:/images/iPrescription"
            extraSpace      : _headerButtonRow.spacing
            visible         : ( vTDOpMode.preTreatment      ||
                                vTDOpMode.inTreatment       ||
                                vTDOpMode.postTreatment )   && ! _root.isCreateRx

            onPressed       : _headerbarPrescription.open()
        }

        VitalsButton { id  : _vitalsButton
            extraSpace      : _headerButtonRow.spacing
            visible         :  vTDOpMode.preTreatment        ||
                               vTDOpMode.inTreatment         ||
                               vTDOpMode.postTreatment

            onPressed       : _treatmentAdjustmentVitals.open()
        }

        IconButton { id  : _wifiButton
            iconSize        : Variables.headerIconDiameter
            iconImageSource : "qrc:/images/iWifi"
            extraSpace      : _headerButtonRow.spacing

            onPressed       : _headerbarWifi.openDialog(_wifiButton)
        }

        // TODO Phase 2 👋👋👋
//        IconButton { id  : _cloudSyncButton
//            iconSize        : Variables.headerIconDiameter
//            iconImageSource : "qrc:/images/iCloudSync"
//            extraSpace      : _headerButtonRow.spacing
//            enabled         : false

//            onPressed       : print("CloudSync button pressed!")
//        }

        IconButton { id  : _settingsButton
            iconSize        : Variables.headerIconDiameter
            iconImageSource : "qrc:/images/iSettings"
            extraSpace      : _headerButtonRow.spacing

            onPressed       : _headerbarSettings.openDialog(_settingsButton)
        }

        IconButton { id  : _informationButton
            iconSize        : Variables.headerIconDiameter
            iconImageSource : "qrc:/images/iInformation"
            extraSpace      : _headerButtonRow.spacing

            onPressed       : _headerbarInformation.openDialog(_informationButton)
        }
    }
}