diff --git a/modules/Bar/Bar.qml b/modules/Bar/Bar.qml index 1b80b0e..87d5e4b 100644 --- a/modules/Bar/Bar.qml +++ b/modules/Bar/Bar.qml @@ -7,9 +7,14 @@ import qs Variants { model: Quickshell.screens delegate: PanelWindow { - required property ShellScreen modelData - screen: modelData id: root + required property ShellScreen modelData + margins { + top: Settings.config.floating ? Settings.config.margins : 0 + left: Settings.config.floating ? Settings.config.margins : 0 + right: Settings.config.floating ? Settings.config.margins : 0 + } + screen: modelData anchors { top: true left: true @@ -19,31 +24,37 @@ Variants { color: "transparent" Rectangle { id: bar + radius: Settings.config.floating ? Settings.config.rounding * 2 : 0 anchors.fill: parent color: ThemeLoader.colors.base00 RowLayout { id: left - anchors.leftMargin: 10 + anchors.leftMargin: Settings.config.floating ? Settings.config.barHeight / 2 - 10: 10 anchors { left: parent.left verticalCenter: parent.verticalCenter } - Ws {barScreen: root.modelData} - MPris {} + Ws { + barScreen: root.modelData + } + MPris {} } RowLayout { id: center anchors { centerIn: parent } - Title {} + Title {} } RowLayout { id: right anchors { right: parent.right verticalCenter: parent.verticalCenter + rightMargin: Settings.config.floating ? Settings.config.barHeight / 2 - 10 : 10 } + Clock {} + StatusIcons {} } } } diff --git a/modules/Bar/Clock.qml b/modules/Bar/Clock.qml new file mode 100644 index 0000000..6996d22 --- /dev/null +++ b/modules/Bar/Clock.qml @@ -0,0 +1,22 @@ +import Quickshell +import QtQuick +import qs.settings +import qs +import qs.widgets + +Rectangle { + id: root + color: ThemeLoader.colors.base03 + implicitWidth: clockText.implicitWidth + 14 + implicitHeight: Settings.config.barHeight / 2 + 6 + radius: Settings.config.rounding + SystemClock { + id: clock + precision: SystemClock.Minutes + } + CText { + id: clockText + anchors.centerIn: root + text: Qt.formatDateTime(clock.date, "hh:mm") + } +} diff --git a/modules/Bar/MPris.qml b/modules/Bar/MPris.qml index d12ee8c..7a95931 100644 --- a/modules/Bar/MPris.qml +++ b/modules/Bar/MPris.qml @@ -9,10 +9,11 @@ import qs.widgets Rectangle { id: root color: ThemeLoader.colors.base03 - implicitWidth: playingSong.implicitWidth + 14 + implicitWidth: songLayout.implicitWidth + 14 implicitHeight: Settings.config.barHeight / 2 + 6 radius: Settings.config.rounding property var spotify: root.getSpotify() + visible: getSpotify() == null ? false : true function getSpotify() { for (var i = 0; i < Mpris.players.values.length; i++) { @@ -22,9 +23,14 @@ Rectangle { } return null; } - CText { - id: playingSong + RowLayout { + id: songLayout anchors.centerIn: parent - text: root.spotify == null ? "" : root.spotify.trackTitle + " - " + root.spotify.trackArtist + CText { + id: playingSong + Layout.maximumWidth: 400 + text: root.spotify == null ? "" : root.spotify.trackTitle + " - " + root.spotify.trackArtist + elide: Text.ElideRight + } } } diff --git a/modules/Bar/StatusIcons.qml b/modules/Bar/StatusIcons.qml new file mode 100644 index 0000000..1a351d7 --- /dev/null +++ b/modules/Bar/StatusIcons.qml @@ -0,0 +1,83 @@ +import Quickshell.Services.UPower +import Quickshell.Services.Pipewire +import QtQuick +import QtQuick.Layouts +import qs +import qs.settings +import qs.widgets + +Rectangle { + id: root + color: ThemeLoader.colors.base03 + implicitWidth: iconLayout.implicitWidth + 14 + implicitHeight: Settings.config.barHeight / 2 + 6 + radius: Settings.config.rounding + property var battery: UPower.displayDevice + property var percentage: UPower.displayDevice.percentage + property bool charging: UPower.displayDevice.state == UPowerDeviceState.Charging + property bool hasBattery: UPower.displayDevice.isLaptopBattery + property var audio: Pipewire.ready ? Pipewire.defaultAudioSink : "" + property var audioPercentage: Pipewire.ready ? Pipewire.defaultAudioSink.audio.volume : 0 + property bool audioMute: Pipewire.ready ? Pipewire.defaultAudioSink.audio.muted : false + + function getBatteryIcon() { + if (charging) { + return "\uf250"; + } + if (percentage < 0.12) { + return "\uf30d"; + } + if (percentage < 0.24) { + return "\uf257"; + } + if (percentage < 0.36) { + return "\uf256"; + } + if (percentage < 0.48) { + return "\uf255"; + } + if (percentage < 0.60) { + return "\uf254"; + } + if (percentage < 0.72) { + return "\uf253"; + } + if (percentage < 0.84) { + return "\uf252"; + } + if (percentage > 0.84) { + return "\uf24f"; + } + } + function getVolumeIcon() { + if (audioMute) { + return "\ue04f"; + } + if (audioPercentage < 0.33) { + return "\ue04e"; + } + if (audioPercentage < 0.66) { + return "\ue04d"; + } + if (audioPercentage > 0.66) { + return "\ue050"; + } + } + RowLayout { + id: iconLayout + anchors.centerIn: parent + CIcon { + id: batteryIcon + text: root.getBatteryIcon() + } + CIcon { + id: volIcon + text: root.getVolumeIcon() + } + } + + property var audioSink: Pipewire.defaultAudioSink + PwObjectTracker { + objects: Pipewire.ready ? Pipewire.defaultAudioSink : [] + } +} diff --git a/modules/Bar/Title.qml b/modules/Bar/Title.qml index 1c6d7bf..13d89ea 100644 --- a/modules/Bar/Title.qml +++ b/modules/Bar/Title.qml @@ -1,6 +1,7 @@ import Quickshell import Quickshell.Wayland import QtQuick +import QtQuick.Layouts import qs import qs.widgets import qs.settings @@ -12,10 +13,14 @@ Rectangle { radius: Settings.config.rounding color: active ? ThemeLoader.colors.base03 : "transparent" implicitHeight: Settings.config.barHeight / 2 + 6 - implicitWidth: titleText.implicitWidth + 14 - CText { + implicitWidth: titleText.width + 14 + RowLayout { anchors.centerIn: parent - id: titleText - text: root.activeWindow ? root.activeWindow.activated ? root.activeWindow.title : "" : "" + CText { + id: titleText + Layout.maximumWidth: 300 + text: root.activeWindow ? root.activeWindow.activated ? root.activeWindow.title : "" : "" + elide: Text.ElideRight // Allows wrapping + } } } diff --git a/settings/Settings.qml b/settings/Settings.qml index b425699..7f5890a 100644 --- a/settings/Settings.qml +++ b/settings/Settings.qml @@ -8,15 +8,16 @@ Singleton { FileView { id: settingsView path: "file:///home/lucy/.config/qs.json" - onAdapterUpdated: writeAdapter() - onDataChanged: writeAdapter() + onFileChanged: reload() + watchChanges: true adapter: JsonAdapter { id: settingsAdapter - property int barHeight: 40 - property int rounding: 16 + property int barHeight + property int rounding property bool floating property string font - property int fontSize: 14 + property int fontSize + property int margins } } } diff --git a/widgets/CIcon.qml b/widgets/CIcon.qml index e69de29..534f895 100644 --- a/widgets/CIcon.qml +++ b/widgets/CIcon.qml @@ -0,0 +1,19 @@ +import QtQuick +import qs +import qs.settings + +Text { + id: root + color: ThemeLoader.colors.base05 + property real iconSize: 14 + property real fill: 1 + renderType: Text.NativeRendering + font { + family: "Material Symbols Rounded" + pointSize: iconSize + variableAxes: { + "FILL": fill.toFixed(1), + "opsz": iconSize + } + } +}