-
-
Notifications
You must be signed in to change notification settings - Fork 59
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
examples/js/applauncher: Fix eventbox widthRequest
- Fix issue #98 Signed-off-by: ReStranger <[email protected]>
- Loading branch information
1 parent
48692ff
commit b7786ea
Showing
1 changed file
with
74 additions
and
70 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,87 +1,91 @@ | ||
| import Apps from "gi://AstalApps" | ||
| import { App, Astal, Gdk, Gtk } from "astal/gtk3" | ||
| import { Variable } from "astal" | ||
| import Apps from "gi://AstalApps"; | ||
| import { App, Astal, Gdk, Gtk } from "astal/gtk3"; | ||
| import { Variable } from "astal"; | ||
|
|
||
| const MAX_ITEMS = 8 | ||
| const MAX_ITEMS = 8; | ||
|
|
||
| function hide() { | ||
| App.get_window("launcher")!.hide() | ||
| App.get_window("launcher")!.hide(); | ||
| } | ||
|
|
||
| function AppButton({ app }: { app: Apps.Application }) { | ||
| return <button | ||
| className="AppButton" | ||
| onClicked={() => { hide(); app.launch() }}> | ||
| <box> | ||
| <icon icon={app.iconName} /> | ||
| <box valign={Gtk.Align.CENTER} vertical> | ||
| <label | ||
| className="name" | ||
| truncate | ||
| xalign={0} | ||
| label={app.name} | ||
| /> | ||
| {app.description && <label | ||
| className="description" | ||
| wrap | ||
| xalign={0} | ||
| label={app.description} | ||
| />} | ||
| </box> | ||
| return ( | ||
| <button | ||
| className="AppButton" | ||
| onClicked={() => { | ||
| hide(); | ||
| app.launch(); | ||
| }} | ||
| > | ||
| <box> | ||
| <icon icon={app.iconName} /> | ||
| <box valign={Gtk.Align.CENTER} vertical> | ||
| <label className="name" truncate xalign={0} label={app.name} /> | ||
| {app.description && ( | ||
| <label | ||
| className="description" | ||
| wrap | ||
| xalign={0} | ||
| label={app.description} | ||
| /> | ||
| )} | ||
| </box> | ||
| </box> | ||
| </button> | ||
| ); | ||
| } | ||
|
|
||
| export default function Applauncher() { | ||
| const { CENTER } = Gtk.Align | ||
| const apps = new Apps.Apps() | ||
| const { CENTER } = Gtk.Align; | ||
| const apps = new Apps.Apps(); | ||
|
|
||
| const text = Variable("") | ||
| const list = text(text => apps.fuzzy_query(text).slice(0, MAX_ITEMS)) | ||
| const onEnter = () => { | ||
| apps.fuzzy_query(text.get())?.[0].launch() | ||
| hide() | ||
| } | ||
| const text = Variable(""); | ||
| const list = text((text) => apps.fuzzy_query(text).slice(0, MAX_ITEMS)); | ||
| const onEnter = () => { | ||
| apps.fuzzy_query(text.get())?.[0].launch(); | ||
| hide(); | ||
| }; | ||
|
|
||
| return <window | ||
| name="launcher" | ||
| anchor={Astal.WindowAnchor.TOP | Astal.WindowAnchor.BOTTOM} | ||
| exclusivity={Astal.Exclusivity.IGNORE} | ||
| keymode={Astal.Keymode.ON_DEMAND} | ||
| application={App} | ||
| onShow={() => text.set("")} | ||
| onKeyPressEvent={function (self, event: Gdk.Event) { | ||
| if (event.get_keyval()[1] === Gdk.KEY_Escape) | ||
| self.hide() | ||
| }}> | ||
| <box> | ||
| <eventbox widthRequest={4000} expand onClick={hide} /> | ||
| <box hexpand={false} vertical> | ||
| <eventbox heightRequest={100} onClick={hide} /> | ||
| <box widthRequest={500} className="Applauncher" vertical> | ||
| <entry | ||
| placeholderText="Search" | ||
| text={text()} | ||
| onChanged={self => text.set(self.text)} | ||
| onActivate={onEnter} | ||
| /> | ||
| <box spacing={6} vertical> | ||
| {list.as(list => list.map(app => ( | ||
| <AppButton app={app} /> | ||
| )))} | ||
| </box> | ||
| <box | ||
| halign={CENTER} | ||
| className="not-found" | ||
| vertical | ||
| visible={list.as(l => l.length === 0)}> | ||
| <icon icon="system-search-symbolic" /> | ||
| <label label="No match found" /> | ||
| </box> | ||
| </box> | ||
| <eventbox expand onClick={hide} /> | ||
| return ( | ||
| <window | ||
| name="launcher" | ||
| anchor={Astal.WindowAnchor.TOP | Astal.WindowAnchor.BOTTOM} | ||
| exclusivity={Astal.Exclusivity.IGNORE} | ||
| keymode={Astal.Keymode.ON_DEMAND} | ||
| application={App} | ||
| onShow={() => text.set("")} | ||
| onKeyPressEvent={function (self, event: Gdk.Event) { | ||
| if (event.get_keyval()[1] === Gdk.KEY_Escape) self.hide(); | ||
| }} | ||
| > | ||
| <box> | ||
| <eventbox widthRequest={400} expand onClick={hide} /> | ||
| <box hexpand={false} vertical> | ||
| <eventbox heightRequest={100} onClick={hide} /> | ||
| <box widthRequest={500} className="Applauncher" vertical> | ||
| <entry | ||
| placeholderText="Search" | ||
| text={text()} | ||
| onChanged={(self) => text.set(self.text)} | ||
| onActivate={onEnter} | ||
| /> | ||
| <box spacing={6} vertical> | ||
| {list.as((list) => list.map((app) => <AppButton app={app} />))} | ||
| </box> | ||
| <box | ||
| halign={CENTER} | ||
| className="not-found" | ||
| vertical | ||
| visible={list.as((l) => l.length === 0)} | ||
| > | ||
| <icon icon="system-search-symbolic" /> | ||
| <label label="No match found" /> | ||
| </box> | ||
| <eventbox widthRequest={4000} expand onClick={hide} /> | ||
| </box> | ||
| <eventbox expand onClick={hide} /> | ||
| </box> | ||
| <eventbox widthRequest={400} expand onClick={hide} /> | ||
| </box> | ||
| </window> | ||
| ); | ||
| } |