import QtQuick
import Quickshell
import Quickshell.Hyprland
import Quickshell.Io
import "../../../colors"
import "../../../config"
import "../states/Battery"

MouseArea {
    id: batteryButton
    width: clicked ? Math.max(batteryPercentageText.width + parent.spacing*3, bar.height) : Math.max(batteryText.width + parent.spacing*2, bar.height)
    height: bar.height
    hoverEnabled: true
    cursorShape: Qt.PointingHandCursor
    visible: false

    property bool clicked: false

    Component.onCompleted: {
        batteryAvailibleScript.running = true
    }
    
    Rectangle {
        anchors.fill: parent
        color: batteryButton.containsMouse ? Colors.tertiary : Qt.alpha(Colors.tertiaryContainer, 0.25)
        radius: Config.radius
        border.width: Config.border_width
        border.color: batteryButton.containsMouse ? Colors.tertiaryContainer_fg
            : Colors.secondaryContainer_fg

        Text {
            id: batteryText
            visible : !clicked
            anchors.centerIn: parent
            text:(
                BatteryState.percentage >= 95 ? "" :
                BatteryState.percentage >= 75 ? "" :
                BatteryState.percentage >= 50 ? "" :
                BatteryState.percentage >= 25 ? "" :
                ""
            )
            font.pixelSize: Config.big_font_size(bar.height)
            font.family: Config.font
            color: (
                BatteryState.charging ? BatteryState.percentage == 100 ? "white" : "green" :
                BatteryState.percentage <= 5 ? "red" :
                BatteryState.percentage < 10 ? "yellow" :
                batteryButton.containsMouse ? Colors.tertiary_fg :
                Colors.primary
            )
        }

        Text {
            id: batteryPercentageText
            visible : clicked
            anchors.centerIn: parent
            text: (
                BatteryState.charging ? "󰂄" :
                BatteryState.percentage >= 90 ? "󰁹  " + BatteryState.percentage + "%" :
                BatteryState.percentage >= 80 ? "󰂂  " + BatteryState.percentage + "%" :
                BatteryState.percentage >= 70 ? "󰂁  " + BatteryState.percentage + "%" :
                BatteryState.percentage >= 60 ? "󰂀  " + BatteryState.percentage + "%" :
                BatteryState.percentage >= 50 ? "󰁿  " + BatteryState.percentage + "%" :
                BatteryState.percentage >= 40 ? "󰁾  " + BatteryState.percentage + "%" :
                BatteryState.percentage >= 30 ? "󰁽  " + BatteryState.percentage + "%" :
                BatteryState.percentage >= 20 ? "󰁼  " + BatteryState.percentage + "%" :
                BatteryState.percentage >= 10 ? "󰁻  " + BatteryState.percentage + "%" :
                BatteryState.percentage >=  5 ? "󰁺  " + BatteryState.percentage + "%" :
                "󰂃  " + BatteryState.percentage + "%"
            )
            font.pixelSize: Config.big_font_size(bar.height)
            font.family: Config.font
            color: (
                BatteryState.charging ? BatteryState.percentage == 100 ? "white" : "green" :
                BatteryState.percentage <= 5 ? "red" :
                BatteryState.percentage < 10 ? "yellow" :
                batteryButton.containsMouse ? Colors.tertiary_fg :
                Colors.primary
            )
        }

        Row {
            id: batteryPercentage
            visible: clicked
            anchors.centerIn: parent
            spacing: batteryButton.parent.spacing/2

            Text {
                id: batteryPercentageSymbol
                text: (
                    BatteryState.charging ? "󰂄" :
                    BatteryState.percentage >= 90 ? "󰁹":
                    BatteryState.percentage >= 80 ? "󰂂":
                    BatteryState.percentage >= 70 ? "󰂁":
                    BatteryState.percentage >= 60 ? "󰂀":
                    BatteryState.percentage >= 50 ? "󰁿":
                    BatteryState.percentage >= 40 ? "󰁾":
                    BatteryState.percentage >= 30 ? "󰁽":
                    BatteryState.percentage >= 20 ? "󰁼":
                    BatteryState.percentage >= 10 ? "󰁻":
                    BatteryState.percentage >= 5 ? "󰁺":
                    "󰂃"
                )

                font.pixelSize: batteryText.font.pixelSize * 0.75
                font.family: "CodeNewRoman Nerd Font"
                font.bold: true

                color: (
                    BatteryState.percentage <= 5 ? "red" :
                    BatteryState.charging ? "green" :
                    BatteryState.percentage < 10 ? "yellow" :
                    batteryButton.containsMouse ? Colors.tertiary_fg :
                    Colors.primary
                )
            }

            Text {
                id: batteryPercentageText
                text: BatteryState.percentage + "%"

                font.pixelSize: batteryText.font.pixelSize * 0.75
                font.family: "CodeNewRoman Nerd Font"
                font.bold: true

                color: batteryPercentageSymbol.color
            }
        }
    }

    Process {
        id: batteryAvailibleScript
        command: ["sh", "-c", "upower -e | grep -q '^/org/freedesktop/UPower/devices/battery' && echo '1' || echo '0'"]
        stdout: StdioCollector {
            onStreamFinished: {
                const hasBattery = this.text.trim() === "1"

                batteryButton.visible = hasBattery
                if (hasBattery) {
                    BatteryState.start()
                }

                console.log("battery available:", hasBattery)
            }
        }
    }

    onClicked: {
        batteryButton.clicked = !batteryButton.clicked
    }

}