Readme (#567)
* Update readme. * updates * Update and fix startup issues.
This commit is contained in:
Jas Singh
GitHub
221
README.md
221
README.md
@@ -1,72 +1,40 @@
|
||||
# 🚧 Migrating to Astal and AGSv2 🚧
|
||||
|
||||
Hyprpanel is upgrading to AGSv2 and Astal
|
||||
|
||||
🔧 No new features or most bugs will be worked on until migration is complete.
|
||||
|
||||
<p align="center">
|
||||
<a href="https://hyprpanel.com" target="_blank" rel="noopener noreferrer">
|
||||
<img width="180" src="./assets/hyprpanel.png" alt="Hyprpanel logo">
|
||||
</a>
|
||||
</p>
|
||||
<br/>
|
||||
<p align="center">
|
||||
<a href="https://hyprpanel.com/getting_started/installation.html"><img src="https://img.shields.io/badge/Wiki-hyprpanel-orange?style=flat&logo=wiki" alt="wiki"></a>
|
||||
<a href="https://discord.gg/MNpg7Z2b3a"><img src="https://img.shields.io/badge/chat-discord-blue?style=flat&logo=discord" alt="discord chat"></a>
|
||||
</p>
|
||||
<br/>
|
||||
|
||||
# HyprPanel 🚀
|
||||
|
||||
A panel built for Hyprland with [AGS](https://github.com/Aylur/ags)
|
||||
A panel built for Hyprland with [Astal](https://github.com/Aylur/astal)
|
||||
|
||||
|
||||
|
||||
|
||||
> NOTE: If you would like to support the project, please instead [donate to Aylur](https://ko-fi.com/aylur) who put in tremendous effort to build AGS. Hyprpanel likely wouldn't exist without it.
|
||||
|
||||
## Installation
|
||||
## Information
|
||||
|
||||
The [HyprPanel Wiki](https://hyprpanel.com/getting_started/installation.html) contains in depth instructions for installing the panel and all of its dependencies. The instructions below are general instructions for installing the panel.
|
||||
The [HyprPanel Wiki](https://hyprpanel.com/getting_started/installation.html) contains in depth instructions for configuring and installing the panel and all of its dependencies. The instructions below are just the general instructions for installing the panel.
|
||||
|
||||
## Requirements
|
||||
## Arch
|
||||
|
||||
Bun
|
||||
|
||||
```sh
|
||||
curl -fsSL https://bun.sh/install | bash && \
|
||||
sudo ln -s $HOME/.bun/bin/bun /usr/local/bin/bun
|
||||
```bash
|
||||
yay -S ags-hyprpanel-git
|
||||
```
|
||||
|
||||
## From Source
|
||||
|
||||
### Required
|
||||
|
||||
```sh
|
||||
pipewire
|
||||
|
||||
## Resource monitoring modules
|
||||
aylurs-gtk-shell-git
|
||||
wireplumber
|
||||
libgtop
|
||||
|
||||
## Bluetooth menu utilities
|
||||
bluez
|
||||
bluez-utils
|
||||
|
||||
## Copy/Paste utilities
|
||||
wl-clipboard
|
||||
|
||||
## Compiler for sass/scss
|
||||
dart-sass
|
||||
|
||||
## Brightness module for OSD
|
||||
brightnessctl
|
||||
|
||||
## AGS requirements
|
||||
networkmanager
|
||||
gnome-bluetooth-3.0
|
||||
dart-sass
|
||||
wl-clipboard
|
||||
upower
|
||||
gvfs
|
||||
```
|
||||
|
||||
::: warning
|
||||
HyprPanel will not run without the required dependencies.
|
||||
:::
|
||||
**NOTE: HyprPanel will not run without the required dependencies.**
|
||||
|
||||
### Optional
|
||||
|
||||
@@ -75,6 +43,9 @@ HyprPanel will not run without the required dependencies.
|
||||
python
|
||||
python-gpustat
|
||||
|
||||
## To control screen/keyboard brightness
|
||||
brightnessctl
|
||||
|
||||
## Only if a pywal hook from wallpaper changes applied through settings is desired
|
||||
pywal
|
||||
|
||||
@@ -114,13 +85,13 @@ swww
|
||||
pacman:
|
||||
|
||||
```bash
|
||||
sudo pacman -S pipewire libgtop bluez bluez-utils btop networkmanager dart-sass wl-clipboard brightnessctl swww python gnome-bluetooth-3.0 pacman-contrib power-profiles-daemon gvfs
|
||||
sudo pacman -S --needed wireplumber libgtop bluez bluez-utils btop networkmanager dart-sass wl-clipboard brightnessctl swww python upower pacman-contrib power-profiles-daemon gvfs
|
||||
```
|
||||
|
||||
AUR:
|
||||
|
||||
```bash
|
||||
yay -S grimblast-git gpu-screen-recorder hyprpicker matugen-bin python-gpustat aylurs-gtk-shell-git hyprsunset-git hypridle-git
|
||||
yay -S --needed aylurs-gtk-shell-git grimblast-git gpu-screen-recorder-git hyprpicker matugen-bin python-gpustat hyprsunset-git hypridle-git
|
||||
```
|
||||
|
||||
### Fedora
|
||||
@@ -135,14 +106,14 @@ sudo dnf config-manager --save --setopt=copr:copr.fedorainfracloud.org:heus-sueh
|
||||
|
||||
DNF:
|
||||
|
||||
```bash
|
||||
sudo dnf install pipewire libgtop2 bluez bluez-tools grimblast hyprpicker btop NetworkManager wl-clipboard swww brightnessctl gnome-bluetooth aylurs-gtk-shell power-profiles-daemon gvfs
|
||||
```sh
|
||||
sudo dnf install wireplumber upower libgtop2 bluez bluez-tools grimblast hyprpicker btop NetworkManager wl-clipboard swww brightnessctl gnome-bluetooth aylurs-gtk-shell power-profiles-daemon gvfs nodejs
|
||||
```
|
||||
|
||||
bun:
|
||||
npm:
|
||||
|
||||
```bash
|
||||
bun install -g sass
|
||||
npm install -g sass
|
||||
```
|
||||
|
||||
flatpak:
|
||||
@@ -163,41 +134,28 @@ sudo dnf install python python3-pip; pip install gpustat pywal
|
||||
|
||||
For NixOS/Home-Manager, see [NixOS & Home-Manager instructions](#nixos--home-manager).
|
||||
|
||||
## Instructions
|
||||
## Installation
|
||||
|
||||
### AGS
|
||||
|
||||
Once everything is installed you need to put the contents of this repo in `~/.config/ags`.
|
||||
If you already have something in `~/.config/ags`, it's recommended that you back it up with:
|
||||
To install HyprPanel, you can run the following commands:
|
||||
|
||||
```bash
|
||||
mv $HOME/.config/ags $HOME/.config/ags.bkup
|
||||
git clone https://github.com/Jas-SinghFSU/HyprPanel.git
|
||||
cd HyprPanel
|
||||
meson setup build
|
||||
meson compile -C build
|
||||
meson install -C build
|
||||
```
|
||||
|
||||
Otherwise you can use this command to install the panel:
|
||||
### Installing NerdFonts
|
||||
|
||||
```bash
|
||||
git clone https://github.com/Jas-SinghFSU/HyprPanel.git && \
|
||||
ln -s $(pwd)/HyprPanel $HOME/.config/ags
|
||||
HyprPanel uses [Nerdfonts](https://www.nerdfonts.com/) to display icons. You can install them using the following command from within the HyprPanel's `scripts` directory:
|
||||
|
||||
```sh
|
||||
# Installs the JetBrainsMono NerdFonts used for icons
|
||||
./scripts/install_fonts.sh
|
||||
```
|
||||
|
||||
### Nerd Fonts
|
||||
|
||||
Additionally, you need to ensure that you have a [Nerd Font](https://www.nerdfonts.com/font-downloads) installed for your icons to render properly.
|
||||
|
||||
### Launch the panel
|
||||
|
||||
Afterwards you can run the panel with the following command in your terminal:
|
||||
|
||||
```bash
|
||||
ags
|
||||
```
|
||||
|
||||
Or you can add it to your Hyprland config (hyprland.conf) to auto-start with:
|
||||
|
||||
```bash
|
||||
exec-once = ags
|
||||
```
|
||||
If you install the fonts after installing HyperPanel, you will need to restart HyperPanel for the changes to take effect.
|
||||
|
||||
### NixOS & Home-Manager
|
||||
|
||||
@@ -263,97 +221,22 @@ wayland.windowManager.hyprland.settings.exec-once = [
|
||||
|
||||
```
|
||||
|
||||
### Launch the panel
|
||||
|
||||
Afterwards you can run the panel with the following command in your terminal:
|
||||
|
||||
```bash
|
||||
hyprpanel
|
||||
```
|
||||
|
||||
Or you can add it to your Hyprland config (hyprland.conf) to auto-start with:
|
||||
|
||||
```bash
|
||||
exec-once = hyprpanel
|
||||
```
|
||||
|
||||
### Notifications
|
||||
|
||||
HyprPanel handles notifications through the AGS built-in notification service. If you're already using a notification daemon such as Dunst or Mako, you may have to stop them to prevent conflicts with HyprPanel.
|
||||
|
||||
> NOTE: If your system is in a language other than English, the resource monitor in the dashboard may not work properly.
|
||||
|
||||
## Configuration
|
||||
|
||||
The HyprPanel comes with a configuration menu which is available by opening the Dashboard menu (click the button in the bar with the default - Arch - icon) and then clicking the Gear icon.
|
||||
|
||||
### Size
|
||||
|
||||
The panel is automatically scaled based on your font size in `Configuration > General`.
|
||||
|
||||
### Specifying bar layouts per monitor
|
||||
|
||||
To specify layouts for each monitor you can create a JSON object such as:
|
||||
|
||||
```JSON
|
||||
{
|
||||
"0": {
|
||||
"left": [
|
||||
"dashboard",
|
||||
"workspaces",
|
||||
"windowtitle"
|
||||
],
|
||||
"middle": [
|
||||
"media"
|
||||
],
|
||||
"right": [
|
||||
"volume",
|
||||
"clock",
|
||||
"notifications"
|
||||
]
|
||||
},
|
||||
"1": {
|
||||
"left": [
|
||||
"dashboard",
|
||||
"workspaces",
|
||||
"windowtitle"
|
||||
],
|
||||
"middle": [
|
||||
"media"
|
||||
],
|
||||
"right": [
|
||||
"volume",
|
||||
"clock",
|
||||
"notifications"
|
||||
]
|
||||
},
|
||||
"2": {
|
||||
"left": [
|
||||
"dashboard",
|
||||
"workspaces",
|
||||
"windowtitle"
|
||||
],
|
||||
"middle": [
|
||||
"media"
|
||||
],
|
||||
"right": [
|
||||
"volume",
|
||||
"network",
|
||||
"bluetooth",
|
||||
"systray",
|
||||
"clock",
|
||||
"notifications"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Where each monitor is defined by its index (0, 1, 2 in this case) and each section (left, middle, right) contains one or more of the following modules:
|
||||
|
||||
```js
|
||||
'battery';
|
||||
'dashboard';
|
||||
'workspaces';
|
||||
'windowtitle';
|
||||
'media';
|
||||
'notifications';
|
||||
'volume';
|
||||
'network';
|
||||
'bluetooth';
|
||||
'clock';
|
||||
'systray';
|
||||
```
|
||||
|
||||
Since the text-box in the options dialog isn't sufficient, it is recommended that you create this JSON configuration in a text editor elsewhere and paste it into the layout text-box under Configuration > Bar > "Bar Layouts for Monitors".
|
||||
|
||||
### Additional Configuration
|
||||
|
||||
#### GPU Tracking
|
||||
|
||||
If you have an NVidia GPU, you can track your GPU usage in your Dashboard by going to your `Settings > Configuration > Dashboard Menu > Track GPU` and turning it on.
|
||||
|
||||
@@ -33,7 +33,16 @@ const MenuDefaultIcon = ({ item }: MenuEntryProps): JSX.Element => {
|
||||
};
|
||||
|
||||
const MenuEntry = ({ item, child }: MenuEntryProps): JSX.Element => {
|
||||
const menu = createMenu(item.menuModel, item.actionGroup);
|
||||
let menu: Gtk.Menu;
|
||||
|
||||
const entryBinding = Variable.derive(
|
||||
[bind(item, 'menuModel'), bind(item, 'actionGroup')],
|
||||
(menuModel, actionGroup) => {
|
||||
if (menuModel && actionGroup) {
|
||||
menu = createMenu(menuModel, actionGroup);
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
return (
|
||||
<button
|
||||
@@ -51,7 +60,10 @@ const MenuEntry = ({ item, child }: MenuEntryProps): JSX.Element => {
|
||||
Notify({ summary: 'App Name', body: item.id });
|
||||
}
|
||||
}}
|
||||
onDestroy={() => menu?.destroy()}
|
||||
onDestroy={() => {
|
||||
menu?.destroy();
|
||||
entryBinding.drop();
|
||||
}}
|
||||
>
|
||||
{child}
|
||||
</button>
|
||||
|
||||
@@ -11,7 +11,9 @@ import { bluetoothService } from 'src/lib/constants/services';
|
||||
* @returns An array of available Bluetooth devices.
|
||||
*/
|
||||
export const getAvailableBluetoothDevices = (): AstalBluetooth.Device[] => {
|
||||
const availableDevices = bluetoothService.devices
|
||||
const bluetoothDevices = bluetoothService.get_devices() ?? [];
|
||||
|
||||
const availableDevices = bluetoothDevices
|
||||
.filter((btDev) => btDev.name !== null)
|
||||
.sort((a, b) => {
|
||||
if (a.connected || a.paired) {
|
||||
|
||||
@@ -69,7 +69,7 @@ const dedupeWAPs = (): AstalNetwork.AccessPoint[] => {
|
||||
return [];
|
||||
}
|
||||
|
||||
const WAPs = networkService.wifi.accessPoints;
|
||||
const WAPs = networkService.wifi.get_access_points();
|
||||
const dedupMap: Record<string, AstalNetwork.AccessPoint> = {};
|
||||
|
||||
WAPs.forEach((item: AstalNetwork.AccessPoint) => {
|
||||
|
||||
Reference in New Issue
Block a user