Add hover show applications in workspace bar

This commit is contained in:
Amaro Lopes
2025-09-22 02:37:28 -03:00
parent 2445e21f0b
commit 65497edde2
8 changed files with 205 additions and 56 deletions

View File

@@ -14,7 +14,7 @@ Rectangle {
implicitWidth: audioText.implicitWidth * 1.6 implicitWidth: audioText.implicitWidth * 1.6
implicitHeight: Theme.heightGaps implicitHeight: Theme.heightGaps
color: "#44475A" color: Theme.backgroudColor
radius: 25 radius: 25
states: [ states: [
State { State {
@@ -66,7 +66,7 @@ Rectangle {
font.bold: true font.bold: true
font.pixelSize: 14 font.pixelSize: 14
font.family: root.fontFamily font.family: root.fontFamily
color: "white" color: Theme.textColor
} }
Process { Process {

View File

@@ -11,7 +11,7 @@ PanelWindow {
implicitHeight: Theme.barSize implicitHeight: Theme.barSize
color: Qt.rgba(0.68, 0.75, 0.88,0.2) color: Qt.rgba(0.68, 0.75, 0.88,0)
screen: Quickshell.screens.filter((screen) => { screen: Quickshell.screens.filter((screen) => {
return screen.name == panelMonitor; return screen.name == panelMonitor;
})[0] })[0]

View File

@@ -1,3 +1,4 @@
pragma ComponentBehavior: Bound
import QtQuick import QtQuick
import QtQuick.Layouts import QtQuick.Layouts
import Quickshell.Widgets import Quickshell.Widgets

View File

@@ -11,7 +11,7 @@ Item {
} }
Rectangle { Rectangle {
color: "#44475A" color: Theme.backgroudColor
implicitWidth: clockText.implicitWidth * 1.6 implicitWidth: clockText.implicitWidth * 1.6
implicitHeight: Theme.heightGaps //root.implicitHeight*0.8 implicitHeight: Theme.heightGaps //root.implicitHeight*0.8
radius: 25 radius: 25
@@ -24,7 +24,7 @@ Item {
font.bold: true font.bold: true
font.pixelSize: 14 font.pixelSize: 14
font.family: Theme.fontFamily font.family: Theme.fontFamily
color: "white" color: Theme.textColor
} }
} }

View File

@@ -1,19 +1,62 @@
pragma Singleton pragma Singleton
import Quickshell
import QtQuick import QtQuick
import Quickshell
import Quickshell.Io
Singleton { Singleton {
id: timeRoot id: timeRoot
readonly property int barSize: 35 readonly property int barSize: 35
readonly property double heightGaps: barSize * 0.8 readonly property double heightGaps: barSize * 0.8
readonly property string fontFamily: "IBM Plex Mono"
// Colors // Colors
FileView {
id: walColors
path: Qt.resolvedUrl("/home/amaro/.cache/wal/colors")
blockLoading: true
watchChanges: true
onFileChanged: this.reload()
}
readonly property var walColorsText: walColors.text().split('\n')
property double barOpacity: 0.2 property double barOpacity: 0.2
property color backgroudColor: Qt.rgba(0.27, 0.28, 0.35) property color backgroudColor: walColorsText[0]
property color foregroundColor: Qt.rgba(0.27, 0.28, 0.35) property color color2: walColorsText[1]
property color color3: walColorsText[2]
property color color4: walColorsText[3]
property color color5: walColorsText[4]
property color color6: walColorsText[5]
property color color7: walColorsText[6]
property color foregroundColor: walColorsText[7]
property color backgroudColorBright: walColorsText[8]
property color color2Bright: walColorsText[9]
property color color3Bright: walColorsText[10]
property color color4Bright: walColorsText[11]
property color color5Bright: walColorsText[12]
property color color6Bright: walColorsText[13]
property color color7Bright: walColorsText[14]
property color foregroundColorBright: walColorsText[15]
readonly property string textColor: foregroundColor
// background "#0e1721"
// color2 "#463e44"
// color3 "#7b4834"
// color4 "#735148"
// color5 "#896451"
// color6 "#9d7057"
// color7 "#595563"
// foreground "#91959b"
// "#5d6772"
// "#5E535B"
// "#A56046"
// "#9A6C60"
// "#B7866C"
// "#D29674"
// "#777285"
// "#c2c5c7"
} }

View File

@@ -0,0 +1,85 @@
pragma Singleton
import Quickshell
import Quickshell.Hyprland
Singleton {
readonly property string hyprlandSignature: Quickshell.env("HYPRLAND_INSTANCE_SIGNATURE")
property var sortedTopLevels: {
const topLevels = Array.from(Hyprland.toplevels.values)
const sortedHyprland = topLevels.sort((a, b) => {
if (a.monitor && b.monitor) {
const monitorCompare = a.monitor.name.localeCompare(b.monitor.name)
if (monitorCompare !== 0) {
return monitorCompare
}
}
if (a.workspace && b.workspace) {
const workspaceCompare = a.workspace.id - b.workspace.id
if (workspaceCompare !== 0) {
return workspaceCompare
}
}
if (a.lastIpcObject && b.lastIpcObject && a.lastIpcObject.at && b.lastIpcObject.at) {
const aX = a.lastIpcObject.at[0]
const bX = b.lastIpcObject.at[0]
const aY = a.lastIpcObject.at[1]
const bY = b.lastIpcObject.at[1]
const xCompare = aX - bX
if (Math.abs(xCompare) > 10) {
return xCompare
}
return aY - bY
}
if (a.lastIpcObject && !b.lastIpcObject) {
return -1
}
if (!a.lastIpcObject && b.lastIpcObject) {
return 1
}
if (a.title && b.title) {
return a.title.localeCompare(b.title)
}
return 0
})
return sortedHyprland
}
property var topLevelWorkspaces: {
return sortedTopLevels.map(topLevel => topLevel.workspace)
}
property var sortedDesktopApplications: {
const desktopEntries = sortedTopLevels.map( topLevel => {
return DesktopEntries.heuristicLookup(topLevel.wayland.appId)
})
const workspace = sortedTopLevels.map( topLevel => {
return topLevel.workspace.id
})
const workspaceDesktopEntries = new Map()
for (let i = 0; i < workspace.length; i++) {
const key = workspace[i];
const value = desktopEntries[i];
if (workspaceDesktopEntries.has(key)) {
workspaceDesktopEntries.get(key).push(value);
} else {
workspaceDesktopEntries.set(key, [value]);
}
}
return workspaceDesktopEntries
}
}

View File

@@ -6,8 +6,10 @@ import Quickshell.Hyprland
import Quickshell.Wayland import Quickshell.Wayland
import Quickshell.Widgets import Quickshell.Widgets
import qs.Common import qs.Common
import qs.Services
WrapperMouseArea { WrapperMouseArea {
id: workspacesRoot
property var monitor: "black" property var monitor: "black"
onWheel: (wheel) => { onWheel: (wheel) => {
@@ -31,70 +33,88 @@ WrapperMouseArea {
model: 5 model: 5
delegate: Rectangle { delegate: Rectangle {
id: workspacesRectangle
required property var modelData
property var index: modelData // Get the workspace data from the model property var index: modelData // Get the workspace data from the model
property var workspace: { property var workspace: {
monitor === "DP-2" ? Hyprland.workspaces.values[index + 5] : Hyprland.workspaces.values[index]; workspacesRoot.monitor === "DP-2" ? Hyprland.workspaces.values[index + 5] : Hyprland.workspaces.values[index];
} }
Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
implicitHeight: Theme.heightGaps implicitHeight: Theme.heightGaps
implicitWidth: workspace.id === Hyprland.focusedWorkspace.id ? root.implicitHeight * 1.5 : root.implicitHeight implicitWidth: workspace.id === Hyprland.focusedWorkspace.id ? Theme.barSize* 1.5 : Theme.barSize
radius: 25 radius: 25
color: workspace.id === Hyprland.focusedWorkspace.id ? "#4444FF" : "#44475A" color: {
if (workspace.id === Hyprland.focusedWorkspace.id) {
return Theme.color6
}
if (HyprlandService.topLevelWorkspaces.filter(topLevelworkspace => topLevelworkspace.id === workspace.id).length) {
return Theme.backgroudColorBright
}
return Theme.backgroudColor
}
// PopupWindow { PopupWindow {
// id: workspacesPopUp id: workspacesPopUp
// anchor.window: root anchor.item: workspacesRectangle
// anchor.rect.x: barArea.x anchor.rect.y: workspacesRectangle.implicitHeight+5
// anchor.rect.y: root.implicitHeight anchor.rect.x: -implicitWidth/2 + workspacesRectangle.implicitWidth/2
// implicitWidth: 500 implicitWidth: wsPopUpRow.implicitWidth*1.6
// implicitHeight: 500 implicitHeight: 35
// Item { color:"transparent"
// anchors.fill: parent
// ScreencopyView { Rectangle {
// anchors.fill : parent Component.onCompleted: console.log("Completed Running!")
// live:true anchors.fill: parent
//// captureSource: Quickshell.screens.filter(screen => screen.name == monitor)[0] color: Theme.backgroudColor
// captureSource: workspace.toplevels radius: 25
// } RowLayout {
// MouseArea { anchors{
// anchors.fill: parent horizontalCenter:parent.horizontalCenter
// hoverEnabled: true verticalCenter:parent.verticalCenter
// onExited: { }
// workspacesPopUp.visible = false id: wsPopUpRow
// } Repeater {
// } model: HyprlandService.sortedDesktopApplications.get(workspacesRectangle.workspace.id)
// } delegate: IconImage {
// } required property var modelData
// Timer { width:30; height:30
// id: workspacesTimer source: (modelData && modelData.icon) ? Quickshell.iconPath(modelData.icon, 1) : ""
// interval: 1000 }
// onTriggered: { workspacesPopUp.visible = true } }
// } }
}
}
Timer {
id: workspacesTimer
interval: 300
onTriggered: { workspacesPopUp.visible = true }
}
Text { Text {
anchors.centerIn: parent anchors.centerIn: parent
text: monitor === "DP-2" ? workspace.id - 5 : workspace.id text: workspacesRoot.monitor === "DP-2" ? workspacesRectangle.workspace.id - 5 : workspacesRectangle.workspace.id
font.bold: true font.bold: true
font.pixelSize: 14 font.pixelSize: 14
font.family: root.fontFamily font.family: Theme.fontFamily
color: "#F8F8F2" color: Theme.textColor
} }
MouseArea { MouseArea {
// hoverEnabled: true hoverEnabled: true
// onEntered: { onEntered: {
// console.log(JSON.stringify(workspace.toplevels.values[0].lastIpcObject)) if (HyprlandService.sortedDesktopApplications.get(workspacesRectangle.workspace.id)){
// workspacesTimer.start() workspacesTimer.start()
// } }
// onExited: { }
// workspacesTimer.stop() onExited: {
// workspacesPopUp.visible = false workspacesTimer.stop()
// } workspacesPopUp.visible = false
}
anchors.fill: parent anchors.fill: parent
onClicked: { onClicked: {
if(workspace.id === Hyprland.focusedWorkspace.id) {return} ; if(workspacesRectangle.workspace.id === Hyprland.focusedWorkspace.id) {return} ;
Hyprland.dispatch("workspace " + workspace.id); Hyprland.dispatch("workspace " + workspacesRectangle.workspace.id);
} }
} }

View File

@@ -15,4 +15,4 @@ ShellRoot {
barComponentsRight: ["AudioWidget.qml", "ClockWidget.qml"] barComponentsRight: ["AudioWidget.qml", "ClockWidget.qml"]
} }
} }