Kalenderblatt

Schreiben Sie ein Programm, welches genau ein Kalenderblatt für einen beliebigen Monat generiert!
z.B. wie folgt:
Kalenderblatt.png
  1. Verwenden Sie ein fehlerfreie HTML-Vorlage mit dem richtigen Zeichensatz, meta/author-Tag, title usw.
  2. Die HTML-Seite ohne Javascript soll bereits enthalten:
    1. Das table-Tag
    2. Die Kopfzeile der Tabelle mit den Wochentagen.
  3. Das script-Tag wird innerhalb des table-Tags plaziert.
  4. Verwenden Sie den Befehl document.write für die Ausgaben.
  5. Schreiben Sie eine Zählschleife, welche die Zeilen mit den tr-Tags erzeugt.
  6. Schreiben Sie eine Zählschleife, welche die Spaltenelemente in den tr-Tags erzeugt.
  7. Ergänzen Sie einen Zähler, welcher in den td-Tags der Tabelle ausgegeben wird. Geben Sie bereits im ersten Element die Zahl 1 aus.
  8. Sie benötigen für die Erstellung eines solchen Kalenderblatts zwei Eingaben:
    1. erster Tag im Monat, z.B. Dienstag.
    2. Anzahl der Tage des Monats.
  9. Die Eingaben werden als Zahlenwerte in Variablen gespeichert.
  10. Vor der erstmaligen Ausgabe des Zählers in der ersten Zeile müssen Sie eine Bedingung prüfen und entsprechend verzweigen:
    • Es ist zu prüfen, ob der Wochentag für die Ausgabe des ersten Tages des Monats (Spalte x) bereits erreicht ist. Nur dann wird der Zähler ausgegeben.
  11. Bei der Ausgabe der Tage des Monats müssen Sie prüfen, ob der Zähler noch kleiner oder gleich dem von Ihnen eingegebenen letzten Tag des Monats ist.

Erweiterungen

  1. Eine weitere Eingabe könnte eine Überschrift enthalten, z.B. "Januar 2016".
    • Für die Überschrift verwenden Sie einen Platzhalter, d.h. ein div-Tag mit einer id an der Position der späteren Überschrift.
    • Sie verwenden für die Ausgabe, den Befehl document.getElementById("MeineId").innerHTML=...
  2. Alle ausgegebenen Sonntage erscheinen in rot, d.h.
    • Wenn die 7. Spalte geschrieben wird, dann wird die Zahl rot ausgegeben, ansonsten schwarz.
  3. Eine weitere Eingabe könnte einen Tag hervorheben, z.B. Eingabe "19" siehe oben.
    • Für die Ausgabe der Zahl bzw. des Tabellenelements wird eine entsprechende Formatierung im style-Tag vorgesehen (class).
    • Der hervorzuhebende Text kann durch die Verwendung des span-Tags formatiert werden;
      • document.write(""+...)
  4. Das Kalenderblatt sollte mittels CSS schön gestaltet werden,
    • z.B. verschiedene Hintergründe für die gesamte Seite und die td-Elemente
    • Verwenden Sie eine leichte Transparenz, so dass der Hintergrund der gesamten Seite leicht durch die Tabelle scheint.
    • zentrieren Sie die Texte und die Tabelle (Tipp: table/margin auto)
    • Ändern Sie das Aussehen der Tabelle. Anregungen finden Sie im Internet bei der Suche nach "css table generator"
  5. Zeichnen Sie ein Struktogramm Ihres Programms!
  6. ...

Bewertung

Je mehr der Anweisungen Sie korrekt anwenden und "zum Laufen bringen", desto besser ist Ihre Note.
  • Eine 6 haben Sie sich erarbeitet, wenn Sie gar nichts tun. D.h. auch Abwesenheit bei Krankheit mit fehlender unaufgeforderter Nachlieferung entspricht einer 6.
  • Eine 5 haben Sie sich verdient, wenn in Ansätzen erkennbar ist, dass Sie den Arbeitsauftrag verstanden haben, aber Ihnen noch die handwerklichen Fähigkeiten fehlen, die Arbeit korrekt umzusetzen.
  • Eine 4 haben Sie sich verdient, wenn Sie eine Tabelle ausgeben können mit einer einfachen Druchnummerierung, d.h. fehlerfreie Ausführung der Arbeiten bis Punkt 7.
  • Eine 3 haben Sie sich verdient, wenn Sie es in der gleichen Zeit wie Ihre mit 3 benoteten Mitschüler schaffen bis Punkt 10 abzuarbeiten.
  • Eine 2 haben Sie sich verdient, wenn Sie in dieser Zeit auch noch Punkt 11 erledigt haben.
  • Für die Erreichung einer 1 sollten Sie zusätzlich mindestens einen Punkt in den angeregten Erweiterungen abgearbeitet haben.



Musterlösung: Download