FTUI version 3

[megadodopublications]

Hallo zusammen.

Mit
 

Code Auswählen Erweitern

<ftui-tab view="{{room}}" >
  <ftui-icon ...
kann ich bei Klick auf ein Icon einen View (Raum) anspringen.

In diesem Raum habe ich per Swiper verschiedene Ansichten "Heizung", Beleuchtung",..

Diese kann ich innerhalb des Raums anspringen
 

Code Auswählen Erweitern

<ftui-icon name="lightbulb-o" onclick="az_1.value = 'az_1_1'"></ftui-icon>

Tiptop soweit! (und noch einmal vielen Dank für die Hilfestellungen!)


Jetzt die nächste Herausforderung:

Gibt es eine Möglichkeit, bei Klick direkt in einen View/Raum *und* in eine Swiper Ansicht zu springen?
Also zB

Code Auswählen Erweitern

<ftui-tab view="{{room}}" id="{{room}}.value = 'xx'">   
(nur ein Beispiel, nein, so einfach geht es nicht..)

Danke und Gruss
Ralph

[grossmaggul]

Ich hatte auch das Phänomen

Wieso auch, ich hatte das Phänomen nicht, die Charts werden korrekt angezeigt, aber die Fehlermeldung kommt bei jedem Site reload und zwar drei Stück, für jede Chart eine.

Vielleicht hat es auch was damit zu tun, daß ich die über content aufrufe.

Aufruf

Code Auswählen Erweitern

<!-- Chart Thermostat -->
<ftui-content file="content/heizung_charts.html" titel="Thermostat"
                          y_label="Temperatur" label1="Ist" label2="Soll"
                          geraet="wz.thermostat" ist="temperature" soll="desiredTemperature"
                          farbe_ist="#d63056" hg-farbe_ist="#d6305650" farbe_soll="#d67054" hg-farbe_soll="#d6407650"
                          punkt_radius="0">
</ftui-content>

Und content file:

Code Auswählen Erweitern

<ftui-chart title="{{titel}}" y-label="{{y_label}}" y1-label="{{y1_label}}" unit="week">
       
            <ftui-chart-data fill label="{{label1}}"
                             background-color="{{hg-farbe_ist}}"
                             color="{{farbe_ist}}"
                             log="logdb"
                             file="history"
                             spec="{{geraet}}:{{ist}}"
                             point-radius="{{punkt_radius}}">
            </ftui-chart-data>
           
            <ftui-chart-data fill label="{{label2}}"
                             background-color="{{hg-farbe_soll}}"
                             color="{{farbe_soll}}"
                             log="logdb"
                             file="history"
                             spec="{{geraet}}:{{soll}}"
                             point-radius="{{punkt_radius}}">
            </ftui-chart-data>
               
            <ftui-chart-data fill label="{{label3}}"
                             background-color="{{hg-farbe_ventil}}"
                             color="{{farbe_ventil}}"
                             log="logdb"
                             file="history" 
                             spec="{{geraet}}:{{ventil}}"
                             y-axis-id="y1"
                             point-radius="{{punkt_radius}}">
            </ftui-chart-data>
               
            <ftui-chart-controls units="day,week,month"></ftui-chart-controls>
</ftui-chart>

[megadodopublications]

'Nabend,

die Übergabe einer URL als Parameter scheint nicht zu funktionieren.. ?

geht:

Code Auswählen Erweitern

<ftui-button class="size-3" @click="javascript:window.location.href='http://ambiente-schreibtisch.xxx.yy';">zu WLED</ftui-button>

geht nicht:

Code Auswählen Erweitern

@click="javascript:window.location.href='{{url}}';"
wobei die URL
so definiert wurde

Code Auswählen Erweitern

<ftui-content file="firehd8/tile-1x9-WLED.html"
device="MQTT2_WLED_AZ_Schreibtisch"
name="Schreibtisch"
url="'http://ambiente-schreibtisch.xx.yy''">
</ftui-content>

Hinweis / evtl relevant: der ftui-button steckt innerhalb des ftui-content noch in einem Popup.

Bug oder ist die Syntax fehlerhaft?

Vielen Dank vorab und Grüße
Ralph

[setstate]

Ein herzerfrischendes Moin vom achtern Diek vorweg!

Ich habe eine Frage bei der Darstellung von verschiedenen Images übereinander.

Ich möchte über ein Image von einem Grundriss einzelne Images von diversen Icons und anderen Images legen.
Bisher war es mir nur möglich diese untereinander oder nebeneinander zu legen.

Gibt es eine Möglichkeit die absoluten Koordinaten der Images/Icons anzugeben so dass dieser ggf, vorhandene Icons/Images ignoriert und diese darüber legt?

Das einbinden des vorhandenen Floorplans mittels <object> ist leider nicht von Erfolg gekrönt, da dort zwar das Hintergrundbild übertragen wird aber nicht die Bilder der Icons.

Danke für Eure Hilfe

Gruß
    Sailor

Das geht jetzt. Das Icon/Text muss innerhalb eines Images liegen:

Code Auswählen Erweitern


<ftui-image>
   <ftui-icon left="60%" top="50%"></ftui-icon>
</ftui-image>

Code Auswählen Erweitern


    <ftui-grid-tile row="1" col="1" height="1" width="1">
      <header>RELATIVE</header>

      <ftui-image src="https://pluspng.com/img-png/germany-png-file-map-germany-with-coats-of-arms-png-1971.png">

        <ftui-icon name="plane" color="red" left="60%" top="50%"></ftui-icon>
        <ftui-label text="A123" color="red" left="60%" top="calc(50% + 2em)"></ftui-label>

        <ftui-icon name="plane" color="black" left="20%" top="50%"></ftui-icon>
        <ftui-label text="A456" color="black" left="20%" top="calc(50% + 2em)"></ftui-label>

        <ftui-icon name="plane" color="white" left="50%" top="70%"></ftui-icon>
        <ftui-label text="A789" color="white" left="50%" top="calc(70% + 2em)"></ftui-label>

      </ftui-image>

    </ftui-grid-tile>


[Dracolein]

Bestätige (für Text): klappt super. Dankeschön

[Sailor]

Das geht jetzt. Das Icon/Text muss innerhalb eines Images liegen:

Und Image in Image?

Code Auswählen Erweitern


<ftui-image src    = "./images/GroundPlan.png"
height = "50%"
top    = "5%"
left   = "5%">
<ftui-image [src]  = "GR_SmokeDetector_Indicator | map('on:`./images/icoSmokeDetectorOn.gif`,  off:`./images/icoSmokeDetectorOff.gif`, lowBatt:`./images/icoSmokeDetectorLowBatt.gif`')"
height = "10%"
width  = "10%"
top    = "50%"
left   = "50%">
</ftui-image>
</ftui-image>


Gruß
    Sailor

[mr_petz]

@Sailor
Ich habe auch mal versucht das nachzustellen.
Image in Image geht zur Zeit bei mir nur so wie hier im Beispiel:

Code Auswählen Erweitern


<ftui-grid-tile row="5" col="7" height="auto" width="4" shape="round">
<header>Test</header>
  <ftui-image src="https://pluspng.com/img-png/germany-png-file-map-germany-with-coats-of-arms-png-1971.png">
   <ftui-image style="position:absolute;left:79%;top:55%" width="20px" height="20px" src="https://pluspng.com/img-png/star-png-star-icon-1600.png"></ftui-image>
  </ftui-image>
</ftui-grid-tile>

oder so:

Code Auswählen Erweitern


<ftui-grid-tile row="5" col="7" height="auto" width="4" shape="round">
  <header>TEST</header>     
   <ftui-image src="https://pluspng.com/img-png/germany-png-file-map-germany-with-coats-of-arms-png-1971.png"></ftui-image>
   <ftui-image style="position:absolute;top:55%;left:79%" width="20px" height="20px" src="https://pluspng.com/img-png/star-png-star-icon-1600.png"></ftui-image>
</ftui-grid-tile>


Edit Bild angehangen...

[megadodopublications]

Hallo zusammen,

auch auf die Gefahr hin dass ich nerve... noch eine Frage

gibt es auch innerhalb eines beliebigen Grid Elements (Row, Column, Cell,..) eine Möglichkeit mit Variablen zu arbeiten, die dann in den eingeschlossenen Elementen genutzt werden können ?
(Ausnahme: content, dort funktioniert das bereits prima) ?

also zB

Code Auswählen Erweitern

<ftui-cell device="meindevice" ....>
  <ftui-label [text]="{meindevice}...>

Vielen Dank und Grüße
Ralph.

[grossmaggul]

@megadodopublications: Würdest Du bitte Deinen Code in Codetags (oben in der Toolbar das #) einschließen, dann werden Deine Postings besser lesbar.

[Dracolein]

Allgemeine Frage, sagt mal beeinflussen (=behindern!) die allgemein nutzbaren Attribute "event-on-update-reading" bzw. "event-min-interval" auch die Aktualisierung von Readings?
Genannte Attribute nutze ich zur Steuerung von FileLogs, aber meine mir einzubilden, dass dadurch auch die dargestellten Readings in FTUI erheblich seltener aktualisiert werden?

[meier81]

Allgemeine Frage, sagt mal beeinflussen (=behindern!) die allgemein nutzbaren Attribute "event-on-update-reading" bzw. "event-min-interval" auch die Aktualisierung von Readings?
Genannte Attribute nutze ich zur Steuerung von FileLogs, aber meine mir einzubilden, dass dadurch auch die dargestellten Readings in FTUI erheblich seltener aktualisiert werden?

Hallo Dracolein, die Attribute beeinflussen die Aktualisierung deines readings eigentlich nicht, hier geht es vielmehr um das event welches ausgelöst wird. Wenn du z.B. ein doif hast und ein reading abfragst und du hast kein event-* gesetzt, dann wird jedes mal das doif getriggert wenn sich das reading aktualisiert, auch wenn das reading sich nicht geändert hat. Wenn du jetzt z.B. event-on-change-reading setzt, wird das doif nur noch getriggert wenn sich das reading vom Wert ändert. Das event-on-update-reading ist ja eigentlich der Standard in FHEM, das musst du eigentlich nicht extra setzen, das brauchst du nur in Kombination mit event-on-change-reading.

Hoffe mich korrigiert einer falls ich hier irgendwo was falsches geschrieben haben sollte 

[Dracolein]

Hallo Dracolein, die Attribute beeinflussen die Aktualisierung deines readings eigentlich nicht, [...]
Hoffe mich korrigiert einer falls ich hier irgendwo was falsches geschrieben haben sollte 

Danke, das fett markierte wollte ich wissen. Die Funktionalitäten der genannten Attribs sind mir bekannt; ein möglicher Einfluss auf die Aktualisierungsintervalle in der FTUI-Darstellung hingegen nicht.

[megadodopublications]

@megadodopublications: Würdest Du bitte Deinen Code in Codetags (oben in der Toolbar das #) einschließen, dann werden Deine Postings besser lesbar.

klar doch.

[megadodopublications]

geht nicht:

Code Auswählen Erweitern

@click="javascript:window.location.href='{{url}}';"
wobei die URL
so definiert wurde

Code Auswählen Erweitern

<ftui-content file="firehd8/tile-1x9-WLED.html"
device="MQTT2_WLED_AZ_Schreibtisch"
name="Schreibtisch"
url="'http://ambiente-schreibtisch.xx.yy''">
</ftui-content>

ich antworte mir mal selber, kann ggf noch jemand mal brauchen. So geht's

So gehts

Code Auswählen Erweitern

<ftui-content file="firehd8/tile-1x9-WLED.html"
device="MQTT2_WLED_AZ_Schreibtisch"
name="Schreibtisch"
url="javascript:window.location.href='http://ambiente-schreibtisch.xx.xx';">
</ftui-content>
[/quote]

und dann

Code Auswählen Erweitern


<ftui-button
class="size-3"
@click={{url}}>
zu WLED
</ftui-button>


VG
Ralph

[Dracolein]

Ich hätte da noch eine Optik-Anfrage, und zwar die Möglichkeit der "tiefgestellten Schrift" der dargestellten Einheit/Dimension bei Verwendung von

Code Auswählen Erweitern

unit="€" als Beispiel.


Sowas:
21°C