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

WIP - modular bar (need to fix brightness & tray)

Browse source
This commit is contained in:
Ly-sec 2025-08-22 16:37:45 +02:00
parent 8f951946ea
commit 8e562e0701
31 changed files with 785 additions and 136 deletions
Download patch file Download diff file Expand all files Collapse all files

261
Modules/Bar/Workspace.qml
View file

@ -1,261 +0,0 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtQuick.Window
import QtQuick.Effects
import Quickshell
import Quickshell.Io
import qs.Commons
import qs.Services
Item {
id: root
property bool isDestroying: false
property bool hovered: false
property ListModel localWorkspaces: ListModel {}
property real masterProgress: 0.0
property bool effectsActive: false
property color effectColor: Color.mPrimary
property int horizontalPadding: Math.round(16 * scaling)
property int spacingBetweenPills: Math.round(8 * scaling)
signal workspaceChanged(int workspaceId, color accentColor)
width: {
let total = 0
for (var i = 0; i < localWorkspaces.count; i++) {
const ws = localWorkspaces.get(i)
if (ws.isFocused)
total += Math.round(44 * scaling)
else if (ws.isActive)
total += Math.round(28 * scaling)
else
total += Math.round(16 * scaling)
}
total += Math.max(localWorkspaces.count - 1, 0) * spacingBetweenPills
total += horizontalPadding * 2
return total
}
height: Math.round(36 * scaling)
Component.onCompleted: {
localWorkspaces.clear()
for (var i = 0; i < WorkspaceService.workspaces.count; i++) {
const ws = WorkspaceService.workspaces.get(i)
if (ws.output.toLowerCase() === screen.name.toLowerCase()) {
localWorkspaces.append(ws)
}
}
workspaceRepeater.model = localWorkspaces
updateWorkspaceFocus()
}
Connections {
target: WorkspaceService
function onWorkspacesChanged() {
localWorkspaces.clear()
for (var i = 0; i < WorkspaceService.workspaces.count; i++) {
const ws = WorkspaceService.workspaces.get(i)
if (ws.output.toLowerCase() === screen.name.toLowerCase()) {
localWorkspaces.append(ws)
}
}
workspaceRepeater.model = localWorkspaces
updateWorkspaceFocus()
}
}
function triggerUnifiedWave() {
effectColor = Color.mPrimary
masterAnimation.restart()
}
SequentialAnimation {
id: masterAnimation
PropertyAction {
target: root
property: "effectsActive"
value: true
}
NumberAnimation {
target: root
property: "masterProgress"
from: 0.0
to: 1.0
duration: 1000
easing.type: Easing.OutQuint
}
PropertyAction {
target: root
property: "effectsActive"
value: false
}
PropertyAction {
target: root
property: "masterProgress"
value: 0.0
}
}
function updateWorkspaceFocus() {
for (var i = 0; i < localWorkspaces.count; i++) {
const ws = localWorkspaces.get(i)
if (ws.isFocused === true) {
root.triggerUnifiedWave()
root.workspaceChanged(ws.id, Color.mPrimary)
break
}
}
}
Rectangle {
id: workspaceBackground
width: parent.width - Style.marginS * scaling * 2
height: Math.round(Style.capsuleHeight * scaling)
radius: Math.round(Style.radiusM * scaling)
color: Color.mSurfaceVariant
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
layer.enabled: true
layer.effect: MultiEffect {
shadowColor: Color.mShadow
shadowVerticalOffset: 0
shadowHorizontalOffset: 0
shadowOpacity: 0.10
}
}
Row {
id: pillRow
spacing: spacingBetweenPills
anchors.verticalCenter: workspaceBackground.verticalCenter
width: root.width - horizontalPadding * 2
x: horizontalPadding
Repeater {
id: workspaceRepeater
model: localWorkspaces
Item {
id: workspacePillContainer
height: Math.round(12 * scaling)
width: {
if (model.isFocused)
return Math.round(44 * scaling)
else if (model.isActive)
return Math.round(28 * scaling)
else
return Math.round(16 * scaling)
}
Rectangle {
id: workspacePill
anchors.fill: parent
radius: {
if (model.isFocused)
return Math.round(12 * scaling)
else
// half of focused height (if you want to animate this too)
return Math.round(6 * scaling)
}
color: {
if (model.isFocused)
return Color.mPrimary
if (model.isUrgent)
return Color.mError
if (model.isActive || model.isOccupied)
return Color.mSecondary
if (model.isUrgent)
return Color.mError
return Color.mOutline
}
scale: model.isFocused ? 1.0 : 0.9
z: 0
MouseArea {
id: pillMouseArea
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onClicked: {
WorkspaceService.switchToWorkspace(model.idx)
}
hoverEnabled: true
}
// Material 3-inspired smooth animation for width, height, scale, color, opacity, and radius
Behavior on width {
NumberAnimation {
duration: Style.animationNormal
easing.type: Easing.OutBack
}
}
Behavior on height {
NumberAnimation {
duration: Style.animationNormal
easing.type: Easing.OutBack
}
}
Behavior on scale {
NumberAnimation {
duration: Style.animationNormal
easing.type: Easing.OutBack
}
}
Behavior on color {
ColorAnimation {
duration: Style.animationFast
easing.type: Easing.InOutCubic
}
}
Behavior on opacity {
NumberAnimation {
duration: Style.animationFast
easing.type: Easing.InOutCubic
}
}
Behavior on radius {
NumberAnimation {
duration: Style.animationNormal
easing.type: Easing.OutBack
}
}
}
Behavior on width {
NumberAnimation {
duration: Style.animationNormal
easing.type: Easing.OutBack
}
}
Behavior on height {
NumberAnimation {
duration: Style.animationNormal
easing.type: Easing.OutBack
}
}
// Burst effect overlay for focused pill (smaller outline)
Rectangle {
id: pillBurst
anchors.centerIn: workspacePillContainer
width: workspacePillContainer.width + 18 * root.masterProgress * scale
height: workspacePillContainer.height + 18 * root.masterProgress * scale
radius: width / 2
color: Color.transparent
border.color: root.effectColor
border.width: Math.max(1, Math.round((2 + 6 * (1.0 - root.masterProgress)) * scaling))
opacity: root.effectsActive && model.isFocused ? (1.0 - root.masterProgress) * 0.7 : 0
visible: root.effectsActive && model.isFocused
z: 1
}
}
}
}
Component.onDestruction: {
root.isDestroying = true
}
}