Hallo zusammen,
ich habe derzeit eine FTUI3 Oberfläche im Testbetrieb, die auf einem Tablet läuft. Ich verwende ein ftui-grid mit mehreren Unterseiten, die jede als ftui-tab-view realisiert sind.
Meine Frage: Gibt es eine Möglichkeit, nach einer bestimmten Zeit (oder Zeit von Inaktivität) automatisch auf die erste Default Unterseite zu springen?
Viele Grüße,
Andreas
<ftui-tab view="View2" size="large" timeout="60">
kombiniert mit
<ftui-tab view="View1" size="large" active>
active = Definition der Defaultseite
timeout = Rückkehrzeit in Sekunden
Danke, das war es.
Noch eine Frage: geht das irgendwie auch bei der mobilen Variante, bei der ja die ftui-view statt des ftui-tab verwendet wird?
Ich habe hier mal auf die Schnelle ebenfalls eine ftui-view als active gekennzeichnet und eine zweite ftui-view mit dem timeout versehen, aber das scheint nicht zu klappen.
Und noch was:Gibt es eine Möglichkeit (zB per URL Parameter o.ä.) die FTUI3 Seite aufzurufen und direkt auf eine andere View zu gehen als die, die im Standard als "Active" gekennzeichnet ist?
Viele Grüße,
Andreas
auf der mobilen Seite musst du das wie hier im example im footer lösen:
https://github.com/knowthelist/ftui/blob/master/www/ftui/examples/mobile.html#L92
Bsp:
<footer class="row fixed border-top">
<ftui-tab fill="clear" direction="vertical" view="View1" title="Tab1" active>
<ftui-icon name="home"></ftui-icon>
<label class="small">Tab1</label>
</ftui-tab>
<ftui-tab fill="clear" direction="vertical" view="View2" title="Tab2" timeout="60">
<ftui-icon name="cog"></ftui-icon>
<label class="small">Tab2</label>
</ftui-tab>
<ftui-tab fill="clear" direction="vertical" view="View3" title="Tab3" timeout="60">
<ftui-icon name="clock-o"></ftui-icon>
<label class="small">Tab3</label>
</ftui-tab>
</footer>
Um dir besser helfen zu können, solltest du deinen Code der Seite posten...
Zitat von: andreas_r am 11 Oktober 2022, 08:56:56
Und noch was:Gibt es eine Möglichkeit (zB per URL Parameter o.ä.) die FTUI3 Seite aufzurufen und direkt auf eine andere View zu gehen als die, die im Standard als "Active" gekennzeichnet ist?
Hier solltest du die SuFu im Hauptthread benutzen, da wirst du fündig...
LG
Hallo,
ich habe es ohne den Footer aufgesetzt. Meine mobile Seite hat (gekürzt) folgende Struktur:
</ftui-view-stage>
<ftui-view id="home" active>
<ftui-view-toolbar>Hausautomatisierung</ftui-view-toolbar>
<ftui-view-item target="eg">
<ftui-icon name="arrow-down" color="blue" slot="start" invert></ftui-icon>
Erdgeschoss
</ftui-view-item>
<ftui-view-item target="og">
<ftui-icon name="arrow-up" color="blue" slot="start" invert></ftui-icon>
1. Stock
</ftui-view-item>
</ftui-view>
<ftui-view id="og">
<ftui-view-toolbar>
<ftui-nav-link slot="start"></ftui-nav-link>
1. Stock
</ftui-view-toolbar>
...
</ftui-view>
<ftui-view id="eg">
<ftui-view-toolbar>
<ftui-nav-link slot="start"></ftui-nav-link>
Erdgeschoss
</ftui-view-toolbar>
...
</ftui-view>
</ftui-view-stage>
Kann ich hier ebenfalls irgendwie auf die "home" View zurückkehren?
Und zur anderen Frage: Habe das hier gefunden:
https://forum.fhem.de/index.php/topic,115259.msg1232877.html#msg1232877 (https://forum.fhem.de/index.php/topic,115259.msg1232877.html#msg1232877)
Leider klappt der Aufruf mit dem URL Parameter nicht. Brauche ich hier eine besondere FTUI Version?
Viele Grüße
Zitat von: andreas_r am 11 Oktober 2022, 17:08:07
Und zur anderen Frage: Habe das hier gefunden:
https://forum.fhem.de/index.php/topic,115259.msg1232877.html#msg1232877 (https://forum.fhem.de/index.php/topic,115259.msg1232877.html#msg1232877)
Leider klappt der Aufruf mit dem URL Parameter nicht. Brauche ich hier eine besondere FTUI Version?
Dies ist bislang nur eine individuelle Erweiterung. Ich kann die Anpassungen bereitstellen, aber besser wäre das Feature im Original aufgehoben ...
Wäre super, wenn Du das hier zumindest posten könntest.
VG, Andreas
Ich hatte mal was für ftui-tab programmiert:
https://forum.fhem.de/index.php/topic,115259.msg1196540.html#msg1196540
bis setstate das integriert hatte.
Jetzt gebe ich dir eine Version für die Mobile Ansicht:
@click="clearTimeout(this.timer);this.timer = setTimeout(() => ftuiHelper.selectAll('ftui-view').forEach(elem => {elem.id==='home'?elem.removeAttribute('outside'):elem.setAttribute('outside','')}),10000);"
hier geht es nach 10sec zurück zu id 'home' egal wo du hin navigierst
Also für dich:
<ftui-view-stage @click="clearTimeout(this.timer);this.timer = setTimeout(() => ftuiHelper.selectAll('ftui-view').forEach(elem => {elem.id==='home'?elem.removeAttribute('outside'):elem.setAttribute('outside','')}),10000);">
<ftui-view id="home">
Ich bin natürlich auch an @OdfFhem´s Lösung interessiert... :D
LG
Edit: Hier war noch meine "Linklösung":
https://forum.fhem.de/index.php/topic,115259.msg1207098.html#msg1207098
Edit2: Im ftui-view-stage ist der @click besser, da dann der timer auch bei den ftui-view-item´s neu gesetzt und ausgeführt wird...
@andreas_r, @mr_petz
Kann ich gerne posten, wird aber nix vor Freitag ...
@mr_petz: Super, danke Dir für die Rückmeldung. Ich hätte es wahrscheinlich jetzt (ohne Deine elegante Variante hier) so gelöst, dass ich einen URL Parameter mitgegeben hätte, der dann von einem eigenen Javascript ausgewertet worden wäre, das - ähnlich wie Dein Skript - die Elemente durchgegangen wäre und die Outside Attribute entsprechend gesetzt hätte. Aber so ist es natürlich viel schöner gelöst. Ich wusste gar nicht, dass man das Click Event entsprechend nutzen kann. Ich dachte, dass geht nur bei den Objekten, die in der Doku erwähnt sind.
@OdfFhem: ich bin ebenfalls gespannt auf Deine Lösung. Vielleicht können wir ja einen Pull Request machen, der die Änderung enthält.
Viele Grüße
Zitat von: OdfFhem am 11 Oktober 2022, 21:16:39
Kann ich gerne posten, wird aber nix vor Freitag ...
... gerade noch Freitag ;D
Bei mir habe ich zum Thema folgende Anpassungen vorgenommen ... ob's jeden Anwendungsfall abdeckt, wäre noch zu klären:
ftui.app.js (lt. GitHub-Stand vom heutigen Tag, vor Zeile #60 einfügen)
//
this.initialView = (new URLSearchParams(window.location.search)).get('initialView');
this.homeView = (new URLSearchParams(window.location.search)).get('homeView');
tab.component.js (lt. GitHub-Stand vom heutigen Tag: Part #1 vor Zeile #24 einfügen; Zeile #97 mit Part #2 ersetzen)
// Part #1
selectAll(`ftui-tab[group="${this.group}"]`).forEach(elem => {
if (window.ftuiApp.initialView) (elem.view === window.ftuiApp.initialView)?elem.setAttribute("active","active"):elem.removeAttribute('active');
if (window.ftuiApp.homeView) (elem.view === window.ftuiApp.homeView)?elem.setAttribute("home","home"):elem.removeAttribute('home');
});
// Part #2
if ((homeElem) && (homeElem.id !== this.id)) {
Neben der index-Datei kann man nun mit dem Parameter initialView die Startansicht und mit dem Parameter homeView die Standardansicht beeinflussen.
http://raspberrypiX:8083/fhem/ftui3/index_X.html
http://raspberrypiX:8083/fhem/ftui3/index_X.html?initialView=View6
http://raspberrypiX:8083/fhem/ftui3/index_X.html?homeView=View3
http://raspberrypiX:8083/fhem/ftui3/index_X.html?initialView=View6&homeView=View3
Zitat von: OdfFhem am 14 Oktober 2022, 23:43:28
... gerade noch Freitag ;D
Da hast du ja nochmal Glück gehabt. ;) Sonst wäre hier vielleicht noch ein Shitstorm los gegangen... ;D
Danke für deine Veröffentlichung. Man muss immer nur eins bedenken... Bei jedem UpdateAll is es weg....
LG
Zitat von: mr_petz am 15 Oktober 2022, 00:32:54
Man muss immer nur eins bedenken... Bei jedem UpdateAll is es weg....
Stimmt ... oder setstate übernimmt es (so oder so ähnlich).
Praktisch ist auf jeden Fall, dass man je nach Raum die gleiche Oberfläche, aber im Zweifel eine "passendere" Startseite hat.
@OdfFhem: Vielen Dank für Deine Lösung. Funktioniert super.
Also mein Vote hättest Du dafür, dass setstate das mit in den Standard übernimmt.
Viele Grüße und nochmal Danke!
Ich habe die Änderungen mal als Pull Request gestellt
https://github.com/knowthelist/ftui/pull/42
VG, Andreas
Zitat von: Dracolein am 10 Oktober 2022, 10:20:49
<ftui-tab view="View2" size="large" timeout="60">
kombiniert mit
<ftui-tab view="View1" size="large" active>
active = Definition der Defaultseite
timeout = Rückkehrzeit in Sekunden
Moin,
würde das auch gern bei mir einbauen, allerdings sehen die <ftui-tab> Tags bei mir anders aus?!
Bei mir werden die Tabs mit
<ftui-tab-view id="View1">
geöffnet, nicht wie in deinem Beispiel mit
<ftui-tab view="View1">
Die Parameter funktionieren bei mir auch nicht...
Muss ich meine index.html umarbeiten oder was wäre hier die Lösung?
Vielen Dank!
Gruß
Sascha
setz doch einfach den ftui-tab blind mit rein und Verweise auf deinen ftui-tab-view:
Bsp:
<ftui-tab view="View1" style="pointer-events:none;min-height:0;width:0;height:0" active></ftui-tab>
<ftui-tab-view id="View1" size="large"></ftui-tab-view>
Ich frage mich nur wie du die ftui-tab-view Seiten aufrufst???
LG
@C0mmanda
Zitat von: mr_petz am 18 Oktober 2022, 20:00:14
Ich frage mich nur wie du die ftui-tab-view Seiten aufrufst???
Das frage ich mich auch gerade ... wäre interessant, wie Du die Views "verwaltest" ... kannst Du einen kleinen Ausschnitt zeigen ?
Oh Mann... :(
Jetzt hab ich es auch gefunden..
Nutze komplett den Standard, habe aber an der falschen Stelle geschaut. Sorry.
Fange gerade erst mit FTUI3 an und finde mich noch nicht so gut zurecht.
Es funktioniert jetzt, Danke! :)
Gruß
Nur noch der Vollständigkeit halber: Setstate hat den Pull Request (https://github.com/knowthelist/ftui/pull/42 (https://github.com/knowthelist/ftui/pull/42)) dankenswerterweise übernommen. Die Funktion ist jetzt also im Standard vorhanden.
Thanks@all!
VG, Andreas