Floorplan wie eine App öffnen (Full Screen Mode)

Begonnen von stobor, 29 März 2019, 15:17:25

Vorheriges Thema - Nächstes Thema

stobor

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.

Intel NUC (Ubuntu 22.04.2 LTS (GNU/Linux 5.15.0-73-generic x86_64))  mit CUL V3.2 (Firmware 1.57 CUL868) für FS20 und CUL V3.4 (Firmware 1.57 CUL868) für HM + Arduino Mega
FHEM Revision: 27642
FS20-Schalter und Dimmer
HM Fensterkontakte, Heizungsthermostate, Temperatursensoren

stobor

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?
Intel NUC (Ubuntu 22.04.2 LTS (GNU/Linux 5.15.0-73-generic x86_64))  mit CUL V3.2 (Firmware 1.57 CUL868) für FS20 und CUL V3.4 (Firmware 1.57 CUL868) für HM + Arduino Mega
FHEM Revision: 27642
FS20-Schalter und Dimmer
HM Fensterkontakte, Heizungsthermostate, Temperatursensoren

mchilli

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
Mehr als 3, der eine macht das, der andere was ganz anderes und einer was ganz ähnliches, was ein anderer auch machen soll.

stobor

Aber wo füge ich das JAvaScript ein - also in welche Datei schreibe ich den Code?
Intel NUC (Ubuntu 22.04.2 LTS (GNU/Linux 5.15.0-73-generic x86_64))  mit CUL V3.2 (Firmware 1.57 CUL868) für FS20 und CUL V3.4 (Firmware 1.57 CUL868) für HM + Arduino Mega
FHEM Revision: 27642
FS20-Schalter und Dimmer
HM Fensterkontakte, Heizungsthermostate, Temperatursensoren

mchilli

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!
Mehr als 3, der eine macht das, der andere was ganz anderes und einer was ganz ähnliches, was ein anderer auch machen soll.

Invers

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.
Pi3B+ mit SSD/ Bullseye | FB7590 AX | 12 x Dect200 | CUL433+868 | SDuino | HM-LAN | 3 x Heizung FHT + FKontakte | KeyMatic + 4 FB | HM Wandtaster 2-fach m. LED | 6 x Türkont. TFK-TI | HM-Bew.-Melder innen | 3 x Smoked. HM-SEC-SD-2

stobor

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);
}

Intel NUC (Ubuntu 22.04.2 LTS (GNU/Linux 5.15.0-73-generic x86_64))  mit CUL V3.2 (Firmware 1.57 CUL868) für FS20 und CUL V3.4 (Firmware 1.57 CUL868) für HM + Arduino Mega
FHEM Revision: 27642
FS20-Schalter und Dimmer
HM Fensterkontakte, Heizungsthermostate, Temperatursensoren

mchilli

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">');
Mehr als 3, der eine macht das, der andere was ganz anderes und einer was ganz ähnliches, was ein anderer auch machen soll.

stobor

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?
Intel NUC (Ubuntu 22.04.2 LTS (GNU/Linux 5.15.0-73-generic x86_64))  mit CUL V3.2 (Firmware 1.57 CUL868) für FS20 und CUL V3.4 (Firmware 1.57 CUL868) für HM + Arduino Mega
FHEM Revision: 27642
FS20-Schalter und Dimmer
HM Fensterkontakte, Heizungsthermostate, Temperatursensoren

mchilli

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.
Mehr als 3, der eine macht das, der andere was ganz anderes und einer was ganz ähnliches, was ein anderer auch machen soll.

stobor

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?
Intel NUC (Ubuntu 22.04.2 LTS (GNU/Linux 5.15.0-73-generic x86_64))  mit CUL V3.2 (Firmware 1.57 CUL868) für FS20 und CUL V3.4 (Firmware 1.57 CUL868) für HM + Arduino Mega
FHEM Revision: 27642
FS20-Schalter und Dimmer
HM Fensterkontakte, Heizungsthermostate, Temperatursensoren

mchilli

Mehr als 3, der eine macht das, der andere was ganz anderes und einer was ganz ähnliches, was ein anderer auch machen soll.

stobor

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?
Intel NUC (Ubuntu 22.04.2 LTS (GNU/Linux 5.15.0-73-generic x86_64))  mit CUL V3.2 (Firmware 1.57 CUL868) für FS20 und CUL V3.4 (Firmware 1.57 CUL868) für HM + Arduino Mega
FHEM Revision: 27642
FS20-Schalter und Dimmer
HM Fensterkontakte, Heizungsthermostate, Temperatursensoren

ahlermi

#13
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);
}
PI4 FHEM, PI3 FHEM, 6 x Echo mit talk2fhem, Siri, SNIPS auf PI3 mit Samson UB1, YeeLight, Homematic, MAX!, 433Mhz, LaCross, Xiaomi Vacuum V1, ESPEasy, Gardena, Telegram, FLOORPLAN, HEOS, Xiaomi Aqara, Sonoff, SolvisMax, SolvisClient, HUE, ESPEasy für Bayernlüfter, Harmony, Tasmota, JKBMS, EASUN