Food-planer

Aus THM-Wiki
Wechseln zu: Navigation, Suche

WICHTIG

Aufgrund fehlender Apple-Geräte auf IOS ungetestet. Hauptsächlich unter Chrome auf Samsung Galaxy S3 sowie auf dem Desktop getestet.

Projektvision

Eine Website, mit dessen Hilfe man Gerichte anlegen kann. Dazu soll es Benutzer und Gruppen geben. Mit diesen kann man gemeinsam oder auch alleine einen Essensplan erstellen. Daraus wird zusätzlich auch eine Einkaufsliste generiert.


Allgemein

Das Repository wird von dem hauseigenen THM-Git (GitLab) verwaltet: Der Zugang dazu ist privat und Teilnehmer müssen hinzugefügt werden.

Dabei werden die Branches wie folgt verwaltet:

  • Master-Branch: Enthält lediglich die einzelnen Releases des Projektes
  • Staging-Branch: Der Staging branch zeigt den aktuellen Zwischenstand zwischen den Releases
  • Für jedes Feature sowie jeden Bug existiert ein eigener Branch. Dieser wird per Mergerequest in staging übertragen

Die Version 1.0 wird am 11.4 fertig sein.

Feature-Requests

  • Benutzer erstellen
  • Gruppen erstellen
  • eigene Gerichte(privat oder in Gruppe) erstellen
  • Gerichte öffentlich erstellen
  • Essensplan als Nutzer erstellen
  • Diesen bei Gruppenerstellung übertragen
  • Gruppenplan verwalten
  • Generierung Einkaufliste
  • Elemente daraus entfernbar
  • an mobile Geräte angepasst
  • an Desktopgeräte angepasst
  • keine unnötigen Serveranfragen
  • in-time Aktualisierung


Design-Style

Allgemeiner Aufbau

Im Projekt ist kein Bootstrap verwendet worden.
Allgemein wird Less als CSS-Precompiler verwendet.
Durch das Fehlen von Bootstrap und fehlender Testgeräte ist es bisher nicht möglich ein vollständig funktionierendes Layout auf allen Gerättypen zu gewährleisten. Dennoch sollte dies auf allen Geräten und in neueren Browsern problemlos funktionieren, da CSS-Vendor-Prefixes und Icons für alle gängigen Browsertypen inkludiert sind.

jQuery

Es wird zum einen ein Teil von jQuery-UI verwendet, um einen allgemeinen Datepicker zu ermöglichen. Dies ist verwendet worden, da man sich in vielen Browsern nicht auf die Unterstützung des Input-Feldes mit dem Typ Date verlassen kann.

touchwipe.js

Zur Optimierung des mobilen Designs wird für ein Swipeable Sidemenu touchwipe.js verwendet

less-libs

Für allgemeine Anpassungen wird eine base.import.less verwendet, sowie eine Bibliothek für Vendor-Prefixes

Farben

Diese werden alle in colors.import.less definiert. Außer die Header-Farben. Diese befinden sich in headercolors.import.less


Definierte Klassen

Es gibt für alle Arten von Input-Feldern, Labels, sowie allen anderen Elementen vorgefertigte Klassen

Sidemenu

Das Design des Sidemenus ist stark an das Android-Material-Design angepasst. Deshalb sieht dieses auf mobilen Geräten auch besser aus als auf dem Desktop-PC.

Icons

Für Icons sind Favicons erstellt worden und für alle Icons innerhalb der Webseite sind SVG-Dateien in client\templates\icons.html

Robotics

Als Font ist Robotics embedded worden

Sidemenu

Das Seitenmenü bildet den Kern des Projektes. Alle weiteren Seiten sind an dieses Menü angepasst.


Projektstruktur

/client 
/css //Less-Dateien
/js //Eine JS-Datei/Template
/templates //Eine .HTML-Datei/Template
/lib //Bibliotheken
/lib //enthält Routen und Datenbankschemas

/public //Bilder und Icons

/server
/publications //enthält alle Publications
startup.js //enthält Beispieldaten

/shared //enthält Meteor-Methoden

Anforderungsanalyse

Alle Dateien befinden sich in GitLab. Diese wurden vor Release 1.0 noch einmal angepasst


Release 1.0

Das Release 1.0 ist am 11.4 fertig. Es enthält alle Dateien, die benötigt werden, um das Projekt zu veröffentlichen. Dabei sind alle oben genannten Features implementiert.

Weiteres

Aus Zeitgründen ist an verschiedenen Stellen das Layout sowie die Farbauswahl nicht perfekt. Hier können zukünftige Optimierungen getätigt werden.