refactor(ags): rearrange bar js
This commit is contained in:
parent
07ad1cddbe
commit
ac869537e7
6 changed files with 152 additions and 148 deletions
|
@ -1,6 +1,6 @@
|
||||||
import { exec } from 'resource:///com/github/Aylur/ags/utils.js';
|
import { exec } from 'resource:///com/github/Aylur/ags/utils.js';
|
||||||
import { Powermenu } from './js/powermenu.js';
|
import { Powermenu } from './js/powermenu.js';
|
||||||
import { LeftBar } from './js/bar/traybuttons.js';
|
import { Bar } from './js/bar/bar.js';
|
||||||
import { Closer } from './js/common.js';
|
import { Closer } from './js/common.js';
|
||||||
|
|
||||||
const scss = ags.App.configDir + '/scss/main.scss';
|
const scss = ags.App.configDir + '/scss/main.scss';
|
||||||
|
@ -13,7 +13,7 @@ export default {
|
||||||
style: css,
|
style: css,
|
||||||
windows: [
|
windows: [
|
||||||
Powermenu,
|
Powermenu,
|
||||||
LeftBar,
|
Bar,
|
||||||
Closer,
|
Closer,
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
65
config/ags/js/bar/bar.js
Normal file
65
config/ags/js/bar/bar.js
Normal file
|
@ -0,0 +1,65 @@
|
||||||
|
const { Window, CenterBox, Box } = ags.Widget;
|
||||||
|
|
||||||
|
import { Separator, EventBox } from '../common.js';
|
||||||
|
import { CurrentWindow } from './current-window.js';
|
||||||
|
import { Workspaces } from './workspaces.js';
|
||||||
|
import { OskToggle } from './osk-toggle.js'
|
||||||
|
import { Heart } from './heart.js'
|
||||||
|
|
||||||
|
export const Bar = Window({
|
||||||
|
name: 'left-bar',
|
||||||
|
layer: 'overlay',
|
||||||
|
anchor: 'top left right',
|
||||||
|
exclusive: true,
|
||||||
|
|
||||||
|
child: CenterBox({
|
||||||
|
className: 'transparent',
|
||||||
|
halign: 'fill',
|
||||||
|
style: 'margin-top: 5px; margin-left: 5px;',
|
||||||
|
vertical: false,
|
||||||
|
|
||||||
|
children: [
|
||||||
|
|
||||||
|
// Left
|
||||||
|
Box({
|
||||||
|
halign: 'start',
|
||||||
|
children: [
|
||||||
|
|
||||||
|
OskToggle,
|
||||||
|
|
||||||
|
Separator(12),
|
||||||
|
|
||||||
|
EventBox({
|
||||||
|
className: 'toggle-off',
|
||||||
|
onPrimaryClickRelease: '',
|
||||||
|
child: ags.Widget.Box({
|
||||||
|
className: 'tablet-toggle',
|
||||||
|
vertical: false,
|
||||||
|
|
||||||
|
child: ags.Widget.Label({
|
||||||
|
label: " ",
|
||||||
|
}),
|
||||||
|
}),
|
||||||
|
}),
|
||||||
|
|
||||||
|
Separator(12),
|
||||||
|
|
||||||
|
Heart,
|
||||||
|
|
||||||
|
Separator(12),
|
||||||
|
|
||||||
|
Workspaces(),
|
||||||
|
|
||||||
|
],
|
||||||
|
}),
|
||||||
|
|
||||||
|
// Center
|
||||||
|
CurrentWindow,
|
||||||
|
|
||||||
|
// Right
|
||||||
|
Box({
|
||||||
|
halign: 'end',
|
||||||
|
}),
|
||||||
|
],
|
||||||
|
}),
|
||||||
|
});
|
31
config/ags/js/bar/heart.js
Normal file
31
config/ags/js/bar/heart.js
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
|
||||||
|
|
||||||
|
import { EventBox } from '../common.js';
|
||||||
|
|
||||||
|
ags.Utils.subprocess(
|
||||||
|
['bash', '-c', 'tail -f /home/matt/.config/.heart'],
|
||||||
|
(output) => {
|
||||||
|
Heart.child.children[0].label = ' ' + output;
|
||||||
|
|
||||||
|
if (output == '') {
|
||||||
|
Heart.toggleClassName('toggle-on', true);
|
||||||
|
} else {
|
||||||
|
Heart.toggleClassName('toggle-on', false);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
);
|
||||||
|
export const Heart = EventBox({
|
||||||
|
className: 'toggle-off',
|
||||||
|
halign: 'center',
|
||||||
|
onPrimaryClickRelease: function() {
|
||||||
|
ags.Utils.exec('/home/matt/.nix/config/ags/bin/heart.sh toggle');
|
||||||
|
},
|
||||||
|
child: ags.Widget.Box({
|
||||||
|
className: 'heart-toggle',
|
||||||
|
vertical: false,
|
||||||
|
|
||||||
|
child: ags.Widget.Label({
|
||||||
|
label: '',
|
||||||
|
}),
|
||||||
|
}),
|
||||||
|
});
|
37
config/ags/js/bar/osk-toggle.js
Normal file
37
config/ags/js/bar/osk-toggle.js
Normal file
|
@ -0,0 +1,37 @@
|
||||||
|
import { Separator, EventBox } from '../common.js';
|
||||||
|
|
||||||
|
ags.Utils.subprocess(
|
||||||
|
['bash', '-c', '/home/matt/.nix/config/ags/scripts/osk-toggle.sh getState'],
|
||||||
|
(output) => {
|
||||||
|
if (output == 'Running') {
|
||||||
|
OskToggle.toggleClassName('toggle-on', true);
|
||||||
|
} else {
|
||||||
|
OskToggle.toggleClassName('toggle-on', false);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
);
|
||||||
|
export const OskToggle = EventBox({
|
||||||
|
className: 'toggle-off',
|
||||||
|
onPrimaryClickRelease: function() {
|
||||||
|
ags.Utils.subprocess(
|
||||||
|
['bash', '-c', '/home/matt/.nix/config/ags/bin/osk-toggle.sh toggle'],
|
||||||
|
(output) => {
|
||||||
|
if (output == 'Running') {
|
||||||
|
OskToggle.toggleClassName('toggle-on', false);
|
||||||
|
} else {
|
||||||
|
OskToggle.toggleClassName('toggle-on', true);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
);
|
||||||
|
},
|
||||||
|
child: ags.Widget.Box({
|
||||||
|
className: 'osk-toggle',
|
||||||
|
vertical: false,
|
||||||
|
|
||||||
|
children: [
|
||||||
|
ags.Widget.Label({
|
||||||
|
label: " ",
|
||||||
|
}),
|
||||||
|
],
|
||||||
|
}),
|
||||||
|
});
|
|
@ -1,146 +0,0 @@
|
||||||
import Gdk from 'gi://Gdk';
|
|
||||||
const display = Gdk.Display.get_default();
|
|
||||||
import { CurrentWindow } from './current-window.js';
|
|
||||||
import { Workspaces } from './workspaces.js';
|
|
||||||
|
|
||||||
const Separator = width => ags.Widget.Box({
|
|
||||||
style: `min-width: ${width}px;`,
|
|
||||||
});
|
|
||||||
|
|
||||||
ags.Utils.subprocess(
|
|
||||||
['bash', '-c', '/home/matt/.nix/config/ags/scripts/osk-toggle.sh getState'],
|
|
||||||
(output) => {
|
|
||||||
if (output == 'Running') {
|
|
||||||
OskToggle.toggleClassName('toggle-on', true);
|
|
||||||
} else {
|
|
||||||
OskToggle.toggleClassName('toggle-on', false);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
);
|
|
||||||
const OskToggle = ags.Widget.EventBox({
|
|
||||||
className: 'toggle-off',
|
|
||||||
onPrimaryClickRelease: function() {
|
|
||||||
ags.Utils.subprocess(
|
|
||||||
['bash', '-c', '/home/matt/.nix/config/ags/scripts/osk-toggle.sh toggle'],
|
|
||||||
(output) => {
|
|
||||||
if (output == 'Running') {
|
|
||||||
OskToggle.toggleClassName('toggle-on', false);
|
|
||||||
} else {
|
|
||||||
OskToggle.toggleClassName('toggle-on', true);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
);
|
|
||||||
},
|
|
||||||
onHover: box => {
|
|
||||||
box.window.set_cursor(Gdk.Cursor.new_from_name(display, 'pointer'));
|
|
||||||
},
|
|
||||||
onHoverLost: box => {
|
|
||||||
box.window.set_cursor(null);
|
|
||||||
},
|
|
||||||
child: ags.Widget.Box({
|
|
||||||
className: 'osk-toggle',
|
|
||||||
vertical: false,
|
|
||||||
|
|
||||||
children: [
|
|
||||||
ags.Widget.Label({
|
|
||||||
label: " ",
|
|
||||||
}),
|
|
||||||
],
|
|
||||||
}),
|
|
||||||
});
|
|
||||||
|
|
||||||
ags.Utils.subprocess(
|
|
||||||
['bash', '-c', 'tail -f /home/matt/.config/.heart'],
|
|
||||||
(output) => {
|
|
||||||
HeartToggle.child.children[0].label = ' ' + output;
|
|
||||||
|
|
||||||
if (output == '') {
|
|
||||||
HeartToggle.toggleClassName('toggle-on', true);
|
|
||||||
} else {
|
|
||||||
HeartToggle.toggleClassName('toggle-on', false);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
);
|
|
||||||
const HeartToggle = ags.Widget.EventBox({
|
|
||||||
className: 'toggle-off',
|
|
||||||
halign: 'center',
|
|
||||||
onPrimaryClickRelease: function() {
|
|
||||||
ags.Utils.exec('/home/matt/.nix/config/ags/scripts/heart.sh toggle');
|
|
||||||
},
|
|
||||||
onHover: box => {
|
|
||||||
box.window.set_cursor(Gdk.Cursor.new_from_name(display, 'pointer'));
|
|
||||||
},
|
|
||||||
onHoverLost: box => {
|
|
||||||
box.window.set_cursor(null);
|
|
||||||
},
|
|
||||||
child: ags.Widget.Box({
|
|
||||||
className: 'heart-toggle',
|
|
||||||
vertical: false,
|
|
||||||
|
|
||||||
child: ags.Widget.Label({
|
|
||||||
label: '',
|
|
||||||
}),
|
|
||||||
}),
|
|
||||||
});
|
|
||||||
|
|
||||||
export const LeftBar = ags.Widget.Window({
|
|
||||||
name: 'left-bar',
|
|
||||||
layer: 'overlay',
|
|
||||||
anchor: 'top left right',
|
|
||||||
exclusive: true,
|
|
||||||
|
|
||||||
child: ags.Widget.CenterBox({
|
|
||||||
className: 'transparent',
|
|
||||||
halign: 'fill',
|
|
||||||
style: 'margin-top: 5px; margin-left: 5px;',
|
|
||||||
vertical: false,
|
|
||||||
|
|
||||||
children: [
|
|
||||||
|
|
||||||
ags.Widget.Box({
|
|
||||||
halign: 'start',
|
|
||||||
children: [
|
|
||||||
|
|
||||||
OskToggle,
|
|
||||||
|
|
||||||
Separator(12),
|
|
||||||
|
|
||||||
ags.Widget.EventBox({
|
|
||||||
className: 'toggle-off',
|
|
||||||
onPrimaryClickRelease: '',
|
|
||||||
onHover: box => {
|
|
||||||
box.window.set_cursor(Gdk.Cursor.new_from_name(display, 'pointer'));
|
|
||||||
},
|
|
||||||
onHoverLost: box => {
|
|
||||||
box.window.set_cursor(null);
|
|
||||||
},
|
|
||||||
child: ags.Widget.Box({
|
|
||||||
className: 'tablet-toggle',
|
|
||||||
vertical: false,
|
|
||||||
|
|
||||||
child: ags.Widget.Label({
|
|
||||||
label: " ",
|
|
||||||
}),
|
|
||||||
}),
|
|
||||||
}),
|
|
||||||
|
|
||||||
Separator(12),
|
|
||||||
|
|
||||||
HeartToggle,
|
|
||||||
|
|
||||||
Separator(12),
|
|
||||||
|
|
||||||
Workspaces(),
|
|
||||||
|
|
||||||
],
|
|
||||||
}),
|
|
||||||
|
|
||||||
CurrentWindow,
|
|
||||||
|
|
||||||
ags.Widget.Box({
|
|
||||||
halign: 'end',
|
|
||||||
style: 'background: red; min-width: 100px; min-height: 40px',
|
|
||||||
}),
|
|
||||||
],
|
|
||||||
}),
|
|
||||||
});
|
|
|
@ -11,3 +11,20 @@ export const Closer = ags.Widget.Window({
|
||||||
},
|
},
|
||||||
}),
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
|
export const Separator = width => ags.Widget.Box({
|
||||||
|
style: `min-width: ${width}px;`,
|
||||||
|
});
|
||||||
|
|
||||||
|
import Gdk from 'gi://Gdk';
|
||||||
|
const display = Gdk.Display.get_default();
|
||||||
|
|
||||||
|
export const EventBox = ({ ...params }) => ags.Widget.EventBox({
|
||||||
|
...params,
|
||||||
|
onHover: box => {
|
||||||
|
box.window.set_cursor(Gdk.Cursor.new_from_name(display, 'pointer'));
|
||||||
|
},
|
||||||
|
onHoverLost: box => {
|
||||||
|
box.window.set_cursor(null);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
Loading…
Reference in a new issue