FTUI version 3

[Medel]

In der Version2 gab es das "scrolllabel",  gibt es die Möglichkeit einen Lauftext zu erzeugen auch bei der Version 3? Man kann zwar "scroll" einfügen aber dann werden ggf nur die Balken angezeigt

[mkriegl]

Ich könnte mal wieder Hilfe für einen Schönheitsfehler gebrauchen. Folgenden Code habe ich hinterlegt, dass ich mein Gäste-Wlan einschalte:

Code Auswählen Erweitern

        <ftui-button [(value)]="myfritz:guestWlan" [fill]="myfritz:box_guestWlan | map('off:outline, on:solid')">
        <ftui-icon path="../images/openautomation" name="it_router" size="3">
        <ftui-badge [text]="myfritz:box_guestWlanRemain"></ftui-badge>
        </ftui-icon>
        </ftui-button>


Leider ist der erste klick immer "set myfritz guestWlan on" auch wenn ich das Wlan bereits anderweitig eingeschaltet habe. Angezeigt wird ein aktives Wlan korrekt. Schöner wäre wenn er den Zustand wüsste und dann den gegensätzlichen Schaltbefehl gibt.

Ähnliches Problem habe ich bei meinen Shellys:

Code Auswählen Erweitern

        <ftui-button [value]="Shelly_PC:relay" (value)="set Shelly_PC toggle" [fill]="Shelly_PC:relay | map('off:outline, on:solid')" shape="circle" size="large">
                <ftui-icon path="../images/openautomation" name="it_pc" size="2"> <ftui-badge [text]="Shelly_PC:statEnergyDay"></ftui-badge>
                </ftui-icon>
        </ftui-button>


Der Status wird mittels Reading "Shelly_PC:relay" als on oder off gegeben geschalten wird aber mit "set Shelly_PC on/off/toggle". Ich hab jetzt einfach mal "toggle" gewählt. Dadurch wird ihm zwar ein "set Shelly_PC toggle on/off" (on/off ist dann zu viel) übergeben, aber er Schaltet wenigstens

[mr_petz]

@mkriegl

zur Fritzbox:
Wie hast du sie eingebunden?
bei [fill] hast du das Reading box_guestWlan mit on/off und bei [(value)] guestWlan

zum Shelly:
Bei mir werden die Readings state, POWER und Topicname in Großbuchstaben geschrieben.?
Also OFF und ON...
Ein set im (value) ist auch nicht nötig. du kannst mit states="toggle" im button arbeiten
Der setbefehl ist kleingeschrieben... also set shelly on

so vielleicht:?

Code Auswählen Erweitern


        <ftui-button [value]="Shelly_PC | map('ON:on,OFF:off')" (value)="Shelly_PC" [fill]="Shelly_PC | map('OFF:outline, ON:solid')" shape="circle" size="large">
                <ftui-icon path="../images/openautomation" name="it_pc" size="2"> <ftui-badge [text]="Shelly_PC:statEnergyDay"></ftui-badge>
                </ftui-icon>
        </ftui-button>


ein List von beiden ist hier hilfreich...

LG mr_petz

[mkriegl]

@mr_petz

1: Hab nochmal rein geschaut. Der Befehl heißt wirklich "set guestWlan on/off" Nur das Reading heißt "box_guestWlan"
Damit geht es dann:
<ftui-button [value]="myfritz:box_guestWlan" (value)="myfritz:guestWlan" [fill]="myfritz:box_guestWlan | map('off:outline, on:solid')">

Code Auswählen Erweitern


Internals:
   APICHECKED 1
   CFGFN      ./FHEM/Fritzbox.cfg
   FUUID     
   HOST       192.168.xxx.1
   INTERVAL   300
   LUAQUERY   1
   M3U_LOCAL  ./www/images/myfritz.m3u
   M3U_URL    unknown
   MODEL      FRITZ!Box xxxx
   NAME       myfritz
   NR         xxx
   REMOTE     1
   SECPORT    xxx
   STATE      WLAN: on gWLAN: on (Remain: 1440 min)
   TELNET     0
   TR064      1
   TYPE       FRITZBOX
   WEBCM      0
   eventCount 237
   Helper:
     DBLOG:
       box_cpuTemp:
         logdb:
           TIME       1670179714.25076
           VALUE      64
       box_guestWlan:
         logdb:
           TIME       1670179763.54141
           VALUE      on
       box_guestWlanRemain:
         logdb:
           TIME       1670179763.54141
           VALUE      1440
       box_powerRate:
         logdb:
           TIME       1670177314.27314
           VALUE      28
       box_rateDown:
         logdb:
           TIME       1670179714.25076
           VALUE      735.291
       box_rateUp:
         logdb:
           TIME       1670179714.25076
           VALUE      18.272
       state:
         logdb:
           TIME       1670179760.71753
           VALUE      guestWlan on
   READINGS:
     2022-12-04 19:48:34   alarm1          Wecker 1
     2022-12-04 19:48:34   alarm1_state    off
     2022-12-04 19:48:34   alarm1_target   FON 1
     2022-12-04 19:48:34   alarm1_time     00:00
     2022-12-04 19:48:34   alarm1_wdays    daily
     2022-12-04 19:48:34   alarm2          Wecker 2
     2022-12-04 19:48:34   alarm2_state    off
     2022-12-04 19:48:34   alarm2_target   FON 1
     2022-12-04 19:48:34   alarm2_time     00:00
     2022-12-04 19:48:34   alarm2_wdays    daily
     2022-12-04 19:48:34   alarm3          Wecker 3
     2022-12-04 19:48:34   alarm3_state    off
     2022-12-04 19:48:34   alarm3_target   FON 1
     2022-12-04 19:48:34   alarm3_time     00:00
     2022-12-04 19:48:34   alarm3_wdays    daily
     2022-12-04 19:48:34   box_connect     5
     2022-12-04 19:48:34   box_cpuTemp     64
     2022-12-04 19:48:34   box_dect        on
     2022-12-04 19:48:34   box_fwVersion   xxx.xx.xx
     2022-12-04 19:49:23   box_guestWlan   on
     2022-12-04 19:48:34   box_guestWlanCount 0
     2022-12-04 19:49:23   box_guestWlanRemain 1440
     2022-12-04 19:48:34   box_ipExtern    xx.xx.xx.xx
     2022-12-04 00:18:30   box_model       FRITZ!Box  [avm]
     2022-12-04 19:48:34   box_moh         default
     2022-12-04 19:48:34   box_powerRate   28
     2022-12-04 19:48:34   box_rateDown    735.291
     2022-12-04 19:49:23   box_rateDown_real 2.45097
     2022-12-04 19:48:34   box_rateUp      18.272
     2022-12-04 19:49:23   box_rateUp_real 0.0609066666666667
     2022-12-04 19:48:34   box_stdDialPort allFons
     2022-12-04 19:48:34   box_tr064       on
     2022-12-04 19:48:34   box_tr069       on
     2022-12-04 19:48:34   box_wlanCount   12
     2022-12-04 19:49:23   box_wlan_2.4GHz on
     2022-12-04 19:49:23   box_wlan_5GHz   on
     2022-12-04 19:48:34   dect1           - mad -
     2022-12-04 19:48:34   dect1_fwVersion 0.00
     2022-12-04 19:48:34   dect1_intRingTone HandsetDefault
     2022-12-04 19:48:34   dect1_intern    xxx
     2022-12-04 19:48:34   dect1_manufacturer x
     2022-12-04 19:48:34   dect1_model     0x00
     2022-12-04 19:48:34   fon1            Telefon
     2022-12-04 19:48:34   fon1_intern     1
     2022-12-04 19:48:34   fon2            Telefon
     2022-12-04 19:48:34   fon2_intern     2
     2022-12-04 19:48:34   gsm_internet    0
     2022-12-04 19:49:23   lastReadout     7 values captured in 2.80 s
     2022-12-04 19:48:34   mac_00_23_xx_xx_xx_xx xxx
     2022-12-04 19:49:23   state           WLAN: on gWLAN: on (Remain: 1440 min)
     2022-12-04 19:48:34   tam1            Anrufbeantworter
     2022-12-04 19:48:34   tam1_newMsg     0
     2022-12-04 19:48:34   tam1_oldMsg     0
     2022-12-04 19:48:34   tam1_state      on
     2022-12-04 19:48:34   user01          (guest)
     2022-12-04 19:48:34   user01_thisMonthTime 0:00
     2022-12-04 19:48:34   user01_todaySeconds 0
     2022-12-04 19:48:34   user01_todayTime 0:00
     2022-12-04 19:48:34   user01_type     Guest
     2022-12-04 19:48:34   userTicket01    622527
   fhem:
     LOCAL      0
     definedHost undefined
     is_double_wlan 1
     lastHour   0
     modulVersion $Date: 2020-06-06 13:11:54 +0200 (Sat, 06 Jun 2020) $
     radioCount 40
     sid        4
     sidTime    1670179763.53965
     610:
       brand      x
       id         1
       model      0x00
       userId     1
     landevice:
       192.168.xxx.1 maxbox
     radio:
       xx         
     wlanDevice:
       XX_XX_XX_XX_XX_XX:
         rssi       0
         speed      0
         speed_rx   0


   helper:
     TimerCmd   myfritz.Cmd
     TimerReadout myfritz.Readout
Attributes:
   allowTR064Command 1
   boxUser    fritzxxx
   event-on-change-reading box_cpuTemp,box_guestWlan,box_guestWlanRemain,box_powerRate,box_rateDown,box_rateUp
   fritzBoxIP 192.168.xxx.1
   group      FritzBox
   icon       it_router
   room       FritzBox
   userReadings box_rateDown_real {ReadingsVal("myfritz","box_rateDown",0)/300.0 },box_rateUp_real {ReadingsVal("myfritz","box_rateUp",0)/300.0}

2: ich habe jetzt nur (value)="Shelly_PC" angepasst und damit scheint es zu passen. Wenn ich aber mal wieder am PC bin, schau ich mir deinen Code genauer an

Code Auswählen Erweitern


Internals:
   CFGFN      ./FHEM/Shelly.cfg
   DEF        192.168.XXX.XX
   DURATION   0
   FUUID      63272805-f33f-d495-60fb-15f016e471773b6f
   INTERVAL   300
   NAME       Shelly_PC
   NR         406
   SHELLYID   shellyplug-s-D96EDA
   STATE      off
   TCPIP      192.168.xxx.xx
   TYPE       Shelly
   eventCount 148
   Helper:
     DBLOG:
       energy:
         logdb:
           TIME       1670177285.09166
           VALUE      6167.9
       inttemp:
         logdb:
           TIME       1670179985.90487
           VALUE      24.44
       power:
         logdb:
           TIME       1670176984.05097
           VALUE      0
       relay:
         logdb:
           TIME       1670176983.01712
           VALUE      off
       statEnergyDay:
         logdb:
           TIME       1670180395.10671
           VALUE      425.6
       state:
         logdb:
           TIME       1670176982.96977
           VALUE      toggle off
   READINGS:
     2022-11-08 14:11:33   cloud           enabled(connected)
     2022-12-04 19:08:05   energy          6167.9
     2022-11-08 14:06:31   firmware        v1.12.1
     2022-12-04 19:58:05   inttemp         24.77
     2022-12-04 00:18:15   network         <html>connected to <a href="http://192.168.xxx.xx">192.168.xxx.xx</a></html>
     2022-12-04 19:03:04   overpower       0
     2022-12-04 19:03:04   power           0
     2022-12-04 19:03:04   relay           off
     2022-12-04 19:59:55   statEnergy      Hour: 0.0 Day: 425.6 Month: 1245.5 Year: 5966.5 (since: 2022-11-09 )
     2022-12-04 19:59:55   statEnergyDay   425.6
     2022-12-03 23:59:55   statEnergyDayLast 272.0
     2022-12-04 19:59:55   statEnergyHour  0.0
     2022-12-04 19:59:55   statEnergyHourLast 3.8
     2022-12-04 19:59:55   statEnergyLast  Hour: 3.8 Day: 272.0 Month: 4721.0 Year: - (since: 2022-11-09 )
     2022-12-04 19:59:55   statEnergyMonth 1245.5
     2022-11-30 23:59:55   statEnergyMonthLast 4721.0
     2022-12-04 19:59:55   statEnergyYear  5966.5
     2022-12-04 19:59:55   statPowerDay    Min: 0.00 Avg: 20.73 Max: 61.91
     2022-12-03 23:59:55   statPowerDayLast Min: 0.00 Avg: 11.28 Max: 80.87
     2022-12-04 19:59:55   statPowerMonth  Min: 0.00 Avg: 13.27 Max: 100.06
     2022-11-30 23:59:55   statPowerMonthLast Min: 0.00 Avg: 9.06 Max: 105.56 (since:  )
     2022-12-04 19:59:55   statPowerYear   Min: 0.00 Avg: 9.68 Max: 105.56 (since:  )
     2022-12-04 19:03:03   state           off
   helper:
     _98_statistics Shelly_Statistics
Attributes:
   event-min-interval power:900
   event-on-change-reading relay,inttemp:1,power,energy,statEnergyDay
   event-on-update-reading statEnergyDay
   group      Shelly
   icon       it_pc
   interval   300
   model      shellyplug
   room       Shelly

Danke schon mal

[mr_petz]

@mr_petz

1: Hab nochmal rein geschaut. Der Befehl heißt wirklich "set guestWlan on/off" Nur das Reading heißt "box_guestWlan"

Dann solltest du hier auch die Bananas aus der Box holen:

Code Auswählen Erweitern


<ftui-button [value]="myfritz:box_guestWlan" (value)="myfritz:guestWlan" [fill]="myfritz:box_guestWlan | map('off:outline, on:solid')">


2: ich habe jetzt nur (value)="Shelly_PC" angepasst und damit scheint es zu passen. Wenn ich aber mal wieder am PC bin, schau ich mir deinen Code genauer an

Da könntest du doch auf [(value)]="Shelly_PC" gehen?

LG mr_petz

[mkriegl]

Danke dir
Fritzbox passt jetzt. Nach meinem Kommentar hatte ich nochmal nachgedacht und es so umgesetzt wie du geschrieben hast 

Shelly teste ich dann nochmal, aber denke bezogen auf state hast du recht 

Gruß .. Max

[mr_petz]

Danke dir
Fritzbox passt jetzt. Nach meinem Kommentar hatte ich nochmal nachgedacht und es so umgesetzt wie du geschrieben hast 

Nachdenken ist immer gut...

[mkriegl]

Meistens, ja. Hab mich heute nur zu wenig bewegt und war zu lang am PC - Kopf raucht 

Deine Thermostate muss ich mir jetzt irgendwann mal zu Gute nehmen. Hab bei mir nur aktuell die Situation zwei Stellventile im Wohnzimmer zu haben und weiß nicht ob man für battery und actuator beide anziegen lassen kann. Battery natürlich dann auch für Thermostat und Stellventil - da weiß ich nicht mehr ob es ein Beispiel gab.
Außerdem sind meine battery Stände aktuell noch in Volt.

Ansonsten haben die aber schon cool ausgeschaut. Chapeau

[meier81]

Hallo euch allen,

mal ne Frage an die Spezis: Kann es sein das die Funktion "@click" im Headerbereich der index.html nicht funkioniert? Bekomme hier die Fehlermeldung "TypeError: DWDWarnPop.open is not a function".

Ist es möglich hier ein popup aufzurufen, ich würde gerne im header ein Warnsymbol anzeigen falls eine Unwetterwarnung ansteht und wenn ich auf das icon klicke geht ein popup auf in dem ich die Details der Wetterwarnungen sehe.

Habe das zur Zeit so definiert:

Code Auswählen Erweitern

  <header>
    <ftui-row>
      <ftui-column width="15%"><ftui-clock format="hh:mm:ss" class="size-3" color="warning"></ftui-clock></ftui-column>
      <ftui-column width="5%">
        <ftui-icon name="_warning"
                   @click="DWDWarnPop.open()"
                   [hidden]="NN_xx_SW_DWD:a_count | step('0:true, 1:false')" class="size-0">
          <ftui-badge [text]="NN_xx_SW_DWD:a_count" class="size-0"></ftui-badge>
        </ftui-icon>
      </ftui-column>
      <ftui-column><ftui-tab-title class="size-3"></ftui-tab-title></ftui-column>
      <ftui-column width="20%"><ftui-clock format="eeee, DD. MMMM YYYY" class="size-3" color="warning"></ftui-clock></ftui-column>
    </ftui-row>
  </header>

Wie gesagt geht um die zweite column.

Gruß Markus

[MDietrich]

Hallo Markus,
ich vermute, dass @click zusammen mit einem Icon nicht funktioniert. Bei mir funktioniert es mit einem Button:

Code Auswählen Erweitern


<ftui-column>
<ftui-cell>
<ftui-button [color]="DWD:a_count | step('-1:dark, 1:danger, 10:danger')"> <!-- Änderung 2022-12-03: wg. Aufruf PopUp -->
<ftui-icon size="3" path="../images/myicons" @click="DWDWarnPop.open()"
[name]="d_recentChOfRain | step('0:umbrella_closed, 41:umbrella_open')"
[color]="WetterProplanta:temperature | step('-50:violett, -5:blue, 5:white, 25:red')">
<ftui-badge color="white" [text]="DWD:a_count" size="1">
</ftui-badge>
</ftui-icon>
</ftui-button>
</ftui-cell>
<ftui-cell>
<ftui-label scroll text-align="center" [text]="DWD:a_0_eventDesc"> </ftui-label>
</ftui-cell>
</ftui-column>

Dann muss du das PopUp noch einfügen, ob im Header oder im Body musst du ausprobieren.

Code Auswählen Erweitern


       <ftui-popup id="DWDWarnPop" timeout="0">

<ftui-label color="danger" slot="close" popup-close>Close</ftui-label>
<ftui-grid-tile row="10" col="3" height="3" width="7" padding="0">
<ftui-content file="dwd-warn_content.html"
device="DWD"
iconspath="icons/weather/wi"
dwdinterval="10">
</ftui-content>
</ftui-grid-tile>
</ftui-popup>


Gruß,
Matthias

P.S.: Das Thema ist hier m.E. besser aufgehoben: https://forum.fhem.de/index.php/topic,117858.0.html

[yersinia]

P.S.: Das Thema ist hier m.E. besser aufgehoben: https://forum.fhem.de/index.php/topic,117858.0.html

Neee, imho eigtl ein Thema hier, weil es um popup und nicht die Anzeige von DWD Warnungen geht.

Kann es sein das die Funktion "@click" im Headerbereich der index.html nicht funkioniert? Bekomme hier die Fehlermeldung "TypeError: DWDWarnPop.open is not a function".

Wo ist denn dein popup DWDWarnPop definiert? Die Funktion open() kommt von der popup.component.

Siehe Codeschnippsel von MDietrich:

Code Auswählen Erweitern

<ftui-popup id="DWDWarnPop" timeout="0">
[...]
</ftui-popup>
Du musst ein popup mit dem Inhalt aus DWDWarn definieren und dann kannst du dies öffnen. MDietrich zeigt, wie man es machen kann.

[meier81]

Ja, das es nicht direkt mit DWD zutun hat sondern mit der @click Funktion habe ich es auch hier gepostet.

Ich weiß auch nicht was hier gestern schief gelaufen ist, habe es zig mal probiert, ging nie. Eben heimgekommen, eure Posts gelesen, eigentlich wieder wie gestern eingebaut und geht.

Zur Info: Popup geht auch ohne Button einfach nur mit einem icon. Habe es jetzt bei mir so realisiert:

Mein Header-Bereich:

Code Auswählen Erweitern

  <header>
    <ftui-row>
      <ftui-column width="15%"><ftui-clock format="hh:mm:ss" class="size-3" color="warning"></ftui-clock></ftui-column>
      <ftui-column width="5%">
        <ftui-icon class="size-0" name="_warning" @click="DWDWarnPop.open()"
                   [hidden]="NN_xx_SW_DWD:a_count | step('0:true, 1:false')"></ftui-icon>
        <ftui-badge [text]="NN_xx_SW_DWD:a_count"
                    [hidden]="NN_xx_SW_DWD:a_count | step('0:true, 1:false')" class="size-0">
        </ftui-badge>
      </ftui-column>
      <ftui-column><ftui-tab-title class="size-3"></ftui-tab-title></ftui-column>
      <ftui-column width="20%"><ftui-clock format="eeee, DD. MMMM YYYY" class="size-3" color="warning"></ftui-clock></ftui-column>
    </ftui-row>
  </header>

Und dann unter dem footer und vor dem Ende vom body:

Code Auswählen Erweitern

  <ftui-popup id="DWDWarnPop" timeout="0">
    <header>DWD Wetterwarnungen</header>
    <ftui-content file="content-dwd_warnung-grid.html"
                  device="NN_xx_SW_DWD"
                  iconspath="icons/weather/wi"
                  dwdinterval="5">
    </ftui-content>
  </ftui-popup>

Damit wäre dieses Problem geklärt, zum Thema Slider bin ich auch weitergekommen, das poste ich dann aber im DWD-Thread.

Gruß Markus

[Carsten]

Moin!

Gibt es eine Möglichkeit, ein großes Popup aus einem kleinen Popup zu öffnen?

Ich habe ein 250 x 250 px großes Popup mit einem Thermostaten, aus dem ich gerne ein größeres Popup mit dem zugehörigen Chart öffnen würde.
Allerdings wird das "große" Popup innerhalb des kleinen angezeigt und alle Größen beziehen sich auf die Abmaße des kleinen Popups.

So sieht der Content des kleinen Popups aus:

Code Auswählen Erweitern


<ftui-cell>
<ftui-label bold size="3" >{{DispName}}</ftui-label>
</ftui-cell>
<ftui-thermostat class="size-1"
@click="pop_TGraph{{Device}}.open()"
[(value)]="{{Device}}:desired-temp"
[temp]="{{Device}}:measured-temp"
[valve]="{{Device}}:1.LEVEL"
[humidity]="{{Device}}:humidity"
has-zoom
step="0.5"
min="10"
max="30"
unit=" °C"         
></ftui-thermostat>         


<ftui-popup position="page" id="pop_TGraph{{Device}}" width="80%" height="80%" timeout="0">
<header>Verlauf a {{DispName}}</header>
    <ftui-content file="content/Diagramm_Heizung.html" Device="{{Device}}"></ftui-content>       
</ftui-popup>


[mr_petz]

Hi Carsten,
Das funktioniert nur wenn du das 2.Popup ausserhalb des 1. platzierst...
Also nicht mit im Content des 1.Popup..., irgendwo im view

Edit:
alternativ so (diese Integration ist nur nicht so gewollt ):
mit in´s @click:

Code Auswählen Erweitern


@click="pop_TGraph{{Device}}.open(); document.querySelector('#pop1').window.style.setProperty('display', 'contents');"


und in´s 2.popup:

Code Auswählen Erweitern


@close="setTimeout(()=>{document.querySelector('#pop1').window.style.removeProperty('display')},0);"


hier bei click und 2.popup #pop1 mit deiner id des 1.popup (kleineren) ersetzen: #...

LG

[meier81]

Guten Abend,

ich hatte es hier mal kurz erwähnt, nun nochmal ausführlich:

Ich habe bei mir einen swiper im Einsatz, der funktioniert auch soweit einwandfrei. Wenn ich diesen nun aber mit einem "header" definierte funktioniert der header auch einwandfrei, der Sliderbalken unten wird aber vermutlich nach unten aus dem Fenster geschoben und ist nicht mehr sichtbar.

Hat da jemand eine Idee wie ich dies vermeiden bzw. anpassen kann das der Balken sichtbar bleibt?