Darstellung eine Animation mit mehreren Mediaimages

Moin Chris,

ich habe alles mögliche ausprobiert um den Rand wegzubekommen - gelungen ist es mir allerdings nicht :frowning: Wenn man die html Box Größe exakt auf die Bildgröße einstellt, dann bekommt man Scroll Leisten :mad: Es könnte aber auch an meinen nicht sehr umfangreichen hmtl Kenntnissen liegen.

Anbei ein Screenshot. Lediglich das png-Unwetterbild rechts unten wird ohne Rand dargestellt.

Unwetterbild png 500 x625

<img src='user/DWD/Unwetterbild.png' style='height: 96%; width: 78%; object-fit: fill;' />

Temperaturbild und Radarbild jpg 540 x 500

 <img src='user/DWD/Radarbild.jpg' style='height: 96%; width: 100%; object-fit: fill;' />
<img src='user/DWD/Temperaturbild.jpg' style='height: 96%; width: 100%; object-fit: fill;' />

Radarfilm links oben gif 540 x 500

<img src='user/DWD/Radarfilm.gif' style='height: 96%; width: 100%; object-fit: fill;' />

Wie gesagt gilt dies nur für den Windows Client. Bei IOS nehme ich die Bilder direkt aus der URL :slight_smile:

Gruß
Hans

Hallo,

ergänzend möchte ich noch auf diesen Thread hinweisen aktueller Win 10 Client entwickelt massiven Resourcen Bedarf an Speicher und CPU der zeigt, dass IPSView einen massiven Speicherbedarf entwickelt, selbst wenn man die Bilder unter Windows von der Festplatte lädt.

Also insgesamt betrachtet wird das wohl erst dann perfekt funktionieren, wenn Andreas dort eine neue Komponente gefunden hat :slight_smile:

Gruß
Hans

rechts und unten lassen sich durch die Größe beeinflussen - aber oben und links nicht

So, Teil eins der Aufgabenstellung findet sich hier :D.

Angelehnt an die andere Diskussion bezüglich „niederschlagsradar aktualisiert sich nicht“, hier die Anpassungen zur Ablage der Datei im user-Ordner und entsprechendes Anlegen einen String Variablen mit HTML Code, die in IPSview als HTMLbox eingebunden werden kann.

Da ich unterschiedliche Auflösungen auf meinen Endgeräten habe, aber meistens die gleiche View nutze, funktioniert das Resizen (Modul IPSView Resize) eines „externen“ Images natürlich nicht.

Deshalb nutze ich die Style Tags und passe das Bilder somit selber an die richtige Größe an.

Zusätzliche bzw. komische Ränder sehe ich bei mir nicht, solange das Resize mit gleichen Skalierungen erfolgt. Sonst rechnet das Modul die HTMLbox um und das Bild passt dann eventuell nicht komplett rein.


<?

$debug = false;

//Auf 5 Minuten Takt Synchronisieren
$offset = (integer)date("s") + ((integer)date("i") % 5) * 60;

// Script Tmer entsprechend setzen bzw. anpassen
if($offset != 0) {
   IPS_SetScriptTimer($_IPS['SELF'],300 - $offset);
} else {
    IPS_SetScriptTimer($_IPS['SELF'],300);
}

//Zeit berechnen
$minute=Floor(date("i") / 5) * 5 - 10;
$dateline=mktime(date("H"), $minute, 0, date("m"), date("d"), date("y"));

$year=gmdate("Y", $dateline);
$month=gmdate("m", $dateline);
$day=gmdate("d", $dateline);
$time=gmdate("Hi", $dateline);

if ($debug)
   echo IPS_GetName($_IPS['SELF']), " Zeit: ".$year." ".$month." ".$day." ".$time."

";

// Animiertes DWD Image zur Anzeige holen
$remoteImage = 'https://www.niederschlagsradar.de/image.ashx?type=blitz&jaar=&regio=homepage&tijdid='.$year.$month.$day.$time.'&time=&bliksem=0';
$filepath = 'user/dwd_regenradar_ani.gif';   
$localImage = IPS_GetKernelDir().'webfront/'.$filepath;

if (!readURLwriteLOCAL($remoteImage, $localImage))
	echo "Fehler beim holen von dwd_regenradar_ani.gif";

// HTML code 
// img { width: 100%; height: auto }


$content = '
<html>
<head>
<style type="text/css" media="screen">
body  { font-family: Arial; margin:0; padding:0; background-color:black; }
img {   width: 100%; height: auto } 
</style>
</head>
<body scroll="no">
<img src="'.$filepath.'">
</body>
</html>';

// Anlegen eines neuen Links mit dem Namen, wenn noch nicht vorhanden
$VariablenID = @IPS_GetVariableIDByName("dwd_regenradar_ani", $_IPS['SELF']);
if ($VariablenID === false) {
	$VariablenID = IPS_CreateVariable(3);
	IPS_SetName($VariablenID, "dwd_regenradar_ani"); // Variable benennen
	IPS_SetParent($VariablenID, $_IPS['SELF']); // Variable einsortieren unter dem Script
	SetValueString( $VariablenID, $content);
} else {
	SetValueString( $VariablenID, $content);
}







function readURLwriteLOCAL($remoteImage, $localImage) {
  	$error = false;
	$ch = curl_init($remoteImage);
	if ($ch === false) { // fehlgeschlagen
		return false;
	} else { // erfolgreich, curl handle
		curl_setopt($ch, CURLOPT_USERAGENT, "Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.111 Safari/537.36");;
		curl_setopt($ch, CURLOPT_HEADER, 0);
		curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
		$remoteImage = curl_exec($ch);
		if (curl_errno($ch)) { // curl Fehler aufgetreten
       	echo curl_error($ch);
       	$error = true;
		 }
		curl_close($ch);
		if (!$error) { // curl read erfolgreich, Datei schreiben
			$result = file_put_contents($localImage, $remoteImage);
			if ($result === false) {
			   echo "Fehler beim Schreiben: ".$localImage;
	       	return false;
			} else {
				return true;
			}
		}
	}
}

?>

Der HTML Inhalt lässt sich auch ins WebFront einbinden, zerlegt in dieser Form aber den Inhalt. Dafür müsste der HTML Code etwas reduziert werden und nicht der img Tag genutzt werden sondern ein eigenes div.

Moin Ralf,

zunächst einmal vielen Dank für den Tipp mit dem Aufbau der Variablen $content. Nachdem ich diese bei mir eingetragen habe sind die Ränder weg :wink: Dann hat sich meine Vermutung, dass meine html Kenntnisse nicht ausreichend sind, ja bestätigt :slight_smile:

Der übrige Aufbau entspricht auch meiner Vorgehensweise mit dem Download und den zyklischen Updates der Bilder. Mich würde noch interessieren, ob du bei dem Windows Client ebenfalls den hier aktueller Win 10 Client entwickelt massiven Resourcen Bedarf an Speicher und CPU beschriebenen Resourcenhunger feststellen kannst. Ich mache es jetzt einfach so, dass ich jeden Morgen IPSView einmal neu automatisch beende und neu starte. Da mein NUC 8 GB hat stellt es insgesamt kein großes Problem dar.

Gruß
Hans

Speicher und CPU ist mir bisher nicht aufgefallen.

Ich nutze relativ viele HTMLboxen, der Desktop läuft nicht so lange, das Windows Tablet ist aber permanent an.

Probleme habe ich nur mit meiner Kamera und Stream in IPSview unter Android. 3-5 Aufrufe des Kamera-Fensters und IPSview verreckt.

Hallo Ralf,

bei mir läuft IPSView zusammen mit IPS auf dem NUC rund um die Uhr und lediglich der Touchscreen wird dunkel geschaltet.

Vielleicht findet Andreas ja bei Gelegenheit eine neue Komponente, so dass die Probleme gefixt werden können. Auch einheitliche Darstellungen für die Slider für ALLE Clients wären wünschenswert :slight_smile:

Gruß
Hans