FHEM Forum

FHEM => Frontends => TabletUI => Thema gestartet von: spooy99 am 12 Januar 2020, 11:57:26

Titel: FTUI - unterschiedlichen Inhalt bei mehreren Endgeräten (individuell) anzeigen
Beitrag von: spooy99 am 12 Januar 2020, 11:57:26
Hallo,

ich habe drei Wanddisplays auf denen je eine FTUI (läuft am Endgerät mit Fully) angezeigt wird. Die FTUI ist grundsätzlich bei allen erst mal identisch. Manche Seiten würde ich aber gerne individuell auf das Endgerät abstimmen wollen, ohne dabei je eine eigene Instanz der FTUI anzulegen.

Als Beispiel die Übersichtsseite - rechts ist noch frei (rote Markierung) und ich würde dort gerne (je Endgerät andere) Shortcuts hinterlegen

1.) Im EG steht im Raum des Display ein Onkyo-Radio und ein TV - dann eben den Power-Switch und z.B. Titelinfo vom Onkyo und TV anzeigen
2.) Im 1OG gibt es SONOS-Lautsprecher und Kamera - dann Info von Sonos und weiteres Kamerabild rechts anzeigen
3.) Im 2OG ist ein Yamaha-System und Heimkino ...

Also die linken 2/3 der Seite sind gleich - und das rechte Drittel eben je Display individuell angepasst.

Wie würdet Ihr das lösen - Idee wäre entweder die FTUI mit Parameter zu starten (screen=1) falls das geht oder kann Fully hier helfen und per JS die Device-Namen zurückliefern über den dann die FTUI angepasst wird ... ?

Bin für jeden Hinweis oder Gedanken dankbar ;-)

Gruß

Titel: Antw:FTUI - unterschiedlichen Inhalt bei mehreren Endgeräten (individuell) anzeigen
Beitrag von: Waldmensch am 12 Januar 2020, 12:05:44
Was spricht gegen eine zweite Index.html? Ich mache das schon immer so, weil ich manche Tablets hochkant betreibe.


Gesendet von iPhone mit Tapatalk
Titel: Antw:FTUI - unterschiedlichen Inhalt bei mehreren Endgeräten (individuell) anzeigen
Beitrag von: Thorsten Pferdekaemper am 12 Januar 2020, 16:52:25
Hi,
das hatten wir doch schonmal so ähnlich. Das hier ist zwar keine vollständige Lösung, aber vielleicht ein Schritt auf dem Weg:
https://forum.fhem.de/index.php/topic,104047.msg982123.html#msg982123
Gruß,
   Thorsten
Titel: Antw:FTUI - unterschiedlichen Inhalt bei mehreren Endgeräten (individuell) anzeigen
Beitrag von: OdfFhem am 13 Januar 2020, 09:05:50
Ich nutze u.a. folgende, frontseitige Vorgehensweise für das Abändern von data-*-Attributen.

Beispielhaft aufs Wesentliche reduziert:

  <div id="simplyCalview" data-type="calview" data-device="EinmalkalenderView" ...></div>
  <script>
    var x = document.getElementById("simplyCalview");
    if (navigator.userAgent.match(/Android/i)) {
      x.setAttribute("data-device","SchulferienkalenderView");
    } else if (navigator.userAgent.match(/Linux/i)) {
      x.setAttribute("data-device","FeiertagkalenderView");
    }
  </script>


Auf einem Android-Gerät werden die Schulferien, auf einem Linux-Gerät die Feiertage und ansonsten Einmal-Termine dargestellt ...


Strukturänderungen lassen sich darüber im Zweifel auch umsetzen, aber vielleicht könnte der Einsatz von FTUISRV hilfreicher sein ...
Titel: Antw:FTUI - unterschiedlichen Inhalt bei mehreren Endgeräten (individuell) anzeigen
Beitrag von: TWART016 am 27 März 2020, 22:43:54
Hier wude das über die Bildschirmbreite gemacht:
https://forum.fhem.de/index.php/topic,37378.msg591642.html#msg591642
(https://forum.fhem.de/index.php/topic,37378.msg591642.html#msg591642)

<script type="text/javascript">
  function getWidth()
  {
xWidth = null;
if(window.screen != null)
  xWidth = window.screen.availWidth;

if(window.innerWidth != null)
  xWidth = window.innerWidth;

if(document.body != null)
  xWidth = document.body.clientWidth;

return xWidth;
  }
</script>


<script type="text/javascript">
if (getWidth() == "1280" ) {
document.write('<meta name="widget_base_width" content="83">');
document.write('<meta name="widget_base_height" content="72">');
}
else {
document.write('<meta name="widget_base_width" content="60">');
document.write('<meta name="widget_base_height" content="52">');
};
</script>


<script type="text/javascript">
if (getWidth() == "1280" ) {
document.write('<link rel="stylesheet" type="text/css" href="css/fhem-tablet-ui-user-1280.css" />');
};
</script>