Countdown-Anzeige?

matt_matt · 20 Mai 2017, 00:08:02

Hallo.

Ich habe mir eine Fensterüberwachung eingerichtet, die abhängig von der Temperatur nach einer gewissen Zeit einen Warnton ausgibt, wenn ein Fenster zu lange offen ist. Ein Tablet auf dem Flur zeigt den Zustand der Fenster an. Meine Überlegung ist nun, schön wäre es, wenn man erkennen könnte, wie lange der Zeitraum ist, bis der Alarm losgeht. Es gibt ein Modul "Countdown", aber das bekomme ich nicht zum laufen, jedenfalls nicht so, wie ich das gerne hätte. Das zeigt die verbleibende Zeit an. Schöner wäre es als optische Anzeige, z.B Fortschrittbalken oder ein Kreis mit Fortschrittsanzeige (Progress Widget).
Wenn ein Fenster geöffnet wird, wird ein Timer erzeugt(define timer at +zeit set warnton), der wieder gelöscht wird, wenn das Fenster geschlossen wird.
Ich habe hier im Forum fleissig gesucht, aber leider keinen Lösungsansatzt gefunden. Wie würdet ihr das lösen?

Danke schonmal
Gruß matt_matt

amenomade · 20 Mai 2017, 02:39:46

Etwas in der Art? https://forum.fhem.de/index.php/topic,39090.0.html

matt_matt · 20 Mai 2017, 22:20:08

Hallo.

Nein, eigentlich dachte ich, es gibt eine einfache Lösung, die ich bei meiner Suche nicht gefunden habe. Bei der Fensterüberwachung gab es immer wieder Situationen, wo ich dachte, jetzt wird es kompliziert. Dabei waren die Lösungen immer relativ einfach. Gibt es sonst keinen Bedarf an einem optischen Countdown. Na macht nichts.
Das Beispiel wird mir bestimmt trotzdem weiterhelfen, es zeigt zumindest, wie man es machen könnte. Wenn der Timer definiert wird, gibt es ein Internal (NTM) oder State, was die Zeit anzeigt, wenn der Timer auslöst. Vieleicht könnte ich daraus was machen(falls meine Programmierkenntnisse dazu ausreichen).

Viele Grüße matt_matt

Shadow3561 · 21 Mai 2017, 08:32:09

Hallo,
Ich habe mal eben schnell etwas aus Vorlagen zusammengebastelt.

Du könntest es als Popup anzeigen lassen.

Code Auswählen

<!DOCTYPE html>
<html>
<head>
   
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="widget_base_width" content="74">
    <meta name="widget_base_height" content="71">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="gridster_disable" content="1">
    <meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
    <meta name="debug" content="2"> <!-- verbose level 1-6 = output to console;0 = not output -->
    <meta http-equiv="Cache-Control" content="no-store" />

    <link rel="stylesheet" href="lib/jquery.gridster.min.css" />
    <link rel="stylesheet" href="css/fhem-tablet-ui.css" />
    <link rel="stylesheet" href="lib/font-awesome.min.css" />
    <link rel="stylesheet" href="lib/jquery.toast.min.css" />

    <!-- define your personal style here, it wont be overwritten  -->
    <!-- link rel="stylesheet" href="css/fhem-green-ui.css" / -->
    <!-- link rel="stylesheet" href="css/fhem-tablet-ui-user.css" / -->

    <script src="../pgm2/jquery.min.js"></script>
    <script src="lib/jquery.toast.min.js"></script>
    <script src="lib/jquery.gridster.min.js"></script>
    <script src="js/fhem-tablet-ui.js" defer></script>

    <title>Timer 1</title>
</head>
<body>
<div class="gridster">
<ul>
  <li data-row="1" data-col="1" data-sizex="4" data-sizey="1">
    <header>Timer 1</header>

<script language="JavaScript"> 
<!--     

    function countdown(zahl){ 
        if(zahl>1){  
        // über 1 Sekunde hinaus -> x Sekunden 
        document.getElementById('downloading').innerHTML=zahl+" Sekunden"; 
        count(zahl);             
        } 
        else if(zahl==1){  
        // 1 Sekunde 
        document.getElementById('downloading').innerHTML=zahl+" Sekunde"; 
        count(zahl);             
        } 
        else {  
        // Countdown abgelaufen, beliebige Handlung kann eingebaut werden 
        document.getElementById('downloading').innerHTML="0 Sekunden"; 
        alert('Zeit ist abgelaufen!'); 
        } 
    } 
     
    function count(countzahl){ 
    // gewünschte Handlung kann hier eingebaut werden 
    countzahl=countzahl-1; 
        setTimeout("countdown("+countzahl+");",1000);             
    } 
	// Zeit in Sekunden hier ändern         
count(600); 

// --> 
</script> 

<b>Countdown: <span id="downloading">600 Sekunden</span>!</b>
</div>

</li>

</ul>
</div>
</body>
</html>

Alternativ dazu könntest du mal beim Ersteller des Knob-Widgets nachfragen ob er etwas wie einen Timer einbauen kann.

matt_matt · 21 Mai 2017, 23:31:57

Hallo Shadow3561

Danke für deine Mühe, aber an ein Popup habe ich nicht gedacht. Ich habe mir eine grafische Oberfläche zusammengebastelt, worauf man sofort erkennen kann, ob Fenster auf sind und wenn ja, welche. Zusätzlich ist jedem Fenster ein Switch zugeordnet, der das jeweilige Fenster aus der Überwachung rausnimmt(im Sommer mit offenen Fenster schlafen oder mal länger die Terassentür offen lassen). Da sollte die Countdown auch auf der der selben Ebene sichtbar sein.

Viele Grüße matt_matt

Shadow3561 · 22 Mai 2017, 19:57:59

Hast du es schon damit probiert?

https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/countdown

MfG

matt_matt · 22 Mai 2017, 22:00:48

Hallo.

Ja, habe ich. Es klappt bloß nicht so, wie ich es gerne hätte. Ein Problem ist z.B.: wird ein zweites Fenster geöffnet, wird der Timer neu gestartet. Das Widget bekommt es nicht mit. Werden alle Fenster geschlossen, wird der Timer gelöscht, das Widget bekommt es nicht mit.
Meine Vorstellung war ein animiertes Icon, dort wird die Zeit aber in Zahlen angezeigt. Könnte man aber mit Leben, falls es richtig laufen würde. Das größte Problem aber ist, das es auf meinem Tablet im Flur nicht angezeigt wird. Dort läuft WebVievControl. Starte ich dort einen anderen Browser wird es angezeigt. Hier am PC wird es auch angezeigt. Ich habe es darum nicht weiter verfolgt.

Viele Grüße matt_matt

ChrisK · 30 Mai 2017, 12:31:00

Hier hatte ich mal ein ähnliches Ziel: https://forum.fhem.de/index.php/topic,49916.msg416520.html#msg416520
Vielleicht hilft Dir die Lösung von setstate irgendwie weiter.

mani · 21 Juni 2017, 22:33:22

Hallo,

möchte wie #3 beschrieben den Countdown in einem popup anzeigen,
Nur wie müsste ich das einfügen? Wenn ich es direkt in die index.html lege läuft's aber wenn ich es ins popup lege wird nichts angezeigt....kann mir jemand auf die Sprünge helfen?

DANKE MfG Mani

DocCyber · 01 Juli 2017, 10:17:11

Zitat von: matt_matt am 20 Mai 2017, 00:08:02
Meine Überlegung ist nun, schön wäre es, wenn man erkennen könnte, wie lange der Zeitraum ist, bis der Alarm losgeht.
....
Schöner wäre es als optische Anzeige, z.B Fortschrittbalken ....
...
Wie würdet ihr das lösen?

Ich habe mir für mein Bewässerungssytem eine Lösung gebastelt, die vermutlich ziemlich genau das ist, was du brauchst.
1. Dummy "elapsed" definieren; für die verstrichene Zeit
2. Dummy "timeMax" definieren; gibt an, wie lange es bis zum Alarm dauern soll.
3. Timer (at) definieren, der periodisch im Sekundentakt den Zähler elapsed hoch- bzw runterzählt.
Der Timer ist zunächst auf inactive gesetzt.
4. notify definieren, das auf "Fenster" reagiert und den Timer (de-)aktiviert.
5. FTUI Level Widget im Frontend nutzen. Als Parameter wird timeMax und elapsed verwendet.

Bei Interesse kann ich dir gern mal einen Screenshot schicken, wie das bei mir aussieht. Weitere Details auf Anfrage.

matt_matt · 02 Juli 2017, 16:27:29

Zitat1. Dummy "elapsed" definieren; für die verstrichene Zeit
2. Dummy "timeMax" definieren; gibt an, wie lange es bis zum Alarm dauern soll.
3. Timer (at) definieren, der periodisch im Sekundentakt den Zähler elapsed hoch- bzw runterzählt.
Der Timer ist zunächst auf inactive gesetzt.
4. notify definieren, das auf "Fenster" reagiert und den Timer (de-)aktiviert.
5. FTUI Level Widget im Frontend nutzen. Als Parameter wird timeMax und elapsed verwendet.

Hallo,
das habe ich jetzt so umgesetzt. Es funktioniert auch soweit, aber ich bekomme es nicht hin, timeMax als Maximalwert einzusetzen.
Als Widget benutzte ich das Progress Widget, es sollte aber genauso funktionieren wie das Level Widget. In der Beschreibung für Data-max steht: "Maximaler Wert, der angezeigt werden soll, oder Name des Readings, das den Maximalwert enthält".
Das dumme ist ja nur, ein Wert ist ein Dummy, der andere Wert ist ein anderer Dummy .

Code Auswählen

<div data-type="progress" 
			     data-device="elapsed"
			     data-max="timeMax"
			     data-progress-width="50"
			     data-set-on="ring"
			     data-get="STATE"
			     class="bigger">
			</div>

.

Ausschnitt aus der Index.html. Was mache ich falsch?

Viele Grüsse matt_matt.

DocCyber · 05 Juli 2017, 19:29:00

Vielleicht liegt es daran, dass mein voriger Post nicht völlig korrekt formuliert war. Sorry dafür.

Ich nutze einen Dummy (waterTime1) mit zwei zusätzlichen Readings.
Definition in FHEM:

Code Auswählen


define waterTime1 dummy
setreading waterTime1 spans 300   #Vorgegebene Laufzeit: 300 s
setreading waterTime1 elapsed 0    #aktuell abgelaufene Zeit

Code in HTML:

Code Auswählen


  <div data-type="level" 
    data-device="waterTime1>"
    data-get="elapsed"
    data-max="spans"
    class="horizontal left mini" >
  </div>

Ich arbeite lediglich mit 'level' statt 'progress'. Aber bei Progress sollte das auch funktionieren, vermute ich

Der Screenshot zeigt das Level-Widget in Aktion nach etwa 2 Drittel der Vorgabezeit.

Rudy · 11 Juli 2017, 21:13:45

Ich würde den Countdown auch gerne nachbauen. Könnt ihr mir bitte mal ein Beispiel für das at geben? Den Rest habe ich hoffentlich verstanden.

DocCyber · 12 Juli 2017, 15:47:29

Hallo Rudy,

man kann es z.B. so machen:

Code Auswählen


define wtime dummy
attr wtime room __Test
setreading wtime elapsed 0
setreading wtime total 30

define switch dummy
attr switch setList on off
attr switch room __Test

define n_set_timer_action notify switch { if ($EVENT eq "on") {fhem("set on_timer_action active")} else {fhem("set on_timer_action inactive");; fhem("setreading wtime elapsed 0")} }
attr n_set_timer_action room __Test

define on_timer_action at +*00:00:01 {my $e = ReadingsVal("wtime", "elapsed", 0);; $e += 1;; if ($e > ReadingsVal("wtime", "total", 0)) {fhem("set on_timer_action inactive");; $e = 0;;} fhem("setreading wtime elapsed $e");;}
attr on_timer_action room __Test
set on_timer_action inactive

Der Testschalter switch löst die Aktion aus.
Das notify reagiert auf den Testschalter und (de-)aktiviert den Timer.
Wenn der Timer aktiv ist, wird elapsed im Sekundentakt hochgezählt.
Wenn der Vorgabewert total erreicht ist, wird der Timer deaktiviert und elapsed auf 0 zurückgesetzt.

Rudy · 16 Juli 2017, 17:03:27

Hallo DocCyber,

ich bin jetzt endlich dazu gekommen, dass so auch bei mir einzubauen. Hat super funktioniert. Vielen Dank für den Code.

DocCyber · 16 Juli 2017, 19:43:56

Freut mich, dass es klappt.

jorge · 28 August 2017, 08:32:26

Genau das. was ich für meine Bewässerungssteuerung gesucht habe:

Zitat von: DocCyber am 05 Juli 2017, 19:29:00

Der Screenshot zeigt das Level-Widget in Aktion nach etwa 2 Drittel der Vorgabezeit.

Kannst Du vielleicht den vollständigen FTUI und FHEM Code posten?

DocCyber · 28 August 2017, 09:04:19

Zitat von: jorge am 28 August 2017, 08:32:26
Kannst Du vielleicht den vollständigen FTUI und FHEM Code posten?

Hallo Jorge,

hast du meine Posts weiter oben nicht gesehen?
https://forum.fhem.de/index.php/topic,72151.msg656303.html#msg656303
https://forum.fhem.de/index.php/topic,72151.msg658696.html#msg658696

Ich glaube, dass alles ziemlich genau beschrieben ist. Was fehlt dir denn sonst noch?

Klaus

jorge · 28 August 2017, 09:46:36

Zitat von: DocCyber am 28 August 2017, 09:04:19

Ich glaube, dass alles ziemlich genau beschrieben ist. Was fehlt dir denn sonst noch?

Klaus

Danke, Klaus für die schnelle Info.
Sorry, hatte den Thread nicht zuende gelesen...
Beim FTUI- Bild werden noch weitere Widgets angezeigt, die im angezeigten HTML Code nicht enthalten sind...

---
Wäre es nicht hilfreich, den switch nach Ende der Laufzeit auf 'off' zu setzen?

LG Jorge

DocCyber · 28 August 2017, 10:59:34

Zitat von: jorge am 28 August 2017, 09:46:36
Beim FTUI- Bild werden noch weitere Widgets angezeigt, die im angezeigten HTML Code nicht enthalten sind...

Ja, das stimmt. Aber das hat mit dem Kern des Threads nur indirekt zu tun und ich habe es daher nicht beschrieben.
Here you are:

In FHEM ergänzt du die Definition des Dummys wtime um eine Auswahlliste für die Bewässerungszeit:

Code Auswählen

attr wtime setList total:60,120,180,240,300,600
Diese Liste kannst du dir im FTUI durch das select-Widget anzeigen lassen.

Code Auswählen


		<div data-type="select" 
			data-device="wtime "
			data-get="total"
			data-set="total"
			data-cmd="setreading"
			class="medium right-space">
		</div>
		
		<div data-type="checkbox"
			data-device="switch"
			class="green right-space">
		</div>
		
		<div data-type="level" 
			data-device="wtime"
			data-get="elapsed"
			data-max="total"
			class="horizontal left mini right-space" >
		</div>
		
		<div data-type="label" 
			data-device="wtime"
			data-get="total"
			class="left">
		</div>&nbsp;Minuten

Ich mache es bei mir so, dass ich die Listenzeiten in Minuten definiere, den gewählen Wert dann in Sekunden umrechne und des Ergebnis in einem weiteren Reading totals (zusätzlich zu total) speichere. Dann muss die Definition des Select-Widgets entsprechend angepasst werden.

Zitat
Wäre es nicht hilfreich, den switch nach Ende der Laufzeit auf 'off' zu setzen?

Natürlich. Ich mach es auch so, hab's nur nicht in den Code geschrieben.
Du hängst beim notify für den Schalter halt einfach noch den entsprechenden Befehl dran, also

Code Auswählen

define n_set_timer_action notify . . . . . fhem("setreading wtime elapsed 0");; fhem("set switch off")} }

tomhead · 01 Mai 2021, 16:39:00

Hallo, ich möchte das Thema mal wieder vorkramen..
Ich habe versucht, das entsprechend bei mir umzusetzen, in FTUI kann ich den Countdown auch starten und der Balken füllt sich langsam aber der Schalter_Wasser_Vorgarten wird am Ende nicht wieder auf off gesetzt. Ich vermute, dass hängt irgendwie mit der Verkettung der Befehle mit fhem("set...");; fhem("set ...");;.. zusammen, ich bin aber bisher nicht dahinter gekommen, wo der Fehler steckt. Ich habe es mit einem ; und zwei ;; zwischen den Befehlen probiert, aber ohne Erfolg. Kann jemand helfen ,woran es liegen könnte?

Danke

Code Auswählen

define wtime dummy
attr wtime readingList elapsed, total
attr wtime room Garten
attr wtime setList elapsed:0 total:10,60,120,180,240,300,600
attr wtime webCmd total
attr wtime widgetOverride total:10,60,120,180,240,300,600

define Schalter_Wasser_Vorgarten dummy
attr Schalter_Wasser_Vorgarten room Garten
attr Schalter_Wasser_Vorgarten setList on off

define n_set_timer_action notify Schalter_Wasser_Vorgarten { if ($EVENT eq "on") {fhem("set on_timer_action active")} else {fhem("set on_timer_action inactive");; fhem("setreading wtime elapsed 0");; fhem("set Schalter_Wasser_Vorgarten off")} }
attr n_set_timer_action room Garten

define on_timer_action at +*00:00:01 {my $e = ReadingsVal("wtime", "elapsed", 0);; $e += 1;; if ($e > ReadingsVal("wtime", "total", 0)) {fhem("set on_timer_action inactive");; $e = 0;;} fhem("setreading wtime elapsed $e");;}
attr on_timer_action room Garten

tomhead · 06 Mai 2021, 21:43:56

So, habe es mittlerweile selber lösen können. In der on_timer_action def muss auch noch ein "set Schalter_Wasser_Vorgarten off" rein, dann klappt es auch mit dem Ausschalten

Falls das mal jemand nachbauen will, hier mein kompletter Code für FHEM und FTUI (Danke nochmal an DocCyber für die wesentlichen Angaben dafür).
Ich habe auch zusätzliche userReadings für die Angaben in Minuten ergänzt.
Der Befehl set Ventil_Wasser_Vorgarten on schaltet dann zusätzlich ein an einem Homematic HM-LC-SW4-DR-2 4-fach-Schalter angeschlossenes Hunter-Magnet-Ventil.

Code Auswählen


define watertimer_Vorgarten dummy
attr watertimer_Vorgarten readingList elapsed, total, total_s, Rest
attr watertimer_Vorgarten room Garten
attr watertimer_Vorgarten setList elapsed:0,1 total:1,5,10,20,25,30,35,40,45,50,55,60
attr watertimer_Vorgarten stateFormat elapsed
attr watertimer_Vorgarten userReadings total_s {ReadingsVal("watertimer_Vorgarten","total",0)*60},Rest {ReadingsVal("watertimer_Vorgarten","elapsed",0)/60}
attr watertimer_Vorgarten webCmd total
attr watertimer_Vorgarten widgetOverride total:1,5,10,20,25,30,35,40,45,50,55,60

define Schalter_Wasser_Vorgarten dummy
attr Schalter_Wasser_Vorgarten room Garten
attr Schalter_Wasser_Vorgarten setList on off

define n_set_timer_action_Vorgarten notify Schalter_Wasser_Vorgarten { if ("$EVENT" ne "off") {fhem("set on_timer_action_Vorgarten active ;; set Ventil_Wasser_Vorgarten on")} else {fhem("set on_timer_action_Vorgarten inactive ;; setreading watertimer_Vorgarten elapsed 0 ;; set Schalter_Wasser_Vorgarten off ;; set Ventil_Wasser_Vorgarten off")} }
attr n_set_timer_action_Vorgarten room Garten

define on_timer_action_Vorgarten at +*00:00:01 {my $e = ReadingsVal("watertimer_Vorgarten", "elapsed", 0);; $e += 1;; if ($e > ReadingsVal("watertimer_Vorgarten", "total_s", 0)) {fhem("set on_timer_action_Vorgarten inactive ;; set Schalter_Wasser_Vorgarten off ;; set Ventil_Wasser_Vorgarten off");; $e = 0;;} fhem("setreading watertimer_Vorgarten elapsed $e");;}
attr on_timer_action_Vorgarten room Garten

Code Auswählen


    <div data-type="label" class="">Vorgarten:</div>
    <div data-type="select" data-device="watertimer_Vorgarten" data-get="total" data-set="total" data-cmd="setreading" class="inline medium"></div>
    <div data-type="checkbox" data-device="Schalter_Wasser_Vorgarten" class="inline green"></div>
    <div data-type="level" data-device="watertimer_Vorgarten" data-get="elapsed" data-max="total_s" class="inline horizontal top-narrow" ></div>
    <div data-type="label" data-post-text=" Minuten" data-device="watertimer_Vorgarten" data-get="Rest" data-fix="0" class="right"></div>