Very minimal volume widget and PWAudioService

This commit is contained in:
quadbyte 2025-08-10 18:28:36 -04:00
parent 56777fc9fd
commit 5c7268aaee
7 changed files with 326 additions and 234 deletions

77
Modules/Audio/Cava.qml Normal file
View file

@ -0,0 +1,77 @@
import QtQuick
import Quickshell
import Quickshell.Io
import qs.Services
Scope {
id: root
property int count: 44
property int noiseReduction: 60
property string channels: "mono"
property string monoOption: "average"
property var config: ({
"general": {
"bars": count,
"framerate": 30,
"autosens": 1
},
"smoothing": {
"monstercat": 1,
"gravity": 1000000,
"noise_reduction": noiseReduction
},
"output": {
"method": "raw",
"bit_format": 8,
"channels": channels,
"mono_option": monoOption
}
})
property var values: Array(count).fill(0)
Process {
id: process
property int index: 0
stdinEnabled: true
running: MediaPlayer.isPlaying
command: ["cava", "-p", "/dev/stdin"]
onExited: {
stdinEnabled = true
index = 0
values = Array(count).fill(0)
}
onStarted: {
for (const k in config) {
if (typeof config[k] !== "object") {
write(k + "=" + config[k] + "\n")
continue
}
write("[" + k + "]\n")
const obj = config[k]
for (const k2 in obj) {
write(k2 + "=" + obj[k2] + "\n")
}
}
stdinEnabled = false
}
stdout: SplitParser {
splitMarker: ""
onRead: data => {
const newValues = Array(count).fill(0)
for (var i = 0; i < values.length; i++) {
newValues[i] = values[i]
}
if (process.index + data.length > count) {
process.index = 0
}
for (var i = 0; i < data.length; i += 1) {
newValues[process.index] = Math.min(data.charCodeAt(i), 128) / 128
process.index = (process.index + 1) % count
}
values = newValues
}
}
}
}

View file

@ -6,125 +6,99 @@ import qs.Widgets
Item { Item {
id: volumeDisplay id: volumeDisplay
property var shell
property int volume: 0
property bool firstChange: true
width: pillIndicator.width width: pillIndicator.width
height: pillIndicator.height height: pillIndicator.height
function getVolumeColor() { function getIcon() {
if (volume <= 100) if (PipeWireAudio.muted) {
return Colors.accentPrimary return "volume_off"
// Calculate interpolation factor (0 at 100%, 1 at 200%) }
var factor = (volume - 100) / 100 return PipeWireAudio.volume === 0 ? "volume_off" : (PipeWireAudio.volume < 0.33 ? "volume_down" : "volume_up")
// Blend between accent and warning colors
return Qt.rgba(Colors.accentPrimary.r + (Colors.warning.r - Colors.accentPrimary.r) * factor,
Colors.accentPrimary.g + (Colors.warning.g - Colors.accentPrimary.g) * factor,
Colors.accentPrimary.b + (Colors.warning.b - Colors.accentPrimary.b) * factor, 1)
} }
function getIconColor() { function getIconColor() {
if (volume <= 100) if (PipeWireAudio.volume <= 1.0) {
return Colors.textPrimary return Colors.textPrimary
return getVolumeColor() // Only use warning blend when >100% }
// Indicate that the volume is over 100%
// Calculate interpolation factor (0 at 100%, 1.0 at 200%)
let factor = (PipeWireAudio.volume - 1)
// Blend between accent and warning colors
return Qt.rgba(Colors.textPrimary.r + (Colors.warning.r - Colors.textPrimary.r) * factor,
Colors.textPrimary.g + (Colors.warning.g - Colors.textPrimary.g) * factor,
Colors.textPrimary.b + (Colors.warning.b - Colors.textPrimary.b) * factor, 1)
} }
NPill { NPill {
id: pillIndicator id: pillIndicator
icon: shell && shell.defaultAudioSink && shell.defaultAudioSink.audio icon: getIcon()
&& shell.defaultAudioSink.audio.muted ? "volume_off" : (volume === 0 ? "volume_off" : (volume < 30 ? "volume_down" : "volume_up")) text: Math.round(PipeWireAudio.volume * 100) + "%"
text: volume + "%" tooltipText: "Volume: " + Math.round(
PipeWireAudio.volume * 100) + "%\nLeft click for advanced settings.\nScroll up/down to change volume."
onClicked: function () {
console.log("onClicked")
//if (ioSelector.visible) {
// ioSelector.dismiss();
// } else {
// ioSelector.show();
// }
}
pillColor: Colors.surfaceVariant // pillColor: Colors.surfaceVariant
iconCircleColor: getVolumeColor() // iconCircleColor: Colors.// getVolumeColor()
iconTextColor: Colors.backgroundPrimary // iconTextColor: Colors.backgroundPrimary
textColor: Colors.textPrimary // textColor: Colors.textPrimary
collapsedIconColor: getIconColor() // collapsedIconColor: getIconColor()
autoHide: true // autoHide: true
// StyledTooltip {
// id: volumeTooltip
// text: "Volume: " + volume + "%\nLeft click for advanced settings.\nScroll up/down to change volume."
// positionAbove: false
// tooltipVisible: !ioSelector.visible && volumeDisplay.containsMouse
// targetItem: pillIndicator
// delay: 1500
// }
// MouseArea {
// anchors.fill: parent
// hoverEnabled: true
// cursorShape: Qt.PointingHandCursor
// onClicked: {
// if (ioSelector.visible) {
// ioSelector.dismiss();
// } else {
// ioSelector.show();
// }
// }
// }
} }
Connections { AudioDeviceSelector {
target: shell ?? null id: ioSelector
function onVolumeChanged() { // onPanelClosed: ioSelector.dismiss()
if (shell) {
const clampedVolume = Math.max(0, Math.min(200, shell.volume))
if (clampedVolume !== volume) {
volume = clampedVolume
pillIndicator.text = volume + "%"
pillIndicator.icon = shell.defaultAudioSink && shell.defaultAudioSink.audio
&& shell.defaultAudioSink.audio.muted ? "volume_off" : (volume === 0 ? "volume_off" : (volume
< 30 ? "volume_down" : "volume_up"))
if (firstChange) {
firstChange = false
} else {
pillIndicator.show()
}
}
}
}
} }
Component.onCompleted: { // Connections {
if (shell && shell.volume !== undefined) { // target: PipeWireAudio
volume = Math.max(0, Math.min(200, shell.volume)) // function onVolumeChanged() {
} // console.log("onVolumeChanged")
} // }
MouseArea { // function onSinkChanged() {
anchors.fill: parent // console.log("onSinkChanged")
hoverEnabled: true // }
acceptedButtons: Qt.NoButton
propagateComposedEvents: true
onEntered: {
volumeDisplay.containsMouse = true
pillIndicator.autoHide = false
pillIndicator.showDelayed()
}
onExited: {
volumeDisplay.containsMouse = false
pillIndicator.autoHide = true
pillIndicator.hide()
}
cursorShape: Qt.PointingHandCursor
onWheel: wheel => {
if (!shell)
return
let step = 5
if (wheel.angleDelta.y > 0) {
shell.updateVolume(Math.min(200, shell.volume + step))
} else if (wheel.angleDelta.y < 0) {
shell.updateVolume(Math.max(0, shell.volume - step))
}
}
}
// AudioDeviceSelector { // }
// id: ioSelector
// onPanelClosed: ioSelector.dismiss() // MouseArea {
// anchors.fill: parent
// hoverEnabled: true
// acceptedButtons: Qt.NoButton
// propagateComposedEvents: true
// onEntered: {
// volumeDisplay.containsMouse = true
// pillIndicator.autoHide = false
// pillIndicator.showDelayed()
// }
// onExited: {
// volumeDisplay.containsMouse = false
// pillIndicator.autoHide = true
// pillIndicator.hide()
// }
// cursorShape: Qt.PointingHandCursor
// onWheel: wheel => {
// if (!shell)
// return
// let step = 5
// if (wheel.angleDelta.y > 0) {
// shell.updateVolume(Math.min(200, shell.volume + step))
// } else if (wheel.angleDelta.y < 0) {
// shell.updateVolume(Math.max(0, shell.volume - step))
// }
// }
// } // }
property bool containsMouse: false
// property bool containsMouse: false
} }

View file

@ -1,161 +1,162 @@
pragma Singleton pragma Singleton
import QtQuick
import Quickshell import Quickshell
import Quickshell.Services.Mpris import Quickshell.Services.Mpris
import qs.Services import qs.Services
import qs.Modules.Audio
Singleton { Singleton {
id: root id: root
// property var currentPlayer: null property var currentPlayer: null
// property real currentPosition: 0 property real currentPosition: 0
// property int selectedPlayerIndex: 0 property int selectedPlayerIndex: 0
// property bool isPlaying: currentPlayer ? currentPlayer.isPlaying : false property bool isPlaying: currentPlayer ? currentPlayer.isPlaying : false
// property string trackTitle: currentPlayer ? (currentPlayer.trackTitle || "Unknown Track") : "" property string trackTitle: currentPlayer ? (currentPlayer.trackTitle || "Unknown Track") : ""
// property string trackArtist: currentPlayer ? (currentPlayer.trackArtist || "Unknown Artist") : "" property string trackArtist: currentPlayer ? (currentPlayer.trackArtist || "Unknown Artist") : ""
// property string trackAlbum: currentPlayer ? (currentPlayer.trackAlbum || "Unknown Album") : "" property string trackAlbum: currentPlayer ? (currentPlayer.trackAlbum || "Unknown Album") : ""
// property string trackArtUrl: currentPlayer ? (currentPlayer.trackArtUrl || "") : "" property string trackArtUrl: currentPlayer ? (currentPlayer.trackArtUrl || "") : ""
// property real trackLength: currentPlayer ? currentPlayer.length : 0 property real trackLength: currentPlayer ? currentPlayer.length : 0
// property bool canPlay: currentPlayer ? currentPlayer.canPlay : false property bool canPlay: currentPlayer ? currentPlayer.canPlay : false
// property bool canPause: currentPlayer ? currentPlayer.canPause : false property bool canPause: currentPlayer ? currentPlayer.canPause : false
// property bool canGoNext: currentPlayer ? currentPlayer.canGoNext : false property bool canGoNext: currentPlayer ? currentPlayer.canGoNext : false
// property bool canGoPrevious: currentPlayer ? currentPlayer.canGoPrevious : false property bool canGoPrevious: currentPlayer ? currentPlayer.canGoPrevious : false
// property bool canSeek: currentPlayer ? currentPlayer.canSeek : false property bool canSeek: currentPlayer ? currentPlayer.canSeek : false
// property bool hasPlayer: getAvailablePlayers().length > 0 property bool hasPlayer: getAvailablePlayers().length > 0
// Item { // Expose cava values
// Component.onCompleted: { property alias cavaValues: cava.values
// updateCurrentPlayer()
// }
// }
// function getAvailablePlayers() { Item {
// if (!Mpris.players || !Mpris.players.values) { Component.onCompleted: {
// return [] updateCurrentPlayer()
// } }
}
// let allPlayers = Mpris.players.values function getAvailablePlayers() {
// let controllablePlayers = [] if (!Mpris.players || !Mpris.players.values) {
return []
}
// for (var i = 0; i < allPlayers.length; i++) { let allPlayers = Mpris.players.values
// let player = allPlayers[i] let controllablePlayers = []
// if (player && player.canControl) {
// controllablePlayers.push(player)
// }
// }
// return controllablePlayers for (var i = 0; i < allPlayers.length; i++) {
// } let player = allPlayers[i]
if (player && player.canControl) {
controllablePlayers.push(player)
}
}
// function findActivePlayer() { return controllablePlayers
// let availablePlayers = getAvailablePlayers() }
// if (availablePlayers.length === 0) {
// return null
// }
// if (selectedPlayerIndex < availablePlayers.length) { function findActivePlayer() {
// return availablePlayers[selectedPlayerIndex] let availablePlayers = getAvailablePlayers()
// } else { if (availablePlayers.length === 0) {
// selectedPlayerIndex = 0 return null
// return availablePlayers[0] }
// }
// }
// // Switch to the most recently active player if (selectedPlayerIndex < availablePlayers.length) {
// function updateCurrentPlayer() { return availablePlayers[selectedPlayerIndex]
// let newPlayer = findActivePlayer() } else {
// if (newPlayer !== currentPlayer) { selectedPlayerIndex = 0
// currentPlayer = newPlayer return availablePlayers[0]
// currentPosition = currentPlayer ? currentPlayer.position : 0 }
// } }
// }
// function playPause() { // Switch to the most recently active player
// if (currentPlayer) { function updateCurrentPlayer() {
// if (currentPlayer.isPlaying) { let newPlayer = findActivePlayer()
// currentPlayer.pause() if (newPlayer !== currentPlayer) {
// } else { currentPlayer = newPlayer
// currentPlayer.play() currentPosition = currentPlayer ? currentPlayer.position : 0
// } }
// } }
// }
// function play() { function playPause() {
// if (currentPlayer && currentPlayer.canPlay) { if (currentPlayer) {
// currentPlayer.play() if (currentPlayer.isPlaying) {
// } currentPlayer.pause()
// } } else {
currentPlayer.play()
}
}
}
// function pause() { function play() {
// if (currentPlayer && currentPlayer.canPause) { if (currentPlayer && currentPlayer.canPlay) {
// currentPlayer.pause() currentPlayer.play()
// } }
// } }
// function next() { function pause() {
// if (currentPlayer && currentPlayer.canGoNext) { if (currentPlayer && currentPlayer.canPause) {
// currentPlayer.next() currentPlayer.pause()
// } }
// } }
// function previous() { function next() {
// if (currentPlayer && currentPlayer.canGoPrevious) { if (currentPlayer && currentPlayer.canGoNext) {
// currentPlayer.previous() currentPlayer.next()
// } }
// } }
// function seek(position) { function previous() {
// if (currentPlayer && currentPlayer.canSeek) { if (currentPlayer && currentPlayer.canGoPrevious) {
// currentPlayer.position = position currentPlayer.previous()
// currentPosition = position }
// } }
// }
// // Seek to position based on ratio (0.0 to 1.0) function seek(position) {
// function seekByRatio(ratio) { if (currentPlayer && currentPlayer.canSeek) {
// if (currentPlayer && currentPlayer.canSeek && currentPlayer.length > 0) { currentPlayer.position = position
// let seekPosition = ratio * currentPlayer.length currentPosition = position
// currentPlayer.position = seekPosition }
// currentPosition = seekPosition }
// }
// }
// // Update progress bar every second while playing // Seek to position based on ratio (0.0 to 1.0)
// Timer { function seekByRatio(ratio) {
// id: positionTimer if (currentPlayer && currentPlayer.canSeek && currentPlayer.length > 0) {
// interval: 1000 let seekPosition = ratio * currentPlayer.length
// running: currentPlayer && currentPlayer.isPlaying && currentPlayer.length > 0 currentPlayer.position = seekPosition
// && currentPlayer.playbackState === MprisPlaybackState.Playing currentPosition = seekPosition
// repeat: true }
// onTriggered: { }
// if (currentPlayer && currentPlayer.isPlaying && currentPlayer.playbackState === MprisPlaybackState.Playing) {
// currentPosition = currentPlayer.position
// } else {
// running = false
// }
// }
// }
// // Reset position when switching to inactive player // Update progress bar every second while playing
// onCurrentPlayerChanged: { Timer {
// if (!currentPlayer || !currentPlayer.isPlaying || currentPlayer.playbackState !== MprisPlaybackState.Playing) { id: positionTimer
// currentPosition = 0 interval: 1000
// } running: currentPlayer && currentPlayer.isPlaying && currentPlayer.length > 0
// } && currentPlayer.playbackState === MprisPlaybackState.Playing
repeat: true
onTriggered: {
if (currentPlayer && currentPlayer.isPlaying && currentPlayer.playbackState === MprisPlaybackState.Playing) {
currentPosition = currentPlayer.position
} else {
running = false
}
}
}
// // Update current player when available players change // Reset position when switching to inactive player
// Connections { onCurrentPlayerChanged: {
// target: Mpris.players if (!currentPlayer || !currentPlayer.isPlaying || currentPlayer.playbackState !== MprisPlaybackState.Playing) {
// function onValuesChanged() { currentPosition = 0
// updateCurrentPlayer() }
// } }
// }
// Cava { // Update current player when available players change
// id: cava Connections {
// count: 44 target: Mpris.players
// } function onValuesChanged() {
updateCurrentPlayer()
}
}
// // Expose cava values Cava {
// property alias cavaValues: cava.values id: cava
}
} }

View file

@ -0,0 +1,30 @@
pragma Singleton
import QtQuick
import Quickshell
import Quickshell.Io
import Quickshell.Services.Pipewire
Singleton {
id: root
// Ensure the volume is readonly from outside
readonly property alias volume: root._volume
property real _volume: 0
readonly property alias muted: root._muted
property bool _muted: false
PwObjectTracker {
objects: [Pipewire.defaultAudioSink]
}
Connections {
target: Pipewire.defaultAudioSink?.audio ? Pipewire.defaultAudioSink?.audio : null
function onVolumeChanged() {
root._volume = (Pipewire.defaultAudioSink?.audio.volume ?? 0)
console.log("onVolumeChanged: " + volume)
}
}
}

View file

@ -64,10 +64,10 @@ Rectangle {
root.onExited() root.onExited()
} }
onClicked: { onClicked: {
root.onClicked()
if (tooltipText) { if (tooltipText) {
tooltip.hide() tooltip.hide()
} }
root.onClicked()
} }
} }
} }

View file

@ -18,6 +18,10 @@ Item {
property real sizeMultiplier: 0.8 property real sizeMultiplier: 0.8
property bool autoHide: false property bool autoHide: false
property var onEntered: function () {}
property var onExited: function () {}
property var onClicked: function () {}
// Internal state // Internal state
property bool showPill: false property bool showPill: false
property bool shouldAnimateHide: false property bool shouldAnimateHide: false
@ -190,10 +194,15 @@ Item {
onEntered: { onEntered: {
showDelayed() showDelayed()
tooltip.show() tooltip.show()
root.onEntered()
} }
onExited: { onExited: {
hide() hide()
tooltip.hide() tooltip.hide()
root.onExited()
}
onClicked: {
root.onClicked()
} }
} }

View file

@ -4,6 +4,7 @@ import QtQuick
import Quickshell import Quickshell
import Quickshell.Io import Quickshell.Io
import Quickshell.Widgets import Quickshell.Widgets
import Quickshell.Services.Pipewire
import qs.Widgets import qs.Widgets
import qs.Modules.Bar import qs.Modules.Bar
import qs.Modules.DemoPanel import qs.Modules.DemoPanel
@ -13,7 +14,7 @@ import qs.Modules.Notification
import qs.Services import qs.Services
ShellRoot { ShellRoot {
id: root id: shellRoot
Background {} Background {}
Overview {} Overview {}