Ich greife von mehreren Geräten auf FTUI zu, möchte aber an unterschiedlichen Geräten unterschiedliche Styles nutzen.
Wie kann ich nun in der FTUI-html-Seite informationen über das benutze Anzeigegerät bekommen um dieses unterscheiden zu können?
Alternativ könnte man den bevorzugten Style auch lokal in einem Cookie speichern, aber wie lässt sich sowas umsetzen?
wenn Du nichts gegen jquery auf Deiner Seite hast (könntest Du ja auch lokal einbinden), könntest Du es so machen:
<script type="text/javascript">
jQuery(document).ready(function ($) {
var deviceAgent = navigator.userAgent.toLowerCase();
var agentID = deviceAgent.match(/(iphone|ipod|ipad)/);
if (agentID) {
window.location.replace("index_mobile.html");
}
});
IN diesem Beispiel würde auf die Seite index_mobile.html weitergeleitet werden, wenn sich das Gerät als iPhone oder iPod oder iPad ausgibt.
Eine Umleitung anhand der Bildschirmgrößen wäre analog denkbar.
VG, Andreas
Danke dir! Das ist schonmal prinzipiell der richtige Ansatz - damit bekomme ich die Browserinformationen geliefert.
Doch leider habe ich 2 identische iPads die ich unterscheiden möchte (das schwarze für den Standard-style und das weisse für den light-style).
D.h. meine erste Idee mit der Browseridentifikation war nicht so dolle, ich muss wohl an die IP oder Hostnamen ran.
Es ginge noch so was, aber leider wohl nur mit Android:
navigator.userAgentData
.getHighEntropyValues([
"architecture",
"model",
"platform",
"platformVersion",
"fullVersionList"
])
.then((ua) => {
const model = ua["model"];
if (model) console.log("Phone: " + model);
});
In Deinem Fall gehts aber wahrscheinlich wirklich nur über die feste(?) IP der Geräte.
Ich habe jetzt eine Lösung gefunden:
Im Verzeichnis www habe ich einen symlink ftui.bright auf ftui angelegt.
Somit kann ich über den Browser über fhem:8083/fhem/ftui/index.html oder fhem:8083/fhem/ftui.bright/index.html auf die gleichen Inhalte zugreifen.
Da es mehrere Dateien als nur index.html gibt, war ein symlink auf das komplette Verzeichnis nötig statt nur auf die index.html
In der html-Datei kann ich dann aber hierüber gezielt das bright-css laden:
<script>
if (this.location.pathname.includes("/ftui.bright/"))
{document.head.innerHTML += '<link href="themes/bright-theme.css" rel="stylesheet">';}
</script>
Die Idee dazu stammt aus dem Wiki: https://wiki.fhem.de/wiki/FTUI3_Testinstanz