New FHEM Tablet UI

[idansch]

Warum nimmst du eigentlich nicht das aktuelle "Live-Bild"?
Ich lasse mir das aktuelle Live-Bild einblenden und kann zudem die Kamera sogar steuern.

Ich habe 3 Cams die dann ständig laufen. Drückt das nicht auf die Leistung? Wollte mein System nicht unnötig belasten. Die Steuerung ist
nicht notwendig. Bei Bedarf hätte ich da die entsprechende APP.

Ein Bild in bestimmten Abständen zu holen und später zusätzlich noch bei "Alarm" (Bewegung) ein zusätzliches  Bild einzublenden, halte ich für mich für die bessere Lösung.
Sollte doch laut Beschreibung gehen?

[nesges]

Gibt es eine Lösung für dieses "Problem"?

Wie im Nachbarthread bemerkt vermute ich, dass es ein Cache-Problem ist. Versuch bitte einmal die Version von widget_image.js im Anhang dieses Posts und ergänze den Parameter data-nocache="true" im HTML-Code des Widgets. Wenn's damit funktioniert sende ich einen Pullrequest für die Änderung.

[tomster]

Mit Deiner Version bekomme ich bei gesetztem <data-nocache="true"> gar kein Bild mehr angezeigt.
Ohne schon; allerdings weiterhin ohne refresh...
Werde morgen nochmal weiter testen.

--edit--
Doch schon ein refresh. Allerdings das erste Mal nach 60 secs, nicht nach 30, wie definiert. Weitere refreshs pending..

[tomster]

Muss das eigentlich so kompliziert sein, fragt der Coding-Laie?

Ich hab bei mir auf einer anderen Web-Site eigentlich nur:

Code Auswählen Erweitern


jQuery(window).load (function(){
                        WebcamRefresh();
                        setInterval('WebcamRefresh()', 600000); // milliseconds
                          });
function WebcamRefresh(){
                        d =new Date();
                        jQuery("#camera1").attr('src', 'data/webcam.jpg'+'?'+d.getTime());
                        }
und weiter unten dann

Code Auswählen Erweitern


<img class="magnify" height="188" id="camera1" src="data/webcam.jpg" width="334" />
im Code stehen. Funzt...

--edit--
Ach ja, 2-geteilt, nur weil ich Webcam_Refresh zusätzlich auch manuell auslösen kann/möchte.

[setstate]

Das Image Update Problem konnte ich lösen.
Beispiel zur Nutzung

Code Auswählen Erweitern


<div data-type="image"
     data-size="95%"
     data-url="http://vusolo2/grab?format=jpg"
     data-refresh="5">
</div>


[tomster]

Funzt!

Wenn man das nun durch Klick noch vergrößern könnte, dann wär's perfekt!

[idansch]

Sorry aber ...

Das Image Update Problem konnte ich lösen. 

bei mir geht es immer noch nicht. Ich habe immer nur ein Bild und zwar das was bei ersten mal aufgerufen wurde. Kein Refresh!

Code Auswählen Erweitern

<div data-type="image"
     data-size="95%"
     data-url="http://192.168.109.27/tmpfs/snap.jpg?usr=xxx&pwd=xxx&resolution=64&rate=0"
data-refresh="5">
</div>

Was hast du genau geändert. Update habe ich heute durchgeführt.

[tomster]

Hast Du als Pfad auch schon Mal

Code Auswählen Erweitern


data-url="http://user:password@192.168.109.27/tmpfs/snap.jpg"

ausprobiert?

[nesges]

Das Image Update Problem konnte ich lösen.

Ein Anchor mit Timestamp wird keinen Cache-Refresh auslösen, soweit ich weiss. Es muss schon ein Query-Parameter sein. JQuery.ajax() nutzt dazu übrigens auch _=Timestamp:

Note: Setting cache to false will only work correctly with HEAD and GET requests. It works by appending "_={timestamp}" to the GET parameters.

Muss das eigentlich so kompliziert sein, fragt der Coding-Laie?

Ja Deine Lösung funktioniert zB mit http://host/script?imgid=12345 nicht. Meine Lösung fängt einige Standardfälle ab, ist aber auch noch nicht vollkommen allgemeingültig - d.h.: noch längst nicht kompliziert genug.

@idansch: Hast du meine Lösung getestet?

[idansch]

@idansch: Hast du meine Lösung getestet?

Habe ich eben. Das Bild wird jetzt durch einen "Platzhalter" angezeigt. Man kann aber erkennen das er alle x Sekunden das Bild versucht neu aufzurufen.
Sieht aus als ob er den Pfad nicht findet?

Code Auswählen Erweitern

<div data-type="image" data-size="95%" data-nocache="true" data-url="http://192.168.109.27/tmpfs/snap.jpg?usr=xxx&amp;pwd=xxx&amp;resolution=64&amp;rate=0" data-refresh="5">
<img alt="img" src="?_=1435225122770?_=1435225117754?_=1435225112723?_=1435225107697?_=1435225102686?_=1435225097663?_=1435225092654?_=1435225087648?_=1435225082638?_=1435225077628?_=1435225072617?_=1435225067602?_=1435225062577http://192.168.109.27/tmpfs/snap.jpg?usr=xxx&amp;pwd=xxx&amp;resolution=64&amp;rate=0" style="opacity: 0.8; height: auto; width: 100%; max-width: 95%;"></div>

[nesges]

Blöder Fehler von mir.. häng mal noch ein # an den URL, also: http://192.168.109.27/tmpfs/snap.jpg?usr=xxx&amp;pwd=xxx&amp;resolution=64&amp;rate=0#

[idansch]

Ja, so geht es!

Habe dein widget_image eigefügt,
data-nocache="true" in html und die # angehangen.

http://192.168.109.27/tmpfs/snap.jpg?usr=xxx&amp;pwd=xxx&amp;resolution=64&amp;rate=0# 

Super!!!

[nesges]

Danke für's testen! Habe grade einen Pullrequest gesendet, wenn der übernommen wird kann das überflüssige # auch wieder weg.

[StefanD]

So, nach zwei Tagen off bin ich wieder da. Alter Verwalter, hier wird einem echt geholfen! Ein wahrer Traum! 

Ich hab's unter Apache laufen - eben so, wie in der Demo Dazu musst du nur das Meta-Tag "fhemweb_url" entsprechend setzen:

Code Auswählen Erweitern

<meta name="fhemweb_url" content="http:///host:port/fhem">

Ich habs bei mir auf nginx laufen:

Code Auswählen Erweitern

server {
        listen [::]:80 ipv6only=off;
....

Vielleicht hilfts dir weiter

Und wie! Letztlich hing es bei mir noch an dieser "Kleinigkeit":

Code Auswählen Erweitern

        location /pgm2 {
                alias /opt/fhem/www/pgm2;
        }
Aber wie das immer so mit dem Wald ist, den man irgendwann vor lauter Bäumen nicht mehr sieht... 

Vielleicht sollten wir hierzu einen neuen Thread auf machen?!?

Das wäre vielleicht gar keine schlechte Idee. So würde man diesen Thread für die reine Funktionalität der Komponenten "sauber halten".


Erste Tests haben leider eines meiner größten funktionalen Probleme nicht gelöst, die mich zum Auslagern bewogen hatten: WebControlView funktioniert zwar prinzipell, allerdings ebenso gut/schlecht wie mit dem integrierten HTTPSrvr. Das vollständige Laden meiner Startseite dauert genau so lange, manchmal wird sie nur zur Hälfte geladen. Der Status z.B. des Garagentors wird nicht durchgängig (zu -> geöffnet -> offen) aktualisiert. Über Chrom wird alles schnell, sauber und korrekt angezeigt. Wäre da nicht die Statusleiste oben, die ich bisher nicht wegbekommen habe, würde ich auch gerne WebControlView ersetzen...

VG Stefan

[nesges]

Über Chrom wird alles schnell, sauber und korrekt angezeigt. Wäre da nicht die Statusleiste oben, die ich bisher nicht wegbekommen habe, würde ich auch gerne WebControlView ersetzen...

Chrome kann Webseiten mit bestimmten Metatags (<meta name="mobile-web-app-capable" content="yes">, ist Standardmässig in FTUI gesetzt) als "Desktop-App" anlegen. Einfach im Browser öffnen und im Menü "Zu Startbildschirm hinzufügen" oder ähnlich (heisst unterschiedlich in verschiedenen Versionen) wählen. Dann nur noch über die Verknüpfung auf dem Homescreen starten -> Fullscreen ohne Statusleiste