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
|
import RegularWindow from "widget/RegularWindow"
import layout from "./layout"
import icons from "lib/icons"
import options from "options"
const current = Variable(layout[0].attribute.name)
const Header = () => Widget.CenterBox({
class_name: "header",
start_widget: Widget.Button({
class_name: "reset",
on_clicked: options.reset,
hpack: "start",
vpack: "start",
child: Widget.Icon(icons.ui.refresh),
tooltip_text: "Reset",
}),
center_widget: Widget.Box({
class_name: "pager horizontal",
children: layout.map(({ attribute: { name, icon } }) => Widget.Button({
xalign: 0,
class_name: current.bind().as(v => `${v === name ? "active" : ""}`),
on_clicked: () => current.value = name,
child: Widget.Box([
Widget.Icon(icon),
Widget.Label(name),
]),
})),
}),
end_widget: Widget.Button({
class_name: "close",
hpack: "end",
vpack: "start",
child: Widget.Icon(icons.ui.close),
on_clicked: () => App.closeWindow("settings-dialog"),
}),
})
const PagesStack = () => Widget.Stack({
transition: "slide_left_right",
children: layout.reduce((obj, page) => ({ ...obj, [page.attribute.name]: page }), {}),
shown: current.bind() as never,
})
export default () => RegularWindow({
name: "settings-dialog",
class_name: "settings-dialog",
title: "Settings",
setup(win) {
win.on("delete-event", () => {
win.hide()
return true
})
win.set_default_size(500, 600)
},
child: Widget.Box({
vertical: true,
children: [
Header(),
PagesStack(),
],
}),
})
|