Quickbar/AudioWidget.qml

import QtQuick
import Quickshell.Io
import Quickshell.Services.Pipewire
import qs.Common

Rectangle {
    id: audioWidget

    property string monitor: ""
    property string icon: " "
    property bool audioPipewireActive: Pipewire.defaultAudioSink? true:false
    property int volume: audioPipewireActive? Math.round(Pipewire.defaultAudioSink.audio.volume * 100): 30

    implicitWidth: audioText.implicitWidth * 1.6
    implicitHeight: Theme.heightGaps
    color: Theme.backgroudColor
    radius: 25
    states: [
        State {
            name: "Mute"
            when: audioWidget.volume == 0

            PropertyChanges {
                audioWidget.icon: " "
            }

        },
        State {
            name: "low volume"
            when: audioWidget.volume <= 25

            PropertyChanges {
                audioWidget.icon: " "
            }

        },
        State {
            name: "high volume"
            when: audioWidget.volume > 25

            PropertyChanges {
                audioWidget.icon: " "
            }

        }
    ]

    PwObjectTracker {
        objects: [Pipewire.defaultAudioSink]
    }

    Connections {
        function onVolumeChanged() {
            audioWidget.volume = Math.round(Pipewire.defaultAudioSink.audio.volume * 100);
        }

        target: audioWidget.audioPipewireActive? Pipewire.defaultAudioSink.audio: null
    }

    Text {
        id: audioText

        property string audioTextText: audioWidget.audioPipewireActive? audioWidget.icon + "  " + Math.round(Pipewire.defaultAudioSink.audio.volume * 100).toString() + "%" : ""

        anchors.centerIn: parent
        text: audioTextText
        font.bold: true
        font.pixelSize: 14
        font.family: Theme.fontFamily
        color: Theme.textColor
    }

    Process {
        id: audioWidgetProcess

        running: false
        command: ["pavucontrol"]
    }

    MouseArea {
        anchors.fill: parent
        onClicked: {
            audioWidgetProcess.startDetached();
        }
        onWheel: (wheel) => {
            if (wheel.angleDelta.y > 0) {
                if (0)
                    return ;

                Pipewire.defaultAudioSink.audio.volume = (audioWidget.volume + 5) / 100;
            } else if (wheel.angleDelta.y < 0) {
                if (0)
                    return ;

                Pipewire.defaultAudioSink.audio.volume = (audioWidget.volume - 5) / 100;
            }
        }
    }

}