Hallo zusammen,
ich betreibe derzeit eine FTUI3 Installation und habe diese auf meinem Tablet im Einsatz. Um den Betrieb möglichst wenig zu gefährden und die Akzeptanz in der Familie zu erhöhen, habe ich das ftui Verzeichnis auf ein ftui_stable Verzeichnis kopiert und zeige dieses auf meinen "produktiven" Geräten (Tablet im Wohnzimmer, Handy meiner Frau usw.) an.
Auf meinen "unwichtigen Geräten" (eigenes Handy, eigener PC) läuft immer das FTUI im Standard FTUI Verzeichnis.
So gelangen die Updates und auch meine Weiterentwicklungen zunächst auf meine eigenen Geräte, wo ich sie dann eine Zeit lang teste, bevor ich sie dann auf die Familie ausrolle. (per Kopie des ftui Folders auf den ftui_stable folder)
Falls das vielleicht für jemand interessant ist:
Folgenden Code habe ich zudem in der Seite untergebracht:
<script>
var url = $(location).attr('href');
var pathname = $(location).attr('pathname');
if (pathname.includes("ftui_stable")) {
$('<meta name="toast" content="0">').appendTo('head');
} else {
$('<div id="div1">Test-Version</div>').appendTo('body');
$('<meta name="toast" content="1">').appendTo('head');
$('<meta name="toast_position" content="topLeft">').appendTo('head');
}
</script>
in der User.css
#div1 {
color: red;
text-align: center;
z-index: 99;
height: 30px;
width: 100px;
background-color: pink;
right: 10px;
position: absolute;
padding: 10px;
top: 10px;
}
Das Skript prüft, ob die aufgerufene Instanz die Test oder die produktive ist und blendet dann zum einen einen Banner ein, der zeigt, dass es sich um die Testversion handelt und zum anderen die Toast Funktion aktiviert. Produktiv sind dann die Toast Messages deaktiviert und es wird logischerweise kein Banner angezeigt.
Vielleicht kann das ja jemand als Anregung brauchen.
VG, Andreas
Hi Andreas,
finde die Idee echt gut, habe die eben mal auf die Schnelle versucht nachzubauen, funktioniert aber leider bei mir nicht, weder der Banner noch die Deaktivierung der Toast-Messages.
Hab eine neue User.css angelegt mit genau dem Inhalt von dir, diese dann oben in der index.html definiert und in der index.html fast ganz oben in index dein script eingefügt, es tut sich aber leider nichts.
Hast du noch eine Idee?
Gruß Markus
Grundsätzlich kann die Idee wirklich nützlich sein.
Ich würde aber ungern auf jQuery zurückgreifen wollen, da auch FTUI3 selbst auf reines JavaScript setzt.
jQuery-freies Script für FTUI3
Muss in den body tag:
<script>
if (this.location.pathname.includes("ftui_stable")) {
document.head.innerHTML += '<meta name="toast" content="0">';
} else {
document.head.innerHTML += '<meta name="toast" content="1">';
document.head.innerHTML += '<meta name="toast_position" content="topLeft">';
document.body.innerHTML += '<div id="div1">Test-Version</div>';
}
</script>
pathname 'ftui_stable' muss existieren oder angepasst werden...
Dann noch die css von #1 im style tag oder user.css.
LG
Ja, das sollte man wohl noch erwähnen, sorry:
1) Die Seite muss einen Verweis auf jquery (im html header) haben:
<script src="modules/jquery-3.6.1.min.js"
integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script> (http://<script%20src="modules/jquery-3.6.1.min.js"%3Cbr%20/%3E %20 %20integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ="%20crossorigin="anonymous"></script>)
2) Das Skript selber muss - wie mr_petz richtig sagt - in den html body, am besten als erste Anweisung.
3) Das CSS File (hier user.css) muss existieren und auch im html header verlinkt sein:
<link href="user.css" rel="stylesheet" type="text/css" /> (http://<link%20href="user.css"%20rel="stylesheet"%20type="text/css"%20/>)
4) der Ordner muss ftui_stable heissen oder man muss das Skript anpassen.
1) und 4) hatte ich leider unterschlagen, weil das bei mir "sowieso" schon in der Seite enthalten war.
VG, Andreas
Zitat von: andreas_r am 01 November 2022, 20:26:11
1) Die Seite muss einen Verweis auf jquery (im html header) haben:
- Greift man auf das jQuery-freie script-Tag in Antwort #3 zurück, dann kann man 1) ignorieren
- Greift man auf das auf jQuery zurückgreifende script-Tag aus dem ersten Beitrag zurück, dann hat der "Normalnutzer" vermutlich ein Problem, da jQuery nicht mit FTUI3 ausgeliefert wird ... weitere Infos wären u.U. hilfreich.
Zitat von: mr_petz am 01 November 2022, 18:56:37
jQuery-freies Script für FTUI3
Muss in den body tag:
<script>
if (this.location.pathname.includes("ftui_stable")) {
document.head.innerHTML += '<meta name="toast" content="0">';
} else {
document.head.innerHTML += '<meta name="toast" content="1">';
document.head.innerHTML += '<meta name="toast_position" content="topLeft">';
document.body.innerHTML += '<div id="div1">Test-Version</div>';
}
</script>
pathname 'ftui_stable' muss existieren oder angepasst werden...
Dann noch die css von #1 im style tag oder user.css.
LG
So, hab das heute Abend mal so umgesetzt, funktioniert einwandfrei und ohne jQuery :D
Muss das noch ein bisschen verfeinern und anpassen, denke das ist aber ein super Weg eine Produktiv- und eine Entwicklungsseite zu machen bzw. zu unterscheiden.
LG Markus
@Markus: Wenn Du noch weitere Ideen hast, bitte gern auch hier posten. Ich bin gespannt, was sich bei dem Ansatz noch optimieren lässt.
VG, Andreas
@andreas_r
Es ist schön das du im wiki die Einträge erstellst.
Einer muss ja mal anfangen... ;)
https://wiki.fhem.de/wiki/FTUI3_Testinstanz
Ich würde aber wie hier in diesen Posts erwähnt auf ein jQuery-freies Script für FTUI3 verweisen.
https://forum.fhem.de/index.php/topic,129881.msg1242708.html#msg1242708
LG
Danke für den HInweis, ist erledigt.
VG
Hallo,
in FTUI2 gab es ftui.version, gibt es was vergleichbares unter FTUI3?
<div class="tiny left top inline" data-bind="ftui.version"></div>
Gruß
Eisix
Zitat von: Eisix am 09 Januar 2023, 08:25:42
gibt es was vergleichbares unter FTUI3?
"ftuiApp.version" sollte funktionieren ...
so tut es nicht
<div class="size-0" data-bind="ftui.version"></div>
andere syntax?
Zitat von: Eisix am 09 Januar 2023, 12:49:02
so tut es nicht
<div class="size-0" data-bind="ftui.version"></div>
andere syntax?
Bei mir läuft es so:
<script>
loadFtuiVersion()
function loadFtuiVersion() {
clearTimeout(this.wait);
if (typeof ftuiApp === "undefined") {
this.wait = setTimeout(()=>loadFtuiVersion(),10);
} else {
clearTimeout(this.wait);
ftuiversion.innerText = ftuiApp.version;
}
};
</script>
<ftui-label id="ftuiversion"></ftui-label>
LG
"ftuiApp.version" steht allgemein zur Verfügung.
Um auf gebräuchliche FTUI3-Art darauf zugreifen zu können, benötigt man z.B. ein Event ...
Beispiele:
<ftui-label [text]="ftui-isDark | ()=>ftuiApp.version"></ftui-label>
oder
<ftui-label [text]="device:reading | ()=>ftuiApp.version"></ftui-label>
Ergebnis ist derzeit: 3.3.0
Zitat von: OdfFhem am 10 Januar 2023, 02:28:01
"ftuiApp.version" steht allgemein zur Verfügung
Das stimmt, aber bei mir erst nach ca. 100-200ms wenn ich es direkt ohne Event einbinden will. Deshalb die Bedingung mit Timeout....
Man könnte natürlich auf irgendein Device gehen, aber wenn sich das ändert oder nicht mehr existiert geht das mit Event nicht mehr...
LG
Zitat von: mr_petz am 10 Januar 2023, 09:14:39
Das stimmt, aber bei mir erst nach ca. 100-200ms wenn ich es direkt ohne Event einbinden will. Deshalb die Bedingung mit Timeout....
Geht natürlich, aber ich nutze FTUI3 lieber "innerhalb" von FTUI3 ...
Zitat von: mr_petz am 10 Januar 2023, 09:14:39
Man könnte natürlich auf irgendein Device gehen, aber wenn sich das ändert oder nicht mehr existiert geht das mit Event nicht mehr...
- das Device hat sich nicht geändert und gibt es auch noch ... das Event kommt also ... ftuiApp.version gibt es aber leider nicht mehr ...
- "ftui-isDark" ist (übrigens) kein Device ... könnte aber natürlich auch irgendwann weg sein ...
Wie oft oder meistens: es gibt viele Möglichkeiten, aber kaum eine ist vor allen Änderungen sicher ... ;)
Zitat von: OdfFhem am 10 Januar 2023, 22:39:12
Geht natürlich, aber ich nutze FTUI3 lieber "innerhalb" von FTUI3 ...
Wie meinst du das?
Meine neue Testumgebung ist fhem in/auf windows und FTUI3 in chrome als Browser auf dem selben Gerät(Laptop) und da ist das so mit den 100-200ms...
Edit: verstehe jetzt, weil ich ein extrascript habe... Richtig?
Zitat von: mr_petz am 11 Januar 2023, 09:11:57
Edit: verstehe jetzt, weil ich ein extrascript habe... Richtig?
Ich versuche es mal etwas anders zu formulieren:
Ich will die Version von FTUI3 ausgeben - allerdings möglichst mit Mitteln von FTUI3.
Dazu nutze ich einfach eine der Web-Komponenten, die autom. erst zum "Auswerten" kommt, wenn ftuiApp bereits (vor langer Zeit) initialisiert wurde.
Ob die benötigte Komponente auf der Hauptebene oder in einer tieferliegenden content-Ebene liegt, sollte dabei keine Rolle spielen - auch unabhängig davon, wann die Unterebene geladen wird.