543 - Widgets con JavaScript en Linux

543 - Widgets con JavaScript en Linux

ags es una librería con la que crear espectaculares #widgets con #javascript en #linux en cualquier de los entorno de escritorio que puedes encontrar

1:25
-3:15

En el episodio 541, te hablé sobre porque JavaScript, se había convertido, a mi modo de ver, en el rey de los lenguajes de programación en los entornos de escritorio Linux. Y no solo de los entornos de escritorio, también de los tiling window manager, en tanto en cuanto, un tiling no es un completo entorno de escritorio. En ese caso, te hablé tanto de GNOME como de KDE, y de las implementaciones que cada uno de ellos había realizado para aprovechar el potencial de JavaScript. Pero, también te dejé caer, sobre que había una opción para los tiling, y es precisamente de lo que te vengo a hablar en este episodio del podcast, de widgets con JavaScript.

Lo cierto es que esta solución que he encontrado para implementar widgets me parece simplemente espectacular, me tiene completamente enamorado, y estoy sacando tiempo de debajo de las piedras para poder aterrizarlo en mi swayfx.

Widgets con JavaScript en Linux

Un paseo por el pasado

En este tiempo, en el que he probado diferentes tiling window manager, he tenido que configurar decenas de barras de herramientas, aplicaciones y complementos, para completar el gestor de ventanas.

Y es que un tiling es solo un gestor de ventanas, adolece de algunas características necesarias para un entorno de escritorio. Herramientas de configuración, barra de tareas, servicio de notificación, etc.

En este sentido, y dependiendo del tiling que he utilizado, he configurado herramientas como dunst para las notificaciones, diferentes barras de herramientas como swaybar, polybar, i3status-rs, así como otras.

También me ha hecho falta otras herramientas para completar la funcionalidad de un entorno de escritorio, como menú para salir del sistema, o para configurar alguna parte del sistema, o un lanzador de aplicaciones como rofi, o cuestiones similares.

La gran ventaja de todo esto es que hay decenas o centenares de herramientas y aplicaciones con la que hacer todo esto. Pero, esto también es un gran inconveniente, porque es necesario dedicar un tiempo a cada una de estas herramientas para tenerlo todo configurado. Claro, que también es una ventaja, porque lo puedes tener todo exactamente como tu quieres o necesitas.

Y entonces llegó Aylur’s Gtk Shell, y esto ha cambiado significativamente mi forma de ver las cosas.

La emoción

Todo esto surgió dos o tres semanas antes de la WordCamp Valencia 2023, y realmente, tuve que concentrarme mucho para no despistarme de mi objetivo, que era la charla sobre WordPress en Docker, que tienes disponible en WordPress.TV.

Sin embargo, tal fue la emoción al descubrir AGS, que nada mas llegar a la WordCamp fui directo al stand de Slimbook a hablarle a Alejandro sobre el descubrimiento. Así que ya te puedes imaginar.

Pero ¿A que se debe tanta emoción?. Pues sencillamente, AGS, puede cubrir muchas de las necesidades que hasta el momento yo estaba cubriendo con diferentes piezas. Es decir, que con AGS puedo tener todo lo que necesito para completar un tiling window manager y llevarlo al nivel de un verdadero entorno de escritorio.

AGS

Pero, ¿Que es AGS?. Pues, tal y como lo define el propio desarrollador de esta herramienta, se trata de una librería construida sobre GJS que te permite construir widgets GTK de forma declarativa.

Pero, no se queda en simplemente ofrecerte la posibilidad de crear widgets, sino que también te proporciona servicios y otra serie de utilidades, que te van a permitir interactuar con el sistema. Es decir, que vas a poder construir una serie de widgets que verdaderamente tienen funcionalidad.

GJS

Y ¿Que es GJS?. Sobre GJS ya te he hablado en mas de una ocasión, y de echo, tienes un completo tutorial de aplicaciones nativas en JavaScript con GJS.

Se trata de un runtime de JavaScript que está constituido sobre SpiderMonkey, el motor JavaScript de Firefox.

Utilizando GJS vas a poder desarrollar aplicaciones, widgets, incluso scripts, como ya te adelanté en el episodio anterior del podcast. Y sin necesidad de nada mas, simplemente sobre GJS.

EWW

No puedo dejar de mencionar eww, dado que AGS está fuertemente inspirado en EWW.

Elkowars Wacky Widgets es un sistema independiente de widgets implementado en Rust, y que te permite construir tus propios widgets en cualquier gestor de ventanas que utilices.

La cuestión es que con eww vas a poder construir desde la típica barra de herramientas, ya sea horizontal como vertical, el típico menú de salida, lanzadores de aplicaciones y mucho mas.

¿Porque AGS y no EWW?

Me imagino que te estarás preguntando, ¿porque AGS y no EWW? Y mas sabiendo que soy un ferviente enamorado de Rust.

No lo tengo muy claro, aunque pienso que algo que me ha atraído de AGS, es que está implementado en JavaScript, y que habiendo creado mis propios elementos en GJS me encuentro muy cerca. Ya conozco el ecosistema, se como funciona y tengo claro como puedo comenzar a crer ventanas, barras, lanzadores y widgets. Además, al estar desarrollado en JavaScript, le puedes dotar de vida propia de forma sencilla. Puedes interactuar con los widgets.

Sin embargo, en el caso de eww, no utiliza JavaScript para crear los widgets, sino que utiliza su propio lenguaje denominado yuck. Aquí me toca aprender algo nuevo. No es que no sea un lenguaje extremadamente complejo, pero, es una desventaja. Y por otro lado, está la interacción o las posibilidades de interacción que ofrece, que a mi me han parecido menores.

El resto de características, mas o menos son equivalentes, de echo, puedes utilizar css para darle un espectacular aspecto visual a cualquiera de las dos herramientas.

Profundizando en AGS

Tengo que decirte que AGS tiene una excelente wiki, que te va a facilitar enormemente ponerte con esta librería.

La instalación

La instalación es muy sencilla, mas si cabe en el caso de Arch, donde tan solo tienes que tirar de repositorios AUR, ejecutando la siguiente línea de terminal,

paru -S aylurs-gtk-shell-git

También tienes la opción de aylurs-gtk-shell, sin embargo, te recomiendo la versión git, para poder exprimirla al máximo, porque lo cierto, es que hay una actividad frenética en el repositorio de GitHub.

Para Ubuntu, tendrás que instalarla desde fuente… Esto ya es un pequeño inconveniente. Aunque supongo que no será nada complejo realmente.

La configuración

Una vez instalado, llegó el momento de crear tu primer widget, o simplemente copiarlo. Para ello, crea el archivo ~/.config/ags/config.js, y pon algo como,

import Widget from 'resource:///com/github/Aylur/ags/widget.js';

const myLabel = Widget.Label({
    label: 'some example content',
})

const myBar = Widget.Window({
    name: 'bar',
    anchor: ['top', 'left', 'right'],
    child: myLabel,
})

export default { windows: [myBar] }

Ya tienes tu primera barra de tareas, a partir de aquí solo te queda implementar y disfrutar.

Sobre los widgets

Actualmente tienes una gran cantidad de widgets disponibles para personalizar tu entorno de escritorio, desde ventanas, cajas botones, entradas, etiquetas, barras de progreso, menús y mucho mas.

Puedes combinar aquellos elementos como tu quieras para conseguir crear aquellos widgets o ventanas que necesites.

Sobre los servicios

Igualmente, y tal y como he indicado anteriormente, además de los widgets. Tienes servicios. Por ejemplo, servicios que te muestran todas las aplicaciones que tienes instaladas en tu equipo, con lo que puedes construir tu propio lanzador de aplicaciones.

También tienes otros servicios, para obtener información sobre la batería, interactuar con el audio, o la red, y mas. Y por supuesto, tienes para interactuar con las notificaciones o con la barra de indicadores.

Es mas, tiene un servicio para interactuar con Hyperland, miel sobre hojuelas. Le falta lo mismo para interactuar con Sway, pero, todo se andará.

Un detalle

Por último un detalle que me parece interesante y curioso. Todas las ventanas, barras, widgets y demás elementos, se cargan al inicio, y según tu hayas declarado, se mostrarán o no. Una vez iniciado, simplemente utilizando ags -t <nombre-del-elemento> lo mostrarás u ocultarás a voluntad.

De a pocos

Con lo que te he contado hasta el momento, ya te puedes imaginar que esto ha supuesto una completa revolución en mi entorno de escritorio. Pero, he tenido que levantar el pie del acelerador, para no quemarme.

Como ya te conté en un podcast anterior, estaba configurando y personalizando Hyperland de a pocos. Pero, la llegada de AGS, ha supuesto un nuevo aliciente, que tengo que compaginar con este primero.

Sin embargo, en la última actualización de Hyperland he notado un consumo de CPU excesivo, y he decidido, saltar temporalmente a Swayfx, mientras se soluciona. Pero, gracias a AGS, puedo construir, una solución que me valga para ambos, o casi, salvo algún que otro detalle.

Como te decía al inicio, ahora mismo, me encuentro reemplazando las distintas piezas de mi escritorio, la barra de herramientas, el lanzador de aplicaciones, el menú de salida. Pero no solo esto, sino que además estoy creando mis primeros widgets, para conseguir que mi entorno de trabajo sea todavía mas productivo.


Más información,

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *