Tip: Webradio-py Funktionalität unendlich erweitern mit Wischgesten

Wischgesten? Auf meinem Webradio? geht das denn?

Ja, das geht. Und auch noch recht einfach. Grundsätzlich lässt sich jede Touchscreen-Anwendung auf dem Raspberry Pi mittels dieser Anleitung erweitern um so mehr Funktionen in eine laufende Anwendung zu packen ohne ständig Befehle über eine Tastatur oder Maus eingeben zu müssen…

Im laufenden Betrieb sieht das Ganze so aus:

Wischgesten erweitern webradio-py um einen Google-Calendar

Wenn auf dem Display “nach rechts” gewischt wird, erscheint eine Ansicht meines Google-Calendars, wenn ich wieder “nach links” wische, erscheint wieder mein Webradio. Beide Anwendungen laufen parallel auf sog. “virtuellen Desktops”.

Was benötige ich dazu?

Ich verwende hierzu eigentlich nur 2 zusätzliche Anwendungen.

  1. “easy-stroke” für die Konfiguration und Erkennung der Wischgesten
  2. “wmctrl” für die Erstellung und Verwaltung der virtuellen Desktops

1. Installation von “wmctrl”

Die Installation von wmctrl ist denkbar einfach und funktioniert über die Standard-Repositories von Raspbian mittels:

sudo apt install wmctrl

2. Installation von “easy-stroke”

Die Installation von “easy-stroke” gestaltet sich leider schon etwas schwieriger. Anders als wmctrl ist easy-stroke leider kein Bestandteil (mehr) der Standard-Repositories für Rasbian und müsste somit separat heruntergeladen / kompiliert und installiert werden so wie hier beschrieben.

Um dies zu vereinfachen, habe ich für die Hardware-Plattform “armhf”, also den “Raspberry-Pi” eine vorkompilierte Version zur leichteren Installation erstellt, die bereits alle Abhängigkeiten mitbringt.

Zur Installation, kannst du entweder mein Github-Repository nach dieser kurzen Anleitung als Paketquelle in dein Raspbian einbinden und folgendes Paket installieren:

sudo apt install easystroke-patched

oder das Programm einfach als fertiges Deb-Paket herunterladen und installieren mittels:

sudo apt install ./easystroke-patched_0.6.0_armhf.deb

3. Einrichtung mehrerer Desktops und automatischer Start von Programmen

Als erstes, legen wir uns einen Starter (*.desktop) in unserem Autostart-Ordner unter ~/.config/autostart/ an. (Wenn der Ordner noch nicht existiert, kannst du diesen einfach erstellen).

mkdir -p ~/.config/autostart && touch ~/.config/autostart/start_sequence.desktop

Öffne die Datei zum editieren mit dem Editor deiner Wahl, und schreibe folgenden Inhalt hinein:

[Desktop Entry]
Type=Application
Name=startup
Exec=/home/pi/bin/wmscript
Terminal=true

Nun benötigen wir noch das Start-Script selbst, das wir in unserem Home-Ordner unter ~/bin/wmscript erstellen.

mkdir ~/bin && touch ~/bin/wmscript

Öffne die Datei wieder zum Editieren und füge diesmal folgenden Inhalt ein, welchen ich verwendet habe um oben gezeigtes Verhalten her zu stellen. Dieser lässt sich natürlich nach belieben erweitern und ändern! Aber hier mal das Beispiel:

#!/bin/bash

#create 2 virtual desktops
sleep 5
wmctrl -n 2

# If Chrome crashes (usually due to rebooting), clear the crash flag so we don't have the annoying warning bar
sed -i 's/"exited_cleanly":false/"exited_cleanly":true/' /home/pi/.config/chromium/Default/Preferences
sed -i 's/"exit_type":"Crashed"/"exit_type":"Normal"/' /home/pi/.config/chromium/Default/Preferences

# start chromium (on desktop 0), where webradio is running
chromium-browser --kiosk /home/pi/calendar.html &

# keep webradio on top while chromium is launching
i="0"
while [ $i -lt 15 ]
do
sleep 1
wmctrl -a Form  #focus webradio every second
i=$[$i+1]
done

# we think that 15 seconds should be enough for chromium to start...

#move chromium to second desktop, but leave the focus to webradio-py
wmctrl -r "calendarpi - Chromium" -t 1

exit 0

Das Script sollte sich durch die hinterlegten Kommentare eigentlich selbst erklären. Im Groben ist der Ablauf folgender:

  1. Erzeuge einen weiteren Desktop mittels wmctrl -n 2
  2. Lösche etwaige Fehlermeldungen der letzten Sitzung, ansonsten erscheint bei jeder neuen Sitzung von Chrome, dass dieser “nicht ordnungsgemäß beendet wurde” und will die letzten Tabs “Wiederherstellen” … das wollen wir nicht.
  3. Starte Chromium im sog. “kiosk-Modus” (fullscreen) und lade eine html-Datei welche lokal auf unserem Pi liegt (welche wir später noch erstellen)
  4. Für 15 Sekunden, fokussiere das Webradio-py Fenster, und zwar jedes Sekunde. Das bewirkt, dass wir höchstens einmal ein kurzes, weißes Flackern bemerken, wenn chromium startet, und sich das Chromium-Fenster nicht einfach über das Webradio legt, was wir ja nicht wollen.
  5. nach 15 Sekunden, verschieben wir das Chromium-Fenster auf den 2ten virtuellen Desktop, ohne jedoch den Fokus von webradio.py ab zu wenden.

Um in Chromium auch noch etwas angezeigt zu bekommen, habe ich mich erst einmal für eine Web-Ansicht meines Google-Calendars entschieden. Dies ist eigentlich auch ganz einfach, setzt jedoch voraus, dass du einen Google-Account besitzt.

Du gehst zur Webseite : https://www.google.com/calendar/embedhelper?ctz=Europe/Helsinki und loggst dich ggf. hier mit einem Google-Account ein. Nun kannst du dir eine gewünschte Ansicht “zusammenklicken” in dem du die Felder und Regler links entsprechend anpasst.

Wenn du fertig bist, kannst du den HTML-Code der oben im Fenster steht kopieren (iframe src= …. ) und in folgendes Template einfügen:

<!doctype html>
<html class="no-js" lang="">
    <head>
        <meta charset="utf-8">
        <title>calendarpi</title>
    </head>
    <body>
        <!-- Nach dieser Zeile kommt dein kopierter code -->
        
        <script>
          window.setTimeout(function () {
            location.reload(); // will reload the page every 10 minutes
          }, 600000);
        </script>
    </body>
</html>

Anschließend speicherst du alles in der Datei die wir oben mittels Chromium laden wollten (/home/pi/calendar.html).

Wenn du deinen Pi nun neu startest, sollte eigentlich alles schon mal soweit funktionieren! Nach deinem Webradio, sollte Chromium geladen werden, nach 15 Sekunden auf den virtuellen Desktop 2 verschoben werden und sollte deinen Kalender anzeigen.

4. Einrichtung der Wischgesten, um zwischen den virtuellen Desktops zu wechseln

Um nun jeweils auf den anderen Desktop zu wechseln, müsstest du nun ein Terminal öffnen und folgendes eingeben:

wmctrl -s 1  #um auf den zweitn Desktop zu schalten oder
wmctrl -s 0  #um wieder auf den ersten Desktop zu schalten 

Will man “nur” 2 virtuelle Desktops benutzen, funktioniert dies grundsätzlich schon. Hiermit könnte man nun “easy-stroke” konfigurieren und die jeweiligen Gesten und Befehle aufnehmen.

Ein Problem bekommt man erst, wenn man 3 oder mehr Desktops möchte und dynamisch (wie bei einem Smartphone) von einem zum nächsten wischen will. Hierzu habe ich mir 2 Helfer-Scripte geschrieben, welche ich unter dem jeweiligen Namen unter /usr/local/bin abgelegt habe und ausführbar machte. (move_left, und move_right)

#!/bin/sh

#/usr/local/bin/move_left

WM=$(which wmctrl);[ -z "$WM" ] && echo MISSING wmctrl && exit 1
CURRENT=$(wmctrl -d | grep '*' | cut -c1)

WSN=$(expr $CURRENT - 1)
# Switch to desired workspace
$WM -s $WSN
exit 0

und

#!/bin/sh

#/usr/local/bin/move_right

WM=$(which wmctrl);[ -z "$WM" ] && echo MISSING wmctrl && exit 1
CURRENT=$(wmctrl -d | grep '*' | cut -c1)

WSN=$(expr $CURRENT + 1)
# Switch to desired workspace
$WM -s $WSN
exit 0

Diese Scripte “errechnen” den jeweils “links” bzw. “rechts” liegenden virtuellen Desktop. Wodurch es nun auch möglich wird mehrere Desktops an zu legen und an zu steuern.

Mit diesen Befehlen, habe ich nun mittels Easy-Stroke meine Wischgesten Konfiguriert:

Easy-Stroke befindet sich im Star-Menü unter “Barrierefreiheit”
Unter Verhalten, muss die “Gesten-Maustaste” auf Maustaste 1 stehen! Hier kannst du auch den Autostart aktivieren.
Nachdem du “Aktion hinzufügen” geklickst hast, wirst du aufgefordert eine Namen, einen Befehl und eine “Geste” auf zu nehmen bzw. fest zu legen.

Wichtig: Wischgesten, lassen sich NUR mit tatsächlich angeschlossener Hardware am Pi einstellen! Also einer Maus, oder einem Touchpad. Über VNC funktioniert dies nicht, da dies nur ein “virtuelles” Eingabegerät darstellt.

Sobald du eine Gesten konfiguriert hast, lassen sich diese auch gleich testen!

Viel Erfolg!

Matthias

2 Kommentare

  1. Hallo hab es ausprobiert funktioniert 👍

    Wollte jetzt noch einen 3 desktop hinzufügen das funktioniert auch hab nur das Problem das ich dort auch noch einen chromium Browser benötige.
    Leider öffnet er aber immer nur einen Browser.
    Wie muss ich das Schreiben das ich auf desktop 2 einen Chromium Browser öffnet und auf desktop 3 ein weiterer Chromium Browser öffnet.
    Kannst du mir helfen ?

    1. Hallo Flo, wenn man dem terminal-Programm “chromium-browser” mehere Argumente (Seiten) übergibt, würde er diese Argumente als “Tabs” öffnen. Da du allerdings im “Kiosk-Mode” unterwegs bist, wird er einfach den einen Tab durch den anderen ersetzen.
      Du musst daher ein neues Chromium-Fenster öffnen… dies kannst du mittels “–new-window” bewerkstelligen. (z.B. chromium-browser --new-window http://www.google.de &) je nachdem, wie das Fenster dann heißt, (dies kannst du mittels wmctrl -l herausfinden) kannst du dieses nach einer bestimmten Ladezeit auf den 3ten Desktop verschieben. (wmctrl -r "google - Chromium" -t 2)

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahre mehr darüber, wie deine Kommentardaten verarbeitet werden.