Shell Script e Ícones Dinâmicos na Área de Notificação

Ok, você já sabe como fazer um Shell Script. Você até se sente feliz com aquela saída textual... Você precisa voltar ao terminal toda vez que quer saber do status daquele script mais demorado, mas isso não é um problema. Isso não é chato, mas... mas e se seu script pudesse representar informações graficamente? E se seu script pudesse apresentar essa informação na área de notificação? Ah... seria massa!

Mas se você está acostumado a escrever Shell Scripts, então você já leu sobre Zenity ou já usou essa ferramenta em algum momento. Com Zenity podemos adicionar interfaces gráficas simples a Shell Scripts e torna-las virtualmente independentes da interface textual do terminal (claro... com outras limitações). E é a Zenity quem vai colocar nossas informações gráficas na área de notificação, seja GNOME, KDE, XFCE ou outro gerenciador de desktop que implemente a área de notificação padrão.

Você não sabe o que é Zenity? Garanto que vai gostar de saber o que ela pode fazer por você. Para dar uma lida na ajuda da Zenity, execute o comando:

$ zenity --help

Faça isso, eu espero aqui.

Não vou tratar das possibilidades e detalhes da Zenity agora, então, vamos seguir adiante. Tente o seguinte:

$ zenity --notification --listen

Notou que apareceu um ícone de alerta na área de notificação? Podemos muda-lo. O argumento --listen faz com que a Zenity, no modo notificação, fique na espera de comandos na entrada padrão. Então agora escreva:

icon:/usr/share/icons/gnome/scalable/emotes/face-smile.svg

icon é um dos comandos aceitos para modificar a notificação e como argumento espera o caminho para uma imagem qualquer, seja jpg, png, svg ou outros formatos suportados pela GTK. Eu prefiro trabalhar com SVG para manter a independência da resolução, já que o tamanho da área de notificação é definido pelo usuário.

Já vimos como colocar ícones na área de notificação e como modifica-los. Vamos ver o mais interessante: Como criar ícones com Shell Script para, então, apresenta-los.

Podemos criar imagens “do nada” ou manipular imagens existentes para apresentar suas derivações. Os caminhos mais interessantes para criação (na minha perspectiva) seriam:

• Escrever um SVG;
• Usar o ImageMagick;
• Escrever um arquivo XPM.

O código SVG é um XML, portanto, para um SVG simples, qualquer método para criar automaticamente um arquivo de texto é suficiente: Nesse exemplo criamos um ícone informando o dia da semana e quanto dela já passou:

echo "<svg width='30' height='30'> 
<rect x='0' y='0' width='30' height='30' fill='#46A' /> 
<rect x='0' y='$(( 30 - ( $(date +%u)*30 / 7 ) ))' 
      width='30' height='$(( $(date +%u)*30 / 7 ))' fill='#09E' /> 
<text x='15' y='20' fill='#FFF' 
      style='font-size:12px; font-family:sans-serif; font-weight:bold; 
             letter-spacing:-1; text-anchor:middle; text-align:center'> 
        $(date +%a)</text> 
</svg>" > /tmp/dia-da-semana.svg
zenity --notification --window-icon=/tmp/dia-da-semana.svg

Sim, o parâmetro --window-icon já predefine o ícone da notificação. É suficiente para o exemplo.

Criar imagens com ImageMagick é interessante, mas não vai dar tempo. Vamos deixar essa para outro dia...

Escrever um arquivo XPM? Isso é pré-histórico! Mas ainda é uma forma interessante de criar pequenos bitmaps na boa perspectiva do pixel-art. Veja aí um exemplo de conteúdo de um arquivo XPM:

/* XPM */
static char * sorriso_xpm[] = { 
"20 20 2 1", 
" 	c None", 
"#	c black", 
"                    ", 
"                    ", 
"                    ", 
"                    ", 
"                    ", 
"       ##  ##       ", 
"       ##  ##       ", 
"       ##  ##       ", 
"       ##  ##       ", 
"       ##  ##       ", 
"   #            #   ", 
"   #            #   ", 
"   ##          ##   ", 
"    ###      ###    ", 
"     ##########     ", 
"      ########      ", 
"                    ", 
"                    ", 
"                    ", 
"                    "};

Da mesma forma que parametrizamos a criação do SVG, podemos parametrizar a criação do XPM, redefinindo cores e pixels pintados. Use a imaginação e divirta-se!

Os caminhos mais interessantes para derivação de uma imagem, seriam:

• Transcrever código SVG com sed;
• Modificar um SVG com XMLStarlet;
• Manipular bitmaps (png, jpg...) com ImageMagick.

Não vai dar para falar do XMLStarlet e do ImageMagick agora, vamos aproveitar para criar uma aplicação mais próxima do mundo real com o sed como a grande estrela. Que tal um gráfico dinâmico mostrando quanto do processador é usado pela aplicação que mais o ocupa? Vamos lá...

#!/bin/bash

tmp_dir=$( mktemp -d )

echo '<svg width="30" height="30">
<defs>
  <marker id="bola" refX="0.0" refY="0.0" style="overflow:visible">
    <circle cx="0" cy="0" r="1.5" fill="#048" />
  </marker>
</defs>
<rect x="0" y="0" ry="5" width="30" height="30" fill="#69B" />
<path d="M 0,20 L 5,19 L 10,18 L 15,17 L 20,16 L 25,15 L 30,14"
      style="marker-start:url(#bola); marker-end:url(#bola);
             marker-mid:url(#bola); stroke:#259; stroke-width:2; fill:none" />
</svg>' > $tmp_dir/orig.svg

v[0]=300; v[1]=300; v[2]=300; v[3]=300; v[4]=300; v[5]=300; v[6]=300
while true; do
  # pega dados do processo com maior uso do processador:
  prog=" $( top -b -n1 | head -n8 | tail -n1 )"
  # pega o uso do processador e nome do processo que mais o ocupa:
  prog_proc=$( echo $prog | cut -d' ' -f9 )
  prog_nome=$( echo $prog | cut -d' ' -f12 )
  for i in 0 1 2 3 4 5; do v[$i]=${v[$(($i+1))]}; done
  v[6]=$( echo "30 - ( ($prog_proc/90) * 30 )" | bc -l )
  d="M  0,${v[0]} L  5,${v[1]} L 10,${v[2]} L 15,${v[3]}"
  d="$d L 20,${v[4]} L 25,${v[5]} L 30,${v[6]}"
  sed -r "s/ d=\".*\"/ d='$d'/" $tmp_dir/orig.svg > $tmp_dir/ico.svg
  echo "tooltip:$prog_nome ocupa $prog_proc% do processador"
  echo "icon:$tmp_dir/ico.svg"
  sleep 2
done |
zenity --notification --listen

rm -r $tmp_dir

Sim, o SVG não precisava ser criado pelo script, isso foi feito apenas para não separar o exemplo, mas também pode ser útil em um script para o mundo real, caso não seja muito complexo. O sed, quem atualiza o ícone, apenas substitui o atributo d, que ocorre apenas uma vez no SVG do exemplo. Depois de gerar o ícone, informamos à Zenity para que o recarregue e ainda atualizamos o tooltip para que o usuário tenha acesso a mais informações caso tenha interesse.

Bom, não tenho mais tempo, podemos aprofundar os assuntos que apenas foram citados em outra oportunidade, mas quais? Vou esperar pelos pedidos...