Habpanel und Blinds (Jalousien)

GUI Relevanten, PaperUI, BasicUI, HabPanel ...

Moderatoren: seppy, udo1toni

Antworten
harteknut
Beiträge: 50
Registriert: 3. Dez 2019 08:21
Answers: 5

Habpanel und Blinds (Jalousien)

Beitrag von harteknut »

Hallo zusammen,
in meinem HABPanel fehlt mir inzwischen nur nur noch die Jalousiesteuerung. Meine Jalousien sind haben keine Positionserfassung, daher habe ich sie in openHAB zwar mit rollershutter-items angebunden, die Position ist aber eher primitiv:
Es gibt nur drei Positionen: 0% wenn ganz offen, 100% wenn ganz zu, bei allem dazwischen wird der Wert auf 50% gesetzt. In der Basic-UI klappt das super.
Für HABPanel möchte ich auch keinen Schieberegler, um verschiedene Positionen anzufahren, sondern
- die drei möglichen Befehle UP, DOWN, STOP auslösen
- die drei (bei mir) möglichen Status 0%, 100% und 50% anzeigen.
Am allerliebsten würde ich das mit diesem Element machen, dass ich aus dem "Overall “skin” based on the Orange Tree theme" von Yannick Schaus rauskopiert hab:
Bildschirmfoto vom 2020-05-18 22-02-55.png
Dabei soll bei 0% die linke, 50% die mittlere und 100% die rechte Schaltfläche in der orangenen "ON"-Farbe dargestellt werden. Leider gibt es die drei Tasten nur im kompletten Custom-Widget mit Slider:
Bildschirmfoto vom 2020-05-18 22-03-32.png
Das ist zwar hübsch, aber in meinem Fall sinnlos, weil ich den Slider nicht benötige.
Könnt Ihr mir sagen, wie ich die Schaltflächen ohne den Rest darstellen kann (und noch die Farben hinbekomme...)?
Gruß,
Simon
von harteknut » 19. Mai 2020 23:10
So, fertig ;)
So siehts jetzt aus...
...mit Jalousien "ganz unten" und Fenster zu:
Bildschirmfoto vom 2020-05-19 22-57-37.png
... mit Jalousien in Zwischenstellung und Fenster offen:
Bildschirmfoto vom 2020-05-19 22-58-56.png
Wenn die Jalousie fährt, sind übrigens alle drei Icons grau.
Dafür habe ich jetzt relativ großen Aufwand betrieben:
- Jede Jalousie ist mit drei Items angelegt (Rollershutter, Switch fürs Fahren, Switch für die Richtung)
- Für den Status des Items brauche ich drei Regeln:

Code: Alles auswählen

// Jalousie OG Bad ***********************************************************************************************
rule "Jalousie OG Bad fährt"
	when 
		Item OG_Bad_RS_faehrt changed from OFF to ON
	then
		tJalousie_1?.cancel	
		OG_Bad_RS.postUpdate(NULL)	
    	tJalousie_1  = createTimer(now.plusSeconds(55), [ |
        	if (OG_Bad_RS_rauf.state == ON) OG_Bad_RS.postUpdate(0) else OG_Bad_RS.postUpdate(100)
				OG_Bad_RS_faehrt.sendCommand(OFF)
			])
	end
rule "Jalousie OG Bad stoppt"		
	when
		Item OG_Bad_RS_faehrt changed from ON to OFF
	then
		if (OG_Bad_RS.state == NULL) {
			OG_Bad_RS.postUpdate(50)
			}	 
		tJalousie_1?.cancel
        tJalousie_1  = null
	end
rule "Jalousie OG Bad dreht um"		
	when 
		Item OG_Bad_RS_rauf changed
	then
		if(OG_Bad_RS.state == NULL) {
			OG_Bad_RS_faehrt.sendCommand(OFF)
			Thread::sleep(500)
			OG_Bad_RS_faehrt.sendCommand(ON)}
	end
Die Icons habe ich mit Inkscape gebastelt und mit den Statusendungen (-10, -60 und -100) unter items/classic abgelegt. Für die Jalousie gibts jetzt so ein Vorlagen-Widget mit folgendem Code:

Code: Alles auswählen

<button class="btn" style="width: 31%; height: 100%; padding: 0; background: inherit; outline: none">
<span>
<widget-icon iconset="'custom-icon'"icon="'blindsup'" ng-click="sendCmd('OG_Bad_RS', 'UP')" size="37"  state="itemState('OG_Bad_RS')=='0' ? '0' : 'OFF'" />
  </span>
</button>
<button class="btn" style="width: 31%; height: 100%; padding: 0; background: inherit; outline: none">
<span>
<widget-icon iconset="'custom-icon'"icon="'blindss'"  ng-click="sendCmd('OG_Bad_RS', 'STOP')" size="35"  state="itemState('OG_Bad_RS')=='50' ? '50' : 'OFF'" />
</span>
</button>
<button class="btn" style="width: 31%; height: 100%; padding: 0; background: inherit; outline: none">
<span>
<widget-icon iconset="'custom-icon'"icon="'blindsdown'" ng-click="sendCmd('OG_Bad_RS', 'DOWN')" size="37" state="itemState('OG_Bad_RS')=='100' ? '100' : 'OFF'" />
</span>
</button>
Wenn sich das was vereinfachen oder verbessern lässt, bitte immer her damit, ich freu mich!
Gruß,
Simon
Gehe zur vollständigen Antwort
Du hast keine ausreichende Berechtigung, um die Dateianhänge dieses Beitrags anzusehen.

harteknut
Beiträge: 50
Registriert: 3. Dez 2019 08:21
Answers: 5

Re: Habpanel und Blinds (Jalousien)

Beitrag von harteknut »

Bin weiter gekommen. Ich habe einfach den Code von meinem Fensterstatus-Button dreimal hintereinander kopiert und den entsprechenden Befehl mit "ng-click" eingefügt.
Funktioniert SUPER, solange ich die Icons aus dem smarthome-set verwende, z.B. bulb. Wenn ich auf eigene SVGs umstelle (iconset="'custom-icon'"icon="'down'") wird der Aktivitätsstatus leider nicht farblich angepasst.
Hat dafür jemand einen Tip?

Code: Alles auswählen

<button class="btn" style="width: 30%; height: 100%; padding: 0; background: inherit; outline: none">
<span>
<widget-icon iconset="'smarthome-set'" icon="'bulb'" ng-click="sendCmd('OG_Bad_RS', 'UP')" size="40" state="itemState('OG_Bad_RS')=='0' ? 'ON' : 'OFF'" />
</span>
</button>
<button class="btn" style="width: 30%; height: 100%; padding: 0; background: inherit; outline: none">
<span>
<widget-icon iconset="'custom-icon'"icon="'up'" ng-click="sendCmd('OG_Bad_RS', 'STOP')" size="40"  state="itemState('OG_Bad_RS')=='50' ? 'ON' : 'OFF'" />
</span>
</button>
<button class="btn" style="width: 30%; height: 100%; padding: 0; background: inherit; outline: none">
<span>
<widget-icon iconset="'custom-icon'"icon="'down'" ng-click="sendCmd('OG_Bad_RS', 'DOWN')" size="40" state="itemState('OG_Bad_RS')=='100' ? 'ON' : 'OFF'" />
</span>
</button>

harteknut
Beiträge: 50
Registriert: 3. Dez 2019 08:21
Answers: 5

Re: Habpanel und Blinds (Jalousien)

Beitrag von harteknut »

So, fertig ;)
So siehts jetzt aus...
...mit Jalousien "ganz unten" und Fenster zu:
Bildschirmfoto vom 2020-05-19 22-57-37.png
... mit Jalousien in Zwischenstellung und Fenster offen:
Bildschirmfoto vom 2020-05-19 22-58-56.png
Wenn die Jalousie fährt, sind übrigens alle drei Icons grau.
Dafür habe ich jetzt relativ großen Aufwand betrieben:
- Jede Jalousie ist mit drei Items angelegt (Rollershutter, Switch fürs Fahren, Switch für die Richtung)
- Für den Status des Items brauche ich drei Regeln:

Code: Alles auswählen

// Jalousie OG Bad ***********************************************************************************************
rule "Jalousie OG Bad fährt"
	when 
		Item OG_Bad_RS_faehrt changed from OFF to ON
	then
		tJalousie_1?.cancel	
		OG_Bad_RS.postUpdate(NULL)	
    	tJalousie_1  = createTimer(now.plusSeconds(55), [ |
        	if (OG_Bad_RS_rauf.state == ON) OG_Bad_RS.postUpdate(0) else OG_Bad_RS.postUpdate(100)
				OG_Bad_RS_faehrt.sendCommand(OFF)
			])
	end
rule "Jalousie OG Bad stoppt"		
	when
		Item OG_Bad_RS_faehrt changed from ON to OFF
	then
		if (OG_Bad_RS.state == NULL) {
			OG_Bad_RS.postUpdate(50)
			}	 
		tJalousie_1?.cancel
        tJalousie_1  = null
	end
rule "Jalousie OG Bad dreht um"		
	when 
		Item OG_Bad_RS_rauf changed
	then
		if(OG_Bad_RS.state == NULL) {
			OG_Bad_RS_faehrt.sendCommand(OFF)
			Thread::sleep(500)
			OG_Bad_RS_faehrt.sendCommand(ON)}
	end
Die Icons habe ich mit Inkscape gebastelt und mit den Statusendungen (-10, -60 und -100) unter items/classic abgelegt. Für die Jalousie gibts jetzt so ein Vorlagen-Widget mit folgendem Code:

Code: Alles auswählen

<button class="btn" style="width: 31%; height: 100%; padding: 0; background: inherit; outline: none">
<span>
<widget-icon iconset="'custom-icon'"icon="'blindsup'" ng-click="sendCmd('OG_Bad_RS', 'UP')" size="37"  state="itemState('OG_Bad_RS')=='0' ? '0' : 'OFF'" />
  </span>
</button>
<button class="btn" style="width: 31%; height: 100%; padding: 0; background: inherit; outline: none">
<span>
<widget-icon iconset="'custom-icon'"icon="'blindss'"  ng-click="sendCmd('OG_Bad_RS', 'STOP')" size="35"  state="itemState('OG_Bad_RS')=='50' ? '50' : 'OFF'" />
</span>
</button>
<button class="btn" style="width: 31%; height: 100%; padding: 0; background: inherit; outline: none">
<span>
<widget-icon iconset="'custom-icon'"icon="'blindsdown'" ng-click="sendCmd('OG_Bad_RS', 'DOWN')" size="37" state="itemState('OG_Bad_RS')=='100' ? '100' : 'OFF'" />
</span>
</button>
Wenn sich das was vereinfachen oder verbessern lässt, bitte immer her damit, ich freu mich!
Gruß,
Simon
Du hast keine ausreichende Berechtigung, um die Dateianhänge dieses Beitrags anzusehen.

sami77
Beiträge: 48
Registriert: 25. Sep 2017 19:04
Answers: 1

Re: Habpanel und Blinds (Jalousien)

Beitrag von sami77 »

Super! Vielen Dank, hab da ein ähnliches Projekt! :-)

Antworten