Der Billig-Router hat sich aufgehängt, damit ist aus der Ferne auch kein Reset via Netzwerk mehr möglich. Einen Weg aus dem Dilemma gibt es dennoch: Ein X10-Modul, gesteuert von einem Web-GUI mit Ajax-Interface, betätigt den Hauptschalter.

Schwung mit CGI

Das CGI-Skript »myx10.cgi« (Listing 4) macht dann auch nicht viel mehr, als das Kommandozeilenskript »myx10« aufzurufen und dessen Ausgabe zurück zum Webclient zu senden. Es nutzt die Funktion »tap« des CPAN-Moduls »Sysadm::Install«, die einfach die Ausgaben eines Kommandos komfortabel abfängt.Wird »myx10.cgi« vom Browser allerdings ohne Device-Parameter aufgerufen, möchte der Webclient die in Abbildung 2 gezeigte Übersicht sehen.

01 #!/usr/bin/perl -w
02 use strict;
03 use CGI qw(:all);
04 use Log::Log4perl qw(:easy);
05 use YAML qw(LoadFile);
06 use Template;
07
08 print header();
09
10 my $action = param("action");
11 my $device = param("device");
12
13 if(!defined $device) {
14  my $devices = LoadFile("/etc/x10.conf");
15
16  my $tpl = Template->new();
17  $tpl->process("myx10.tmpl", {
18   devices => $devices,
19  } ) or die $tpl->error();
20  exit 0;
21 }
22
23 if(!defined $action or
24  $action !~ /^(on|off|status)$/) {
25  print "Error: No/Invalid actionn";
26  exit 0;
27 }
28
29 if(!defined $device or $device =~ /W/) {
30  print "Error: use a proper 'device'n";
31  exit 0;
32 }
33
34 system "sudo", "/usr/bin/myx10",
35    $device, param("action");

Hierzu lädt »myx10.cgi« die X10-Konfigurationsdatei und ruft anschließend den Prozessor des Template-Toolkits auf, um das Template »myx10.tmpl« zu rendern (Abbildung 3). Dort sorgt eine Foreach-Schleife dafür, dass für jedes konfigurierte Gerät eine Tabellenspalte mit Druckknopf entsteht.

Abbildung 3: Das CGI rendert mit Hilfe eines Template-Prozessors diese Vorlage für die Anzeige der Statusübersicht.

Die »onClick«-Aktion eines jeden Buttons ruft die später in »myx10.js« (Abbildung 4) definierte Funktion »toggle()« auf, die nicht nur die Kommunikation mit dem Server abwickelt, sondern auch die Farbe des Buttons anpasst. Die »id« jedes Buttons setzt »myx10.js« auf das Gerätekürzel, die Klasse »class« auf den zufälligen Namen »clicker«, damit eine Javascript-Funktion anschließend über alle derartigen Elemente iterieren kann.

Abbildung 4: Dieser Javascript-Code ist unter anderem für das Update der Status-Buttons in der Webübersicht verantwortlich.

YUI

Moderne Webapplikationen laden nicht mehr die ganze Seite nach, wenn der Surfer nur ein Knöpferl drückt. Die Kommunikation mit dem Webserver findet asynchron über Ajax statt, nur tatsächlich veränderte Elemente zeichnet der Browser neu [3]. Da Ajax aber recht umständlich zu programmieren ist und exzessiver Javascript-Gebrauch bekanntlich Haarausfall verursacht, gibt es etliche Javascript-Bibliotheken, die die Handhabung vereinfachen und Browserkompatibilität gewährleisten.

Ein Beispiel ist die YUI-Library meines Arbeitgebers Yahoo, die kostenlos und ohne Registrierungspflicht verfügbar ist. Auf [2] liegt eine Zip-Datei, die im Verzeichnis »build« alle notwendigen Javascript-Dateien enthält.

Nach dem Download entpackt man einfach das Zip-Archiv und kopiert das »build«-Verzeichnis zum Beispiel unter »htdocs/yui« auf den lokalen Webserver. Ab dann können Javascript-Applikationen die ».js«-Dateien zum Beispiel als »src=/yui/yahoo/yahoo.js« einbinden.

Der Billig-Router hat sich aufgehängt, damit ist aus der Ferne auch kein Reset via Netzwerk mehr möglich. Einen Weg aus dem Dilemma gibt es dennoch: Ein X10-Modul, gesteuert von einem Web-GUI mit Ajax-Interface, betätigt den Hauptschalter.