146 lines
3.7 KiB
QML
146 lines
3.7 KiB
QML
import QtQuick
|
|
import Quickshell
|
|
import Quickshell.Wayland
|
|
import "." as M
|
|
|
|
// OSD overlay — slides out from the bar, centered on screen.
|
|
PanelWindow {
|
|
id: root
|
|
|
|
required property var screen
|
|
|
|
visible: _winVisible
|
|
color: "transparent"
|
|
|
|
property bool _winVisible: false
|
|
property bool _shown: M.OsdState.visible && M.OsdState.screen === root.screen
|
|
|
|
on_ShownChanged: {
|
|
if (_shown) {
|
|
_winVisible = true;
|
|
hideAnim.stop();
|
|
showAnim.start();
|
|
} else {
|
|
showAnim.stop();
|
|
hideAnim.start();
|
|
}
|
|
}
|
|
|
|
WlrLayershell.layer: WlrLayer.Overlay
|
|
WlrLayershell.exclusiveZone: 0
|
|
WlrLayershell.namespace: "nova-osd"
|
|
mask: Region {}
|
|
|
|
anchors.top: true
|
|
anchors.left: true
|
|
|
|
margins.top: 0
|
|
margins.left: Math.max(0, Math.min(Math.round(M.OsdState.itemX - implicitWidth / 2), screen.width - implicitWidth))
|
|
|
|
implicitWidth: 200
|
|
implicitHeight: 48
|
|
|
|
ParallelAnimation {
|
|
id: showAnim
|
|
NumberAnimation {
|
|
target: content
|
|
property: "opacity"
|
|
to: 1
|
|
duration: 150
|
|
easing.type: Easing.OutCubic
|
|
}
|
|
NumberAnimation {
|
|
target: content
|
|
property: "y"
|
|
to: 0
|
|
duration: 200
|
|
easing.type: Easing.OutCubic
|
|
}
|
|
}
|
|
|
|
ParallelAnimation {
|
|
id: hideAnim
|
|
NumberAnimation {
|
|
target: content
|
|
property: "opacity"
|
|
to: 0
|
|
duration: 250
|
|
easing.type: Easing.InCubic
|
|
}
|
|
NumberAnimation {
|
|
target: content
|
|
property: "y"
|
|
to: -content.height
|
|
duration: 250
|
|
easing.type: Easing.InCubic
|
|
}
|
|
onFinished: root._winVisible = false
|
|
}
|
|
|
|
Item {
|
|
id: content
|
|
anchors.left: parent.left
|
|
anchors.right: parent.right
|
|
height: root.implicitHeight
|
|
opacity: 0
|
|
y: -height
|
|
|
|
Rectangle {
|
|
anchors.fill: parent
|
|
color: M.Theme.base00
|
|
opacity: Math.max(M.Theme.barOpacity, 0.85)
|
|
topLeftRadius: 0
|
|
topRightRadius: 0
|
|
bottomLeftRadius: M.Theme.radius
|
|
bottomRightRadius: M.Theme.radius
|
|
}
|
|
|
|
Row {
|
|
anchors.centerIn: parent
|
|
spacing: 10
|
|
|
|
Text {
|
|
text: M.OsdState.icon
|
|
color: M.Theme.base0D
|
|
font.pixelSize: M.Theme.fontSize + 6
|
|
font.family: M.Theme.iconFontFamily
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
}
|
|
|
|
Item {
|
|
width: 120
|
|
height: 6
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
|
|
Rectangle {
|
|
anchors.fill: parent
|
|
color: M.Theme.base02
|
|
radius: 3
|
|
}
|
|
|
|
Rectangle {
|
|
width: parent.width * Math.min(1, Math.max(0, M.OsdState.value))
|
|
height: parent.height
|
|
color: M.Theme.base0D
|
|
radius: 3
|
|
|
|
Behavior on width {
|
|
NumberAnimation {
|
|
duration: 120
|
|
easing.type: Easing.OutCubic
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
Text {
|
|
text: Math.round(M.OsdState.value * 100) + "%"
|
|
color: M.Theme.base05
|
|
font.pixelSize: M.Theme.fontSize
|
|
font.family: M.Theme.fontFamily
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
width: 32
|
|
}
|
|
}
|
|
}
|
|
}
|