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

Add animations everywhere

Browse source
This commit is contained in:
Ly-sec 2025-08-13 15:09:49 +02:00
commit c3304818f1
16 changed files with 637 additions and 174 deletions
Download patch file Download diff file Expand all files Collapse all files

88
Modules/Background/Overview.qml
View file

@ -7,7 +7,7 @@ import qs.Widgets
NLoader {
active: Workspaces.isNiri
Component.onCompleted: {
if (Workspaces.isNiri) {
console.log("[Overview] Loading Overview component (Niri detected)")
@ -15,55 +15,55 @@ NLoader {
console.log("[Overview] Skipping Overview component (Niri not detected)")
}
}
sourceComponent: Variants {
model: Quickshell.screens
delegate: PanelWindow {
required property ShellScreen modelData
property string wallpaperSource: Wallpapers.currentWallpaper !== ""
&& !Settings.data.wallpaper.swww.enabled ? Wallpapers.currentWallpaper : ""
required property ShellScreen modelData
property string wallpaperSource: Wallpapers.currentWallpaper !== ""
&& !Settings.data.wallpaper.swww.enabled ? Wallpapers.currentWallpaper : ""
visible: wallpaperSource !== "" && !Settings.data.wallpaper.swww.enabled
color: "transparent"
screen: modelData
WlrLayershell.layer: WlrLayer.Background
WlrLayershell.exclusionMode: ExclusionMode.Ignore
WlrLayershell.namespace: "quickshell-overview"
visible: wallpaperSource !== "" && !Settings.data.wallpaper.swww.enabled
color: "transparent"
screen: modelData
WlrLayershell.layer: WlrLayer.Background
WlrLayershell.exclusionMode: ExclusionMode.Ignore
WlrLayershell.namespace: "quickshell-overview"
anchors {
top: true
bottom: true
right: true
left: true
anchors {
top: true
bottom: true
right: true
left: true
}
Image {
id: bgImage
anchors.fill: parent
fillMode: Image.PreserveAspectCrop
source: wallpaperSource
cache: true
smooth: true
mipmap: false
visible: wallpaperSource !== ""
}
MultiEffect {
id: overviewBgBlur
anchors.fill: parent
source: bgImage
blurEnabled: true
blur: 0.48
blurMax: 128
}
Rectangle {
anchors.fill: parent
color: Qt.rgba(Colors.backgroundPrimary.r, Colors.backgroundPrimary.g, Colors.backgroundPrimary.b, 0.5)
}
}
Image {
id: bgImage
anchors.fill: parent
fillMode: Image.PreserveAspectCrop
source: wallpaperSource
cache: true
smooth: true
mipmap: false
visible: wallpaperSource !== ""
}
MultiEffect {
id: overviewBgBlur
anchors.fill: parent
source: bgImage
blurEnabled: true
blur: 0.48
blurMax: 128
}
Rectangle {
anchors.fill: parent
color: Qt.rgba(Colors.backgroundPrimary.r, Colors.backgroundPrimary.g, Colors.backgroundPrimary.b, 0.5)
}
}
}
}

14
Modules/Bar/Bar.qml
View file

@ -15,8 +15,6 @@ Variants {
required property ShellScreen modelData
readonly property real scaling: Scaling.scale(screen)
property var settingsPanel: null
screen: modelData
implicitHeight: Style.barHeight * scaling
color: "transparent"
@ -52,11 +50,13 @@ Variants {
anchors.verticalCenter: parent.verticalCenter
spacing: Style.marginSmall * scaling
NText {
text: screen.name
anchors.verticalCenter: parent.verticalCenter
font.weight: Style.fontWeightBold
}
// Debug show monitor name
// NText {
// text: screen.name
// anchors.verticalCenter: parent.verticalCenter
// font.weight: Style.fontWeightBold
// }
SystemMonitor {}
}
// Center

2
Modules/Bar/NotificationHistory.qml
View file

@ -36,4 +36,4 @@ NIconButton {
NotificationHistoryPanel {
id: notificationHistoryPanelLoader
}
}
}

2
Modules/Bar/NotificationHistoryPanel.qml
View file

@ -228,4 +228,4 @@ NLoader {
}
}
}
}
}

84
Modules/Bar/SystemMonitor.qml Normal file
View file

@ -0,0 +1,84 @@
import QtQuick
import Quickshell
import qs.Services
import qs.Widgets
Row {
id: layout
anchors.verticalCenter: parent.verticalCenter
spacing: Style.marginSmall * scaling
visible: Settings.data.bar.showSystemInfo
// Ensure our width is an integer
width: Math.floor(cpuUsageLayout.width + cpuTempLayout.width + memoryUsageLayout.width + (2 * 10))
Row {
id: cpuUsageLayout
spacing: Style.marginTiny * scaling
NText {
id: cpuUsageIcon
text: "speed"
font.family: "Material Symbols Outlined"
font.pointSize: Style.fontSizeLarge * scaling
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
color: Colors.accentPrimary
}
NText {
id: cpuUsageText
text: `${SystemStats.cpuUsage}%`
font.pointSize: Style.fontSizeSmall * scaling
font.weight: Style.fontWeightBold
anchors.verticalCenter: parent.verticalCenter
verticalAlignment: Text.AlignVCenter
}
}
// CPU Temperature Component
Row {
id: cpuTempLayout
spacing: Style.marginTiny * scaling
NText {
text: "thermometer"
font.family: "Material Symbols Outlined"
font.pointSize: Style.fontSizeLarge * scaling
color: Colors.accentPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
}
NText {
text: `${SystemStats.cpuTemp}°C`
font.pointSize: Style.fontSizeSmall * scaling
font.weight: Style.fontWeightBold
anchors.verticalCenter: parent.verticalCenter
verticalAlignment: Text.AlignVCenter
}
}
// Memory Usage Component
Row {
id: memoryUsageLayout
spacing: Style.marginTiny * scaling
NText {
text: "memory"
font.family: "Material Symbols Outlined"
font.pointSize: Style.fontSizeLarge * scaling
color: Colors.accentPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
}
NText {
text: `${SystemStats.memoryUsageGb}G`
font.pointSize: Style.fontSizeSmall * scaling
font.weight: Style.fontWeightBold
anchors.verticalCenter: parent.verticalCenter
verticalAlignment: Text.AlignVCenter
}
}
}

14
Modules/Bar/Volume.qml
View file

@ -10,9 +10,6 @@ Item {
width: pill.width
height: pill.height
// Reference to settings panel
property var settingsPanel: null
Component.onCompleted: {
console.log("[Volume] settingsPanel received:", !!settingsPanel)
}
@ -87,15 +84,8 @@ Item {
}
}
onClicked: {
// Open settings panel and navigate to Audio tab
console.log("[Volume] Attempting to open settings panel...")
try {
settingsPanel.isLoaded = true
settingsPanel.content.currentTabIndex = 5 // Audio tab index
console.log("[Volume] Settings panel opened successfully")
} catch (error) {
console.log("[Volume] Error opening settings panel:", error)
}
settingsPanel.currentTabIndex = 5 // Audio tab index
settingsPanel.isLoaded = true
}
}
}

24
Modules/Settings/SettingsPanel.qml
View file

@ -10,6 +10,8 @@ import qs.Widgets
NLoader {
id: root
property int currentTabIndex: 0
content: Component {
NPanel {
id: panel
@ -52,7 +54,6 @@ NLoader {
WlrLayershell.keyboardFocus: WlrKeyboardFocus.OnDemand
property int currentTabIndex: 0
property var tabsModel: [{
"label": "General",
"icon": "tune",
@ -89,11 +90,12 @@ NLoader {
"label": "Wallpaper Selector",
"icon": "wallpaper_slideshow",
"source": "Tabs/WallpaperSelector.qml"
}, {
"label": "Misc",
"icon": "more_horiz",
"source": "Tabs/Misc.qml"
}, {
}, // {
// "label": "Misc",
// "icon": "more_horiz",
// "source": "Tabs/Misc.qml"
// },
{
"label": "About",
"icon": "info",
"source": "Tabs/About.qml"
@ -186,7 +188,7 @@ NLoader {
delegate: Rectangle {
id: tabItem
readonly property bool selected: index === panel.currentTabIndex
width: parent.width
height: 32 * scaling // Back to original height
radius: Style.radiusSmall * scaling
@ -194,6 +196,8 @@ NLoader {
border.color: "transparent"
border.width: 0
readonly property bool selected: index === currentTabIndex
// Subtle hover effect: only icon/text color tint on hover
property bool hovering: false
@ -227,7 +231,7 @@ NLoader {
onEntered: tabItem.hovering = true
onExited: tabItem.hovering = false
onCanceled: tabItem.hovering = false
onClicked: panel.currentTabIndex = index
onClicked: currentTabIndex = index
}
}
}
@ -258,7 +262,7 @@ NLoader {
// Tab label on the main right
NText {
text: panel.tabsModel[panel.currentTabIndex].label
text: panel.tabsModel[currentTabIndex].label
font.pointSize: Style.fontSizeLarge * scaling
font.weight: Style.fontWeightBold
color: Colors.accentPrimary
@ -282,7 +286,7 @@ NLoader {
id: stack
Layout.fillWidth: true
Layout.fillHeight: true
currentIndex: panel.currentTabIndex
currentIndex: currentTabIndex
Tabs.General {}
Tabs.Bar {}

118
Modules/Settings/Tabs/Audio.qml
View file

@ -88,14 +88,14 @@ ColumnLayout {
}
}
NToggle {
id: allowOverdrive
label: "Allow Volume Overdrive"
description: "Enable volume levels above 100% (up to 200%)"
value: Settings.data.audio ? Settings.data.audio.volumeOverdrive : false
onToggled: function (checked) {
Settings.data.audio.volumeOverdrive = checked
NToggle {
id: allowOverdrive
label: "Allow Volume Overdrive"
description: "Enable volume levels above 100% (up to 200%)"
value: Settings.data.audio ? Settings.data.audio.volumeOverdrive : false
onToggled: function (checked) {
Settings.data.audio.volumeOverdrive = checked
// If overdrive is disabled and current volume is above 100%, cap it
if (!checked && Audio.volume > 1.0) {
Audio.volumeSet(1.0)
@ -140,58 +140,56 @@ ColumnLayout {
font.weight: Style.fontWeightBold
color: Colors.textPrimary
Layout.bottomMargin: Style.marginSmall * scaling
}
// Output Device
NComboBox {
id: outputDeviceCombo
label: "Output Device"
description: "Default audio output device"
optionsKeys: outputDeviceKeys
optionsLabels: outputDeviceLabels
currentKey: Audio.sink ? Audio.sink.id.toString() : ""
onSelected: function (key) {
// Find the node by ID and set it as preferred
for (let i = 0; i < Pipewire.nodes.count; i++) {
let node = Pipewire.nodes.get(i)
if (node.id.toString() === key && node.isSink) {
Pipewire.preferredDefaultAudioSink = node
break
}
}
}
}
// Input Device
NComboBox {
id: inputDeviceCombo
label: "Input Device"
description: "Default audio input device"
optionsKeys: inputDeviceKeys
optionsLabels: inputDeviceLabels
currentKey: Audio.source ? Audio.source.id.toString() : ""
onSelected: function (key) {
// Find the node by ID and set it as preferred
for (let i = 0; i < Pipewire.nodes.count; i++) {
let node = Pipewire.nodes.get(i)
if (node.id.toString() === key && !node.isSink) {
Pipewire.preferredDefaultAudioSource = node
break
}
}
}
}
}
// Divider
NDivider {
Layout.fillWidth: true
Layout.topMargin: Style.marginLarge * scaling
Layout.bottomMargin: Style.marginMedium * scaling
}
// Output Device
NComboBox {
id: outputDeviceCombo
label: "Output Device"
description: "Default audio output device"
optionsKeys: outputDeviceKeys
optionsLabels: outputDeviceLabels
currentKey: Audio.sink ? Audio.sink.id.toString() : ""
onSelected: function (key) {
// Find the node by ID and set it as preferred
for (var i = 0; i < Pipewire.nodes.count; i++) {
let node = Pipewire.nodes.get(i)
if (node.id.toString() === key && node.isSink) {
Pipewire.preferredDefaultAudioSink = node
break
}
}
}
}
// Input Device
NComboBox {
id: inputDeviceCombo
label: "Input Device"
description: "Default audio input device"
optionsKeys: inputDeviceKeys
optionsLabels: inputDeviceLabels
currentKey: Audio.source ? Audio.source.id.toString() : ""
onSelected: function (key) {
// Find the node by ID and set it as preferred
for (var i = 0; i < Pipewire.nodes.count; i++) {
let node = Pipewire.nodes.get(i)
if (node.id.toString() === key && !node.isSink) {
Pipewire.preferredDefaultAudioSource = node
break
}
}
}
}
}
// Divider
NDivider {
Layout.fillWidth: true
Layout.topMargin: Style.marginLarge * scaling
Layout.bottomMargin: Style.marginMedium * scaling
}
// Audio Visualizer Category
ColumnLayout {
spacing: Style.marginSmall * scaling
@ -298,11 +296,11 @@ ColumnLayout {
outputDeviceCombo.optionsKeys = outputDeviceKeys
outputDeviceCombo.optionsLabels = outputDeviceLabels
}
if (inputDeviceCombo) {
inputDeviceCombo.optionsKeys = inputDeviceKeys
inputDeviceCombo.optionsLabels = inputDeviceLabels
}
}
}
}
}

2
Modules/Settings/Tabs/Misc.qml
View file

@ -39,8 +39,6 @@ ColumnLayout {
color: Colors.textPrimary
Layout.bottomMargin: Style.marginSmall * scaling
}
}
}
}

381
Modules/SidePanel/Cards/ProfileCard.qml
View file

@ -62,11 +62,18 @@ NBox {
}
}
NIconButton {
id: powerButton
icon: "power_settings_new"
onClicked: {
//settingsPanel.isLoaded = !settingsPanel.isLoaded
powerMenu.show()
}
}
}
}
// ----------------------------------
// Uptime
Timer {
interval: 60000
repeat: true
@ -99,4 +106,378 @@ NBox {
}
}
}
// ----------------------------------
// Logout menu
function logout() {
if (WorkspaceManager.isNiri) {
logoutProcessNiri.running = true
} else if (WorkspaceManager.isHyprland) {
logoutProcessHyprland.running = true
} else {
console.warn("No supported compositor detected for logout")
}
}
function suspend() {
suspendProcess.running = true
}
function shutdown() {
shutdownProcess.running = true
}
function reboot() {
rebootProcess.running = true
}
function updateSystemInfo() {
uptimeProcess.running = true
}
Process {
id: shutdownProcess
command: ["shutdown", "-h", "now"]
running: false
}
Process {
id: rebootProcess
command: ["reboot"]
running: false
}
Process {
id: suspendProcess
command: ["systemctl", "suspend"]
running: false
}
Process {
id: logoutProcessNiri
command: ["niri", "msg", "action", "quit", "--skip-confirmation"]
running: false
}
Process {
id: logoutProcessHyprland
command: ["hyprctl", "dispatch", "exit"]
running: false
}
Process {
id: logoutProcess
command: ["loginctl", "terminate-user", Quickshell.env("USER")]
running: false
}
NPanel {
id: powerMenu
anchors.top: powerButton.bottom
anchors.right: powerButton.right
Rectangle {
width: 160 * scaling
height: 220 * scaling
color: Colors.surface
radius: 8 * scaling
border.color: Colors.outline
border.width: 1 * scaling
visible: true
z: 9999
anchors.top: parent.top
anchors.right: parent.right
anchors.rightMargin: 32 * scaling
anchors.topMargin: powerButton.y + powerButton.height + 48 * scaling
// Prevent closing when clicking in the panel bg
MouseArea {
anchors.fill: parent
}
ColumnLayout {
anchors.fill: parent
anchors.margins: 8 * scaling
spacing: 4 * scaling
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 36 * scaling
radius: 6 * scaling
color: lockButtonArea.containsMouse ? Colors.accentPrimary : "transparent"
Item {
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: 12 * scaling
anchors.rightMargin: 12 * scaling
Row {
id: lockRow
spacing: 8 * scaling
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
Text {
text: "lock_outline"
font.family: "Material Symbols Outlined"
font.pixelSize: 16 * scaling
color: lockButtonArea.containsMouse ? Colors.onAccent : Colors.textPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 1 * scaling
}
Text {
text: "Lock Screen"
font.pixelSize: 14 * scaling
color: lockButtonArea.containsMouse ? Colors.onAccent : Colors.textPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 1 * scaling
}
}
}
MouseArea {
id: lockButtonArea
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: {
lockScreen.locked = true
systemMenu.visible = false
}
}
}
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 36 * scaling
radius: 6 * scaling
color: suspendButtonArea.containsMouse ? Colors.accentPrimary : "transparent"
Item {
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: 12 * scaling
anchors.rightMargin: 12 * scaling
Row {
id: suspendRow
spacing: 8 * scaling
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
Text {
text: "bedtime"
font.family: "Material Symbols Outlined"
font.pixelSize: 16 * scaling
color: suspendButtonArea.containsMouse ? Colors.onAccent : Colors.textPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 1 * scaling
}
Text {
text: "Suspend"
font.pixelSize: 14 * scaling
color: suspendButtonArea.containsMouse ? Colors.onAccent : Colors.textPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 1 * scaling
}
}
}
MouseArea {
id: suspendButtonArea
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: {
suspend()
systemMenu.visible = false
}
}
}
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 36 * scaling
radius: 6 * scaling
color: rebootButtonArea.containsMouse ? Colors.accentPrimary : "transparent"
Item {
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: 12 * scaling
anchors.rightMargin: 12 * scaling
Row {
id: rebootRow
spacing: 8 * scaling
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
Text {
text: "refresh"
font.family: "Material Symbols Outlined"
font.pixelSize: 16 * scaling
color: rebootButtonArea.containsMouse ? Colors.onAccent : Colors.textPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 1 * scaling
}
Text {
text: "Reboot"
font.pixelSize: 14 * scaling
color: rebootButtonArea.containsMouse ? Colors.onAccent : Colors.textPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 1 * scaling
}
}
}
MouseArea {
id: rebootButtonArea
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: {
reboot()
systemMenu.visible = false
}
}
}
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 36 * scaling
radius: 6 * scaling
color: logoutButtonArea.containsMouse ? Colors.accentPrimary : "transparent"
Item {
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: 12 * scaling
anchors.rightMargin: 12 * scaling
Row {
id: logoutRow
spacing: 8 * scaling
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
Text {
text: "exit_to_app"
font.family: "Material Symbols Outlined"
font.pixelSize: 16 * scaling
color: logoutButtonArea.containsMouse ? Colors.onAccent : Colors.textPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 1 * scaling
}
Text {
text: "Logout"
font.pixelSize: 14 * scaling
color: logoutButtonArea.containsMouse ? Colors.onAccent : Colors.textPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 1 * scaling
}
}
}
MouseArea {
id: logoutButtonArea
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: {
logout()
systemMenu.visible = false
}
}
}
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 36 * scaling
radius: 6 * scaling
color: shutdownButtonArea.containsMouse ? Colors.accentPrimary : "transparent"
Item {
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: 12 * scaling
anchors.rightMargin: 12 * scaling
Row {
id: shutdownRow
spacing: 8 * scaling
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
Text {
text: "power_settings_new"
font.family: "Material Symbols Outlined"
font.pixelSize: 16 * scaling
color: shutdownButtonArea.containsMouse ? Colors.onAccent : Colors.textPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 1 * scaling
}
Text {
text: "Shutdown"
font.pixelSize: 14 * scaling
color: shutdownButtonArea.containsMouse ? Colors.onAccent : Colors.textPrimary
verticalAlignment: Text.AlignVCenter
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 1 * scaling
}
}
}
MouseArea {
id: shutdownButtonArea
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: {
shutdown()
systemMenu.visible = false
}
}
}
}
}
}
}

4
Modules/SidePanel/Cards/UtilitiesCard.qml
View file

@ -30,6 +30,10 @@ NBox {
// Wallpaper
NIconButton {
icon: "image"
onClicked: {
settingsPanel.currentTabIndex = 8 // Audio tab index
settingsPanel.isLoaded = true
}
}
Item {