refactor(ags launcher): clean up stuff and fix label vpack

This commit is contained in:
matt1432 2023-12-09 12:12:43 -05:00
parent c6cd289046
commit d4b5232339
3 changed files with 42 additions and 69 deletions

View file

@ -1,31 +1,13 @@
import App from 'resource:///com/github/Aylur/ags/app.js'; import App from 'resource:///com/github/Aylur/ags/app.js';
import Hyprland from 'resource:///com/github/Aylur/ags/service/hyprland.js'; import Hyprland from 'resource:///com/github/Aylur/ags/service/hyprland.js';
import { Box, Button, CenterBox, Icon, Label } from 'resource:///com/github/Aylur/ags/widget.js'; import { Box, Icon, Label } from 'resource:///com/github/Aylur/ags/widget.js';
import { lookUpIcon } from 'resource:///com/github/Aylur/ags/utils.js'; import { lookUpIcon } from 'resource:///com/github/Aylur/ags/utils.js';
import Separator from '../misc/separator.js'; import EventBox from '../misc/cursorbox.js';
const ENTRY_SPACING = 16;
export default (app) => { export default (app) => {
const title = Label({
class_name: 'title',
label: app.name,
xalign: 0,
vpack: 'center',
truncate: 'end',
});
const description = Label({
class_name: 'description',
label: app.description || '',
wrap: true,
xalign: 0,
justification: 'left',
vpack: 'center',
});
const icon = Icon({ const icon = Icon({
icon: lookUpIcon(app.icon_name) ? icon: lookUpIcon(app.icon_name) ?
app.icon_name : app.icon_name :
@ -35,15 +17,32 @@ export default (app) => {
size: 42, size: 42,
}); });
const textBox = CenterBox({ const textBox = Box({
vertical: true, vertical: true,
start_widget: title, vpack: 'start',
center_widget: description,
end_widget: Separator(ENTRY_SPACING, { vertical: true }), children: [
Label({
class_name: 'title',
label: app.name,
xalign: 0,
truncate: 'end',
}),
Label({
class_name: 'description',
label: app.description || '',
wrap: true,
xalign: 0,
justification: 'left',
}),
Label(),
],
}); });
return Button({ return EventBox({
hexpand: true, hexpand: true,
class_name: 'app', class_name: 'app',
@ -60,7 +59,6 @@ export default (app) => {
child: Box({ child: Box({
children: [ children: [
icon, icon,
Separator(ENTRY_SPACING),
textBox, textBox,
], ],
}), }),

View file

@ -7,15 +7,13 @@ import { Fzf } from '../../node_modules/fzf/dist/fzf.es.js';
import { Box, Entry, Icon, Label, ListBox, Scrollable } from 'resource:///com/github/Aylur/ags/widget.js'; import { Box, Entry, Icon, Label, ListBox, Scrollable } from 'resource:///com/github/Aylur/ags/widget.js';
import PopupWindow from '../misc/popup.js'; import PopupWindow from '../misc/popup.js';
import Separator from '../misc/separator.js';
import AppItem from './app-item.js'; import AppItem from './app-item.js';
const Applauncher = ({ window_name = 'applauncher' } = {}) => { const Applauncher = ({ window_name = 'applauncher' } = {}) => {
const ICON_SEPARATION = 4;
let fzfResults; let fzfResults;
const list = ListBox(); const list = ListBox();
const setSort = (text) => { const setSort = (text) => {
const fzf = new Fzf(Applications.list, { const fzf = new Fzf(Applications.list, {
selector: (app) => app.name, selector: (app) => app.name,
@ -25,8 +23,8 @@ const Applauncher = ({ window_name = 'applauncher' } = {}) => {
fzfResults = fzf.find(text); fzfResults = fzf.find(text);
list.set_sort_func((a, b) => { list.set_sort_func((a, b) => {
const row1 = a.get_children()[0].children[1]?.app.name; const row1 = a.get_children()[0]?.app.name;
const row2 = b.get_children()[0].children[1]?.app.name; const row2 = b.get_children()[0]?.app.name;
if (!row1 || !row2) { if (!row1 || !row2) {
return 0; return 0;
@ -42,22 +40,13 @@ const Applauncher = ({ window_name = 'applauncher' } = {}) => {
ch.destroy(); ch.destroy();
}); });
[...Applications.query('').flatMap((app) => { const children = Applications.query('')
const item = AppItem(app); .flatMap((app) => AppItem(app));
return Box({ children.forEach((ch) => {
children: [
Separator(ICON_SEPARATION, {
binds: [['visible', item, 'visible']],
}),
item,
],
});
}),
Separator(ICON_SEPARATION)]
.forEach(((ch) => {
list.add(ch); list.add(ch);
})); });
list.show_all();
}; };
makeNewChildren(); makeNewChildren();
@ -90,7 +79,7 @@ const Applauncher = ({ window_name = 'applauncher' } = {}) => {
list.get_children().forEach((row) => { list.get_children().forEach((row) => {
row.changed(); row.changed();
const item = row.get_children()[0].children[1]; const item = row.get_children()[0];
if (item?.app) { if (item?.app) {
const isMatching = fzfResults.find((r) => { const isMatching = fzfResults.find((r) => {

View file

@ -77,27 +77,7 @@
.app { .app {
all: unset; all: unset;
transition: 200ms; transition: 200ms;
padding: 2px 9px;
&:active {
background-color: rgba($contrast-bg, 0.5);
border-radius: 9px; border-radius: 9px;
box-shadow: inset 0 0 0 3px rgba(238, 238, 238, 0.03);
.title {
color: #f8f8f2;
}
}
&:hover, &:focus {
.title {
color: $contrast-bg;
}
image {
-gtk-icon-shadow: 2px 2px $contrast-bg;
}
}
label { label {
transition: 200ms; transition: 200ms;
@ -113,10 +93,16 @@
image { image {
transition: 200ms; transition: 200ms;
margin-right: 8px;
}
&:active {
background-color: rgba($contrast-bg, 0.5);
box-shadow: inset 0 0 0 3px rgba(238, 238, 238, 0.03);
} }
} }
*:selected { *:selected, .app:hover, .app:focus {
* { * {
font-weight: unset; font-weight: unset;
} }