feat(ags): add clock to lockscreen
All checks were successful
Discord / discord commits (push) Has been skipped

This commit is contained in:
matt1432 2024-04-19 18:00:50 -04:00
parent 94ce797784
commit bab5698f39
2 changed files with 30 additions and 6 deletions

View file

@ -3,3 +3,8 @@
window { window {
background-color: transparent; background-color: transparent;
} }
.clock {
font-size: 80pt;
font-family: "Ubuntu Mono";
}

View file

@ -1,9 +1,11 @@
const { Box, Entry, Label, Separator, Window } = Widget; const { Box, Entry, Label, Window } = Widget;
import Gdk from 'gi://Gdk?version=3.0'; import Gdk from 'gi://Gdk?version=3.0';
import Gtk from 'gi://Gtk?version=3.0'; import Gtk from 'gi://Gtk?version=3.0';
import Lock from 'gi://GtkSessionLock?version=0.1'; import Lock from 'gi://GtkSessionLock?version=0.1';
import Separator from '../misc/separator.ts';
/* Types */ /* Types */
import { Box as AgsBox } from 'types/widgets/box'; import { Box as AgsBox } from 'types/widgets/box';
@ -13,8 +15,10 @@ const windows: Gtk.Window[] = [];
const blurBGs: AgsBox<Gtk.Widget, { geometry: { w: number, h: number }; }>[] = []; const blurBGs: AgsBox<Gtk.Widget, { geometry: { w: number, h: number }; }>[] = [];
const transition_duration = 1000; const transition_duration = 1000;
const windowMargins = -2; const WINDOW_MARGINS = -2;
const bgCSS = ({ w = 1, h = 1 } = {}) =>` const ENTRY_SPACING = 20;
const CLOCK_SPACING = 60;
const bgCSS = ({ w = 1, h = 1 } = {}) => `
border: 2px solid rgba(189, 147, 249, 0.8); border: 2px solid rgba(189, 147, 249, 0.8);
background: rgba(0, 0, 0, 0.2); background: rgba(0, 0, 0, 0.2);
min-height: ${h}px; min-height: ${h}px;
@ -44,6 +48,17 @@ const unlock = () => {
}); });
}; };
const Clock = () => Label({ class_name: 'clock' })
.poll(1000, (self) => {
self.label = (new Date().toLocaleString([], {
hour: 'numeric',
minute: 'numeric',
hour12: true,
}) ?? '')
.replace('a.m.', 'AM')
.replace('p.m.', 'PM');
});
const PasswordPrompt = (monitor: Gdk.Monitor) => { const PasswordPrompt = (monitor: Gdk.Monitor) => {
const rev = Box({ const rev = Box({
css: bgCSS(), css: bgCSS(),
@ -78,7 +93,7 @@ const PasswordPrompt = (monitor: Gdk.Monitor) => {
gdkmonitor: monitor, gdkmonitor: monitor,
layer: 'overlay', layer: 'overlay',
anchor: ['top', 'bottom', 'right', 'left'], anchor: ['top', 'bottom', 'right', 'left'],
margins: [windowMargins], margins: [WINDOW_MARGINS],
exclusivity: 'ignore', exclusivity: 'ignore',
child: Box({ child: Box({
@ -93,13 +108,17 @@ const PasswordPrompt = (monitor: Gdk.Monitor) => {
const label = Label('Enter password:'); const label = Label('Enter password:');
return new Gtk.Window({ return new Gtk.Window({
child: Widget.Box({ child: Box({
vertical: true, vertical: true,
vpack: 'center', vpack: 'center',
hpack: 'center', hpack: 'center',
spacing: 16, spacing: 16,
children: [ children: [
Clock(),
Separator(CLOCK_SPACING, { vertical: true }),
Box({ Box({
hpack: 'center', hpack: 'center',
class_name: 'avatar', class_name: 'avatar',
@ -111,7 +130,7 @@ const PasswordPrompt = (monitor: Gdk.Monitor) => {
children: [ children: [
label, label,
Separator(), Separator(ENTRY_SPACING, { vertical: true }),
Entry({ Entry({
hpack: 'center', hpack: 'center',