refactor(ags launcher): clean up stuff and fix label vpack
This commit is contained in:
parent
c6cd289046
commit
d4b5232339
3 changed files with 42 additions and 69 deletions
|
@ -1,31 +1,13 @@
|
|||
import App from 'resource:///com/github/Aylur/ags/app.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 Separator from '../misc/separator.js';
|
||||
import EventBox from '../misc/cursorbox.js';
|
||||
|
||||
const ENTRY_SPACING = 16;
|
||||
|
||||
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({
|
||||
icon: lookUpIcon(app.icon_name) ?
|
||||
app.icon_name :
|
||||
|
@ -35,15 +17,32 @@ export default (app) => {
|
|||
size: 42,
|
||||
});
|
||||
|
||||
const textBox = CenterBox({
|
||||
const textBox = Box({
|
||||
vertical: true,
|
||||
start_widget: title,
|
||||
center_widget: description,
|
||||
end_widget: Separator(ENTRY_SPACING, { vertical: true }),
|
||||
vpack: 'start',
|
||||
|
||||
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,
|
||||
class_name: 'app',
|
||||
|
||||
|
@ -60,7 +59,6 @@ export default (app) => {
|
|||
child: Box({
|
||||
children: [
|
||||
icon,
|
||||
Separator(ENTRY_SPACING),
|
||||
textBox,
|
||||
],
|
||||
}),
|
||||
|
|
|
@ -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 PopupWindow from '../misc/popup.js';
|
||||
import Separator from '../misc/separator.js';
|
||||
import AppItem from './app-item.js';
|
||||
|
||||
|
||||
const Applauncher = ({ window_name = 'applauncher' } = {}) => {
|
||||
const ICON_SEPARATION = 4;
|
||||
|
||||
let fzfResults;
|
||||
const list = ListBox();
|
||||
|
||||
const setSort = (text) => {
|
||||
const fzf = new Fzf(Applications.list, {
|
||||
selector: (app) => app.name,
|
||||
|
@ -25,8 +23,8 @@ const Applauncher = ({ window_name = 'applauncher' } = {}) => {
|
|||
|
||||
fzfResults = fzf.find(text);
|
||||
list.set_sort_func((a, b) => {
|
||||
const row1 = a.get_children()[0].children[1]?.app.name;
|
||||
const row2 = b.get_children()[0].children[1]?.app.name;
|
||||
const row1 = a.get_children()[0]?.app.name;
|
||||
const row2 = b.get_children()[0]?.app.name;
|
||||
|
||||
if (!row1 || !row2) {
|
||||
return 0;
|
||||
|
@ -42,22 +40,13 @@ const Applauncher = ({ window_name = 'applauncher' } = {}) => {
|
|||
ch.destroy();
|
||||
});
|
||||
|
||||
[...Applications.query('').flatMap((app) => {
|
||||
const item = AppItem(app);
|
||||
const children = Applications.query('')
|
||||
.flatMap((app) => AppItem(app));
|
||||
|
||||
return Box({
|
||||
children: [
|
||||
Separator(ICON_SEPARATION, {
|
||||
binds: [['visible', item, 'visible']],
|
||||
}),
|
||||
item,
|
||||
],
|
||||
});
|
||||
}),
|
||||
Separator(ICON_SEPARATION)]
|
||||
.forEach(((ch) => {
|
||||
children.forEach((ch) => {
|
||||
list.add(ch);
|
||||
}));
|
||||
});
|
||||
list.show_all();
|
||||
};
|
||||
|
||||
makeNewChildren();
|
||||
|
@ -90,7 +79,7 @@ const Applauncher = ({ window_name = 'applauncher' } = {}) => {
|
|||
list.get_children().forEach((row) => {
|
||||
row.changed();
|
||||
|
||||
const item = row.get_children()[0].children[1];
|
||||
const item = row.get_children()[0];
|
||||
|
||||
if (item?.app) {
|
||||
const isMatching = fzfResults.find((r) => {
|
||||
|
|
|
@ -77,27 +77,7 @@
|
|||
.app {
|
||||
all: unset;
|
||||
transition: 200ms;
|
||||
padding: 2px 9px;
|
||||
|
||||
&:active {
|
||||
background-color: rgba($contrast-bg, 0.5);
|
||||
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 {
|
||||
transition: 200ms;
|
||||
|
@ -113,10 +93,16 @@
|
|||
|
||||
image {
|
||||
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;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue