151 lines
5 KiB
QML
151 lines
5 KiB
QML
import QtQuick
|
|
import QtQuick.Layouts
|
|
import Quickshell
|
|
import qs.Commons
|
|
import qs.Services
|
|
import qs.Widgets
|
|
|
|
Rectangle {
|
|
id: root
|
|
|
|
property ShellScreen screen
|
|
property real scaling: 1.0
|
|
|
|
// Widget properties passed from Bar.qml for per-instance settings
|
|
property string widgetId: ""
|
|
property string section: ""
|
|
property int sectionWidgetIndex: -1
|
|
property int sectionWidgetsCount: 0
|
|
|
|
property var widgetMetadata: BarWidgetRegistry.widgetMetadata[widgetId]
|
|
property var widgetSettings: {
|
|
if (section && sectionWidgetIndex >= 0) {
|
|
var widgets = Settings.data.bar.widgets[section]
|
|
if (widgets && sectionWidgetIndex < widgets.length) {
|
|
return widgets[sectionWidgetIndex]
|
|
}
|
|
}
|
|
return {}
|
|
}
|
|
|
|
// Resolve settings: try user settings or defaults from BarWidgetRegistry
|
|
readonly property bool use12h: widgetSettings.use12HourClock !== undefined ? widgetSettings.use12HourClock : widgetMetadata.use12HourClock
|
|
readonly property bool reverseDayMonth: widgetSettings.reverseDayMonth !== undefined ? widgetSettings.reverseDayMonth : widgetMetadata.reverseDayMonth
|
|
readonly property string displayFormat: widgetSettings.displayFormat !== undefined ? widgetSettings.displayFormat : widgetMetadata.displayFormat
|
|
|
|
implicitWidth: Math.round(layout.implicitWidth + Style.marginM * 2 * scaling)
|
|
implicitHeight: Math.round(Style.capsuleHeight * scaling)
|
|
radius: Math.round(Style.radiusS * scaling)
|
|
color: Color.mSurfaceVariant
|
|
|
|
Item {
|
|
id: clockContainer
|
|
anchors.fill: parent
|
|
anchors.margins: Style.marginXS * scaling
|
|
|
|
ColumnLayout {
|
|
id: layout
|
|
anchors.centerIn: parent
|
|
spacing: -3 * scaling
|
|
|
|
// First line
|
|
NText {
|
|
readonly property bool showSeconds: (displayFormat === "time-seconds")
|
|
readonly property bool inlineDate: (displayFormat === "time-date")
|
|
|
|
text: {
|
|
const now = Time.date
|
|
let timeStr = ""
|
|
|
|
if (use12h) {
|
|
// 12-hour format with proper padding and consistent spacing
|
|
const hours = now.getHours()
|
|
const displayHours = hours === 0 ? 12 : (hours > 12 ? hours - 12 : hours)
|
|
const paddedHours = displayHours.toString().padStart(2, '0')
|
|
const minutes = now.getMinutes().toString().padStart(2, '0')
|
|
const ampm = hours < 12 ? 'AM' : 'PM'
|
|
|
|
if (showSeconds) {
|
|
const seconds = now.getSeconds().toString().padStart(2, '0')
|
|
timeStr = `${paddedHours}:${minutes}:${seconds} ${ampm}`
|
|
} else {
|
|
timeStr = `${paddedHours}:${minutes} ${ampm}`
|
|
}
|
|
} else {
|
|
// 24-hour format with padding
|
|
const hours = now.getHours().toString().padStart(2, '0')
|
|
const minutes = now.getMinutes().toString().padStart(2, '0')
|
|
|
|
if (showSeconds) {
|
|
const seconds = now.getSeconds().toString().padStart(2, '0')
|
|
timeStr = `${hours}:${minutes}:${seconds}`
|
|
} else {
|
|
timeStr = `${hours}:${minutes}`
|
|
}
|
|
}
|
|
|
|
// Add inline date if needed
|
|
if (inlineDate) {
|
|
let dayName = now.toLocaleDateString(Qt.locale(), "ddd")
|
|
dayName = dayName.charAt(0).toUpperCase() + dayName.slice(1)
|
|
const day = now.getDate().toString().padStart(2, '0')
|
|
let month = now.toLocaleDateString(Qt.locale(), "MMM")
|
|
timeStr += " - " + (reverseDayMonth ? `${dayName}, ${month} ${day}` : `${dayName}, ${day} ${month}`)
|
|
}
|
|
|
|
return timeStr
|
|
}
|
|
|
|
//font.family: Settings.data.ui.fontFixed
|
|
font.pointSize: Style.fontSizeXS * scaling
|
|
font.weight: Style.fontWeightBold
|
|
color: Color.mPrimary
|
|
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
|
|
}
|
|
|
|
// Second line
|
|
NText {
|
|
visible: (displayFormat === "time-date-short")
|
|
text: {
|
|
const now = Time.date
|
|
const day = now.getDate().toString().padStart(2, '0')
|
|
const month = (now.getMonth() + 1).toString().padStart(2, '0')
|
|
return reverseDayMonth ? `${month}/${day}` : `${day}/${month}`
|
|
}
|
|
|
|
// Enable fixed-width font for consistent spacing
|
|
//font.family: Settings.data.ui.fontFixed
|
|
font.pointSize: Style.fontSizeXXS * scaling
|
|
font.weight: Style.fontWeightRegular
|
|
color: Color.mPrimary
|
|
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
|
|
}
|
|
}
|
|
}
|
|
|
|
NTooltip {
|
|
id: tooltip
|
|
text: `${Time.formatDate(reverseDayMonth)}.`
|
|
target: clockContainer
|
|
positionAbove: Settings.data.bar.position === "bottom"
|
|
}
|
|
|
|
MouseArea {
|
|
id: clockMouseArea
|
|
anchors.fill: parent
|
|
cursorShape: Qt.PointingHandCursor
|
|
hoverEnabled: true
|
|
onEntered: {
|
|
if (!PanelService.getPanel("calendarPanel")?.active) {
|
|
tooltip.show()
|
|
}
|
|
}
|
|
onExited: {
|
|
tooltip.hide()
|
|
}
|
|
onClicked: {
|
|
tooltip.hide()
|
|
PanelService.getPanel("calendarPanel")?.toggle(this)
|
|
}
|
|
}
|
|
}
|