neues Attribut: uiTable - DOIF User Interface, neues Attribut: DOIF_Readings

Begonnen von Damian, 07 Oktober 2017, 23:29:48

Vorheriges Thema - Nächstes Thema

Ellert


Damian

Eine Konfiguration - drei verschiedene Ausgabegeräte. Der Statusbildschirm wird auf einem Smartphone einspaltig ohne Plots dargestellt und ist ohne Zoomen bedienbar :)

Im Anhang ein Vergleichsfoto.
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Damian

Statusbildschirm mit Anzeige aktueller Uhrzeit (Digital-Uhr) mit Datum im ersten Post aktualisiert.
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Damian

Und hier die Anleitung zur Umsetzung von Zeit und Datum als Anregung für eigene Umsetzung:

defmod Time DOIF (1)
attr Time uiTable {\
$SHOWNODEVICELINE=".*";;\
}\
\
STY("<div class='doifclock'>error</div>","font-weight:bold;;font-size:18pt;;color:darkorange;;text-align:center;;");;


Und der Inhalt von doifclock.js in www/pgm2

function startTime() {
  var today = new Date();
  var h = today.getHours();
  var m = today.getMinutes();
  var d = today.getDate();
  var mo = today.getMonth()+1;
  var y = today.getFullYear();
  m = checkTime(m);
  $('.doifclock').each(function(){
    $(this).html(h + ":" + m + "&nbsp&nbsp" + d + "." + mo + "." + y);
  });
  var t = setTimeout(startTime,1000);
}
function checkTime(i) {
  if (i < 10) {i = "0" + i};  // add zero in front of numbers < 10
  return i;
}
startTime();


Dann noch doifclock.js in der Instanz von FHEMWEB per Attribut angeben:

attr <WEB> JavaScripts www/pgm2/doifclock.js

Da die Zeitaktualisierung auf der js-Seite läuft, wird FHEM mit der sekundlichen Aktualisierung nicht belastet.

Im Anhang das sichtbare Ergebnis.

Die Idee zur Umsetzung kam von Ellert.
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Ellert


StephanFHEM

fehlt noch ein Widget für TabletUI damit man das ganze analog zu ReadingGroups dort anzeigen lassen kann:-)

Ellert

Zitat von: StephanFHEM am 11 Dezember 2017, 21:12:33
fehlt noch ein Widget für TabletUI damit man das ganze analog zu ReadingGroups dort anzeigen lassen kann:-)

Sei so gut und fang schon mal damit an.

StephanFHEM

ZitatSei so gut und fang schon mal damit an

und glaub mir (unabhängig davon, dass ich den Wink mit der Holzhandlung verstanden habe): wenn ich es könnte würde ich es tun.
Leider reichen meine Kenntnisse dafür nicht aus. Es ist manchmal ganz schön blöd, wenn man selbst nicht die Fähigkeiten hat seine Ideen umzusetzen. Dafür haben alle, die hier ihr Know-how einsetzen und Module bereitstellen meinen tiefsten Respekt!

Damian

Ich denke, langfristig werden wir solche js-Erweiterungen sowie Templates für DOIF in contrib\doif ablegen, damit man nicht lange suchen muss.

TabletUI-Unterstützung ist übrigens aus DOIF wieder rausgeflogen. Es ist besser nur auf einer Hochzeit zu tanzen, dafür aber richtig ;)

Für TabletUI gibt es sicherlich eine Uhr mit Datum und noch viele andere Dinge.
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Ellert

Zitat von: StephanFHEM am 11 Dezember 2017, 21:26:04
und glaub mir (unabhängig davon, dass ich den Wink mit der Holzhandlung verstanden habe): wenn ich es könnte würde ich es tun.
Leider reichen meine Kenntnisse dafür nicht aus. Es ist manchmal ganz schön blöd, wenn man selbst nicht die Fähigkeiten hat seine Ideen umzusetzen. Dafür haben alle, die hier ihr Know-how einsetzen und Module bereitstellen meinen tiefsten Respekt!
Wo ein Wille ist ...

Du könntest probieren stateFormat in einem DOIF mit uiTable zu setzen und das dann mit dem Readingsgroup-Widget in Tablet-UI einzubinden.

attr <doifname> stateFormat {DOIF_RegisterEvalAll($defs{<doifname>},"<doifname>","uiTable")}

<doifname> ist durch den tatsächlichen Namen zu ersetzen.

RoBra81

Hallo,

ich bin gerade dabei, mir mit den Beispielen aus dem Wiki ein bisschen die uiTable zu erarbeiten - super Sache!

Aus dem Link-Beispiel wollte ich mir unter Verwendung von Templates eine Liste meiner Raumlinks bauen. Ohne Templates hat's funktioniert, mit Templates stimmt aber irgendwie die CSS-Formatierung nicht. Hier mein Attribut uiTable:

{
  $TD{0}{0..20}="style='position:relative'";
}

DEF TPL_Link("<a target='_self' href='$FW_ME?room=".$1."' title='".$1."'>".FW_makeImage("".$2."\@lightblue")."<div style='position:absolute; left:0px; top:40px; font-size:12px; background-color:lightblue; color:darkred'>".$1."</div></a>");

TPL_Link("Esszimmer","scene_dinner")|TPL_Link("Buero","scene_dinner")


Wo könnte mein Fehler liegen?

Vielen Dank (auch für eure tolle Arbeit!)
Ronny

Damian

Wie sah die funktionierende Definition ohne Templates aus?

Du kannst bei Templates ohne Anführungszeichen arbeiten, das macht die Sache einfacher und damit weniger fehleranfällig:

DEF TPL_Link("<a target='_self' href='$FW_ME?room=$1' title='$1'>".FW_makeImage("$2\@lightblue")."<div style='position:absolute; left:0px; top:40px; font-size:12px; background-color:lightblue; color:darkred'>$1</div></a>");

TPL_Link(Esszimmer,scene_dinner)|TPL_Link(Buero,scene_dinner)
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

RoBra81

Habe den Fehler scheinbar gefunden: anders als im Wiki funktioniert es bei mir, wenn ich das ; am Ende der DEF TPL_Link-Zeile weglasse...

Damian

Zitat von: RoBra81 am 13 Dezember 2017, 20:33:13
Habe den Fehler scheinbar gefunden: anders als im Wiki funktioniert es bei mir, wenn ich das ; am Ende der DEF TPL_Link-Zeile weglasse...

An dieser Stelle ist Semikolon auch fehl am Platz. Die werden nur im Perlbereich angegeben.
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

RoBra81

Guten Morgen,

ich bin am nächsten Wiki-Beispiel angekommen und meine Begeisterung steigt. Nun wollte ich mir einen Grundriss meiner Wohnung anlegen - was soweit funktioniert hat - und statt auf $SELF auf ein anderes Device triggern - woran es gerade scheitert:

defmod Grundriss_Labor DOIF (1)
attr Grundriss_Labor group Labor: uiTable
attr Grundriss_Labor room DOIF_Test
attr Grundriss_Labor uiTable {\
  $ATTRIBUTESFIRST = 1;;\
  $TABLE = "font-size:10pt;;text-align:center;;position:relative;;width:1200px;; height:600px;; background-image:url($FW_ME/images/default/wohnung/OG.svg);; background-size: 1200px 600px;;";;\
  $TR{1,3} = "class=''";;\
  $TPL{switch}="iconSwitch,on,off,off,on";;\
}\
\
DEF TPL_Objekt("<div style='position:absolute;;;; Left:".$1."px;;;; top:".$2."px;;;;'>".$3.WID($4,$TPL{switch})."</div>")\
\
TPL_Objekt("35","25","Schlafen<br>",[$SELF:SZ])|\
TPL_Objekt("145","25","Küche<br>","[Dunkel:state]")|\
TPL_Objekt("225","25","Bad<br>",[$SELF:Bad])|\
TPL_Objekt("145","105","Diele ",[$SELF:Diele])|\
TPL_Objekt("35","160","Wohnen A<br>",[$SELF:WZ1])|\
TPL_Objekt("35","220","Wohnen B<br>",[$SELF:WZ2])|\
TPL_Objekt("145","160","Kind<br>",[$SELF:Ki])|\
TPL_Objekt("145","250","Balkon<br>",[$SELF:Balkon])

setstate Grundriss_Labor initialized
setstate Grundriss_Labor 2017-12-14 09:21:50 Bad off
setstate Grundriss_Labor 2017-12-14 09:21:34 SZ on
setstate Grundriss_Labor 2017-12-14 08:53:02 cmd 0
setstate Grundriss_Labor 2017-12-14 08:53:02 state initialized



Bei "Dunkel" handel es sich um einen S7-Ausgang, welcher die States on und off annehmen kann (habe es auch schon mit einem Homematic-Device probiert). Mit dem oben angegebenen Code wird bei der Küche kein Symbol angezeigt. Wenn ich nun in einem zweiten Browserfenster das Device "Dunkel" schalte, erscheint dort und im Fenster des DOIFs die Fehlermeldungen

fhem?detail=Dunkel line 1:
Uncaught SyntaxError: missing ) after argument list


bzw.

fhem?detail=Grundriss_Labor# line 1:
Uncaught SyntaxError: missing ) after argument list


Wo könnte hier mein Fehler liegen?

Vielen Dank
Ronny