FTUI3 Testinstanz

Aus FHEMWiki
Version vom 19. Dezember 2022, 13:54 Uhr von Andreas r (Diskussion | Beiträge) (Die Seite wurde neu angelegt: „== Zielsetzung == Bei FTUI3 Updates werden unter Umständen Dinge angepasst, die bestehende Funktionen beeinträchtigen. Wie kann ich meine FTUI3 Installation…“)
(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)

Zielsetzung

Bei FTUI3 Updates werden unter Umständen Dinge angepasst, die bestehende Funktionen beeinträchtigen. Wie kann ich meine FTUI3 Installation davor schützen?

Umsetzung

Um den Betrieb möglichst wenig zu gefährden und die Akzeptanz in der Familie zu erhöhen, kopiert man das ftui Verzeichnis auf ein ftui_stable (siehe auch Quelltext unten) Verzeichnis und verwendet in Zukunft dieses Verzeichnis, um es auf den "produktiven" Geräten (Tablet im Wohnzimmer, Handy der Ehefrau usw.) anzuzeigen. Auf meinen "Testgeräten" (eigenes Handy, eigener PC) läuft immer das FTUI3 im Standard FTUI Verzeichnis.

So gelangen die Updates und auch eigene Weiterentwicklungen zunächst auf meine Testgeräte, bevor ich sie dann auf die Enduser ausgerollt werden. (per Kopie des ftui Folders auf den ftui_stable folder)

Optional: Um die Versionen noch besser unterscheidbar zu machen, kann noch folgende Erweiterung vorgenommen werden. Damit erreicht man, dass in der Test-Version ein entsprechendes Banner angezeigt wird, was in der produktiven Instanz dann nicht hinzugefügt wird. Außerdem zeigt die Testversion auch Toast Messages an.


 <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>

Das hinzugefügte DIV sollte man noch so stylen, z.B. durch hinzufügen des folgenden Eintrags in einer user.css Datei:

#div1 {
    color: red;
    text-align: center;
    z-index: 99;
    height: 30px;
    width: 100px;
    background-color: pink;
    right: 10px;
    position: absolute;
    padding: 10px;
    top: 10px;
}