FTUI version 3

[DocCyber]

Hallo zusammen.

Ich möchte eine tabellenartige Liste innerhalb einer Kachel erstellen, die scrollbar ist (dafür das <DIV style="overflow">).
Das funktioniert so weit, aber wie bekomme ich es hin, den horizontalen Abstand FTUI-Komponenten so anzupassen, dass die verfügbare Breite einer Kachel ausgenutzt wird?

Code Auswählen Erweitern

<ftui-grid-tile row="11" col="3" height="7" width="12"
  <div style="overflow-y: auto;overflow-x: auto;">
    <ftui-column >
      <ftui-row margin-top="3" margin-bottom="3" >
        <ftui-column align-items="left" width="15%">
          <ftui-icon class="size--1" name="home"></ftui-icon>
        </ftui-column>
        <ftui-column align-items="left" width="25%">
          <ftui-label >Home</ftui-label>
        </ftui-column>
        <ftui-column  align-items="left"width="60%">
          <ftui-label>Übersicht</ftui-label>
        </ftui-column>
      </ftui-row>
     
      <ftui-row margin-top="3" margin-bottom="3">
        <ftui-column align-items="left">
          <ftui-icon class="size--1" name="fire"></ftui-icon>
        </ftui-column>
        <ftui-column align-items="left" >
          <ftui-label >Heizung</ftui-label>
        </ftui-column>
        <ftui-column  align-items="left">
          <ftui-label>Dachgeschoss</ftui-label>
        </ftui-column>
      </ftui-row>
     
      <ftui-row margin-top="3" margin-bottom="3">
        <ftui-column align-items="left">
          <ftui-icon class="size--1" name="cog"></ftui-icon>
        </ftui-column>
        <ftui-column align-items="left" >
          <ftui-label >Einstellungen</ftui-label>
        </ftui-column>
        <ftui-column  align-items="left">
          <ftui-label>Rollläden</ftui-label>
        </ftui-column>
      </ftui-row>
     
    </ftui-column>
  </div>
</ftui-grid-tile>

Ergebnis s. ScreenshotDu darfst diesen Dateianhang nicht ansehen.


Vielen Dank für eure Hilfe.

[Andre09]

Hallo zusammen,

Habe mir dank Euer Hilfe ein richtig starkes FTUI3 aufgebaut.
Jetzt habe ich mich gefragt ob es irgendwie die Möglichkeit gibt einen Timer zu realsieren, also das ich zb 15min einstelle und das Tablet am Ende piept.

Hintergrund ist, das das Tablet im Übergang Küche zu Wohnraum hängt und man öfter in der Küche einen Timer braucht den ich mir alternativ am Handy oder der Uhr sonst einstelle.

Vielleicht hat wer brauchbare intuitive Ideen ?

[juemuc]

Hi,

die Bausteine sind in FHEM definiert und in FTUI zur Anzeige gebracht.

Code Auswählen Erweitern

defmod EZ_Dimmdauer_PARAM dummy
attr EZ_Dimmdauer_PARAM devStateStyle style="text-align:right"
attr EZ_Dimmdauer_PARAM event-on-change-reading .*
attr EZ_Dimmdauer_PARAM group Esszimmerlampen
attr EZ_Dimmdauer_PARAM icon edit_settings@black
attr EZ_Dimmdauer_PARAM readingList timer_in_Min
attr EZ_Dimmdauer_PARAM room Parameter
attr EZ_Dimmdauer_PARAM setList timer_in_Min:slider,15,1,90
attr EZ_Dimmdauer_PARAM stateFormat {"Timer in Min: ".ReadingsVal($name,"timer_in_Min",0)." / "."Timer in Sek: ".ReadingsVal($name,"timer_in_Sek",0)." / "."Timer in Sek*10: ".ReadingsVal($name,"timer_in_Sek_Multi10",0)}
attr EZ_Dimmdauer_PARAM userReadings timer_in_Min

Code Auswählen Erweitern

defmod EZ_Lampe_dimmen_notify notify EZ_Lampe_dimmen_dummy.on\
    set HUEDevice9 ct 330 : pct 100;;\
    sleep 1;;\
    set HUEDevice9 pct 0 : transitiontime [EZ_Dimmdauer_PARAM:timer_in_Sek_Multi10];;\
    {my $t = ReadingsVal("EZ_Dimmdauer_PARAM","timer_in_Sek",0);;;;\
     startCountdown("EZ_Lampe_dimmen_dummy",$t)}
attr EZ_Lampe_dimmen_notify devStateStyle style="text-align:right"
attr EZ_Lampe_dimmen_notify group Esszimmerlampen
attr EZ_Lampe_dimmen_notify icon light_off-for-timer@black


Viele Grüße
Jürgen

[yersinia]

slice(start, end) müsste das eigtl schon erfüllen. Für Spezialfälle würde ich mal die (vielen, vielen sehr guten) Beispiele von mr_petz hier in diesem Thread suchen.

[DocCyber]

slice(start, end) müsste das eigtl schon erfüllen.

Perfekt - danke! 

[Jojo11]

Nochmal eine kurze Frage. Bei FTUI 2 konnte ich den stream meiner webcam stoppen indem ich die Variable, die den Link enthielt geleert habe (CAM01_stream_link).
Das hat im fully-Browser sehr zuverlässig funktioniert.
In FTUI3 mit folgendem Code

Code Auswählen Erweitern

<ftui-image id="img1" [src]="CAM01_stream_link" nocache width="100%" [hidden]="CAM01:hidden | map('on:false,off:true')"></ftui-image>

schaltet der stream nicht mehr ab, wenn src geleert wird. Mit [hidden] wird er zwar wie gewünscht ausgeblendet, aber im Hintergrund läuft der stream trotzdem weiter. Bei Wandtablet zu Hause kein Problem, aber per VPN unterwegs kann das schon ordentlich Daten ziehen, ohne dass man es bemerkt.
Nur ein manueller reload im Browser deaktiviert den stream.
Übersehe ich da irgendwas oder gibt es dafür eine Lösung?

[Jojo11]

Hallo zusammen,

gibt es eine Möglichkeit, die Funktion des "< Back"-Buttons oben link im Beispiel mobile_plain.html auf einen weiteren Button (irgendwo platziert auf der Unterseite) zu übertragen?
Evtl sogar in Kombination mit dem Footer aus dem Beispiel "mobile.html"?
Wenn das Telefon oben links die Kamera hat, ist die Platzierung etwas ungünstig 

Ich antworte mir mal selbst 
Ein

Code Auswählen Erweitern

onclick="this.closest('ftui-view-stage').goBack();"
in einem entsprechenden Icon macht den Job, ist aber wahrscheinlich nicht die sauberste Lösung.

[DocCyber]

Hallo zusammen.

Gibt es eine Möglichkeit, das device für die Notation device:reading als Ergebnis eines Ausdrucks festzulegen?
Ich könnte mir dafür ReadingsVal() oder eine andere, auch eigene Funktion vorstellen.

Allerdings habe ich keine Idee, wie das funktionieren könnte.
Vielleicht hat sonst jemand eine Lösung... @setstate oder @Thyraz ? 

[juemuc]

Hi,
was ist denn Dein Ziel?
Viele Grüße
Jürgen

[DocCyber]

Hallo Jürgen,

Deine Rückfrage ist berechtigt; ich habe es hier offenbar nicht klar genug beschrieben.
Ich habe mehrere Devices, deren Namen alle den Raumbezeichnungen KG1, KG2, ..., EG1, EG2, ..., OG1, OG, ..., DG1, DG2, ... entsprechen.
In jedem der Räume hängen Thermostate, deren Einstellungen ich flexibel festlegen will.
Dazu habe ich für jeden Raum eine Kachel <ftui-grid-tile> mit Informationen.
Bei Click auf die Kachel setze ich den Wert des Steuerungs-Dummy heatCtrl eben auf EG1, OG3, ... und aktiviere ein Popup [(active entspricht RegEx)].
Dieses Popup soll aber für alle Räume benutzt werden.
Im Popup selbst kann ich zwar auf heatCtrl zugreifen.
Aber dadurch erhalte ich eben nur den Namen des Raumes, nicht aber das Device gleichen Namens.
Ich brauche aber das Device (z.B. EG1), um innerhalb des Popups weitere Readings lesen und schreiben zu können.

Beispiel EG1:heatProg hat den Wert Abwesend . Das würde ich gern in <ftui-label> verwenden.
So könnte ich mir das vorstellen:

Code Auswählen Erweitern

<ftui-label [text]="`Value(heatCtrl)`:heatProg"></ftui-label>Und damit hätte ich genau das, was ich brauche:

Code Auswählen Erweitern

<ftui-label [text]="Abwesend"></ftui-label>
Vielleicht geht das ja ... oder kann so etwas noch einbauen?

[juemuc]

Hi DocCyber,
hast Du Dir einmal die Möglichkeiten von "content-Files" angesehen. So habe ich z.B. gleiche Geräte ausgelagert. Die Definition gilt dann für Geräte, mit denen das Contentfile aufgerufen wird.

Viele Grüße
Jürgen

[DocCyber]

hast Du Dir einmal die Möglichkeiten von "content-Files" angesehen

Ja, ich benutze <ftui-content> schon sehr intensiv, aber das reicht für meine Zwecke nicht.

Ich brauche schlicht eine Möglichkeit, das Ergebnis einer fhem - bzw. Perl-Funktion in einem <ftui-tag> zu verwenden, also so etwas:

Code Auswählen Erweitern

<ftui-label [text]="`Value(heatCtrl)`:heatProg"></ftui-label>
Damit ließen sich auch viele andere Problemchen lösen.

[juemuc]

Hallo zusammen,

ich benötige wieder einmal die Hilfe der "Formatierungsspezialisten" 

In einem Reading steht das Datum und die Uhrzeit in der Form "YYYY-MM-DD HH:MM:SS". Dies möchte in FTUI3 in der Form "TT.MM.YYYY HH:MM" anzeigen. Wer kann mir helfen?

Viele Grüße
Jürgen 

[MDietrich]

Hallo Jürgen,
versuche es einmal so:

Code Auswählen Erweitern

<ftui-label [text]="d_dummy1:state | toDate() | format('hh:mm.ss DD.MM.YYYY')"></ftui-label>

im dummy steht: 2024-01-04 15:46:02

Viel Spaß,
Matthias

[juemuc]

Hallo Matthias,

super. Vielen Dank.
Ich habe es noch so angepasst

Code Auswählen Erweitern

| toDate() | format('DD.MM.YYYY hh:mm')
Viele Grüße
Jürgen