| commit | author | age | ||
| 00c9b9 | 1 | # Proto |
| U | 2 | |
| 3 | Ein Rumpf-Konstrukt für Webapps bestehend aus einer kleinen Java-App und einer Web-Bedienoberfläche. Die Java-App implementiert einen embedded Webserver auf der Grundlage des Java-Moduls jdk.httpserver. Die Bedienoberfläche besteht nur aus HTML, CSS und Javascript, die ohne Anpassung am Code auf verschiedenen Geräten funktioniert. | |
| 4 | ||
| 5 | ## Eigenschaften | |
| 6 | ||
| 7 | Die Bedienoberfläche gruppiert Menü, Kopf- und Fußzeile sowie eine Seitenleiste um einen zentralen Bereich, dessen Inhalt nach unten aus dem sichtbaren Teil der Anzeige herausläuft, wenn der Platz auf der Anzeige nicht ausreicht. | |
| 8 | ||
| 9 | Beim Rollen des Inhalts bleiben die umliegenden Elemente und damit die wesentlichen Bedienelemente sichtbar. | |
| 10 | ||
| 11 | Der Inhalt des Menüs kann über Beschreibungsdateien an unterschiedliche Belange angepasst und über eine Schaltfläche ein- und ausgeblendet werden. Die Menübeschreibungen müssen in der Javascript Object Notation (JSON) verfasst sein und können beliebig in eine hierarchische Struktur von Untermenüs verschachtelt werden. | |
| 12 | ||
| 13 | ## Demo | |
| 14 | ||
| 15 | Aussehen und Funktionsweise der Bedienoberfläche kann mit der [Demo](/data/ulrich/test/app-vorlage/) angesehen und ausprobiert werden. | |
| 16 | ||
| 17 | ## Verwendung | |
| 18 | ||
| 19 | Noch beschreiben | |
| 20 | ||
| 21 | #### Add to Home Screen | |
| 22 | ||
| 23 | Proto schafft die Grundlage für Apps, die sich neben der universellen Ausführbarkeit in einem Webbrowser auch in einem Schritt auf einem Schlaufon oder Tafelrechner installieren und ausführen lassen, wie es gewöhnlich nur Apps aus dem App Store des Geräteherstellers erlauben. | |
| 24 | ||
| 25 | Wird Proto beispielsweise mit Safari auf einem iPhone oder iPad aufgerufen, kann die Funktion "zum Home-Bildschirm hinzufügen" verwendet werden. Anschließend ist die App durch einfaches Antippen ihres Piktogrammes direkt vom Startbildschirm ausführbar wie eine App aus dem App Store. Diese Vorgehensweise funktioniert in vergleichbarer Weise mit Chrome auf Android-Geräten. | |
| 26 | ||
| 27 | ## Abhängigkeiten | |
| 28 | ||
| 29 | Proto verwendet [Mustache](https://mustache.github.io/) um Seitenvorlagen clientseitig zu HTML zu rendern. Damit der Code einfach geladen und so wie er ist ausprobiert werden kann ist Mustache aus dem Content Delivery Network [CDNJS](https://cdnjs.com/) eingebunden. Ferner ist die Schriftart [Roboto Condensed](https://fonts.google.com/specimen/Roboto+Condensed) aus [Google Fonts](https://fonts.google.com/) eingebaut. | |
| 30 | ||
| 31 | Diese Abhängigkeiten sollten von den angegebenen Quellen heruntergeladen und für einen produktiven Einsatz auf dem Rechner hinterlegt werden, auf dem Proto ausgeführt wird. Von dort eingebunden führt die Verwendung dieser Zusätze nicht zu einem Ausbrechen aus dem eigenen Server. | |
