FTUI version 3

[mr_petz]

Hallo Zusammen,

ich hätte mal eine Frage zu den Pipes.
Wenn ich statt eines Readings, ein Attribut auslese und die Pipes verwende, erhalte ich statt des dort Datums im Attribut, immer das aktuelle Datum von heute.

Fhem-Definition

Code Auswählen Erweitern

define LoremIpsum dummy
attr LoremIpsum firstPayDate 2021-05-06
...

Hi ToM_ToM,
Bei dir matcht leider keiner dieser 3 'm':
https://github.com/knowthelist/ftui/blob/87ae49f98d1325c18dd8c53ad5b5982d93e014ea/www/ftui/modules/ftui/ftui.helper.js#L213

Da müsste @setstate deine Version noch mit einbauen.
Zum Übergang kannst du es so lösen:

Code Auswählen Erweitern


<ftui-label [text]="LoremIpsum:firstPayDate | d=>new Date(d) | format('DD.MM.YYYY')" class="size-2"></ftui-label>


LG mr_petz

Edit: oder Regulär:

Code Auswählen Erweitern


<ftui-label [text]="LoremIpsum:firstPayDate | append('_00:00:00') | toDate() | format('DD.MM.YYYY')" class="size-2"></ftui-label>

somit wird in deinem Fall gematcht...

Edit2:
Einer geht noch:

Code Auswählen Erweitern


<ftui-label [text]="LoremIpsum:firstPayDate | d=>d.replace(/(\d\d\d\d)-(\d\d)-(\d\d)/,'$3.$2.$1')" class="size-2"></ftui-label>


Gerade aufgefallen... Geht ja auch mit FTUI replace:

Code Auswählen Erweitern


<ftui-label [text]="LoremIpsum:firstPayDate | replace(/(\d\d\d\d)-(\d\d)-(\d\d)/,'$3.$2.$1')" class="size-2"></ftui-label>


[Dracolein]

Gibt es eine Möglichkeit, für design-Zwecke simple Trennlinien einzufügen?

[mr_petz]

Gibt es eine Möglichkeit, für design-Zwecke simple Trennlinien einzufügen?

Hi Dracolein.

Ich mache das so z.Bsp.:

Code Auswählen Erweitern


<hr style="width: 95%; border: 1px solid gray; padding: 0; margin: 0;">

mit z.Bsp.: var(--primary-color) kannst du auch FTUI3-Farben verwenden...

hier die Style-Möglichkeiten:
https://www.w3schools.com/howto/howto_css_style_hr.asp
und Allgemein:
https://www.w3schools.com/tags/tag_hr.asp

LG mr_petz

[Dracolein]

Und das baut man einfach irgendwo in die FTUI3 Definitionen an die Stelle rein wo es gewünscht ist, ohne irgendein umklammerndes <ftui-???>

[mr_petz]

Ja genau, du setzt es einfach unter/nach dein Label oder was auch immer...
Oder wo wolltest du die Trennlinien bzw. sichtbare Linien???

Edit:
Sowas würde auch gehen:
Hier ist dann Test im Button unterstrichen:

Code Auswählen Erweitern


<ftui-button [(value)]="dummy">
<span>
  <ftui-label text="TEST"></ftui-label>
  <hr style="width: 95%; border: 1px solid; padding: 0; margin: 0;">
</span>
</ftui-button>

oder alleine (mein Favourit):

Code Auswählen Erweitern


<hr style="width: 95%; border-width: 0; padding: 0.1px; margin: 0; background: gray;">

das selbe Ergebnis kannst du auch mit <div> erreichen:

Code Auswählen Erweitern


<ftui-button [(value)]="dummy">
<span>
  <ftui-label text="TEST"></ftui-label>
  <div style="width: 95%; border-top: 1px solid; padding: 0; margin: 0;"></div>
</span>
</ftui-button>

oder alleine:

Code Auswählen Erweitern


<div style="width: 95%; border-top: 1px solid; padding: 0; margin: 0;"></div>


[Adimarantis]

Mein System läuft mit "attr global unicode"
Leider verdaut FTUI3 (hatte ich auch schon unter FTUI2) dann Umlaute in Readings nicht mehr.

Mein Problem ist ganz einfach den Text eines Wetterreadings von Proplanta. Wenn hier "bewölkt" drin steht dann liefert

Code Auswählen Erweitern

<ftui-label class="size-2" [text]="Wetter:fc0_weatherDay"></ftui-label>
nichts.
Dagegen "sonnig" schreibt den Text wie erwartet.

Kann man hier irgendwas (header, meta data) einstellen, um die Unicode Umlaute zum Laufen zu kriegen?

[mr_petz]

Es gibt zwar ein meta, aber ich glaube das es trotzdem nicht gehen wird (hatten wir hier glaube schon mal):

Code Auswählen Erweitern


<meta http-equiv="content-type" content="text/html; charset=utf-8">

Wichtig ist auch die html in utf8 zu speichern...
Wie kommt es den vom reading? Kannst vielleicht mit replace() arbeiten..?
LG

[Adimarantis]

Im Developer View schaut es dann so aus:

Code Auswählen Erweitern

<ftui-label id="ftui_label_259" margin="0" padding="0" text="<BINARY>" color="" unit="" size="-1" interval="0" width="" height="" top="" left=""></ftui-label>
Wahrscheinlich ist es dann ein 0xC3 0xB6. (für "ö")
Aber wie macht man da ein replace? "replace(0xC3B6,'ö')" geht zumindest nicht, wäre allerdings auch mühsam dass für alle Umlaute zu wiederholen.
Ich wüsste jetzt auch nicht wie ich prüfe, was letztendlich bei FTUI ankommt. (außer "BINARY")

[mr_petz]

Ich glaube da wird mit replace() auch nichts gehen...
Wenn da nur <BINARY> kommt, dann kann das ja alles mögliche mit 0,1 oder hex sein...
zu replace() wenn dann sollte es so gehen: replace(/\u00f6/g,'ö')
ö wäre im Übrigen 0x00F6...
LG

Edit:
Wenn es rein binary kommt, also so z.Bsp.: 01001000 (H) ,dann könntest du diesen code als pipe testen:

Code Auswählen Erweitern


t => t.split(' ').map(x => x = String.fromCharCode(parseInt(x, 2))).join('')


[OdfFhem]

Ich wüsste jetzt auch nicht wie ich prüfe, was letztendlich bei FTUI ankommt. (außer "BINARY")

*** Abarbeitung in der unicode-Umgebung
Es scheint ein FHEM-Problem zu sein, da die jsonlist2-Anfrage bereits den fraglichen Wert als falschen Text liefert:

Code Auswählen Erweitern

Value: "<BINARY>"
Der eigentliche Wert hätte "Restmüll, Gelber Sack" lauten sollen.
replace bringt hier nichts, da man den eigentlichen Wert gar nicht kennt.

*** Abarbeitung in der Standard-Umgebung
Es wird der erwartete Wert übertragen:

Code Auswählen Erweitern

Value: "Restmüll, Gelber Sack am 29.09.2022"

***
In beiden Umgebungen wird die Antwort in utf-8 transportiert.

[OdfFhem]

Verhalten wird durch jsonlist2 hervorgerufen - wohl ein Fall für @rudolfkoenig.

*** 98_JsonList2.pm ... Do not emit non-utf-8 data (Forum #55318)
my $b = "x$a";
$a = "<BINARY>" if(!utf8::decode($b)); # Forum #55318

*** encoding = unicode
a ... Restmüll, Gelber Sack am 29.09.2022
b ... xRestmüll, Gelber Sack am 29.09.2022
a ... <BINARY>

*** encoding = bytestream
a ... Restmüll, Gelber Sack am 29.09.2022
b ... xRestmüll, Gelber Sack am 29.09.2022
a ... Restmüll, Gelber Sack am 29.09.2022

[Adimarantis]

Das ist es.
Habe die Zeile in JsonList2 mal testweise auskommentiert und schon funktioniert es.
Jetzt fragt sich natürlich ob das irgendwelche anderen Seiteneffekte haben kann.

[OdfFhem]

Das ist es.

Ich habe schon mal vorab die morgen verfügbare Anpassung durch @rudolfkoenig getestet ... funktioniert jetzt in beiden Welten.

[Adimarantis]

Jetzt hätte ich noch einen anderen seltsamen Effekt:
Bei mir flackern ein paar Icons auf meinem Android 9 Hannspree Titan 3 Tablet.
Beim Testen am PC kann ich das nicht beobachten.

Hängt augenscheinlich mit einem Webcam Bild (snapshot) zusammen, dass ich mit "interval" aktualisiere.
Auf der selben Seite habe ich einen Wetterbericht mit animierten Icons von bas.
Ist mir bisher bei "Regen" oder "Schnee" Icons aufgefallen: Jedesmal wenn die Webcam aktualisiert, flackert das Icon unter dem "Regen" und die zwei rechts daneben im selben Tile. Erst war es eben nur ein Icon, weil der Regen am Tag4 war, als der auf Tag3 rutschte waren es dann drei Icons.
Der Zusammenhang mit der Webcam liess sich durch Änderung vom Interval klar nachweisen. Die Webcam selber flackert aber nicht.
Hab das Wetter Tile schon mal mit dem Tile rechts davon getauscht, was aber keinen Unterschied gemacht hat.

Hat das schon mal jemand beobachtet und evtl Ideen? Das Flackern ist schon etwas nervig, besonders wenn die Cam alle Sekunde aktualisiert.

[mkriegl]

Kann mir jemand mit Regex etc. helfen? Ich habe ein Reading (Datum) im Format 17.11.2022, will aber nur 17.11. anzeigen lassen.

In der alten Version hatte ich es mit data-part=(\d\d\.\d\d\.).* verwirklicht bekomme es aber in 3.0 nicht gebacken und habe schon Alles irgendwie ausprobiert

Danke