1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
|
import icons from "lib/icons"
import { uptime } from "lib/variables"
import options from "options"
import powermenu, { Action } from "service/powermenu"
const battery = await Service.import("battery")
const { image, size } = options.quicksettings.avatar
function up(up: number) {
const h = Math.floor(up / 60)
const m = Math.floor(up % 60)
return `${h}h ${m < 10 ? "0" + m : m}m`
}
const Avatar = () => Widget.Box({
class_name: "avatar",
css: Utils.merge([image.bind(), size.bind()], (img, size) => `
min-width: ${size}px;
min-height: ${size}px;
background-image: url('${img}');
background-size: cover;
`),
})
const SysButton = (action: Action) => Widget.Button({
vpack: "center",
child: Widget.Icon(icons.powermenu[action]),
on_clicked: () => powermenu.action(action),
})
export const Header = () => Widget.Box(
{ class_name: "header horizontal" },
Avatar(),
Widget.Box({
vertical: true,
vpack: "center",
children: [
Widget.Box({
visible: battery.bind("available"),
children: [
Widget.Icon({ icon: battery.bind("icon_name") }),
Widget.Label({ label: battery.bind("percent").as(p => `${p}%`) }),
],
}),
Widget.Box([
Widget.Icon({ icon: icons.ui.time }),
Widget.Label({ label: uptime.bind().as(up) }),
//Widget.Label({ label: `${user.name}\n` }),
// //Widget.Label({ label: uptime.bind().value }),
// Widget.Label({ label: `${user.name}\n ${uptime.bind().value}` }),
// //Widget.Icon({ icon: icons.ui.time }),
]),
],
}),
Widget.Box({ hexpand: true }),
Widget.Button({
vpack: "center",
child: Widget.Icon(icons.ui.settings),
on_clicked: () => {
App.closeWindow("quicksettings")
App.closeWindow("settings-dialog")
App.openWindow("settings-dialog")
},
}),
SysButton("logout"),
SysButton("shutdown"),
)
|
