AG Kalender/Pflichtenheft/Technische Spezifikation

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
 

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
 

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
 

List View

MockUp
 

Week View

MockUp
 

Month View

MockUp
 

Komponenten

(Such) Filter

MockUp

Time Navigation

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

MockUp
 

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
  Ein Klick auf das Jahr wechselt das Jahr, wobei die restlichen Angaben übernommen werden.
Monat Beschreibung
 
  • 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
 
  • 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
 
  • Ein Klick auf den gewünschten Tag wechselt die Ansicht entsprechend.
  • Ein Klick auf Year und $Month verhalten sich entsprechenden der jeweiligen Komponente.