import QtQuick
import Quickshell
import Quickshell.Wayland
import Quickshell.Services.Pipewire
import "." as M

M.BarSection {
    id: root
    spacing: M.Theme.moduleSpacing
    tooltip: ""

    PwObjectTracker {
        objects: [Pipewire.defaultAudioSink]
    }

    readonly property var sink: Pipewire.defaultAudioSink
    readonly property real volume: sink?.audio?.volume ?? 0
    readonly property bool muted: sink?.audio?.muted ?? false
    readonly property string _volumeIcon: muted ? "\uF026" : (volume > 0.5 ? "\uF028" : (volume > 0 ? "\uF027" : "\uF026"))
    readonly property color _volumeColor: muted ? M.Theme.base04 : M.Theme.base0E

    readonly property var _sinkList: {
        const sinks = [];
        if (Pipewire.nodes) {
            for (const node of Pipewire.nodes.values)
                if (!node.isStream && node.isSink)
                    sinks.push(node);
        }
        return sinks;
    }

    property bool _expanded: false
    property bool _panelHovered: false
    property bool _osdActive: false
    readonly property bool _anyHover: root._hovered || _panelHovered
    readonly property bool _showPanel: _anyHover || _expanded || _osdActive

    onVolumeChanged: _flashPanel()
    onMutedChanged: _flashPanel()

    function _flashPanel() {
        _osdActive = true;
        _osdTimer.restart();
    }

    Timer {
        id: _osdTimer
        interval: 1500
        onTriggered: root._osdActive = false
    }

    on_AnyHoverChanged: {
        if (_anyHover)
            _collapseTimer.stop();
        else if (_expanded)
            _collapseTimer.start();
    }

    Timer {
        id: _collapseTimer
        interval: 500
        onTriggered: root._expanded = false
    }

    M.BarIcon {
        icon: root._volumeIcon
        color: root._volumeColor
        anchors.verticalCenter: parent.verticalCenter
    }
    M.BarLabel {
        label: Math.round(root.volume * 100) + "%"
        minText: "100%"
        color: root._volumeColor
        anchors.verticalCenter: parent.verticalCenter
    }

    TapHandler {
        cursorShape: Qt.PointingHandCursor
        onTapped: root._expanded = !root._expanded
    }

    WheelHandler {
        onWheel: event => {
            if (!root.sink?.audio)
                return;
            root.sink.audio.volume = Math.max(0, root.sink.audio.volume + (event.angleDelta.y > 0 ? 0.05 : -0.05));
        }
    }

    // Unified volume panel — hover shows slider, click expands to show devices
    PanelWindow {
        id: panel

        screen: QsWindow.window?.screen ?? null
        visible: _winVisible
        color: "transparent"

        property bool _winVisible: false

        WlrLayershell.layer: WlrLayer.Overlay
        WlrLayershell.exclusiveZone: 0
        WlrLayershell.namespace: "nova-volume"

        anchors.top: true
        anchors.left: true

        margins.top: 0
        margins.left: Math.max(0, Math.min(
            Math.round(root.mapToGlobal(root.width / 2, 0).x - (QsWindow.window?.screen?.x ?? 0) - implicitWidth / 2),
            (panel.screen?.width ?? 1920) - implicitWidth
        ))

        implicitWidth: panelContent.width
        implicitHeight: panelContent.height

        // Show/hide logic
        Connections {
            target: root
            function on_ShowPanelChanged() {
                if (root._showPanel) {
                    panel._winVisible = true;
                    hideAnim.stop();
                    showAnim.start();
                } else {
                    root._expanded = false;
                    showAnim.stop();
                    hideAnim.start();
                }
            }
        }

        ParallelAnimation {
            id: showAnim
            NumberAnimation { target: panelContent; property: "opacity"; to: 1; duration: 120; easing.type: Easing.OutCubic }
            NumberAnimation { target: panelContent; property: "y"; to: 0; duration: 150; easing.type: Easing.OutCubic }
        }

        ParallelAnimation {
            id: hideAnim
            NumberAnimation { target: panelContent; property: "opacity"; to: 0; duration: 150; easing.type: Easing.InCubic }
            NumberAnimation { target: panelContent; property: "y"; to: -panelContent.height; duration: 150; easing.type: Easing.InCubic }
            onFinished: panel._winVisible = false
        }

        // Keep panel open when mouse is over it
        MouseArea {
            anchors.fill: parent
            hoverEnabled: true
            onContainsMouseChanged: root._panelHovered = containsMouse
            // Click inside panel doesn't dismiss
        }

        Rectangle {
            x: panelContent.x
            y: panelContent.y
            width: panelContent.width
            height: panelContent.height
            color: M.Theme.base01
            opacity: panelContent.opacity * Math.max(M.Theme.barOpacity, 0.85)
            topLeftRadius: 0
            topRightRadius: 0
            bottomLeftRadius: M.Theme.radius
            bottomRightRadius: M.Theme.radius
        }

        Column {
            id: panelContent
            width: 220
            opacity: 0
            y: -height

            // Compact: slider row
            Item {
                width: parent.width
                height: 36

                // Mute toggle
                Text {
                    id: muteIcon
                    anchors.left: parent.left
                    anchors.leftMargin: 12
                    anchors.verticalCenter: parent.verticalCenter
                    text: root._volumeIcon
                    color: root._volumeColor
                    font.pixelSize: M.Theme.fontSize + 2
                    font.family: M.Theme.iconFontFamily

                    MouseArea {
                        anchors.fill: parent
                        cursorShape: Qt.PointingHandCursor
                        onClicked: if (root.sink?.audio) root.sink.audio.muted = !root.sink.audio.muted
                    }
                }

                // Slider
                Item {
                    id: slider
                    anchors.left: muteIcon.right
                    anchors.leftMargin: 8
                    anchors.right: volLabel.left
                    anchors.rightMargin: 8
                    anchors.verticalCenter: parent.verticalCenter
                    height: 6

                    Rectangle {
                        anchors.fill: parent
                        color: M.Theme.base02
                        radius: 3
                    }

                    Rectangle {
                        width: parent.width * Math.min(1, Math.max(0, root.volume))
                        height: parent.height
                        color: root._volumeColor
                        radius: 3

                        Behavior on width { NumberAnimation { duration: 80 } }
                    }

                    MouseArea {
                        anchors.fill: parent
                        anchors.margins: -6
                        cursorShape: Qt.PointingHandCursor
                        onPressed: mouse => _setVol(mouse)
                        onPositionChanged: mouse => { if (pressed) _setVol(mouse); }
                        function _setVol(mouse) {
                            if (!root.sink?.audio) return;
                            root.sink.audio.volume = Math.max(0, Math.min(1, mouse.x / slider.width));
                        }
                    }
                }

                Text {
                    id: volLabel
                    anchors.right: parent.right
                    anchors.rightMargin: 12
                    anchors.verticalCenter: parent.verticalCenter
                    text: Math.round(root.volume * 100) + "%"
                    color: root.muted ? M.Theme.base04 : M.Theme.base05
                    font.pixelSize: M.Theme.fontSize
                    font.family: M.Theme.fontFamily
                    width: 30
                }
            }

            // Sink name
            Text {
                width: parent.width
                height: 18
                horizontalAlignment: Text.AlignHCenter
                text: root.sink?.description ?? root.sink?.name ?? ""
                color: M.Theme.base04
                font.pixelSize: M.Theme.fontSize - 2
                font.family: M.Theme.fontFamily
                elide: Text.ElideRight
                leftPadding: 12
                rightPadding: 12
            }

            // Expanded: output device list
            Column {
                id: deviceList
                width: parent.width
                visible: root._expanded
                clip: true

                property real _targetHeight: root._expanded ? implicitHeight : 0
                height: _targetHeight
                Behavior on height { NumberAnimation { duration: 200; easing.type: Easing.OutCubic } }

                // Separator
                Rectangle {
                    width: parent.width - 16
                    height: 1
                    anchors.horizontalCenter: parent.horizontalCenter
                    color: M.Theme.base03
                }

                // Header
                Text {
                    width: parent.width
                    height: 24
                    verticalAlignment: Text.AlignVCenter
                    leftPadding: 12
                    text: "Output Devices"
                    color: M.Theme.base04
                    font.pixelSize: M.Theme.fontSize - 1
                    font.family: M.Theme.fontFamily
                }

                Repeater {
                    model: root._sinkList

                    delegate: Item {
                        required property var modelData

                        width: deviceList.width
                        height: 28

                        readonly property bool _active: modelData === root.sink

                        Rectangle {
                            anchors.fill: parent
                            anchors.leftMargin: 4
                            anchors.rightMargin: 4
                            color: deviceArea.containsMouse ? M.Theme.base02 : "transparent"
                            radius: M.Theme.radius
                        }

                        Text {
                            anchors.left: parent.left
                            anchors.leftMargin: 12
                            anchors.right: parent.right
                            anchors.rightMargin: 12
                            anchors.verticalCenter: parent.verticalCenter
                            text: modelData.description || modelData.name || "Unknown"
                            color: parent._active ? M.Theme.base0E : M.Theme.base05
                            font.pixelSize: M.Theme.fontSize
                            font.family: M.Theme.fontFamily
                            font.bold: parent._active
                            elide: Text.ElideRight
                        }

                        MouseArea {
                            id: deviceArea
                            anchors.fill: parent
                            hoverEnabled: true
                            cursorShape: Qt.PointingHandCursor
                            onClicked: Pipewire.preferredDefaultAudioSink = modelData
                        }
                    }
                }

                // Bottom padding
                Item { width: 1; height: 4 }
            }
        }
    }
}