28allday
b1e2bb3bc6
Convert the bar from a vertical left-edge strip to a horizontal top bar. The shell had no orientation abstraction, so this flips the geometry across the bar and the drawer/region/interaction layer: - Bar.qml: ColumnLayout -> RowLayout; hit-testing (checkPopout/handleWheel), scroll halves and popout-center anchoring all keyed off x instead of y; first/last padding -> left/right margins. - BarWrapper.qml: the bar's "thickness" is now its height (clampedHeight/ contentHeight/implicitHeight); content anchors left/right/top. - drawers: Exclusions (exclusive zone moved left->top), Panels (content inset topMargin = bar height), Regions + ContentWindow (panel->window coordinate mapping and the thick border flip left->top), Interactions (bar-region check y<barHeight, panel Y-origin uses bar height, scroll passes x, bar drag-reveal is vertical). - widgets: Clock (Row, HH:MM with a colon), StatusIcons (Row), Workspaces + Workspace (Row), Tray (Row, expand chevron at the right) — each sizes to the bar height instead of width. Verified live in the dev VM: top bar renders with centered-clock entries, the exclusion zone keeps windows below the bar, and the dashboard drops down correctly. Popout fly-outs still anchor sideways (Phase B). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
117 lines
3.9 KiB
QML
117 lines
3.9 KiB
QML
pragma ComponentBehavior: Bound
|
|
|
|
import QtQuick
|
|
import QtQuick.Layouts
|
|
import Quickshell
|
|
import Caelestia.Config
|
|
import qs.components
|
|
import qs.services
|
|
import qs.utils
|
|
|
|
ColumnLayout {
|
|
id: root
|
|
|
|
required property int index
|
|
required property int activeWsId
|
|
required property var occupied
|
|
required property int groupOffset
|
|
|
|
readonly property bool isWorkspace: true // Flag for finding workspace children
|
|
// Unanimated prop for others to use as reference
|
|
readonly property int size: implicitHeight + (hasWindows ? Tokens.padding.extraSmall : 0)
|
|
|
|
readonly property int ws: groupOffset + index + 1
|
|
readonly property bool isOccupied: occupied[ws] ?? false
|
|
readonly property bool hasWindows: isOccupied && Config.bar.workspaces.showWindows
|
|
|
|
Layout.alignment: Qt.AlignVCenter
|
|
Layout.preferredHeight: size
|
|
|
|
spacing: 0
|
|
|
|
StyledText {
|
|
id: indicator
|
|
|
|
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
|
|
Layout.preferredHeight: Tokens.sizes.bar.innerWidth - Tokens.padding.small
|
|
|
|
animate: true
|
|
text: {
|
|
const ws = Hypr.workspaces.values.find(w => w.id === root.ws);
|
|
const wsName = !ws || ws.name == root.ws ? root.ws : ws.name[0];
|
|
let displayName = wsName.toString();
|
|
if (Config.bar.workspaces.capitalisation.toLowerCase() === "upper") {
|
|
displayName = displayName.toUpperCase();
|
|
} else if (Config.bar.workspaces.capitalisation.toLowerCase() === "lower") {
|
|
displayName = displayName.toLowerCase();
|
|
}
|
|
const label = Config.bar.workspaces.label || displayName;
|
|
const occupiedLabel = Config.bar.workspaces.occupiedLabel || label;
|
|
const activeLabel = Config.bar.workspaces.activeLabel || (root.isOccupied ? occupiedLabel : label);
|
|
return root.activeWsId === root.ws ? activeLabel : root.isOccupied ? occupiedLabel : label;
|
|
}
|
|
color: Config.bar.workspaces.occupiedBg || root.isOccupied || root.activeWsId === root.ws ? Colours.palette.m3onSurface : Colours.layer(Colours.palette.m3outlineVariant, 2)
|
|
verticalAlignment: Qt.AlignVCenter
|
|
font.family: "Rubik" // Hard code rubik for now since google sans doesn't play well with certain unicode symbols apparently
|
|
}
|
|
|
|
Loader {
|
|
id: windows
|
|
|
|
asynchronous: true
|
|
|
|
Layout.alignment: Qt.AlignHCenter
|
|
Layout.fillHeight: true
|
|
Layout.topMargin: -Tokens.sizes.bar.innerWidth / 10
|
|
|
|
visible: active
|
|
active: root.hasWindows
|
|
|
|
sourceComponent: Column {
|
|
spacing: 0
|
|
|
|
add: Transition {
|
|
Anim {
|
|
properties: "scale"
|
|
from: 0
|
|
to: 1
|
|
easing: Tokens.anim.standardDecel
|
|
}
|
|
}
|
|
|
|
move: Transition {
|
|
Anim {
|
|
properties: "scale"
|
|
to: 1
|
|
easing: Tokens.anim.standardDecel
|
|
}
|
|
Anim {
|
|
properties: "x,y"
|
|
}
|
|
}
|
|
|
|
Repeater {
|
|
model: ScriptModel {
|
|
values: {
|
|
const ws = root.ws;
|
|
const windows = Hypr.toplevels.values.filter(c => c.workspace?.id === ws);
|
|
const maxIcons = root.Config.bar.workspaces.maxWindowIcons;
|
|
return maxIcons > 0 ? windows.slice(0, maxIcons) : windows;
|
|
}
|
|
}
|
|
|
|
MaterialIcon {
|
|
required property var modelData
|
|
|
|
grade: 0
|
|
text: Icons.getAppCategoryIcon(modelData.lastIpcObject.class, "terminal")
|
|
color: Colours.palette.m3onSurfaceVariant
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
Behavior on Layout.preferredHeight {
|
|
Anim {}
|
|
}
|
|
}
|