FTUI version 3

[setstate]

Und mit Label geht das nicht? Das text attribute wird doch ins innerHtml geschrieben.

[mr_petz]

Und mit Label geht das nicht? Das text attribute wird doch ins innerHtml geschrieben.

Da wird mehr nötig sein. Da sind ja auch Icons mit im spiel ...
Label geht ja auch nur auf state wenn ich das readingsgroup-device angebe oder?
Selbst wenn ich einen Response auf das Device mache, sehe ich nur die attr und internals.
Ich habe auch versucht das readingsgroup widget aus ftui2.x nachzuvollziehen, aber da werde ich nicht schlau.
Wie wurde denn das Html im widget aus fhem ausgelesen?
In fhem wird das Html der Readingsgroup per js erstellt. Zumindest lese ich es so
LG mr_petz

[OdfFhem]

Eigentlich gibt es kein get bei readingsGroup, aber get <readingsGroup> html gibt es trotzdem ...

[mr_petz]

Ok. Also müsste man nur ein get readingsgroup html als sendfhem erstellen?
Würde das im content gehen?
Kann es gerade nicht testen.
Oder würde es sogar so gehen?:

Code Auswählen Erweitern


<ftui-content [content]="readingsgroup html"></ftui-content>

Oder würde das .join(' ') fehlen?
LG

[setstate]

ich habe eine Möglichkeit gefunden. Ich werde ftui-content erweitern

[mr_petz]

Ok. Schön das du einen Weg gefunden hast.
Ich habe auch gerade mal gespielt aus langer weile und hinbekommen.
Die table wird direkt gelesen und so wie sie kommt angezeigt.
Bei mir ist nur das Frost SVG riesig groß und sprengt die Tabelle. Da muss man/ich bestimmt nochwas in fhem am css tunen...
In fhem ist es klein.
Ich bin mal auf deine Version gespannt. (du bist hier ja der Profi )
LG

Edit: Wenn man die fhemSVG´s in der RG verwendet und kein width/height angegeben hat, dann wird die Tabelle in FTUI übergroß.
Hat den Grund, weil sie ansich mit großer width und height angegeben sind.
Da sollte man aufpassen... denke ich.

[Stonemuc]

ich habe eine Möglichkeit gefunden. Ich werde ftui-content erweitern

Da freu ich mich..danke.

[setstate]

ich habe eine Möglichkeit gefunden. Ich werde ftui-content erweitern

ich habe es doch nicht im ftui-content eingebaut. Das passte alles nicht ins allgemeine Konzept. Es gibt jetzt im Binding eine neue Pipe-Function:
sendCommand()

Damit kann man durch eine Readingupdate ein Command an FHEM schicken und das Ergebnis in das Attribute schieben.

Code Auswählen Erweitern


  <ftui-label [text]="BadFenster | sendCommand('{countOpenWindows()}')"></ftui-label>


Damit kann man auch ein readingGroup HTML holen.

Code Auswählen Erweitern

   <ftui-content [content]="Sonos_Play5 | sendCommand('get Sonos_Play5RG_Favourites html')"></ftui-content>


Oder in Kurzform:

Code Auswählen Erweitern

   <ftui-content [content]="Sonos_Play5 | getHTML('Sonos_Play5RG_Favourites')"></ftui-content>


[hackepeter]

Schönen Sonntag euch allen,

ich habe mit dem Popup im Zusammenhang mit tab-view noch ein kleines Problem.
Das popup befindet sich im Tab "View_home". Es öffnet und schließt sich per dummy wie gewünscht. Auch händisch öffnet sich das popup wie gewünscht. Nur beim schließen (egal ob per "x" oder via Touch abseits des popups) ist kein Tab mehr aktiv - "View_home" sollte aber aktiv sein. In den beispielen und in der  Suche bin ich leider nicht fündig geworden.

Code Auswählen Erweitern

<ftui-grid base-width="100%" base-height="100%" margin="2" shape="round">  <!--keine ahnung ob das mit % richtig ist-->
<ftui-tab-view id="View_home">
  <!--************CAM Haus***************-->
<ftui-grid-tile row="3" col="3" height="4" width="5">
  <header>CamHaus</header>
  <ftui-tab view="View" direction="vertical">
<ftui-image src="http://192.168.178.13:88/cgi-bin/CGIProxy.fcgi?cmd=snapPicture2&usr=admin&pwd=xxxxx" interval="2" nocache height="100%" width="400px" popup-target="popupcam1"></ftui-image>
  </ftui-tab>
   </ftui-grid-tile>
</ftui-tab-view>
</ftui-grid>


  <!--************Popup CAM Haus***************-->
<ftui-popup id="popupcam1" [active]="camAlarm:192.168.178.13 | map('alarm: true, NoAlarm: false')"timeout="15" left="2%" top="2%" opacity="0" autoclose="10" position="page" height="92%" width="92%">
    <ftui-image src="http://192.168.178.13:88/cgi-bin/CGIProxy.fcgi?cmd=snapPicture2&usr=admin&pwd=xxxxx&t=" interval="2" nocache></ftui-image>
</ftui-popup>

[mr_petz]

@setstate
bezüglich der Anzeige von einer Readingsgroup.
du hast ja auch mit den Sonos_Favourits_RG getestet.
Da sind ja Standardmäßig onclick im <div> der einzelnen icons/images integriert.
Diese "Links" kann man ja so nicht nutzen, da sie mit der function FW_cmd() aus der fhemweb.js verknüpft sind.
Durch eine kleine funktion könnte man sie zum starten der FavouritesSender nutzen. Ich habe das zur Zeit so gelöst in einem script-tag der entsprechenden Seite:

Code Auswählen Erweitern


function FW_cmd(arg) {
  ftuiApp.fhemService.sendCommand(arg.replace('/fhem?XHR=1&cmd.Sonos_Bad%3D','').replace(/%20/g,' ').replace(/%2520/g,'%20'));
}

replace(/%20/g,' ') muss fürs set sein und
replace(/%2520/g,'%20') muss für den Favouriten sein.
Sonos_Bad muss natürlich durch das entsprechende Device ersetzt werden.
Könnte man es irgendwie ins FTUI3 integrieren?
Ansonsten funktioniert das holen der RG.
LG mr_petz

Edit. es gibt noch mehr "SonderUrlEncodes" im Favouritsnamen Bsp:
%2528 muss zu %28 werden und
%2529 zu %29
Die beiden sind ().
Da werden bestimmt auch noch mehr drin sein.
Die werden aber von fhem erstellt...

[2space]

Guten Abend,

ich muss gestehen, eigentlich bin ich erst auf Seite 49 dieses Megathreads. Trotzdem quält mich aktuell ein Problem mit ftui-icon und map:

Code Auswählen Erweitern

<ftui-icon [name]="WZ_Heizung:batteryLevel | map('1.8:battery-0, 2.0:battery-1, 2.3:battery-2, 2.5:battery-3, 2.8:battery')"
          [color]="WZ_Heizung:batteryLevel | map('1.8:danger, 2.0:warning, 2.3:success, 2.5:secondary, 2.8:green')">
</ftui-icon>

Erzeugt bei einem batteryLevel von 2.4 den Fehler: File not found: /opt/fhem/www/ftui//icons/2.4.svg

BatteryLevel wie 1.8 oder 2.0 welche das mapping treffen, werden korrekt dargestellt. Ist mir noch zu helfen? 

[LuGu]

Guten Abend,

ich muss gestehen, eigentlich bin ich erst auf Seite 49 dieses Megathreads. Trotzdem quält mich aktuell ein Problem mit ftui-icon und map:

Code Auswählen Erweitern

<ftui-icon [name]="WZ_Heizung:batteryLevel | map('1.8:battery-0, 2.0:battery-1, 2.3:battery-2, 2.5:battery-3, 2.8:battery')"
          [color]="WZ_Heizung:batteryLevel | map('1.8:danger, 2.0:warning, 2.3:success, 2.5:secondary, 2.8:green')">
</ftui-icon>

Erzeugt bei einem batteryLevel von 2.4 den Fehler: File not found: /opt/fhem/www/ftui//icons/2.4.svg

BatteryLevel wie 1.8 oder 2.0 welche das mapping treffen, werden korrekt dargestellt. Ist mir noch zu helfen? 

Wenn du fleißig weiterliest, wist du finden das man jetzt in deinem Fall statt map step nimmt.

Hier ist es erklärt:

https://forum.fhem.de/index.php/topic,123701.msg1182722.html#msg1182722

Gruß LuGu

[SirMarco]

Hallo zusammen

Ich nutze FTUI überwiegend auf Mobiledevices. Auf dem PC sieht es dann bescheiden aus.

Hätte ich gerne ein padding links und rechts von 10%
Das klappt auch wunderbar mit:

Code Auswählen Erweitern


@media screen and (min-width: 950px) {
    html {
        width: 100%;
        margin: 0;
        padding: 0;
    }
    body {
        width: 100%;
        margin-left: 10%;
        margin-right: 10%;
        padding: 0;
    }
}


Der view-content passt sich leider nicht an. Erst wenn ich in der view.component.js width: 100vw; auf width: 100%; ändere.
Hat jemand eine schönere Lösung?

Grüsse

PS: Kann ich eigentlich auch ein Bild direkt im Beitrag einfügen, anstatt Anhang? 

[grossmaggul]

Kann ich eigentlich auch ein Bild direkt im Beitrag einfügen, anstatt Anhang?

Nein, leider nicht.

[mr_petz]

Hallo zusammen

Ich nutze FTUI überwiegend auf Mobiledevices. Auf dem PC sieht es dann bescheiden aus.

Hätte ich gerne ein padding links und rechts von 10%
Das klappt auch wunderbar mit:

Code Auswählen Erweitern


@media screen and (min-width: 950px) {
    html {
        width: 100%;
        margin: 0;
        padding: 0;
    }
    body {
        width: 100%;
        margin-left: 10%;
        margin-right: 10%;
        padding: 0;
    }
}


Der view-content passt sich leider nicht an. Erst wenn ich in der view.component.js width: 100vw; auf width: 100%; ändere.
Hat jemand eine schönere Lösung?

Grüsse

PS: Kann ich eigentlich auch ein Bild direkt im Beitrag einfügen, anstatt Anhang? 

Ob das eine schönere Lösung ist, kann ich nicht sagen.

Code Auswählen Erweitern


body {
padding-left:10%;
}
ftui-view {
padding-left:10%;
}
ftui-view-item {
width:90%;
}
footer{
width:80%;
}


So wird alles ausser die ftui-view-toolbar zusammengerückt.
Diese bekomme ich nicht angesprochen da, wie du ja schon gesehen hast, nur die class .container hier zieht.
Da müsste setstate was ändern.
Ich hoffe das war so gemeint für PC-Browser???
LG