Add ToastService, NToast etc

This commit is contained in:
Ly-sec 2025-08-19 14:14:00 +02:00
parent 1993e28c18
commit 1d860da42e
18 changed files with 534 additions and 31 deletions

View file

@ -108,7 +108,7 @@ Singleton {
property JsonObject bar
bar: JsonObject {
property string barPosition: "top" // Possible values: "top", "bottom", "left", "right"
property string position: "top" // Possible values: "top", "bottom", "left", "right"
property bool showActiveWindow: true
property bool showSystemInfo: false
property bool showMedia: false

View file

@ -44,10 +44,10 @@ NLoader {
margins {
top: (Settings.data.bar.monitors.includes(modelData.name)
|| (Settings.data.bar.monitors.length === 0)) && Settings.data.bar.barPosition === "top"
|| (Settings.data.bar.monitors.length === 0)) && Settings.data.bar.position === "top"
? Math.floor(Style.barHeight * scaling) : 0
bottom: (Settings.data.bar.monitors.includes(modelData.name)
|| (Settings.data.bar.monitors.length === 0)) && Settings.data.bar.barPosition === "bottom"
|| (Settings.data.bar.monitors.length === 0)) && Settings.data.bar.position === "bottom"
? Math.floor(Style.barHeight * scaling) : 0
}

View file

@ -25,8 +25,8 @@ Variants {
|| (Settings.data.bar.monitors.length === 0)) : false
anchors {
top: Settings.data.bar.barPosition === "top"
bottom: Settings.data.bar.barPosition === "bottom"
top: Settings.data.bar.position === "top"
bottom: Settings.data.bar.position === "bottom"
left: true
right: true
}

View file

@ -76,10 +76,10 @@ NLoader {
anchors {
right: parent.right
rightMargin: Style.marginXS * scaling
top: Settings.data.bar.barPosition === "top" ? parent.top : undefined
bottom: Settings.data.bar.barPosition === "bottom" ? parent.bottom : undefined
topMargin: Settings.data.bar.barPosition === "top" ? Style.marginXS * scaling : undefined
bottomMargin: Settings.data.bar.barPosition === "bottom" ? Style.barHeight * scaling + Style.marginXS * scaling : undefined
top: Settings.data.bar.position === "top" ? parent.top : undefined
bottom: Settings.data.bar.position === "bottom" ? parent.bottom : undefined
topMargin: Settings.data.bar.position === "top" ? Style.marginXS * scaling : undefined
bottomMargin: Settings.data.bar.position === "bottom" ? Style.barHeight * scaling + Style.marginXS * scaling : undefined
}
// Animation properties

View file

@ -20,7 +20,7 @@ Rectangle {
id: tooltip
text: Time.dateString
target: clock
positionAbove: Settings.data.bar.barPosition === "bottom"
positionAbove: Settings.data.bar.position === "bottom"
}
onEntered: {

View file

@ -119,7 +119,7 @@ Rectangle {
id: trayTooltip
target: trayIcon
text: modelData.tooltipTitle || modelData.name || modelData.id || "Tray Item"
positionAbove: Settings.data.bar.barPosition === "bottom"
positionAbove: Settings.data.bar.position === "bottom"
}
}
}

View file

@ -91,10 +91,10 @@ NLoader {
anchors {
right: parent.right
rightMargin: Style.marginXS * scaling
top: Settings.data.bar.barPosition === "top" ? parent.top : undefined
bottom: Settings.data.bar.barPosition === "bottom" ? parent.bottom : undefined
topMargin: Settings.data.bar.barPosition === "top" ? Style.marginXS * scaling : undefined
bottomMargin: Settings.data.bar.barPosition === "bottom" ? Style.barHeight * scaling + Style.marginXS * scaling : undefined
top: Settings.data.bar.position === "top" ? parent.top : undefined
bottom: Settings.data.bar.position === "bottom" ? parent.bottom : undefined
topMargin: Settings.data.bar.position === "top" ? Style.marginXS * scaling : undefined
bottomMargin: Settings.data.bar.position === "bottom" ? Style.barHeight * scaling + Style.marginXS * scaling : undefined
}
// Animation properties

View file

@ -71,9 +71,9 @@ ColumnLayout {
name: "Bottom"
}
}
currentKey: Settings.data.bar.barPosition
currentKey: Settings.data.bar.position
onSelected: function (key) {
Settings.data.bar.barPosition = key
Settings.data.bar.position = key
}
}
}

View file

@ -1,10 +1,10 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Quickshell.Io
import qs.Commons
import qs.Services
import qs.Widgets
import Quickshell.Io
ColumnLayout {
id: root
@ -147,9 +147,12 @@ ColumnLayout {
description: "Automatically generate colors based on your active wallpaper."
checked: Settings.data.colorSchemes.useWallpaperColors
onToggled: checked => {
Settings.data.colorSchemes.useWallpaperColors = checked
if (Settings.data.colorSchemes.useWallpaperColors) {
ColorSchemeService.changedWallpaper()
if (checked) {
// Check if matugen is installed
matugenCheck.running = true
} else {
Settings.data.colorSchemes.useWallpaperColors = false
ToastService.showNotice("Matugen:\nDisabled")
}
}
}
@ -337,4 +340,26 @@ ColumnLayout {
}
}
}
// Simple process to check if matugen exists
Process {
id: matugenCheck
command: ["which", "matugen"]
running: false
onExited: function(exitCode) {
if (exitCode === 0) {
// Matugen exists, enable it
Settings.data.colorSchemes.useWallpaperColors = true
ColorSchemeService.changedWallpaper()
ToastService.showNotice("Matugen:\nEnabled!")
} else {
// Matugen not found
ToastService.showWarning("Matugen:\nNot installed!")
}
}
stdout: StdioCollector {}
stderr: StdioCollector {}
}
}

View file

@ -49,6 +49,11 @@ ColumnLayout {
onToggled: checked => {
Settings.data.network.wifiEnabled = checked
NetworkService.setWifiEnabled(checked)
if (checked) {
ToastService.showNotice("WiFi:\nEnabled")
} else {
ToastService.showNotice("WiFi:\nDisabled")
}
}
}
@ -59,6 +64,11 @@ ColumnLayout {
onToggled: checked => {
Settings.data.network.bluetoothEnabled = checked
BluetoothService.setBluetoothEnabled(checked)
if (checked) {
ToastService.showNotice("Bluetooth:\nEnabled")
} else {
ToastService.showNotice("Bluetooth:\nDisabled")
}
}
}
}

View file

@ -1,6 +1,7 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Quickshell.Io
import qs.Commons
import qs.Services
import qs.Widgets
@ -147,7 +148,13 @@ ColumnLayout {
description: "Use SWWW daemon for advanced wallpaper management."
checked: Settings.data.wallpaper.swww.enabled
onToggled: checked => {
Settings.data.wallpaper.swww.enabled = checked
if (checked) {
// Check if swww is installed
swwwCheck.running = true
} else {
Settings.data.wallpaper.swww.enabled = false
ToastService.showNotice("SWWW:\nDisabled")
}
}
}
@ -335,4 +342,26 @@ ColumnLayout {
}
}
}
// Process to check if swww is installed
Process {
id: swwwCheck
command: ["which", "swww"]
running: false
onExited: function(exitCode) {
if (exitCode === 0) {
// SWWW exists, enable it
Settings.data.wallpaper.swww.enabled = true
WallpaperService.startSWWWDaemon()
ToastService.showNotice("SWWW:\nEnabled!")
} else {
// SWWW not found
ToastService.showWarning("SWWW:\nNot installed!")
}
}
stdout: StdioCollector {}
stderr: StdioCollector {}
}
}

View file

@ -91,10 +91,10 @@ NLoader {
// Height scales to content plus vertical padding
height: content.implicitHeight + innerMargin * 2
// Place the panel relative to the bar based on its position
y: Settings.data.bar.barPosition === "top" ? Style.marginS * scaling : undefined
y: Settings.data.bar.position === "top" ? Style.marginS * scaling : undefined
anchors {
bottom: Settings.data.bar.barPosition === "bottom" ? parent.bottom : undefined
bottomMargin: Settings.data.bar.barPosition === "bottom" ? Style.barHeight * scaling + Style.marginS * scaling : undefined
bottom: Settings.data.bar.position === "bottom" ? parent.bottom : undefined
bottomMargin: Settings.data.bar.position === "bottom" ? Style.barHeight * scaling + Style.marginS * scaling : undefined
}
// Center horizontally under the anchorX, clamped to the screen bounds
x: Math.max(Style.marginS * scaling, Math.min(parent.width - width - Style.marginS * scaling,

View file

@ -0,0 +1,54 @@
import QtQuick
import QtQuick.Controls
import Quickshell
import Quickshell.Wayland
import qs.Commons
import qs.Services
import qs.Widgets
// ToastManager creates toast overlays on each screen
Variants {
model: Quickshell.screens
delegate: PanelWindow {
id: root
required property ShellScreen modelData
readonly property real scaling: ScalingService.scale(screen)
screen: modelData
// Position at top, centered horizontally
anchors {
top: true
left: true
right: true
}
// Small height when hidden, appropriate height when visible
implicitHeight: toast.visible ? toast.height + Style.barHeight * scaling + Style.marginS * scaling : 1
// Transparent background
color: Color.transparent
// High layer to appear above other panels
//WlrLayershell.layer: WlrLayer.Overlay
WlrLayershell.keyboardFocus: WlrKeyboardFocus.None
exclusionMode: PanelWindow.ExclusionMode.Ignore
NToast {
id: toast
scaling: root.scaling
// Position just below where the bar would be
targetY: Style.barHeight * scaling + Style.marginS * scaling
Component.onCompleted: {
// Register this toast with the service
ToastService.currentToast = toast
// Connect dismissal signal
toast.dismissed.connect(ToastService.onToastDismissed)
}
}
}
}

214
Services/ToastService.qml Normal file
View file

@ -0,0 +1,214 @@
pragma Singleton
import QtQuick
import Quickshell.Io
import qs.Commons
QtObject {
id: root
// Queue of pending toast messages
property var messageQueue: []
property bool isShowingToast: false
// Reference to the current toast instance (set by ToastManager)
property var currentToast: null
// Methods to show different types of messages
function showNotice(message, persistent = false, duration = 3000) {
showToast(message, "notice", persistent, duration)
}
function showWarning(message, persistent = false, duration = 4000) {
showToast(message, "warning", persistent, duration)
}
// Utility function to check if a command exists and show appropriate toast
function checkCommandAndToast(command, successMessage, failMessage, onSuccess = null) {
var checkProcess = Qt.createQmlObject(`
import QtQuick
import Quickshell.Io
Process {
id: checkProc
command: ["which", "${command}"]
running: true
property var onSuccessCallback: null
property bool hasFinished: false
onExited: {
if (!hasFinished) {
hasFinished = true
if (exitCode === 0) {
ToastService.showNotice("${successMessage}")
if (onSuccessCallback) onSuccessCallback()
} else {
ToastService.showWarning("${failMessage}")
}
checkProc.destroy()
}
}
// Fallback collectors to prevent issues
stdout: StdioCollector {}
stderr: StdioCollector {}
}
`, root)
checkProcess.onSuccessCallback = onSuccess
}
// Simple function to show a random toast (useful for testing or fun messages)
function showRandomToast() {
var messages = [
{ type: "notice", text: "Everything is working smoothly!" },
{ type: "notice", text: "Noctalia is looking great today!" },
{ type: "notice", text: "Your desktop setup is amazing!" },
{ type: "warning", text: "Don't forget to take a break!" },
{ type: "notice", text: "Configuration saved successfully!" },
{ type: "warning", text: "Remember to backup your settings!" }
]
var randomMessage = messages[Math.floor(Math.random() * messages.length)]
showToast(randomMessage.text, randomMessage.type)
}
// Convenience function for quick notifications
function quickNotice(message) {
showNotice(message, false, 2000) // Short duration
}
function quickWarning(message) {
showWarning(message, false, 3000) // Medium duration
}
// Generic command runner with toast feedback
function runCommandWithToast(command, args, successMessage, failMessage, onSuccess = null) {
var fullCommand = [command].concat(args || [])
var runProcess = Qt.createQmlObject(`
import QtQuick
import Quickshell.Io
Process {
id: runProc
command: ${JSON.stringify(fullCommand)}
running: true
property var onSuccessCallback: null
property bool hasFinished: false
onExited: {
if (!hasFinished) {
hasFinished = true
if (exitCode === 0) {
ToastService.showNotice("${successMessage}")
if (onSuccessCallback) onSuccessCallback()
} else {
ToastService.showWarning("${failMessage}")
}
runProc.destroy()
}
}
stdout: StdioCollector {}
stderr: StdioCollector {}
}
`, root)
runProcess.onSuccessCallback = onSuccess
}
// Check if a file/directory exists
function checkPathAndToast(path, successMessage, failMessage, onSuccess = null) {
runCommandWithToast("test", ["-e", path], successMessage, failMessage, onSuccess)
}
// Show toast after a delay (useful for delayed feedback)
function delayedToast(message, type = "notice", delayMs = 1000) {
var timer = Qt.createQmlObject(`
import QtQuick
Timer {
interval: ${delayMs}
repeat: false
running: true
onTriggered: {
ToastService.showToast("${message}", "${type}")
destroy()
}
}
`, root)
}
// Generic method to show a toast
function showToast(message, type = "notice", persistent = false, duration = 3000) {
var toastData = {
message: message,
type: type,
persistent: persistent,
duration: duration,
timestamp: Date.now()
}
// Add to queue
messageQueue.push(toastData)
// Process queue if not currently showing a toast
if (!isShowingToast) {
processQueue()
}
}
// Process the message queue
function processQueue() {
if (messageQueue.length === 0 || !currentToast) {
isShowingToast = false
return
}
if (isShowingToast) {
// Wait for current toast to finish
return
}
var toastData = messageQueue.shift()
isShowingToast = true
// Configure and show toast
currentToast.message = toastData.message
currentToast.type = toastData.type
currentToast.persistent = toastData.persistent
currentToast.duration = toastData.duration
currentToast.show()
}
// Called when a toast is dismissed
function onToastDismissed() {
isShowingToast = false
// Small delay before showing next toast
Qt.callLater(function() {
processQueue()
})
}
// Clear all pending messages
function clearQueue() {
messageQueue = []
}
// Hide current toast
function hideCurrentToast() {
if (currentToast && isShowingToast) {
currentToast.hide()
}
}
Component.onCompleted: {
}
}

View file

@ -51,9 +51,7 @@ Rectangle {
NTooltip {
id: tooltip
target: root
positionAbove: Settings.data.bar.barPosition === "bottom"
positionLeft: Settings.data.bar.barPosition === "right"
positionRight: Settings.data.bar.barPosition === "left"
positionAbove: Settings.data.bar.position === "bottom"
text: root.tooltipText
}

View file

@ -168,9 +168,7 @@ Item {
NTooltip {
id: tooltip
positionAbove: Settings.data.bar.barPosition === "bottom"
positionLeft: Settings.data.bar.barPosition === "right"
positionRight: Settings.data.bar.barPosition === "left"
positionAbove: Settings.data.bar.position === "bottom"
target: pill
delay: Style.tooltipDelayLong
text: root.tooltipText

172
Widgets/NToast.qml Normal file
View file

@ -0,0 +1,172 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtQuick.Effects
import qs.Commons
import qs.Widgets
Item {
id: root
property string message: ""
property string type: "notice" // "notice", "warning"
property int duration: 5000 // Auto-hide after 5 seconds, 0 = no auto-hide
property bool persistent: false // If true, requires manual dismiss
property real scaling: 1.0 // Will be set by parent
// Animation properties
property real targetY: 0
property real hiddenY: -height - 20
signal dismissed()
width: Math.min(500 * scaling, parent.width * 0.8)
height: Math.max(60 * scaling, contentLayout.implicitHeight + Style.marginL * 2 * scaling)
// Position at top center of parent
anchors.horizontalCenter: parent.horizontalCenter
y: hiddenY
z: 1000 // High z-index to appear above everything
function show() {
visible = true
showAnimation.start()
if (duration > 0 && !persistent) {
autoHideTimer.start()
}
}
function hide() {
hideAnimation.start()
}
// Auto-hide timer
Timer {
id: autoHideTimer
interval: root.duration
onTriggered: hide()
}
// Show animation
PropertyAnimation {
id: showAnimation
target: root
property: "y"
to: targetY
duration: Style.animationNormal
easing.type: Easing.OutCubic
}
// Hide animation
PropertyAnimation {
id: hideAnimation
target: root
property: "y"
to: hiddenY
duration: Style.animationNormal
easing.type: Easing.InCubic
onFinished: {
root.visible = false
root.dismissed()
}
}
// Main toast container
Rectangle {
id: container
anchors.fill: parent
radius: Style.radiusL * scaling
// Clean surface background
color: Color.mSurface
// Simple colored border all around
border.color: {
switch (root.type) {
case "warning": return Color.mError
case "notice": return Color.mPrimary
default: return Color.mOutline
}
}
border.width: Math.max(2, Style.borderM * scaling)
// Drop shadow effect
layer.enabled: true
layer.effect: MultiEffect {
shadowEnabled: true
shadowColor: Qt.rgba(0, 0, 0, 0.3)
shadowBlur: 20 * scaling
shadowVerticalOffset: 4 * scaling
}
RowLayout {
id: contentLayout
anchors.fill: parent
anchors.margins: Style.marginM * scaling
spacing: Style.marginS * scaling
// Icon
NIcon {
id: icon
text: {
switch (root.type) {
case "warning": return "warning"
case "notice": return "info"
default: return "info"
}
}
color: {
switch (root.type) {
case "warning": return Color.mError
case "notice": return Color.mPrimary
default: return Color.mPrimary
}
}
font.pointSize: Style.fontSizeXXL * 1.5 * scaling // 150% size to cover two lines
Layout.alignment: Qt.AlignVCenter
}
// Message text
NText {
id: messageText
text: root.message
color: Color.mOnSurface
font.pointSize: Style.fontSize * scaling
wrapMode: Text.WordWrap
Layout.fillWidth: true
Layout.alignment: Qt.AlignVCenter
}
// Close button (only if persistent or manual dismiss needed)
NIconButton {
id: closeButton
icon: "close"
visible: root.persistent || root.duration === 0
color: Color.mOnSurface
fontPointSize: Style.fontSize * scaling
sizeMultiplier: 0.8
Layout.alignment: Qt.AlignTop
onClicked: hide()
}
}
// Click to dismiss (if not persistent)
MouseArea {
anchors.fill: parent
enabled: !root.persistent
onClicked: hide()
cursorShape: Qt.PointingHandCursor
}
}
// Initial state
Component.onCompleted: {
visible = false
}
}

View file

@ -24,6 +24,7 @@ import qs.Modules.LockScreen
import qs.Modules.Notification
import qs.Modules.SettingsPanel
import qs.Modules.SidePanel
import qs.Modules.Toast
import qs.Services
import qs.Widgets
@ -68,6 +69,8 @@ ShellRoot {
id: lockScreen
}
ToastManager {}
IPCManager {}
Component.onCompleted: {