Frontend-Umfage

[rudolfkoenig]

Bedienung über Kommandozeileneingabe oben rechts neben dem Fhem-Logo, Edit files und Save config im Menu links

Das ist fuer solche Konfigurationsaenderungen vorgesehen, die sonst nicht grafisch abgedeckt sind, und fuer Kenner, die es so schneller eingeben koennen bzw. anderen einfacher beschreiben koennen. Wie koennte man sowas besser implementieren?

Das es eine grafische intuitive Oberfläche für Bedien-Komfort und Übersicht braucht ist Sonnenklar.

Ich glaube nicht, dass _eine_ Oberflaeche alle Anforderungen gut erfuellen kann, meine waeren z.Bsp:
- Perfekt in allen Szenarien: FHEM-Konfiguration, -Debugging, Anzeige und Bedienung der FHEM-Komponente.
- Passt zum UI und Bedienungskonzept der gerade verwendeten OS, und das auf allen Mobil- und Desktop-Betriebsystemen.
- Laeuft als Native-, Bildschirmschoner- oder Desktophintergrund-App, ueber Browser, Messanger, Telnet/SSH
- Ist behindertengerecht, mehrsprachig, bedienbar ueber Siri/Alexa/etc.
- Optimal fuer alle FHEM-Module, auch fuer die, die nach Fertigstellen des Frontends gebaut werden.
- Der Benutzer benoetigt keine Konfigurationsarbeit/Programmierung fuer das Frontend.
- Intuitiv fuer Anfaenger, effizient fuer Experten.

FHEMWEB/FTUI/etc deckt einen Teil der Anforderungen ab, und das auch nicht perfekt.
Die, die andere Prioritaeten haben, fangen mit einem neuen Frontend an, und das ist auch gut.

[realbeat]

Ich glaube nicht, dass _eine_ Oberflaeche alle Anforderungen gut erfuellen kann, meine waeren z.Bsp:
- Perfekt in allen Szenarien: FHEM-Konfiguration, -Debugging, Anzeige und Bedienung der FHEM-Komponente.
- Passt zum UI und Bedienungskonzept der gerade verwendeten OS, und das auf allen Mobil- und Desktop-Betriebsystemen.
- Laeuft als Native-, Bildschirmschoner- oder Desktophintergrund-App, ueber Browser, Messanger, Telnet/SSH
- Ist behindertengerecht, mehrsprachig, bedienbar ueber Siri/Alexa/etc.
- Optimal fuer alle FHEM-Module, auch fuer die, die nach Fertigstellen des Frontends gebaut werden.
- Der Benutzer benoetigt keine Konfigurationsarbeit/Programmierung fuer das Frontend.
- Intuitiv fuer Anfaenger, effizient fuer Experten.

Damit hätten wir dann die ultimativ eierlegende Wollmilchsau definiert    

...und ja, leider gibt es aber grade einen für mich langsam völlig unübersichtlichen Frontendwildwuchs mit vielen guten Ansätzen: Floorplan, Dashboard, Webview, SmartVisu, das Chartfrontend, TabletUI undundund.

Ich persönlich würde es gerne sehen, wenn sich der TabletUI Ansatz weiterentwickelt. Die Beliebtheit des TabletUI ist für mich einfach zu erklären und liegt im einfach gehaltenen und Begleiteten Einstieg für Anfänger:

Install
-------
* copy the whole tree into the corresponding folder of your FHEM server /\<fhem-path\>/www/tablet
* add 'define TABLETUI HTTPSRV ftui/ ./www/tablet/ Tablet-UI' in fhem.cfg
* rename the index-example.html to index.html or create your own index.html
* Tadaaa! A new fhem ui in http://\<fhem-url\>:8083/fhem/ftui/

...Drei Schritte und wie vom Entwickler versprochenen "Tadaa", der Einsteiger hat erst mal ein Erfolgserlebniss 
So sollte das GUI-Konzept weitergedacht werden.



Zu der konkreten Frage betreffend Kommandozeile oben im FHEMWEB:
Viel braucht es nicht, aber zur Hilfe für Einsteiger  könnte so etwas in der fhem.cfg helfen, wobei die Terminal-Eingabe-Zeile auch das Kommandozeilen-Eingabefeld im 01_FHEMWEB.pm ersetzen könnte:
Das Eigabefeld ist ein schnörkelloses HTML5 Input mit Datalist Feld, damit lässt sich ein "freies" Eingabefeld mit einer Auswahlliste verbinden. Perfekt um möglichst flexibel alle Eingaben zu ermöglichen und gleichzeitig  zu erlauben aus einer Liste auszuwählen.  Diese Kombination könnte in allen Eingabefeldern auch speziell für attribute verwendet werden.  ( Die Werte der Optionsfelder werden mit Json Werten befüllt PossibleSets,PossibleAttrs) In vielen Konfigurations-Bereichen im fhemweb sind ja Dropdown-Auswahlmenues bereits vorhanden. Was mir sehr entgegen kommt.
(https://forum.fhem.de/index.php?action=dlattach;topic=51891.0;attach=50723;image)
(Für cmd Profis die automatisch nach jeder Eingabe auf Enter klicken mag der "Ausführen" Button lächerlich erscheinen, genauso wie dem Unerfahrenen ein leeres Eingabefeld (huuh, was soll ich damit?)

Code Auswählen Erweitern

define BeginnersTutorial weblink htmlCode <hr>\
Erste Schritte mit FHEM\
<hr>\
<form method="post" action="/fhem" style="display:inline">\
Befehl eingeben:\
  <input name="cmd" class"maininput" list="cmd">\
  <datalist id="cmd">\
    <option value="update+check">   \
    <option value="version">    \
    <option value="list">    \
    <option value="JsonList2">\
    <option value="xmllist">    \
    <option value="backup"> \
    <option value="reload ...">    \
  </datalist> \
  <input  type="submit" value="Ausführen" >\
  </form>&nbsp;;&nbsp;;&nbsp;;&nbsp;;&nbsp;; \
<form method="post" action="/fhem?cmd=save" style="display:inline"><button type="submit">Konfiguration sichern</button></form>\
<form method="post" action="/fhem?cmd=shutdown+restart" style="display:inline"><button type="submit">Neustarten um Änderungen anzuzeigen</button></form>\
  &nbsp;;&nbsp;;&nbsp;;&nbsp;;&nbsp;;\
<form method="post" action="/fhem?cmd=help" style="display:inline"><button type="submit">FHEM Befehlsübersicht</button></form>\
<form method="post" action="/fhem?cmd=update" style="display:inline"><button type="submit">FHEM Update</button></form>\
<hr>\
Wo finde ich Hilfe?\
<select onChange="window.location.href=this.value">\
    <option value="http://fhem.de/HOWTO_DE.html">Mit FHEM beginnen</option>\
<option value="http://www.fhemwiki.de/wiki/Erste_Schritte_in_fhem">Wiki: Erste Schritte in FHEM</option>\
<option value="http://www.fhemwiki.de/wiki/Kategorie:HOWTOS">Wiki: How to?</option>\
    <option value="http://fhem.de/faq.html">FAQ</option>\
<option value="http://fhem.de/commandref.html">FHEM Befehle und Geräte</option>\
<option value="http://www.fhemwiki.de/wiki/Hauptseite">Wiki</option>\
<option value="http://www.fhemwiki.de/wiki/Kategorie:Code_Snippets">Wiki: Code Snippets</option>\
<option value="http://www.fhemwiki.de/wiki/Kategorie:Examples">Wiki: Beispiele</option>\
<option value="http://www.fhemwiki.de/wiki/Anwendungsszenarien">Wiki: Anwendungsszenarien</option>\
<option value="https://forum.fhem.de/index.php">Das FHEM Forum!</option>\
</select>\
<hr>
attr BeginnersTutorial room Einfuehrung in Fhem
Die Hilfe ist ein normales klassisches Auswahlfeld ohne Möglichkeit der freien Eingabe und dient nur dazu die FHEM-Einsteiger Seite mit der Benutzerfreundlichen Kommandozeileneingabe noch zu ergänzen
Für Interessierte: Zum Testen den Code einfach in die fhem.cfg kopieren
(https://forum.fhem.de/index.php?action=dlattach;topic=51891.0;attach=50725;image)

[realbeat]

Warum schaust Du Dir nicht einfach die FHEM Statistiken unter https://forum.fhem.de/index.php/board,11.0.html an?

Vermutlich, weil er darüber als mehr oder weniger FHEM-Neuling (Mit ein paar mehr Post's als ich)  noch gar nicht gestolpert ist. Was leider sehr Schade ist für FHEM, da gibt es so viele tolle Möglichkeiten, aber man muss sie eben erst mal entdecken in der Masse.