never/noctalia-shell
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: Add music and sysinfo to top bar (togglable) - also a bunch of misc fixes

Browse source
This commit is contained in:
ferreo 2025-07-14 20:40:43 +01:00
parent e1caf737fe
commit b4697235c0
29 changed files with 795 additions and 399 deletions
Download patch file Download diff file Expand all files Collapse all files

94
Widgets/Sidebar/Config.qml
View file

@ -10,7 +10,7 @@ import qs.Settings
Rectangle {
id: settingsModal
anchors.centerIn: parent
color: Settings.Theme.backgroundPrimary
color: Theme.backgroundPrimary
radius: 20
visible: false
z: 100
@ -36,15 +36,15 @@ Rectangle {
text: "settings"
font.family: "Material Symbols Outlined"
font.pixelSize: Theme.fontSizeHeader
color: Settings.Theme.accentPrimary
color: Theme.accentPrimary
}
Text {
text: "Settings"
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeHeader
font.bold: true
color: Settings.Theme.textPrimary
color: Theme.textPrimary
Layout.fillWidth: true
}
@ -52,8 +52,8 @@ Rectangle {
width: 36
height: 36
radius: 18
color: closeButtonArea.containsMouse ? Settings.Theme.accentPrimary : "transparent"
border.color: Settings.Theme.accentPrimary
color: closeButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
border.color: Theme.accentPrimary
border.width: 1
Text {
@ -61,7 +61,7 @@ Rectangle {
text: "close"
font.family: "Material Symbols Outlined"
font.pixelSize: Theme.fontSizeBody
color: closeButtonArea.containsMouse ? Settings.Theme.onAccent : Settings.Theme.accentPrimary
color: closeButtonArea.containsMouse ? Theme.onAccent : Theme.accentPrimary
}
MouseArea {
@ -77,7 +77,7 @@ Rectangle {
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 180
color: Settings.Theme.surface
color: Theme.surface
radius: 18
ColumnLayout {
@ -94,15 +94,15 @@ Rectangle {
text: "wb_sunny"
font.family: "Material Symbols Outlined"
font.pixelSize: Theme.fontSizeBody
color: Settings.Theme.accentPrimary
color: Theme.accentPrimary
}
Text {
text: "Weather Settings"
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeBody
font.bold: true
color: Settings.Theme.textPrimary
color: Theme.textPrimary
Layout.fillWidth: true
}
}
@ -114,18 +114,18 @@ Rectangle {
Text {
text: "City"
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeSmall
font.bold: true
color: Settings.Theme.textPrimary
color: Theme.textPrimary
}
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 40
radius: 8
color: Settings.Theme.surfaceVariant
border.color: cityInput.activeFocus ? Settings.Theme.accentPrimary : Settings.Theme.outline
color: Theme.surfaceVariant
border.color: cityInput.activeFocus ? Theme.accentPrimary : Theme.outline
border.width: 1
TextInput {
@ -139,9 +139,9 @@ Rectangle {
anchors.topMargin: 6
anchors.bottomMargin: 6
text: tempWeatherCity
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeSmall
color: Settings.Theme.textPrimary
color: Theme.textPrimary
verticalAlignment: TextInput.AlignVCenter
clip: true
focus: true
@ -170,10 +170,10 @@ Rectangle {
Text {
text: "Temperature Unit"
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeSmall
font.bold: true
color: Settings.Theme.textPrimary
color: Theme.textPrimary
}
Item {
@ -186,8 +186,8 @@ Rectangle {
width: 52
height: 32
radius: 16
color: Settings.Theme.accentPrimary
border.color: Settings.Theme.accentPrimary
color: Theme.accentPrimary
border.color: Theme.accentPrimary
border.width: 2
Rectangle {
@ -195,8 +195,8 @@ Rectangle {
width: 28
height: 28
radius: 14
color: Settings.Theme.surface
border.color: Settings.Theme.outline
color: Theme.surface
border.color: Theme.outline
border.width: 1
y: 2
x: tempUseFahrenheit ? customSwitch.width - width - 2 : 2
@ -204,10 +204,10 @@ Rectangle {
Text {
anchors.centerIn: parent
text: tempUseFahrenheit ? "°F" : "°C"
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeCaption
font.bold: true
color: Settings.Theme.textPrimary
color: Theme.textPrimary
}
Behavior on x {
@ -230,7 +230,7 @@ Rectangle {
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 140
color: Settings.Theme.surface
color: Theme.surface
radius: 18
anchors.left: parent.left
anchors.right: parent.right
@ -253,15 +253,15 @@ Rectangle {
text: "person"
font.family: "Material Symbols Outlined"
font.pixelSize: Theme.fontSizeBody
color: Settings.Theme.accentPrimary
color: Theme.accentPrimary
}
Text {
text: "Profile Image"
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeBody
font.bold: true
color: Settings.Theme.textPrimary
color: Theme.textPrimary
Layout.fillWidth: true
}
}
@ -275,8 +275,8 @@ Rectangle {
width: 36
height: 36
radius: 18
color: Settings.Theme.surfaceVariant
border.color: profileImageInput.activeFocus ? Settings.Theme.accentPrimary : Settings.Theme.outline
color: Theme.surfaceVariant
border.color: profileImageInput.activeFocus ? Theme.accentPrimary : Theme.outline
border.width: 1
Image {
@ -306,7 +306,7 @@ Rectangle {
text: "person"
font.family: "Material Symbols Outlined"
font.pixelSize: Theme.fontSizeBody
color: Settings.Theme.accentPrimary
color: Theme.accentPrimary
visible: tempProfileImage === ""
}
}
@ -316,8 +316,8 @@ Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 40
radius: 8
color: Settings.Theme.surfaceVariant
border.color: profileImageInput.activeFocus ? Settings.Theme.accentPrimary : Settings.Theme.outline
color: Theme.surfaceVariant
border.color: profileImageInput.activeFocus ? Theme.accentPrimary : Theme.outline
border.width: 1
TextInput {
@ -331,9 +331,9 @@ Rectangle {
anchors.topMargin: 6
anchors.bottomMargin: 6
text: tempProfileImage
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeSmall
color: Settings.Theme.textPrimary
color: Theme.textPrimary
verticalAlignment: TextInput.AlignVCenter
clip: true
focus: true
@ -359,7 +359,7 @@ Rectangle {
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 100
color: Settings.Theme.surface
color: Theme.surface
radius: 18
ColumnLayout {
@ -375,14 +375,14 @@ Rectangle {
text: "image"
font.family: "Material Symbols Outlined"
font.pixelSize: Theme.fontSizeBody
color: Settings.Theme.accentPrimary
color: Theme.accentPrimary
}
Text {
text: "Wallpaper Folder"
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeBody
font.bold: true
color: Settings.Theme.textPrimary
color: Theme.textPrimary
Layout.fillWidth: true
}
}
@ -392,8 +392,8 @@ Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 40
radius: 8
color: Settings.Theme.surfaceVariant
border.color: wallpaperFolderInput.activeFocus ? Settings.Theme.accentPrimary : Settings.Theme.outline
color: Theme.surfaceVariant
border.color: wallpaperFolderInput.activeFocus ? Theme.accentPrimary : Theme.outline
border.width: 1
TextInput {
@ -407,9 +407,9 @@ Rectangle {
anchors.topMargin: 6
anchors.bottomMargin: 6
text: tempWallpaperFolder
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeSmall
color: Settings.Theme.textPrimary
color: Theme.textPrimary
verticalAlignment: TextInput.AlignVCenter
clip: true
selectByMouse: true
@ -435,7 +435,7 @@ Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 44
radius: 12
color: applyButtonArea.containsMouse ? Settings.Theme.accentPrimary : Settings.Theme.accentPrimary
color: applyButtonArea.containsMouse ? Theme.accentPrimary : Theme.accentPrimary
border.color: "transparent"
border.width: 0
opacity: 1.0
@ -443,10 +443,10 @@ Rectangle {
Text {
anchors.centerIn: parent
text: "Apply Changes"
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeSmall
font.bold: true
color: applyButtonArea.containsMouse ? Settings.Theme.onAccent : Settings.Theme.onAccent
color: applyButtonArea.containsMouse ? Theme.onAccent : Theme.onAccent
}
MouseArea {

118
Widgets/Sidebar/Config/ProfileSettings.qml
View file

@ -7,7 +7,7 @@ import qs.Settings
Rectangle {
id: profileSettingsCard
Layout.fillWidth: true
Layout.preferredHeight: 200
Layout.preferredHeight: 300
color: Theme.surface
radius: 18
border.color: "transparent"
@ -15,6 +15,10 @@ Rectangle {
Layout.bottomMargin: 16
property bool showActiveWindowIcon: false
signal showAWIconChanged(bool showActiveWindowIcon)
property bool showSystemInfoInBar: true
signal showSystemInfoChanged(bool showSystemInfoInBar)
property bool showMediaInBar: false
signal showMediaChanged(bool showMediaInBar)
ColumnLayout {
anchors.fill: parent
@ -125,7 +129,6 @@ Rectangle {
}
}
// Show Active Window Icon Setting
RowLayout {
spacing: 8
@ -148,8 +151,8 @@ Rectangle {
width: 52
height: 32
radius: 16
color: Theme.accentPrimary
border.color: Theme.accentPrimary
color: showActiveWindowIcon ? Theme.accentPrimary : Theme.surfaceVariant
border.color: showActiveWindowIcon ? Theme.accentPrimary : Theme.outline
border.width: 2
Rectangle {
@ -177,6 +180,110 @@ Rectangle {
}
}
// Show System Info In Bar Setting
RowLayout {
spacing: 8
Layout.fillWidth: true
Text {
text: "Show System Info In Bar"
font.pixelSize: 13
font.bold: true
color: Theme.textPrimary
Layout.alignment: Qt.AlignVCenter
}
Item {
Layout.fillWidth: true
}
// Custom Material 3 Switch
Rectangle {
id: customSwitch2
width: 52
height: 32
radius: 16
color: showSystemInfoInBar ? Theme.accentPrimary : Theme.surfaceVariant
border.color: showSystemInfoInBar ? Theme.accentPrimary : Theme.outline
border.width: 2
Rectangle {
id: thumb2
width: 28
height: 28
radius: 14
color: Theme.surface
border.color: Theme.outline
border.width: 1
y: 2
x: showSystemInfoInBar ? customSwitch2.width - width - 2 : 2
Behavior on x {
NumberAnimation { duration: 200; easing.type: Easing.OutCubic }
}
}
MouseArea {
anchors.fill: parent
onClicked: {
showSystemInfoChanged(!showSystemInfoInBar)
}
}
}
}
// Show Media In Bar Setting
RowLayout {
spacing: 8
Layout.fillWidth: true
Text {
text: "Show Media In Bar"
font.pixelSize: 13
font.bold: true
color: Theme.textPrimary
Layout.alignment: Qt.AlignVCenter
}
Item {
Layout.fillWidth: true
}
// Custom Material 3 Switch
Rectangle {
id: customSwitch3
width: 52
height: 32
radius: 16
color: showMediaInBar ? Theme.accentPrimary : Theme.surfaceVariant
border.color: showMediaInBar ? Theme.accentPrimary : Theme.outline
border.width: 2
Rectangle {
id: thumb3
width: 28
height: 28
radius: 14
color: Theme.surface
border.color: Theme.outline
border.width: 1
y: 2
x: showMediaInBar ? customSwitch3.width - width - 2 : 2
Behavior on x {
NumberAnimation { duration: 200; easing.type: Easing.OutCubic }
}
}
MouseArea {
anchors.fill: parent
onClicked: {
showMediaChanged(!showMediaInBar)
}
}
}
}
// Video Path Input Row
RowLayout {
spacing: 8
@ -184,7 +291,8 @@ Rectangle {
Text {
text: "Video Path"
font.pixelSize: 14
font.pixelSize: 13
font.bold: true
color: Theme.textPrimary
Layout.alignment: Qt.AlignVCenter
}

14
Widgets/Sidebar/Config/SettingsModal.qml
View file

@ -9,7 +9,7 @@ import qs.Services
PanelWindow {
id: settingsModal
implicitWidth: 480
implicitHeight: 720
implicitHeight: 800
visible: false
color: "transparent"
anchors.top: true
@ -35,6 +35,8 @@ PanelWindow {
property int tempTransitionFps: Settings.transitionFps
property string tempTransitionType: Settings.transitionType
property real tempTransitionDuration: Settings.transitionDuration
property bool tempShowSystemInfoInBar: Settings.showSystemInfoInBar
property bool tempShowMediaInBar: Settings.showMediaInBar
Rectangle {
anchors.fill: parent
@ -141,6 +143,14 @@ PanelWindow {
onShowAWIconChanged: function (showActiveWindowIcon) {
tempShowActiveWindowIcon = showActiveWindowIcon;
}
showSystemInfoInBar: tempShowSystemInfoInBar
onShowSystemInfoChanged: function (showSystemInfoInBar) {
tempShowSystemInfoInBar = showSystemInfoInBar;
}
showMediaInBar: tempShowMediaInBar
onShowMediaChanged: function (showMediaInBar) {
tempShowMediaInBar = showMediaInBar;
}
}
}
CollapsibleCategory {
@ -224,6 +234,8 @@ PanelWindow {
Settings.transitionFps = tempTransitionFps;
Settings.transitionType = tempTransitionType;
Settings.transitionDuration = tempTransitionDuration;
Settings.showSystemInfoInBar = tempShowSystemInfoInBar;
Settings.showMediaInBar = tempShowMediaInBar;
Settings.saveSettings();
if (typeof weather !== 'undefined' && weather) {
weather.fetchCityWeather();

2
Widgets/Sidebar/Panel/BluetoothPanel.qml
View file

@ -73,7 +73,7 @@ Item {
PanelWindow {
id: bluetoothPanelModal
implicitWidth: 480
implicitHeight: 720
implicitHeight: 800
visible: false
color: "transparent"
anchors.top: true

141
Widgets/Sidebar/Panel/Music.qml
View file

@ -2,90 +2,16 @@ import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import Qt5Compat.GraphicalEffects
import Quickshell.Services.Mpris
import qs.Settings
import qs.Components
import QtQuick
import qs.Services
Rectangle {
id: musicCard
width: 360
height: 200
height: 250
color: "transparent"
property var currentPlayer: null
property real currentPosition: 0
property int selectedPlayerIndex: 0
// Returns available MPRIS players
function getAvailablePlayers() {
if (!Mpris.players || !Mpris.players.values) {
return []
}
let allPlayers = Mpris.players.values
let controllablePlayers = []
for (let i = 0; i < allPlayers.length; i++) {
let player = allPlayers[i]
if (player && player.canControl) {
controllablePlayers.push(player)
}
}
return controllablePlayers
}
// Returns active player or first available
function findActivePlayer() {
let availablePlayers = getAvailablePlayers()
if (availablePlayers.length === 0) {
return null
}
// Use selected player if valid, otherwise use first available
if (selectedPlayerIndex < availablePlayers.length) {
return availablePlayers[selectedPlayerIndex]
} else {
selectedPlayerIndex = 0
return availablePlayers[0]
}
}
// Updates currentPlayer and currentPosition
function updateCurrentPlayer() {
let newPlayer = findActivePlayer()
if (newPlayer !== currentPlayer) {
currentPlayer = newPlayer
currentPosition = currentPlayer ? currentPlayer.position : 0
}
}
// Updates progress bar every second
Timer {
id: positionTimer
interval: 1000
running: currentPlayer && currentPlayer.isPlaying && currentPlayer.length > 0
repeat: true
onTriggered: {
if (currentPlayer && currentPlayer.isPlaying) {
currentPosition = currentPlayer.position
}
}
}
// Reacts to player list changes
Connections {
target: Mpris.players
function onValuesChanged() {
updateCurrentPlayer()
}
}
Component.onCompleted: {
updateCurrentPlayer()
}
Rectangle {
id: card
anchors.fill: parent
@ -96,7 +22,7 @@ Rectangle {
Item {
width: parent.width
height: parent.height
visible: !currentPlayer
visible: !MusicManager.currentPlayer
ColumnLayout {
anchors.centerIn: parent
@ -111,7 +37,7 @@ Rectangle {
}
Text {
text: getAvailablePlayers().length > 0 ? "No controllable player selected" : "No music player detected"
text: MusicManager.hasPlayer ? "No controllable player selected" : "No music player detected"
color: Qt.rgba(Theme.textPrimary.r, Theme.textPrimary.g, Theme.textPrimary.b, 0.6)
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeSmall
@ -141,6 +67,7 @@ Rectangle {
// Spectrum visualizer
CircularSpectrum {
id: spectrum
values: MusicManager.cavaValues
anchors.centerIn: parent
innerRadius: 30 // just outside 60x60 album art
outerRadius: 48 // how far bars extend
@ -170,7 +97,7 @@ Rectangle {
asynchronous: true
sourceSize.width: 60
sourceSize.height: 60
source: currentPlayer ? (currentPlayer.trackArtUrl || "") : ""
source: MusicManager.trackArtUrl
visible: source.toString() !== ""
// Rounded corners using layer
@ -204,7 +131,7 @@ Rectangle {
spacing: 4
Text {
text: currentPlayer ? (currentPlayer.trackTitle || "Unknown Track") : ""
text: MusicManager.trackTitle
color: Theme.textPrimary
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeSmall
@ -216,7 +143,7 @@ Rectangle {
}
Text {
text: currentPlayer ? (currentPlayer.trackArtist || "Unknown Artist") : ""
text: MusicManager.trackArtist
color: Qt.rgba(Theme.textPrimary.r, Theme.textPrimary.g, Theme.textPrimary.b, 0.8)
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeCaption
@ -225,7 +152,7 @@ Rectangle {
}
Text {
text: currentPlayer ? (currentPlayer.trackAlbum || "Unknown Album") : ""
text: MusicManager.trackAlbum
color: Qt.rgba(Theme.textPrimary.r, Theme.textPrimary.g, Theme.textPrimary.b, 0.6)
font.family: Theme.fontFamily
font.pixelSize: Theme.fontSizeCaption
@ -244,8 +171,8 @@ Rectangle {
color: Qt.rgba(Theme.textPrimary.r, Theme.textPrimary.g, Theme.textPrimary.b, 0.15)
Layout.fillWidth: true
property real progressRatio: currentPlayer && currentPlayer.length > 0 ?
(currentPosition / currentPlayer.length) : 0
property real progressRatio: MusicManager.trackLength > 0 ?
(MusicManager.currentPosition / MusicManager.trackLength) : 0
Rectangle {
id: progressFill
@ -272,7 +199,7 @@ Rectangle {
x: Math.max(0, Math.min(parent.width - width, progressFill.width - width/2))
anchors.verticalCenter: parent.verticalCenter
visible: currentPlayer && currentPlayer.length > 0
visible: MusicManager.trackLength > 0
scale: progressMouseArea.containsMouse || progressMouseArea.pressed ? 1.2 : 1.0
Behavior on scale {
@ -285,23 +212,17 @@ Rectangle {
id: progressMouseArea
anchors.fill: parent
hoverEnabled: true
enabled: currentPlayer && currentPlayer.length > 0 && currentPlayer.canSeek
enabled: MusicManager.trackLength > 0 && MusicManager.canSeek
onClicked: function(mouse) {
if (currentPlayer && currentPlayer.length > 0) {
let ratio = mouse.x / width
let seekPosition = ratio * currentPlayer.length
currentPlayer.position = seekPosition
currentPosition = seekPosition
}
let ratio = mouse.x / width
MusicManager.seekByRatio(ratio)
}
onPositionChanged: function(mouse) {
if (pressed && currentPlayer && currentPlayer.length > 0) {
if (pressed) {
let ratio = Math.max(0, Math.min(1, mouse.x / width))
let seekPosition = ratio * currentPlayer.length
currentPlayer.position = seekPosition
currentPosition = seekPosition
MusicManager.seekByRatio(ratio)
}
}
}
@ -326,8 +247,8 @@ Rectangle {
id: previousButton
anchors.fill: parent
hoverEnabled: true
enabled: currentPlayer && currentPlayer.canGoPrevious
onClicked: if (currentPlayer) currentPlayer.previous()
enabled: MusicManager.canGoPrevious
onClicked: MusicManager.previous()
}
Text {
@ -352,21 +273,13 @@ Rectangle {
id: playButton
anchors.fill: parent
hoverEnabled: true
enabled: currentPlayer && (currentPlayer.canPlay || currentPlayer.canPause)
onClicked: {
if (currentPlayer) {
if (currentPlayer.isPlaying) {
currentPlayer.pause()
} else {
currentPlayer.play()
}
}
}
enabled: MusicManager.canPlay || MusicManager.canPause
onClicked: MusicManager.playPause()
}
Text {
anchors.centerIn: parent
text: currentPlayer && currentPlayer.isPlaying ? "pause" : "play_arrow"
text: MusicManager.isPlaying ? "pause" : "play_arrow"
font.family: "Material Symbols Outlined"
font.pixelSize: Theme.fontSizeBody
color: playButton.enabled ? Theme.accentPrimary : Qt.rgba(Theme.textPrimary.r, Theme.textPrimary.g, Theme.textPrimary.b, 0.3)
@ -386,8 +299,8 @@ Rectangle {
id: nextButton
anchors.fill: parent
hoverEnabled: true
enabled: currentPlayer && currentPlayer.canGoNext
onClicked: if (currentPlayer) currentPlayer.next()
enabled: MusicManager.canGoNext
onClicked: MusicManager.next()
}
Text {
@ -401,10 +314,4 @@ Rectangle {
}
}
}
// Audio Visualizer (Cava)
Cava {
id: cava
count: 64
}
}

4
Widgets/Sidebar/Panel/PanelPopup.qml
View file

@ -10,7 +10,7 @@ import qs.Components
PanelWindow {
id: panelPopup
implicitWidth: 500
implicitHeight: 750
implicitHeight: 800
visible: false
color: "transparent"
screen: modelData
@ -30,7 +30,6 @@ PanelWindow {
slideAnim.from = width;
slideAnim.to = 0;
slideAnim.running = true;
if (systemMonitor) systemMonitor.startMonitoring();
if (weather) weather.startWeatherFetch();
if (systemWidget) systemWidget.panelVisible = true;
if (quickAccessWidget) quickAccessWidget.panelVisible = true;
@ -56,7 +55,6 @@ PanelWindow {
if (panelPopup.slideOffset === panelPopup.width) {
panelPopup.visible = false;
// Stop monitoring and background tasks when hidden
if (systemMonitor) systemMonitor.stopMonitoring();
if (weather) weather.stopWeatherFetch();
if (systemWidget) systemWidget.panelVisible = false;
if (quickAccessWidget) quickAccessWidget.panelVisible = false;

36
Widgets/Sidebar/Panel/QuickAccess.qml
View file

@ -4,7 +4,7 @@ import QtQuick.Controls
import Qt5Compat.GraphicalEffects
import Quickshell
import Quickshell.Io
import "root:/Settings" as Settings
import qs.Settings
Rectangle {
id: quickAccessWidget
@ -24,7 +24,7 @@ Rectangle {
Rectangle {
id: card
anchors.fill: parent
color: Settings.Theme.surface
color: Theme.surface
radius: 18
RowLayout {
@ -38,8 +38,8 @@ Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 44
radius: 12
color: settingsButtonArea.containsMouse ? Settings.Theme.accentPrimary : "transparent"
border.color: Settings.Theme.accentPrimary
color: settingsButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
border.color: Theme.accentPrimary
border.width: 1
RowLayout {
@ -51,15 +51,15 @@ Rectangle {
text: "settings"
font.family: settingsButtonArea.containsMouse ? "Material Symbols Rounded" : "Material Symbols Outlined"
font.pixelSize: 16
color: settingsButtonArea.containsMouse ? Settings.Theme.onAccent : Settings.Theme.accentPrimary
color: settingsButtonArea.containsMouse ? Theme.onAccent : Theme.accentPrimary
}
Text {
text: "Settings"
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: 14
font.bold: true
color: settingsButtonArea.containsMouse ? Settings.Theme.onAccent : Settings.Theme.textPrimary
color: settingsButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
Layout.fillWidth: true
}
}
@ -80,9 +80,9 @@ Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 44
radius: 12
color: isRecording ? Settings.Theme.accentPrimary :
(recorderButtonArea.containsMouse ? Settings.Theme.accentPrimary : "transparent")
border.color: Settings.Theme.accentPrimary
color: isRecording ? Theme.accentPrimary :
(recorderButtonArea.containsMouse ? Theme.accentPrimary : "transparent")
border.color: Theme.accentPrimary
border.width: 1
RowLayout {
@ -94,15 +94,15 @@ Rectangle {
text: isRecording ? "radio_button_checked" : "radio_button_unchecked"
font.family: (isRecording || recorderButtonArea.containsMouse) ? "Material Symbols Rounded" : "Material Symbols Outlined"
font.pixelSize: 16
color: isRecording || recorderButtonArea.containsMouse ? Settings.Theme.onAccent : Settings.Theme.accentPrimary
color: isRecording || recorderButtonArea.containsMouse ? Theme.onAccent : Theme.accentPrimary
}
Text {
text: isRecording ? "End" : "Record"
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: 14
font.bold: true
color: isRecording || recorderButtonArea.containsMouse ? Settings.Theme.onAccent : Settings.Theme.textPrimary
color: isRecording || recorderButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
Layout.fillWidth: true
}
}
@ -127,8 +127,8 @@ Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 44
radius: 12
color: wallpaperButtonArea.containsMouse ? Settings.Theme.accentPrimary : "transparent"
border.color: Settings.Theme.accentPrimary
color: wallpaperButtonArea.containsMouse ? Theme.accentPrimary : "transparent"
border.color: Theme.accentPrimary
border.width: 1
RowLayout {
@ -140,15 +140,15 @@ Rectangle {
text: "image"
font.family: "Material Symbols Outlined"
font.pixelSize: 16
color: wallpaperButtonArea.containsMouse ? Settings.Theme.onAccent : Settings.Theme.accentPrimary
color: wallpaperButtonArea.containsMouse ? Theme.onAccent : Theme.accentPrimary
}
Text {
text: "Wallpaper"
font.family: Settings.Theme.fontFamily
font.family: Theme.fontFamily
font.pixelSize: 14
font.bold: true
color: wallpaperButtonArea.containsMouse ? Settings.Theme.onAccent : Settings.Theme.textPrimary
color: wallpaperButtonArea.containsMouse ? Theme.onAccent : Theme.textPrimary
Layout.fillWidth: true
}
}

128
Widgets/Sidebar/Panel/SystemMonitor.qml
View file

@ -2,116 +2,22 @@ import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
import Quickshell.Io
import "root:/Settings" as Settings
import "root:/Components" as Components
import qs.Components
import qs.Services
import qs.Settings
Rectangle {
id: systemMonitor
width: 70
height: 200
height: 250
color: "transparent"
property real cpuUsage: 0
property real memoryUsage: 0
property real diskUsage: 0
property bool isVisible: false
Timer {
id: cpuTimer
interval: 2000
repeat: true
running: isVisible
onTriggered: cpuInfo.running = true
}
Timer {
id: memoryTimer
interval: 3000
repeat: true
running: isVisible
onTriggered: memoryInfo.running = true
}
Timer {
id: diskTimer
interval: 5000
repeat: true
running: isVisible
onTriggered: diskInfo.running = true
}
// Process for getting CPU usage
Process {
id: cpuInfo
command: ["sh", "-c", "top -bn1 | grep 'Cpu(s)' | awk '{print $2}' | awk -F'%' '{print $1}'"]
running: false
stdout: SplitParser {
onRead: data => {
let usage = parseFloat(data.trim())
if (!isNaN(usage)) {
systemMonitor.cpuUsage = usage
}
cpuInfo.running = false
}
}
}
// Process for getting memory usage
Process {
id: memoryInfo
command: ["sh", "-c", "free | grep Mem | awk '{print int($3/$2 * 100)}'"]
running: false
stdout: SplitParser {
onRead: data => {
let usage = parseFloat(data.trim())
if (!isNaN(usage)) {
systemMonitor.memoryUsage = usage
}
memoryInfo.running = false
}
}
}
// Process for getting disk usage
Process {
id: diskInfo
command: ["sh", "-c", "df / | tail -1 | awk '{print int($5)}'"]
running: false
stdout: SplitParser {
onRead: data => {
let usage = parseFloat(data.trim())
if (!isNaN(usage)) {
systemMonitor.diskUsage = usage
}
diskInfo.running = false
}
}
}
// Function to start monitoring
function startMonitoring() {
isVisible = true
// Trigger initial readings
cpuInfo.running = true
memoryInfo.running = true
diskInfo.running = true
}
// Function to stop monitoring
function stopMonitoring() {
isVisible = false
cpuInfo.running = false
memoryInfo.running = false
diskInfo.running = false
}
Rectangle {
id: card
anchors.fill: parent
color: Settings.Theme.surface
color: Theme.surface
radius: 18
ColumnLayout {
@ -121,8 +27,8 @@ Rectangle {
Layout.alignment: Qt.AlignVCenter
// CPU Usage
Components.CircularProgressBar {
progress: cpuUsage / 100
CircularProgressBar {
progress: Sysinfo.cpuUsage / 100
size: 50
strokeWidth: 4
hasNotch: true
@ -131,9 +37,21 @@ Rectangle {
Layout.alignment: Qt.AlignHCenter
}
// Cpu Temp
CircularProgressBar {
progress: Sysinfo.cpuTemp / 100
size: 50
strokeWidth: 4
hasNotch: true
units: "°C"
notchIcon: "thermometer"
notchIconSize: 14
Layout.alignment: Qt.AlignHCenter
}
// Memory Usage
Components.CircularProgressBar {
progress: memoryUsage / 100
CircularProgressBar {
progress: Sysinfo.memoryUsagePer / 100
size: 50
strokeWidth: 4
hasNotch: true
@ -143,8 +61,8 @@ Rectangle {
}
// Disk Usage
Components.CircularProgressBar {
progress: diskUsage / 100
CircularProgressBar {
progress: Sysinfo.diskUsage / 100
size: 50
strokeWidth: 4
hasNotch: true

2
Widgets/Sidebar/Panel/WallpaperPanel.qml
View file

@ -10,7 +10,7 @@ import qs.Services
PanelWindow {
id: wallpaperPanelModal
implicitWidth: 480
implicitHeight: 720
implicitHeight: 800
visible: false
color: "transparent"
anchors.top: true

2
Widgets/Sidebar/Panel/Weather.qml
View file

@ -2,7 +2,7 @@ import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
import qs.Settings
import "root:/Helpers/Weather.js" as WeatherHelper
import "../../../Helpers/Weather.js" as WeatherHelper
Rectangle {
id: weatherRoot

2
Widgets/Sidebar/Panel/WifiPanel.qml
View file

@ -335,7 +335,7 @@ Item {
PanelWindow {
id: wifiPanelModal
implicitWidth: 480
implicitHeight: 720
implicitHeight: 800
visible: false
color: "transparent"
anchors.top: true