Hallo,
ich würde gerne meine Floorplans direkt über die jeweilige Floorplan-URL auf dem Tablet (iPad) aufrufen. Der Floorplan soll dann möglichst ohne Browser-Ballast (ohne Tabs und Adresszeile und ohne Statuszeile) erscheinen. Ich meine, dafür lässt sich
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
verwenden.
Wie kann ich aber das im FLoorplan selber einstellen? Ich baue ja keine html-Seite, sondern Konfiguriere lediglich über das FHEM UI oder die CSS (darkfloorplanstyle.css).
Danke für eure Hilfe.
Zum Ausprobieren habe ich mal testweise die 95_FLOORPLAN.pm verändert:
...
FP_htmlHeader($) {
my $title = shift;
$title = "FHEM floorplan" if (!$title);
### Page start
$FW_RET = "";
$FW_RET .= '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">'."\n";
$FW_RET .= '<html xmlns="http://www.w3.org/1999/xhtml">'."\n";
FW_pO "<head root=\"$FW_ME\">\n<title>$title</title>";
FW_pO "<meta charset=\"$FW_encoding\">"; # Forum 28666
FW_pO "<meta name=\"apple-mobile-web-app-capable\" content=\"yes\"/>";
...
Aber das ist ja eher unschön. Gibt's da andere Wege?
Hey, du kannst auch über Javascript Zeilen nachträglich in den Header schreiben, ist jedenfalls eleganter als im Modul was zu ändern.
https://stackoverflow.com/questions/1900874/how-to-add-anything-in-head-through-jquery-javascript (https://stackoverflow.com/questions/1900874/how-to-add-anything-in-head-through-jquery-javascript)
Aber wo füge ich das JAvaScript ein - also in welche Datei schreibe ich den Code?
Floorplan hat auch das Attribut "JavaScripts", wo du eigene Scripte zusätzlich laden kannst.
Heißt: Du erstellst dir eine *.js Datei im FHEM Ordner "www" und trägst sie in das attr ein.
In dieses Script kannst du dann all deinen Javascript Code einfügen!
Bei Apple weiss ich es nicht genau, ob das auch geht, aber bei Android mache ich das mit Chrome so, dass ich die betreffende Seite anzeige und dann im Menü "zum Startbildschirm zufügen" klicke. Dadurch wird ein Icon auf dem Bildschirm des Tabs abgelegt.
Wenn ich über dieses Icon starte, dann ist alles so, wie du es dir gerade gewünscht hast.
Früher ging das auch mal mit Firefox, aber jetzt offenbar nicht mehr. Weiss nicht, warum. Die früher erzeugten Links funktionieren nach wie vor noch.
Vielleicht geht das ja mit Apple auch.
Zitat von: mchilli am 30 März 2019, 15:11:12
Floorplan hat auch das Attribut "JavaScripts", wo du eigene Scripte zusätzlich laden kannst.
Heißt: Du erstellst dir eine *.js Datei im FHEM Ordner "www" und trägst sie in das attr ein.
In dieses Script kannst du dann all deinen Javascript Code einfügen!
ich habe das jetzt probiert, und eine eigene Javascript-Datei abgelegt.
Sie wird vermutlich auch geladen. Im Chrome kann ich zumindest beim Netzwrrktraffic sehen, dass sie geladen wird.
Wie bekomme ich denn jetzt aber das Script ausgeführt? Ich habe scho ein paar Varianten probiert, aber das scheint nichts zu bringen:
var sMeta;
sMeta = document.createElement('meta');
sMeta.name = 'apple-mobile-web-app-capable';
sMeta.content = 'yes';
document.getElementsByTagName('head')[0].appendChild(sMeta);
window.onload = function () {
window.alert("Hallo Welt!");
var sMeta;
sMeta = document.createElement('meta');
sMeta.name = 'apple-mobile-web-app-capable';
sMeta.content = 'yes';
document.getElementsByTagName('head')[0].appendChild(sMeta);
}
warum denn nicht einfach so?
$('head').append('<meta name="apple-mobile-web-app-capable" content="yes">'+
'<meta name="apple-mobile-web-app-status-bar-style" content="black">');
Das kann ich direkt so in meine JavaScript Datei schreiben?
Und dann würde das funktionieren?
Oder ist das nur eine andere Schreibweise für meinen Ansatz, der leider nicht den gewünschten Erfolg bringt?
Deine Schreibweise ist reiner Javascript Code und meine JQuery Code.
Also ich kann dir nur sagen das es bei mir so funktioniert, hab bei mir auch den meta tag im head stehen.
Ich schein mich zu blöd anzustellen.
myFloorplan.js (Ordner: opt/fhem/www):
$('head').append('<meta name="apple-mobile-web-app-capable" content="yes">'+'<meta name="apple-mobile-web-app-status-bar-style" content="black">');
fhem.cfg:
...
define Erdgeschoss FLOORPLAN
attr Erdgeschoss JavaScripts myFloorplan.js
attr Erdgeschoss fp_arrange 0
attr Erdgeschoss fp_noMenu 1
attr Erdgeschoss room Floorplans
Trotz neustart des kompletten Systems, erscheint weiterhin auf dem iPad und iPhone die Adresszeile und Statuszeile.
Was mache ich denn falsch?
Vielleicht hilft dir das noch weiter:
https://stackoverflow.com/questions/48774142/after-upgrade-to-ios-11-3-web-app-does-not-show-full-screen-per-apple-mobile-web (https://stackoverflow.com/questions/48774142/after-upgrade-to-ios-11-3-web-app-does-not-show-full-screen-per-apple-mobile-web)
Komisch ist nur, dass meine Änderungen in der 95_FLOORPLAN.pm den gewünschten Erfolg brachten:
Zitat von: stobor am 29 März 2019, 16:56:00
Zum Ausprobieren habe ich mal testweise die 95_FLOORPLAN.pm verändert:
...
FP_htmlHeader($) {
my $title = shift;
$title = "FHEM floorplan" if (!$title);
### Page start
$FW_RET = "";
$FW_RET .= '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">'."\n";
$FW_RET .= '<html xmlns="http://www.w3.org/1999/xhtml">'."\n";
FW_pO "<head root=\"$FW_ME\">\n<title>$title</title>";
FW_pO "<meta charset=\"$FW_encoding\">"; # Forum 28666
FW_pO "<meta name=\"apple-mobile-web-app-capable\" content=\"yes\"/>";
...
Aber das ist ja eher unschön. Gibt's da andere Wege?
Ich mache das so:
vim /opt/fhem/www/pgm2/myScript.js
attr WetterDash JavaScripts pgm2/myScript.js
window.onload = testeMich;
function testeMich(){
alert('Aufruf');
var link = document.querySelector("link[rel*='icon']") || document.createElement('link');
link.rel = 'shortcut icon';
link.href = '/fhem/icons/favicon';
document.getElementsByTagName('head')[0].appendChild(link);
}