[Gelöst] PWA geplant?

Eistee · 03 Februar 2020, 10:13:08

Hallo,

ich wollte mal fragen ob es Pläne gibt das als PWA (Progressive Web App) um zu setzen. PWA hätte meiner Meinung nach sehr viele Vorteile gegenüber einer Platformabhängigen App.

Gruß Alina

Syrex-o · 03 Februar 2020, 21:01:21

Zitat von: Eistee am 03 Februar 2020, 10:13:08
Hallo,

ich wollte mal fragen ob es Pläne gibt das als PWA (Progressive Web App) um zu setzen. PWA hätte meiner Meinung nach sehr viele Vorteile gegenüber einer Platformabhängigen App.

Gruß Alina

Hey,

Klar, warum eigentlich nicht. Könnte man in Betracht ziehen.
Was wäre denn der Vorteil für dich persönlich?

Beste Grüße

Eistee · 03 Februar 2020, 23:37:08

Vorteile:
- geht überall wo ein moderner Browser drauf läuft (Android, iOS, Windows, Mac, Linux)
- benutzbar wie eine echte App. Da es eh mit Angular programmiert wurde könnte man so auf ionic verzichten.
- Serviceworker der pushnachichten unterstüzt und auch im Hintergrund eine Verbindung zu FHEM hält. So könnte man auf jedem Gerät benachichtigt werden ohne so etwas wie Telegram nutzen zu müssen.
- Offline nutzbar. Man könnte so den letzten bekannten zustand des Heims auch Offline betrachten. Oder auch Steuern was dann ausgeführt wird wenn wieder Netz da ist.
- Man könnte eine sichere Schnittstelle zu FHEM integrieren die man auch von unterwegs nutzen kann.
- FHEM könnte die PWA direkt auf dem eigenem Webserver bereitstellen. Das erleichtert auch Updates da es direkt mit FHEM geupdated werden kann.
.....

HTML5 bietet inzwischen so viele Möglichkeiten. Damit sind auch Sprachausgaben möglich oder man könnte die Webcam nutzen um z.B. Codes zu scannen.

Syrex-o · 29 Februar 2020, 23:16:31

So,

Ich hab mich Mal weiter informiert. PWA wird kommen.
Sobald alles neu aufgesetzt ist kommt FhemNative PWA als weiteres Release.
Ich kann mich bisher nur noch nicht mit dem Update anfreunden. Da alle die PWA benutzen wo sie wollen, kann ich nur über ein Update berichten. Der Download und das überspielen auf das relevante system muss dann alleine erfolgen.

Oder gibt es da eine sinnvolle alternative?

Beste Grüße

Eistee · 04 März 2020, 08:27:13

Naja entweder installiert sich jeder selbst seinen Webserver oder du inkludierst es wie z.B. TabletUI in FHEM. Dann könnte man das mit dem FHEM Update zusammen aktualisieren. Die Geräte holen sich ja dann das Update über den ServiceWorker

Syrex-o · 08 März 2020, 18:04:00

Zitat von: Eistee am 04 März 2020, 08:27:13
Naja entweder installiert sich jeder selbst seinen Webserver oder du inkludierst es wie z.B. TabletUI in FHEM. Dann könnte man das mit dem FHEM Update zusammen aktualisieren. Die Geräte holen sich ja dann das Update über den ServiceWorker

Das macht Sinn.
Wird noch einen Moment dauern, aber kommt.

Beste Grüße

luk99 · 28 März 2020, 13:49:08

Hallo,

Erstmal vielen Dank Syrex-o für diese geniale App.

Ich möchte mal kurz über meine Erfahrungen mit FhemNative und PWA reden:
Ich habe gestern mal probiert das ganze als PWA zum laufen zu bringen:
An sich funktioniert fast alles direkt ohne Probleme, das einzige Manko ist, dass man über den Webbrowser keine Configs importieren oder exportieren kann. Das liegt an dem File Framework von Ionic in der room-settings.component.ts, dieses ist nur mit iOS/Android kompatibel, bzw die Alternative funktioniert ja nur mit dem Desktop-Versionen.
Daher habe ich testweise die JSON mit auf den Angular-Server gelegt und direkt vom Server importieren lassen, sodass FhemNative bei einem Klick auf Config importieren automatisch die Config vom Server verwendet. Das klappt soweit auch ganz gut, man muss nur das Design mit einer App erstellen und dann auf den Server exportieren.
Vorteil ist, ich kann auf dem Mac die UI erstellen und muss dann nur auf den Tablets importieren klicken, ohne dass ich die JSON umständlich auf die Tablets schicken muss.

Auch das Zusammenspiel mit dem Fully Kiosk Browser unter Android funktioniert ohne Probleme, ich kann über das FHEM Device das Tablet mit Bewegungsmeldern einschalten, usw.

Das Ganze nur mal kurz als kleine Anregung, was momentan schon mit PWA möglich ist

Beste Grüße

Lukas

Syrex-o · 28 März 2020, 15:48:34

Zitat von: luk99 am 28 März 2020, 13:49:08
Hallo,

Erstmal vielen Dank Syrex-o für diese geniale App.
Ich möchte mal kurz über meine Erfahrungen mit FhemNative und PWA reden:
Ich habe gestern mal probiert das ganze als PWA zum laufen zu bringen:
An sich funktioniert fast alles direkt ohne Probleme, das einzige Manko ist, dass man über den Webbrowser keine Configs importieren oder exportieren kann. Das liegt an dem File Framework von Ionic in der room-settings.component.ts, dieses ist nur mit iOS/Android kompatibel, bzw die Alternative funktioniert ja nur mit dem Desktop-Versionen.
Daher habe ich testweise die JSON mit auf den Angular-Server gelegt und direkt vom Server importieren lassen, sodass FhemNative bei einem Klick auf Config importieren automatisch die Config vom Server verwendet. Das klappt soweit auch ganz gut, man muss nur das Design mit einer App erstellen und dann auf den Server exportieren.
Vorteil ist, ich kann auf dem Mac die UI erstellen und muss dann nur auf den Tablets importieren klicken, ohne dass ich die JSON umständlich auf die Tablets schicken muss.

Auch das Zusammenspiel mit dem Fully Kiosk Browser unter Android funktioniert ohne Probleme, ich kann über das FHEM Device das Tablet mit Bewegungsmeldern einschalten, usw.

Das Ganze nur mal kurz als kleine Anregung, was momentan schon mit PWA möglich ist

Beste Grüße

Lukas

Gerne

Das klingt doch schonmal sehr schön.
Ich werde nur sicher Hilfe bei dem Updater brauchen. Da hab ich überhaupt keine Erfahrung für eine PWA.

Beste Grüße

Syrex-o · 23 April 2020, 11:32:03

Hey,

FhemNative wird ab 2.5.1 die Möglichkeit bieten eine PWA zu erstellen. Der service worker und die config dafür ist vorhanden. Kann ke nach belieben angepasst werden.
Jedoch sehe ich nicht die Notwendigkeit ein offizielles release dafür anzubieten. Daher:
- per git alles ziehen
- npm install
- npm run ionic:pwa
Das erstellt dann den www Ordner für euch und ihr könnt ihn auf den Server packen.
Eventuell könnte man darüber nachdenken, die config bei solch einer Konfiguration vom server zu ziehen, wie @luk99 beschrieben hat.

Beste Grüße

Eistee · 20 Juni 2020, 11:37:03

Was mache ich falsch? Die installation "npm install" lief ohne Fehler.

Code Auswählen

root@homeapp:~/fhemnative# npm run ionic:pwa
npm ERR! missing script: ionic:pwa

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2020-06-20T09_35_33_500Z-debug.log
root@homeapp:~/fhemnative# cat /root/.npm/_logs/2020-06-20T09_35_33_500Z-debug.log
0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'ionic:pwa' ]
2 info using npm@6.14.5
3 info using node@v12.16.2
4 verbose stack Error: missing script: ionic:pwa
4 verbose stack     at run (/usr/local/lib/node_modules/npm/lib/run-script.js:155:19)
4 verbose stack     at /usr/local/lib/node_modules/npm/lib/run-script.js:63:5
4 verbose stack     at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:116:5
4 verbose stack     at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:436:5
4 verbose stack     at checkBinReferences_ (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:391:45)
4 verbose stack     at final (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:434:3)
4 verbose stack     at then (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:161:5)
4 verbose stack     at ReadFileContext.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:350:20)
4 verbose stack     at ReadFileContext.callback (/usr/local/lib/node_modules/npm/node_modules/graceful-fs/graceful-fs.js:123:16)
4 verbose stack     at FSReqCallback.readFileAfterOpen [as oncomplete] (fs.js:257:13)
5 verbose cwd /root/FhemNative/Development/FhemNative
6 verbose Linux 5.3.18-3-pve
7 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "ionic:pwa"
8 verbose node v12.16.2
9 verbose npm  v6.14.5
10 error missing script: ionic:pwa
11 verbose exit [ 1, true ]

Syrex-o · 20 Juni 2020, 17:14:34

Zitat von: Eistee am 20 Juni 2020, 11:37:03
Was mache ich falsch? Die installation "npm install" lief ohne Fehler.
Code Auswählen Erweitern
root@homeapp:~/fhemnative# npm run ionic:pwa npm ERR! missing script: ionic:pwa npm ERR! A complete log of this run can be found in: npm ERR! /root/.npm/_logs/2020-06-20T09_35_33_500Z-debug.log root@homeapp:~/fhemnative# cat /root/.npm/_logs/2020-06-20T09_35_33_500Z-debug.log 0 info it worked if it ends with ok 1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'ionic:pwa' ] 2 info using npm@6.14.5 3 info using node@v12.16.2 4 verbose stack Error: missing script: ionic:pwa 4 verbose stack at run (/usr/local/lib/node_modules/npm/lib/run-script.js:155:19) 4 verbose stack at /usr/local/lib/node_modules/npm/lib/run-script.js:63:5 4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:116:5 4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:436:5 4 verbose stack at checkBinReferences_ (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:391:45) 4 verbose stack at final (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:434:3) 4 verbose stack at then (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:161:5) 4 verbose stack at ReadFileContext.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:350:20) 4 verbose stack at ReadFileContext.callback (/usr/local/lib/node_modules/npm/node_modules/graceful-fs/graceful-fs.js:123:16) 4 verbose stack at FSReqCallback.readFileAfterOpen [as oncomplete] (fs.js:257:13) 5 verbose cwd /root/FhemNative/Development/FhemNative 6 verbose Linux 5.3.18-3-pve 7 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "ionic:pwa" 8 verbose node v12.16.2 9 verbose npm v6.14.5 10 error missing script: ionic:pwa 11 verbose exit [ 1, true ]

Aus irgendeinem Grund ist der Befehl aus der package.json verschwunden.
Werde ich beheben.