From d4b52323393630a59c2ab8fbf1199525c88b6c7c Mon Sep 17 00:00:00 2001 From: matt1432 Date: Sat, 9 Dec 2023 12:12:43 -0500 Subject: [PATCH] refactor(ags launcher): clean up stuff and fix label vpack --- .../wim/config/ags/js/applauncher/app-item.js | 50 +++++++++---------- devices/wim/config/ags/js/applauncher/main.js | 31 ++++-------- .../config/ags/scss/widgets/applauncher.scss | 30 +++-------- 3 files changed, 42 insertions(+), 69 deletions(-) diff --git a/devices/wim/config/ags/js/applauncher/app-item.js b/devices/wim/config/ags/js/applauncher/app-item.js index 9fc05e55..31e49e19 100644 --- a/devices/wim/config/ags/js/applauncher/app-item.js +++ b/devices/wim/config/ags/js/applauncher/app-item.js @@ -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, ], }), diff --git a/devices/wim/config/ags/js/applauncher/main.js b/devices/wim/config/ags/js/applauncher/main.js index 52704aaf..e70199d0 100644 --- a/devices/wim/config/ags/js/applauncher/main.js +++ b/devices/wim/config/ags/js/applauncher/main.js @@ -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) => { - list.add(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) => { diff --git a/devices/wim/config/ags/scss/widgets/applauncher.scss b/devices/wim/config/ags/scss/widgets/applauncher.scss index 2be2c394..655f1150 100644 --- a/devices/wim/config/ags/scss/widgets/applauncher.scss +++ b/devices/wim/config/ags/scss/widgets/applauncher.scss @@ -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; - } - } + border-radius: 9px; 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; }