Hallo zusammen!
Bin begeisterter Benutzer von smartHome.py und smartVISU.
Das sind zwei echt genial frameworks. Glückwunsch und DANKE an die Entwickler. Echt Gute Arbeit!!!
Da mir in der smartVISU ein feature gefehlt hat, oder ich zumindest nicht direkt gesehen habe wie ich es mit bestehenden widgets umsetzen kann hab ich mir mal mein eigenes widget geschrieben. Damit ich aber nicht immer nur von eurer Arbeit profitieren kann sondern ihr auch mal was zurück bekommt möchte ich mein Widget hier mit euch teilen. Vielleicht findet ja der eine oder andere auch interresse daran.
Erst mal eine kurze beschreibung was ich mit meinem widget bezwecken möchte:
Auf der Startseite meiner Visu möchte ich eine Liste aller Lampen im Haus haben, die momentan an sind. Alle Lampen die derzeit aus sind interresieren mich nicht und sollen auch nicht angezeigt werden. Lampen die derzeit an sind sollen nicht nur angezeigt werden, sondern durch klicken sollte es auch möglich sein diese auszuschalten. Sind sie dann aus, sollten sie aus der Liste verschwinden.
Dem widget habe ich bis lange den nichts aussagenden Namen "test" gegeben. Mir ist einfach noch kein besserer Name eingefallen.
Nun zur Umsetzung des Widgets:
In der basic.html habe ich folgendes hinzugefügt:
In der widget.min.js habe ich folgendes hinzugefügt:
In der html Seite meiner VISU habe ich dann folgende Einträge benutzt:
Für Lampen die angezeigt werden sollen wenn sie An sind und die beim Klicken ausgeschaltet werden sollen:
Für Steckdosen die angezeigt werden sollen wenn sie aus sind und beim Klicken eingeschlatet werden sollen:
Ich hoffe euch gefällt das Widget, für Namensvorschläge oder gar einen alternativen Lösungsansatz zu meinem Problem bin ich jederzeit offen.
Danke euch nochmal für eure erstklassige Arbeit an smartHome.py und smartVISU.
Dominik
Bin begeisterter Benutzer von smartHome.py und smartVISU.
Das sind zwei echt genial frameworks. Glückwunsch und DANKE an die Entwickler. Echt Gute Arbeit!!!
Da mir in der smartVISU ein feature gefehlt hat, oder ich zumindest nicht direkt gesehen habe wie ich es mit bestehenden widgets umsetzen kann hab ich mir mal mein eigenes widget geschrieben. Damit ich aber nicht immer nur von eurer Arbeit profitieren kann sondern ihr auch mal was zurück bekommt möchte ich mein Widget hier mit euch teilen. Vielleicht findet ja der eine oder andere auch interresse daran.
Erst mal eine kurze beschreibung was ich mit meinem widget bezwecken möchte:
Auf der Startseite meiner Visu möchte ich eine Liste aller Lampen im Haus haben, die momentan an sind. Alle Lampen die derzeit aus sind interresieren mich nicht und sollen auch nicht angezeigt werden. Lampen die derzeit an sind sollen nicht nur angezeigt werden, sondern durch klicken sollte es auch möglich sein diese auszuschalten. Sind sie dann aus, sollten sie aus der Liste verschwinden.
Dem widget habe ich bis lange den nichts aussagenden Namen "test" gegeben. Mir ist einfach noch kein besserer Name eingefallen.
Nun zur Umsetzung des Widgets:
In der basic.html habe ich folgendes hinzugefügt:
Code:
/**
* A switch, build of two pics
*
* @param unique id for this widget
* @param a gad/item
* @param the text, printed when gad has value val (optional)
* @param the pic for the 'on' state (optional)
* @param the pic for the 'off' state (optional)
* @param value send for the 'on' state (optional, default 1)
* @param value send for the 'off' state (optional, default 0)
*/
{% macro test(id, gad, txt, pic_on, pic_off, val_on, val_off) %}
<span id="{{ uid(page, id) }}" data-widget="basic.test" data-item="{{ gad }}"
data-val-on="{{ val_on|default('1') }}" data-val-off="{{ val_off|default('0') }}"
data-pic-on="{{ pic_on|default(icon1~'control_on_off.png') }}" data-pic-off="{{ pic_off|default(icon0~'control_on_off.png') }}"
class="switch"><a><img class="icon" src="{{ pic_off|default(icon0~'control_on_off.png') }}" /></a>{{ txt}} <br> </span>
{% endmacro %}
Code:
$(document).delegate('span[data-widget="basic.test"]',{
update:function(d,a){
$("#"+this.id+" img").attr("src",a==$(this).attr("data-val-on")?$(this).attr("data-pic-on"):$(this).attr("data-pic-off"));
if (a == $(this).attr('data-val-on')) {
$('#' + this.id).show();
} else {
$('#' + this.id).hide();
}
},
click:function(d){
$("#"+this.id+" img").attr("src")==$(this).attr("data-pic-off")?io.write($(this).attr("data-item"),$(this).attr("data-val-on")):io.write($(this).attr("data-item"),$(this).attr("data-val-off"))
}
});
Für Lampen die angezeigt werden sollen wenn sie An sind und die beim Klicken ausgeschaltet werden sollen:
Code:
{{ basic.test('OG.Schlafzimmer.Licht.On', 'OG.Schlafzimmer.Licht', 'Schlafzimmer', icon1~'light_light.png', icon0~'light_light.png') }}
{{ basic.test('OG.Diele.Licht.On', 'OG.Diele.Licht', 'Diele OG', icon1~'light_light.png', icon0~'light_light.png') }}
{{ basic.test('OG.Bad.LichtDecke.On', 'OG.Bad.LichtDecke', 'Bad', icon1~'light_light.png', icon0~'light_light.png') }}
{{ basic.test('OG.Bad.LichtWand.On', 'OG.Bad.LichtWand', 'Bad Wand', icon1~'light_light.png', icon0~'light_light.png') }}
...
Code:
{{ basic.test('OG.Schlafzimmer.Steckdose1.Off', 'OG.Schlafzimmer.Steckdose1', 'Schlafzimmer 1', icon1~'message_socket.png', icon0~'message_socket.png', '0', '1') }}
{{ basic.test('OG.Schlafzimmer.Steckdose2.Off', 'OG.Schlafzimmer.Steckdose2', 'Schlafzimmer 2', icon1~'message_socket.png', icon0~'message_socket.png', '0', '1') }}
{{ basic.test('OG.Arbeitszimmer.Steckdose.Off', 'OG.Arbeitszimmer.Steckdose', 'Arbeitszimmer', icon1~'message_socket.png', icon0~'message_socket.png', '0', '1') }}
...
Danke euch nochmal für eure erstklassige Arbeit an smartHome.py und smartVISU.
Dominik
.
Kommentar