Schönere relative Zeitangaben / Patch für moment.js-Support

[peterk_de]

Hallo zusammen,

TabletUI bringt ja für Labels eine Substitutions-Funktion mit, die auch relative Zeitangaben kann. Also wenn man als (reeeiiin fiktives ) Beispiel einmal wissen will, vor wie lange die Katze zuletzt aufm Klo war, könnte man das so tun:

Code Auswählen Erweitern

<div data-type="label"
data-device="katzenkloDevice"
data-get="ReadingMitDemTimestamp"
data-substitution="toDate().ago()"
data-refresh="30"></div>

Das ist schonmal cool, die vergangene Zeit ist da und läuft sogar mit - FHEMWEB kann das gar nicht (dazu hatte ich vor ewig einmal ein kleines Javascript "nicedates.js" geschrieben - bei Interesse mal im Forum nach suchen). Leider ist die Formatierung in TabletUI aber, sagen wir einmal, für meinen Anwendungsfall etwas zu "rudimentär" und ... einfach häßlich. Es kommt soetwas heraus:

Code Auswählen Erweitern

7 Stunde(n), 42 Minute(n), 34 Sekunde(n)

Nun will ich nicht unbedingt auf die Sekunde genau wissen, wann die Katze aufm Klo war und dafür sehr viel Platz vergeuden - je länger es her ist, desto ungenauer darf es gern sein. Wenn man sich den Code von FTUI dafür anguckt, weiß man aber warum das so ist, es ist wahre Weltraumäffchenarbeit das ordentlich zu machen.

Daher mein Vorschlag: Eine Library dafür benutzen - https://momentjs.com Ich habe das mal testhalber in die aktuelle fhem-tablet-ui.js hineingepatcht (nach Date.prototype.ago suchen und den Inhalt der Funktion gegen das folgende tauschen):

Code Auswählen Erweitern

Date.prototype.ago = function (format) {

moment.locale(ftui.config.lang);

var timestamp =  moment(this);

if (!ftui.isValid(format)) {
return timestamp.fromNow();
} else if (format == "calendar") {
return timestamp.calendar();
} else {
return timestamp.format(format);
}
};

Fertig - mehr ist es nicht (man muss natürlich moment.js noch in /lib packen und in der eigenenHTML-Datei laden, siehe Link), schon stehen (fast) alle und sehr umfangreichen Möglichkeiten der Moment.js stehen zur Verfügung:

- Support für unzählige Sprachen
- Relative Angaben (z.B. vor x Minuten, vor y Tagen --> Genauigkeit automatisch)
- absolute Angaben (reine Formatierung nach Format-String, geht wie ohne Patch nach wie vor)
- Halbrelative Angabe wie z.B. Gestern, 13:30 Uhr (Format "calendar" bei moment.js, geht mit meinem Patch so: toDate().ago('calendar'))
- Automatisch auch zukünftige Angaben (in 30 Minuten)

... uund wenn man will, Auslagerung des Date-Parsings und deutliche Verkleinerung des Datums-Codes in FTUI.

@Setstate, wäre das nicht eine (evtl. optionale) Dependency wert? Man könnte ja auch dynamisch schauen, ob die Library da ist ...

Anbei noch ein Bild, wie schön das dann aussehen kann ... beide Button-Labels bekommen jeweils ein Reading, das einen FHEM-Timestamp liefert und dazu nur data-substitution="toDate().ago()"