FTUI Beispiel Mondphase
Die aktuelle Mondphase soll in FHEM Tablet UI V2 als Bild angezeigt werden.
Vektorgrafik
Zunächst wird das FHEM-Device Astro definiert, im nachfolgenden Beispiel unter dem Namen SonneMond:
defmod SonneMond Astro
attr SonneMond icon weather_moon_phases_8
attr SonneMond stateFormat Mondphase: MoonPhaseN
Eine im Astro-Device erzeugte SVG-Datei kann in FTUI eingebunden werden (xxx.yyy.zzz.aa an die lokalen Gegebenheiten anpassen); Farben und Größe sind frei wählbar:
<div data-type="image"
data-url="http://xxx.yyy.zzz.aa:8083/fhem/Astro_moonwidget?name=SonneMond&mooncolor=grey&moonshadow=black&size=100x100">
</div>
Pixelgrafik
Unter Inkaufnahme größeren Datenvolumens lassen sich auch wirklichkeitsnahe Bilder einbinden. Hierzu wird zunächst eine Sammlung von 100 Phasenbildern im Verzeichnis /opt/fhem/www/images/phasenbilder gespeichert. Die Bilder holt man sich aus Phasenbilder.
Das FHEM-Device Astro wird um ein Userreading (hier Mondbild genannt) erweitert:
defmod SonneMond Astro
attr SonneMond icon weather_moon_phases_8
attr SonneMond stateFormat Mondphase: MoonPhaseN
attr SonneMond userReadings Mondbild {moon_pics("myAstro")}
In 99_myUtils.pm hinterlegt man eine Funktion, welche das Userreading füllt:
#-- Moon picture
sub myUtils_Astro_Initialize($$)
{
my ($hash) = @_;
}
sub moon_pics($)
{
my ($name) = @_;
my $picNo = ReadingsVal("SonneMond","MoonAge",0);
my $picOrd = "/fhem/www/images/phasenbilder/";
my $picPath = "";
if( $picNo < 180 ){
$picNo = int($picNo/180*49+51);
}else{
$picNo = int(($picNo/180-1)*49+1);
}
$picPath = $picOrd.$picNo.".png";
return $picPath
}
sub Moon_to_html($)
{
my($hash) = @_;
$hash = $defs{$hash} if( ref($hash) ne 'HASH' );
return undef if( !$hash );
my $name = $hash->{NAME};
my $scale = "100";
my $state = $hash->{STATE};
my $pathToPictures = ReadingsVal("SonneMond", "Mondbild", "");
my $ret;
$ret .= "<div style='width:".$scale."px; text-align: center;'>";
$ret .= "<img src='$pathToPictures$\' width='$scale' height='$scale'>";
$ret .= "</div>";
$hash->{fhem}->{cached} = $ret;
return $ret;
}
1;
Die Einbindung in FTUI erfolgt über das Image-Widget, ergänzt um Label:
<div data-type="image" data-device="SonneMond" data-get="Mondbild"></div>
<div data-type="label" data-get="SonneMond:MoonPhaseS" data-color="#8C8C8C"></div>
Hinweise
Die beschriebenen Vorgehensweisen sind Beiträgen im Forum entnommen. Dort werden auch weitere Optionen, z.B. zur Reduzierung des Datenvolumens diskutiert.