widgets.js 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293
  1. /** @license (c) aylur. GPL v3 */
  2. import Adw from "gi://Adw";
  3. import Gio from "gi://Gio";
  4. import Gdk from "gi://Gdk";
  5. import Gtk from "gi://Gtk";
  6. import GObject from "gi://GObject";
  7. // GNOME imports
  8. import { gettext as _ } from "resource:///org/gnome/Shell/Extensions/js/extensions/prefs.js";
  9. // Shared state
  10. import { Logger } from "../shared/logger.js";
  11. export class PreferencesPage extends Adw.PreferencesPage {
  12. static {
  13. GObject.registerClass(this);
  14. }
  15. add_group({ title, description = "", children, header_suffix = "" }) {
  16. const group = new Adw.PreferencesGroup({ title, description });
  17. for (const child of children) group.add(child);
  18. if (header_suffix) group.set_header_suffix(header_suffix);
  19. this.add(group);
  20. }
  21. }
  22. export class SwitchRow extends Adw.ActionRow {
  23. static {
  24. GObject.registerClass(this);
  25. }
  26. constructor({ title, settings, bind, subtitle = "", experimental = false }) {
  27. super({ title, subtitle });
  28. const gswitch = new Gtk.Switch({
  29. active: settings.get_boolean(bind),
  30. valign: Gtk.Align.CENTER,
  31. });
  32. settings.bind(bind, gswitch, "active", Gio.SettingsBindFlags.DEFAULT);
  33. if (experimental) {
  34. const icon = new Gtk.Image({ icon_name: "bug-symbolic" });
  35. icon.set_tooltip_markup(
  36. _("<b>CAUTION</b>: Enabling this setting can lead to bugs or cause the shell to crash")
  37. );
  38. this.add_suffix(icon);
  39. }
  40. this.add_suffix(gswitch);
  41. this.activatable_widget = gswitch;
  42. }
  43. }
  44. export class ColorRow extends Adw.ActionRow {
  45. static {
  46. GObject.registerClass(this);
  47. }
  48. constructor({ title, init, onChange, subtitle = "" }) {
  49. super({ title, subtitle });
  50. let rgba = new Gdk.RGBA();
  51. rgba.parse(init);
  52. this.colorButton = new Gtk.ColorButton({ rgba, use_alpha: true, valign: Gtk.Align.CENTER });
  53. this.colorButton.connect("color-set", () => {
  54. onChange(this.colorButton.get_rgba().to_string());
  55. });
  56. this.add_suffix(this.colorButton);
  57. this.activatable_widget = this.colorButton;
  58. }
  59. }
  60. export class SpinButtonRow extends Adw.ActionRow {
  61. static {
  62. GObject.registerClass(this);
  63. }
  64. constructor({
  65. title,
  66. range: [low, high, step],
  67. subtitle = "",
  68. init = undefined,
  69. onChange = undefined,
  70. max_width_chars = undefined,
  71. max_length = undefined,
  72. width_chars = undefined,
  73. xalign = undefined,
  74. settings = undefined,
  75. bind = undefined,
  76. }) {
  77. super({ title, subtitle });
  78. const gspin = Gtk.SpinButton.new_with_range(low, high, step);
  79. gspin.valign = Gtk.Align.CENTER;
  80. if (bind && settings) {
  81. settings.bind(bind, gspin, "value", Gio.SettingsBindFlags.DEFAULT);
  82. } else if (init) {
  83. gspin.value = init;
  84. gspin.connect("value-changed", (widget) => {
  85. onChange?.(widget.value);
  86. });
  87. }
  88. this.add_suffix(gspin);
  89. this.activatable_widget = gspin;
  90. }
  91. }
  92. export class DropDownRow extends Adw.ActionRow {
  93. static {
  94. GObject.registerClass(this);
  95. }
  96. /**
  97. * @type {string}
  98. * Name of the gsetting key to bind to
  99. */
  100. bind;
  101. /**
  102. * @type {'b'|'y'|'n'|'q'|'i'|'u'|'x'|'t'|'h'|'d'|'s'|'o'|'g'|'?'|'a'|'m'}
  103. * - b: the type string of G_VARIANT_TYPE_BOOLEAN; a boolean value.
  104. * - y: the type string of G_VARIANT_TYPE_BYTE; a byte.
  105. * - n: the type string of G_VARIANT_TYPE_INT16; a signed 16 bit integer.
  106. * - q: the type string of G_VARIANT_TYPE_UINT16; an unsigned 16 bit integer.
  107. * - i: the type string of G_VARIANT_TYPE_INT32; a signed 32 bit integer.
  108. * - u: the type string of G_VARIANT_TYPE_UINT32; an unsigned 32 bit integer.
  109. * - x: the type string of G_VARIANT_TYPE_INT64; a signed 64 bit integer.
  110. * - t: the type string of G_VARIANT_TYPE_UINT64; an unsigned 64 bit integer.
  111. * - h: the type string of G_VARIANT_TYPE_HANDLE; a signed 32 bit value that, by convention, is used as an index into an array of file descriptors that are sent alongside a D-Bus message.
  112. * - d: the type string of G_VARIANT_TYPE_DOUBLE; a double precision floating point value.
  113. * - s: the type string of G_VARIANT_TYPE_STRING; a string.
  114. * - o: the type string of G_VARIANT_TYPE_OBJECT_PATH; a string in the form of a D-Bus object path.
  115. * - g: the type string of G_VARIANT_TYPE_SIGNATURE; a string in the form of a D-Bus type signature.
  116. * - ?: the type string of G_VARIANT_TYPE_BASIC; an indefinite type that is a supertype of any of the basic types.
  117. * - v: the type string of G_VARIANT_TYPE_VARIANT; a container type that contain any other type of value.
  118. * - a: used as a prefix on another type string to mean an array of that type; the type string “ai”, for example, is the type of an array of signed 32-bit integers.
  119. * - m: used as a prefix on another type string to mean a “maybe”, or “nullable”, version of that type; the type string “ms”, for example, is the type of a value that maybe contains a string, or maybe contains nothing.
  120. */
  121. type;
  122. selected = 0;
  123. /** @type {{name: string; id: string}[]} */
  124. items;
  125. model = new Gtk.StringList();
  126. /** @type {Gtk.DropDown} */
  127. dropdown;
  128. constructor({ title, settings, bind, items, subtitle = "", type }) {
  129. super({ title, subtitle });
  130. this.settings = settings;
  131. this.items = items;
  132. this.bind = bind;
  133. this.type = type ?? this.settings.get_value(bind)?.get_type() ?? "?";
  134. this.#build();
  135. this.add_suffix(this.dropdown);
  136. this.add_suffix(new ResetButton({ settings, bind, onReset: () => this.reset() }));
  137. }
  138. reset() {
  139. this.dropdown.selected = 0;
  140. this.selected = 0;
  141. }
  142. #build() {
  143. for (const { name, id } of this.items) {
  144. this.model.append(name);
  145. if (this.#get() === id) this.selected = this.items.findIndex((x) => x.id === id);
  146. }
  147. const { model, selected } = this;
  148. this.dropdown = new Gtk.DropDown({ valign: Gtk.Align.CENTER, model, selected });
  149. this.dropdown.connect("notify::selected", () => this.#onSelected());
  150. this.activatable_widget = this.dropdown;
  151. }
  152. #onSelected() {
  153. this.selected = this.dropdown.selected;
  154. const { id } = this.items[this.selected];
  155. Logger.debug("setting", id, this.selected);
  156. this.#set(this.bind, id);
  157. }
  158. static #settingsTypes = {
  159. b: "boolean",
  160. y: "byte",
  161. n: "int16",
  162. q: "uint16",
  163. i: "int32",
  164. u: "uint",
  165. x: "int64",
  166. t: "uint64",
  167. d: "double",
  168. s: "string",
  169. o: "objv",
  170. };
  171. /**
  172. * @param {string} x
  173. */
  174. #get(x = this.bind) {
  175. const methodName = `get_${DropDownRow.#settingsTypes[this.type] ?? "value"}`;
  176. return this.settings[methodName]?.(x);
  177. }
  178. /**
  179. * @param {string} x
  180. * @param {unknown} y
  181. */
  182. #set(x, y) {
  183. const methodName = `set_${DropDownRow.#settingsTypes[this.type] ?? "value"}`;
  184. Logger.log(`${methodName}(${x}, ${y})`);
  185. return this.settings[methodName]?.(x, y);
  186. }
  187. }
  188. export class ResetButton extends Gtk.Button {
  189. static {
  190. GObject.registerClass(this);
  191. }
  192. constructor({ settings = undefined, bind = undefined, onReset }) {
  193. super({
  194. icon_name: "edit-clear-symbolic",
  195. tooltip_text: _("Reset"),
  196. valign: Gtk.Align.CENTER,
  197. });
  198. this.connect("clicked", () => {
  199. settings?.reset(bind);
  200. onReset?.();
  201. });
  202. }
  203. }
  204. export class EntryRow extends Adw.EntryRow {
  205. static {
  206. GObject.registerClass(this);
  207. }
  208. constructor({ title, settings, bind, map }) {
  209. super({ title });
  210. this.connect("changed", () => {
  211. const text = this.get_text();
  212. if (typeof text === "string")
  213. if (map) {
  214. map.to(settings, bind, text);
  215. } else {
  216. settings.set_string(bind, text);
  217. }
  218. });
  219. const current = map ? map.from(settings, bind) : settings.get_string(bind);
  220. this.set_text(current ?? "");
  221. this.add_suffix(
  222. new ResetButton({
  223. settings,
  224. bind,
  225. onReset: () => {
  226. this.set_text((map ? map.from(settings, bind) : settings.get_string(bind)) ?? "");
  227. },
  228. })
  229. );
  230. }
  231. }
  232. export class RadioRow extends Adw.ActionRow {
  233. static {
  234. GObject.registerClass(this);
  235. }
  236. static orientation = Gtk.Orientation.HORIZONTAL;
  237. static spacing = 10;
  238. static valign = Gtk.Align.CENTER;
  239. constructor({ title, subtitle = "", settings, bind, options }) {
  240. super({ title, subtitle });
  241. const current = settings.get_string(bind);
  242. const labels = Object.fromEntries(Object.entries(options).map(([k, v]) => [v, k]));
  243. const { orientation, spacing, valign } = RadioRow;
  244. const hbox = new Gtk.Box({ orientation, spacing, valign });
  245. let group;
  246. for (const [key, label] of Object.entries(options)) {
  247. const toggle = new Gtk.ToggleButton({ label, ...(group && { group }) });
  248. group ||= toggle;
  249. toggle.active = key === current;
  250. toggle.connect("clicked", () => {
  251. if (toggle.active) {
  252. settings.set_string(bind, labels[toggle.label]);
  253. }
  254. });
  255. hbox.append(toggle);
  256. }
  257. this.add_suffix(hbox);
  258. }
  259. }