AG Kalender/Pflichtenheft/Technische Spezifikation

Aus Piratenwiki
Wechseln zu: Navigation, Suche

Hier befindet sich die technische Spezifikation des Kalenders.

HTML Templates

Browser Templates

Allgemein

Zweck
Das Allgemeine Browser-Template dient als Grundlage um Komponenten einzufügen.

MockUp
AG Kalender - General Layout (Browser).png

Beschreibung
Das Template stellt den Content-Bereich einer Website zu Verfügung und verfügt selber über 3 Bereiche.

  • Filter Area
  • Date Navigation Area
  • View Area

Komponenten dürfen nicht direkt in diesem Template platziert werden.

Browser Template Elemente

Date Navigation Area

Zweck
Bereich zur Anordnung von Elementen, welche für die Navigation im Kalender zuständig sind.

MockUp
AG Kalender - Date Navigation (Browser).png

Beschreibung
Die Date Navigation Area beinhaltet

  • Eine Komponente, welche das aktuelle Datum anzeigt
  • Vier Komponenten zur Kalendernavigation. Welche angezeigt werden hängt von der jeweiligen View ab. Das Verhalten wird über eine Konfiguration festgelegt. So basiert jede Einzelkomponente auf dem gleichen Code.
    Jeweils eine für
    • Jahr
    • Monat
    • Kalenderwoche
    • Tag

Filter Area

MockUp

View Area

Day View

MockUp
AG Kalender - Day View (Browser).png

List View

MockUp
AG Kalender - List View (Browser).png

Week View

MockUp
AG Kalender - Week View (Browser).png

Month View

MockUp
AG Kalender - Month View (Browser).png

Komponenten

(Such) Filter

MockUp

Time Navigation

Zweck
Bietet Funktionalität den Kalender zeitlich vor und zurück zu navigieren.

MockUp
AG Kalender - Time Navigation Component (Browser).png

Beschreibung
Die Variable "$Time" die vier Werte "Jahr", "Monat", "KW" (für Kalenderwoche) oder "Tag" haben. Diese vier werte sind gleichzeitig auch die vier Zustände, die die Komponente haben kann. Ein Klick auf das Feld "$Time" bewirkt, dass ein PopUp auf den Bildschirm erscheint. Je nach Kontext wird dem User eine andere Auswahl geliefert.
Beispiele:

Jahr Beschreibung
AG Kalender - Date Picker (Year) (Browser).png Ein Klick auf das Jahr wechselt das Jahr, wobei die restlichen Angaben übernommen werden.
Monat Beschreibung
AG Kalender - Date Picker (Month) (Browser).png
  • Ein Klick auf den Monat wechselt die Kalenderansicht auf den gewählten Monat. Das Jahr und der Tag werden übernommen.
  • Ein Klick auf auf das Feld $Year öffnet die das Auswahlmenü vom Jahr. Der Kontext ist die Monats-Auswahl.
Woche Beschreibung
AG Kalender - Date Picker (Week) (Browser).png
  • Ein Klick auf die gewünschte Kalenderwoche wechselt die Ansicht entsprechend. Das Jahr und der Wochentag werden übernommen.
  • Ein Klick auf auf das Feld $Year öffnet die das Auswahlmenü vom Jahr. Der Kontext ist die Monats-Auswahl.
Tag Beschreibung
AG Kalender - Date Picker (Day) (Browser).png
  • Ein Klick auf den gewünschten Tag wechselt die Ansicht entsprechend.
  • Ein Klick auf Year und $Month verhalten sich entsprechenden der jeweiligen Komponente.