import QtQuick
import QtQuick.Layouts
import QtQuick.Controls
import "../theme"
import ".."

Rectangle {
    id: root
    width: 240
    implicitHeight: batCol.implicitHeight + 24
    radius: Theme.radiusMedium
    color: Theme.menuDropdownBg
    border.color: Theme.menuDropdownBorder
    border.width: 1

    ColumnLayout {
        id: batCol
        anchors.fill: parent
        anchors.margins: 12
        spacing: 8

        RowLayout {
            Layout.fillWidth: true
            Text {
                text: "Battery"
                font.family: Theme.fontFamily
                font.pixelSize: Theme.fontSizeNormal
                font.weight: Font.DemiBold
                color: Theme.textPrimary
                Layout.fillWidth: true
            }
            Text {
                text: `${GlobalState.batteryPercent}%`
                font.family: Theme.fontFamily
                font.pixelSize: Theme.fontSizeSmall
                font.weight: Font.DemiBold
                color: GlobalState.batteryPercent <= 20 ? Theme.accentRed : Theme.accentGreen
            }
        }

        Rectangle {
            Layout.fillWidth: true
            Layout.preferredHeight: 1
            color: Qt.rgba(1.0, 1.0, 1.0, 0.12)
        }

        ColumnLayout {
            Layout.fillWidth: true
            spacing: 3

            Text {
                text: GlobalState.batteryPresent
                    ? (GlobalState.batteryCharging ? "Power Source: Power Adapter" : "Power Source: Battery")
                    : "Power Source: AC Connected"
                font.family: Theme.fontFamily
                font.pixelSize: Theme.fontSizeSmall
                color: Theme.textPrimary
            }

            Text {
                text: GlobalState.batteryPresent
                    ? `Status: ${GlobalState.batteryStatus}`
                    : "Desktop Workstation Mode"
                font.family: Theme.fontFamily
                font.pixelSize: Theme.fontSizeSmall
                color: Theme.textSecondary
            }
        }

        Rectangle {
            Layout.fillWidth: true
            Layout.preferredHeight: 1
            color: Qt.rgba(1.0, 1.0, 1.0, 0.12)
        }

        Rectangle {
            Layout.fillWidth: true
            Layout.preferredHeight: 24
            radius: Theme.radiusSmall
            color: batPrefMouse.containsMouse ? Qt.rgba(1.0, 1.0, 1.0, 0.15) : Qt.rgba(1.0, 1.0, 1.0, 0.08)

            Text {
                anchors.centerIn: parent
                text: "Energy Saver Preferences..."
                font.family: Theme.fontFamily
                font.pixelSize: Theme.fontSizeSmall
                color: Theme.textPrimary
            }

            MouseArea {
                id: batPrefMouse
                anchors.fill: parent
                hoverEnabled: true
                cursorShape: Qt.PointingHandCursor
                onClicked: {
                    GlobalState.batteryPopupVisible = false;
                    GlobalState.launchApp("foot -e btop");
                }
            }
        }
    }
}