Wort Uhr

Der Quellcode Variante 1

Die Programmierung der Wort Uhr benötigt etwas Javascript Programmierung. Daher starten wir mit einer neuen Methode "SetTimeToWords_Simple()" die uns erstmal nur die Uhrzeit ausgibt. Diese Methode erweitern wir dann Schritt für Schritt.
Natürlich brauchen wir dafür auch etwas HTML Code um die Zeit auszugeben:

See the Pen Untitled by Fabian (@Onkelllepie) on CodePen.

Wie ihr seht, habe ich folgendes HTML zur Ausgabe der aktuellen Zeit definiert :

<p id="time"></p>

und

<p>
     <label>
         Es ist
     </label>
     <label id="hourLabel">00</label>
     <label>uhr</label>
     <label>und</label>
     <label id="minuteLabel">00</label>
     <label>min</label>
</p>

Folgender Javascript Code gibt uns die Zeit aus:

function SetTimeToWords_Simple() {
  // date Variable definieren
  var date = new Date();
  
  // date Variable als String mit Millisekunden in das Element time schreiben
  document.getElementById("time").innerHTML = date.toLocaleTimeString() + "." + date.getMilliseconds();
  
  // nur die Stunde der Variable Time in das Element hourLabel schreiben
  document.getElementById("hourLabel").innerText = date.getHours();
  
  // nur die Minute der Variable Time in das Element minuteLabel schreiben
  document.getElementById("minuteLabel").innerText = date.getMinutes();
  
  // Methode SetTimeToWords_Simple alle 10 Sekunden aufrufen
  setTimeout(SetTimeToWords_Simple, 10);
}

// Erstmaliges Aufrufen der Methode SetTimeToWords_Simple()
SetTimeToWords_Simple();

Der Code wurde mit Kommentaren (erkennbar an den // vor dem Text) versehen, damit ihr wisst, was die einzelnen Zeilen bewirken.
Als Ergebnis sehen wir nun die Uhrzeit ganz normal in der Form Stunde:Minute:Sekunde und zusätzlich als einfachen Text. Allerdings werden die Stunden und Minuten immer noch als Zahlen ausgegeben. Das wollen wir im Folgenden ändern. Dafür erstellen wir uns eine einfache Methode, die die Zahl "1" in den Text "eins", die Zahl "2" in den Text "zwei" und so weiter verwandelt:

function NumberToWord(number) {
    switch (number) {
        case 0:
            return "null";
            break;
        case 1:
            return "ein";
            break;
        case 2:
            return "zwei";
            break;
        case 3:
            return "drei";
            break;
        case 4:
            return "vier";
            break;
        case 5:
            return "fünf";
            break;
        case 6:
            return "sechs";
            break;
        case 7:
            return "sieben";
            break;
        case 8:
            return "acht";
            break;
        case 9:
            return "neun";
            break;
        case 10:
            return "zehn";
            break;
        case 11:
            return "elf";
            break;
        case 12:
            return "zwölf";
            break;
    }

Hierzu ein paar Besonderheiten. Zum einen benutzen wir hier einen sogenannten "Switch Case" Befehl. Das heißt, wir übergeben dem Befehl eine Variable, in unserem Fall "number" mit dem Wert 1 oder 2 oder 3 und so weiter.
Mit dem "case" definieren wir, was in einem bestimmten Fall zu tun ist. Zum Beispiel definieren wir mit:

case 1:
    reurn "eins";
    break

das wenn "number" eine "1" ist, dann soll die Methode "eins" zurückgeben.
Probiert es gerne mal aus:

See the Pen Untitled by Fabian (@Onkelllepie) on CodePen.

Ändere oben im JavaScript einfach den Wert "1" unter "eingabeVariable" in "2". Danach wird "zwei" ausgegeben.
Ändere den Wert nun in "3" und es wird "kenne ich nicht" ausgegeben. Denn "3" ist nicht definiert, und daher nutzt der Switch-Case-Befehl die Definition aus der "default"-Implementierung:

default:
     return "kenne ich nicht";
     break;

Erweitert nun den Switch Case Befehl um folgende Definition:
Aber Achtung! Ihr müsst diesen über dem "default" Befehl einfügen.

      case 3:
        return "drei";
        break;

Nun sollte "drei" ausgegeben werden. Wenn ihr alles richtig gemacht habt, dann sieht es am Ende so aus:

See the Pen Untitled by Fabian (@Onkelllepie) on CodePen.

Ihr kennt nun den Switch-Case-Befehl. Deshalb zurück zu unserer Wortuhr. Aktuell haben wir nur ein Switch-Case bis 12 programmiert. Da unser Tag aber 24 Stunden hat, müssen wir die Programmierung erweitern.
Außerdem wollen wir auch die Minuten in Worten anzeigen, deshalb benötigen wir sogar eine Programmierung bis 60!
Da das eine sehr lange Methode wäre, habe ich versucht dieses Problem etwas eleganter zu lösen:
Wie ihr wisst, sind die Zahlen bis 20 immer eindeutig, aber ab der 21 ändert sich im 10er-Rhythmus immer nur die Zahl vorne. Also 21 und 31 oder 22 und 32 oder 23 und 33 und so weiter:

1	eins	11	elf	21	ein und zwanzig	31	ein und dreißig	41	ein und vierzig	51	ein und fünfzig
2	zwei	12	zwölf	22	zwei und zwanzig	32	zwei und dreißig	42	zwei und vierzig	52	zwei und fünfzig
3	drei	13	drei zehn	23	drei und zwanzig	33	drei und dreißig	43	drei und vierzig	53	drei und fünfzig
4	vier	14	vier zehn	24	vier und zwanzig	34	vier und dreißig	44	vier und vierzig	54	vier und fünfzig
5	fünf	15	fünf zehn	25	fünf und zwanzig	35	fünf und dreißig	45	fünf und vierzig	55	fünf und fünfzig
6	sechs	16	sechs zehn	26	sechs und zwanzig	36	sechs und dreißig	46	sechs und vierzig	56	sechs und fünfzig
7	sieben	17	sieb zehn	27	sieben und zwanzig	37	sieben und dreißig	47	sieben und vierzig	57	sieben und fünfzig
8	acht	18	acht zehn	28	acht und zwanzig	38	acht und dreißig	48	acht und vierzig	58	acht und fünfzig
9	neun	19	neun zehn	29	neun und zwanzig	39	neun und dreißig	49	neun und vierzig	59	neun und fünfzig
10	zehn	20	zwanzig	30	dreißig	40	vierzig	50	fünfzig	60	sechzig

Wir sehen hier einige Besonderheiten:

• Die Zahlen 1 bis 12 sind immer eindeutig und unterliegen keinem Muster
• Die Zahl 17 wird als "siebzehn" geschrieben und nicht als "siebenzehn"
• Die Zehnerpotenzen, also 10, 20, 30, 40, 50, lassen sich auch nicht gut verallgemeinern
• Alle anderen Zahlen: 21-29, 31-39, 41-49, 51-59 lassen sich gut verallgemeinern und in ein Muster verpacken

Daher kann man folgende Methode programmieren:

• Die Zahlen 1-20 und die Zehnerpotenzen, also 30, 40, 50, als switch case Befehl
• Alle anderen Zahlen, als folgende Methode:

See the Pen Untitled by Fabian (@Onkelllepie) on CodePen.

Im obigen Code gibt es eine Methode "NumberToWord", die eine Variable "Number" erwartet.
Darin wird ein Array (eine Liste von Werten) definiert. Diese Liste enthält alle Zahlen von 1 bis 9 und deren Äquivalent (also Übersetzung) in Worten.
Als nächstes wird in einer if-Anweisung (also eine "Wenn -> Dann"-Anweisung) überprüft, ob der Wert in "number" größer als 20 und kleiner als 30 ist. Falls ja:
Dann wird aus dem Array der Wert an der Position "number-20" geladen und mit "undzwanzig" verknüpft. Zum Beispiel, wenn "number" 22 ist, wird der Wert an der Position 2 im Array geladen, was "zwei" entspricht. Dieser Wert wird mit "undzwanzig" verknüpft, also "zwei" + "undzwanzig" ergibt "zweiundzwanzig".
Falls nein, wird geprüft, ob der Wert zwischen 30 und 40 liegt. Falls ja, wird wieder der Wert aus dem passenden Array-Eintrag geladen und mit "unddreißig" verknüpft.
Und so weiter... Probiert es im obigen Code gerne mal aus und ändert den Wert "var number = 22;" auf 35 oder 47.

Hier findet ihr nun die komplette Methode mit dem Switch Case Befehl und der Array Implementierung von Zahlen in Worte:

See the Pen Untitled by Fabian (@Onkelllepie) on CodePen.

Nun klingt vielleicht alles sehr logisch und nachvollziehbar, was ihr gelesen habt. Aber es ist schöner, auszuprobieren, ob unsere Programmierung auch immer funktioniert.
In einem professionellen Projekt würde man einen Test programmieren und damit prüfen, ob der Code immer korrekt funktioniert. (Das machen wir jetzt mal nicht, weil es sehr theoretisch ist und man nicht viel sieht. Falls ihr Interesse daran habt, dann schreibt mir einfach, und ich werde eine extra Seite dazu posten.)
Aber wir begnügen uns damit, mit unseren eigenen Augen zu prüfen, ob alles funktioniert. Vermutlich habt ihr jedoch keine Lust, den ganzen Tag vor dem Bildschirm zu sitzen und die Uhr zu beobachten.
Deshalb stelle ich euch hier eine Möglichkeit vor, um den Tag etwas schneller vergehen zu lassen und die Uhr vorzudrehen.

Oben habt ihr sicherlich den Strich mit dem Punkt unter der Wortuhr bemerkt (auch Slider genannt). Damit könnt ihr die Zeit schneller vergehen lassen. Zieht den Punkt einfach nach rechts, und die Zeit vergeht schneller. Hier der Code dazu:

See the Pen Untitled by Fabian (@Onkelllepie) on CodePen.

Wie funktioniert das? - Wie ihr im Code oben sehen könnt, wurde eine Date-Variable "dateTimeToWords" außerhalb, also nicht in einer Methode, sondern "Global" definiert:

var dateTimeToWords = new Date();

Dann wurde eine Methode "fastForward" programmiert, die in diese Variable immer als neues Datum plus einen Wert neu setzt:

function fastForward() {
...
dateTimeToWords = new Date(
    dateTimeToWords.getTime() + milliSecsInputFastForward
  );
}

Die Zahl "milliSecsInputFastForward" ist der Wert vom Schieberegler, der zwischen 1 und 600.000 liegt. Jedes Mal, wenn wir die "fastForward"-Methode aufrufen, schauen wir auf die aktuelle Zeit in der "dateTimeToWords"-Variable und fügen die Millisekunden hinzu, die wir auf dem Schieberegler ausgewählt haben.

Um das besser zu verstehen: Stellt euch vor, "dateTimeToWords" zeigt auf den 01.01.1971 um 00:00:00.100 Uhr, also 100 Millisekunden nach Mitternacht am 01.01.1970. Die Funktion "getTime()" gibt uns die Millisekunden seit dem 01.01.1970 00:00:00 zurück. In diesem Beispiel sind das also 100. Wenn der Schieberegler nun auf 200 eingestellt ist, setzen wir die Zeit auf den 01.01.1971 00:00:00.300, also 200 Millisekunden später als die Uhr eigentlich anzeigen sollte.

Das passiert jedes Mal. Im nächsten Durchlauf sind dann 100 Millisekunden vergangen: 00:00:00.200 ist die eigentliche Uhrzeit, aber die Variable zeigt 00:00:00.300 an. Dann addieren wir 200 dazu, und es wird 00:00:00.500. So vergehen innerhalb von 100 Millisekunden auf unserer Uhr tatsächlich 400 Millisekunden.

Mit dieser Methode können wir die Zeit schneller laufen lassen und genau beobachten, wie sich unsere Uhr verhält.

Zurück zum Code. Im HTML ist der Slider definiert:

  <input id="fastForwardMilliseconds" type="range" min="100" max="600000" value="100">

Im Javacript wird der "Value", also der ausgewählte Wert mittels "document.getElementById("fastForwardMilliseconds").value" ausgelesen und als eine Ganzzahl interpretiert (Ganzzahl = Integer = Int, parse = interpretieren 0> parseInt = als Integer interpretieren):

  var milliSecsInputFastForward = parseInt(
    document.getElementById("fastForwardMilliseconds").value
  );

Dieser Wert wird in der Variable "milliSecsInputFastForward" gespeichert und dann in einem Text angezeigt und eben für die Berechnung der neuen Uhrzeit verwendet:

// Anzeigen des ausgewählten Wertes - eigentlich nicht notwendig
  document.getElementById(
    "fastForwardMillisecondsDisplay"
  ).innerText = milliSecsInputFastForward;

// Erzeugen der neuen Uhrzeit mit dem ausgewählten Beschleunigungsfaktor
  dateTimeToWords = new Date(
    dateTimeToWords.getTime() + milliSecsInputFastForward
  );

Die Methode "fastForward" wird über "getTimeout(fastForward,100)" alle 100 Millisekunden aufgerufen. Daher ist 100 als Standardwert definiert. Die Uhrzeit entspricht damit, mehr oder weniger, genau der aktuellen Uhrzeit.

  setTimeout(fastForward, 100);

Nur wenn ein größerer Wert als 100 ausgewählt wird, wird die Zeit beschleunigt.

Damit man direkt sieht, was passiert, wenn man die Zeit beschleunigt laufen lässt, habe ich auch die vorangegange Programmierung hinzugefügt.
Man sieht damit wie sich unser Text "Es ist HH Uhr und MM Minuten" verändert, wenn man ihn schnell laufen lässt.
Wichtig hierbei ist, dass die genutzte Variable für die Zeit nun "dateTimeToWords" und nicht mehr "date" ist!

Alter Code:

function SetTimeToWords_Simple() {
 var date = new Date();
    document.getElementById("hours_TimeToWords").innerHTML = "<em>" + NumberToWord(date.getHours()) + "</em>";
    document.getElementById("minutes_TimeToWords").innerHTML = "<em>" + NumberToWord(date.getMinutes()) + "</em>";

    setTimeout(SetTimeToWords_Simple, 10);
}

Neuer Code:

function SetTimeToWords_Simple() {
  document.getElementById("hours_TimeToWords").innerHTML =
    "<em>" + NumberToWord(dateTimeToWords.getHours()) + "</em>";
  document.getElementById("minutes_TimeToWords").innerHTML =
    "<em>" + NumberToWord(dateTimeToWords.getMinutes()) + "</em>";

  setTimeout(SetTimeToWords_Simple, 10);
}

Nun ist unsere erste Variante für eine Wort Uhr fertig programmiert. Fast... . Denn mir ist ein kleiner Fehler aufgefallen. Wenn Ihr oben mal die Zeit auf 13:01 stellt, dann fällt euch vielleicht auf, dass dann "es ist dreizehn Uhr und ein Minuten" angezeigt wird. Das stimmt so leider nicht und müsste eigentlich "es ist dreizehn Uhr und eine Minute" lauten.
Deshalb habe ich den Code nochmals verändert. Ich habe eine Methode erstellt, die den Sonderfall "eine Minute" behandelt:

function NumberToWordOneException() {
    // Aktuelle Minute auslesen
    var minuteDateTimeToWords = dateTimeToWords.getMinutes();
    // Prüfen ob diese genau 1 ist
    if (minuteDateTimeToWords == 1) {
        // Die Zeit ist genau 1, 
        // also "Minute" statt "Minuten" anzeigen
        document.getElementById("minuteLabel_TimeToWords").innerText = "Minute";
        // also "eine" statt "ein" anzeigen
        document.getElementById("minutes_TimeToWords").innerHTML = "<em>" + "eine"+ "</em>";
    }
    else
    // Die Zeit ist ungleich 1, somit "Minuten" anzeigen
    document.getElementById("minuteLabel_TimeToWords").innerText = "Minuten";
    }

Hierbei wird die aktuelle Minute ausgelesen. Wenn diese 1 ist, dann wird "eine Minute" angezeigt, statt "ein Minuten". Wenn diese ungleich 1 ist, dann wird "Minuten" angezeigt und die bestehende Übersetzung in Worte genutzt.

See the Pen Untitled by Fabian (@Onkelllepie) on CodePen.

Nun sind wir hoffentlich wirklich fertig mit der Programmierung und niemand von euch findet einen weiteren Fehler. Falls doch, dann meldet euch bitte über das Kontaktformular.

Allerdings sieht die Wort Uhr noch sehr einfach aus. Deshalb wollen wir mit etwas CSS das Design der Wort Uhr ändern. Ich dachte mir, ich gebe der Uhr einen hellblauen Hintergrund, zeichne einen Rahmen drumherum und setze die Schriftfarbe auf weiß. Gedacht getan:

   .watchText {
            font-family: Verdana;
            font-size: 22px;
            font-weight: 500;
            text-align: center;
            color: #f8f8ff;
        }

        .watchText_Frame {
            border-style: solid;
            border-color: #d3d3d3;
            border-radius: 25px;
            border-width: 10px;
            background-color: #87ceff;
            padding: 10px 20px 5px 20px;
            color: #f8f8ff;
            font-family: Verdana;
            font-size: 22px;
            font-weight: 500;
            text-align: center;
        }

Damit sieht unsere Uhr dann so aus:

See the Pen Untitled by Fabian (@Onkelllepie) on CodePen.

Hier eine kurze Beschreibung der CSS Eigenschaften, damit ihr wisst welcher Wert was bedeutet:

Die CSS Klasse WatchText_Frame gibt die Hintergrndfarbe und die Textgestaltung an:

border-style: solid;	Gibt die Art des Rahmens an.
border-color: #d3d3d3;	Gibt die Farbe des Rahmens an.
border-radius: 25px;	Gibt die Rundung des Rahmens an.
border-width: 10px;	Gibt die Breite des Rahmens an.
background-color: #87ceff;	Gibt die Hintergrundfarbe an.
padding: 10px 20px 5px 20px;	Gibt die Entfernung zu Rahmen an.
color: #f8f8ff;	Gibt die Schriftfarbe an.
font-family: Verdana;	Gibt die Schriftart an.
font-size: 22px;	Gibt die Schriftgröße an.
font-weight: 500;	Gibt die Dicke der Schrift an.
text-align: center;	Gibt an, dass der Text in der Mitte zentriert werden soll.

Probiert es gerne mal aus und ändert die Werte. Zum Beispiel die Schriftfarbe oder den Hintergrund. Ihr bekommt sicher ein noch schöneres Ergebnis hin.

Der Quellcode Variante 2

Wie ihr seht ist Variante 1 die genaue Angabe der Uhrzeit in Stunde und Minute, nur als Text.
Variante 2 soll die Uhrzeit nur "ungefähr" angeben. Also zum Beispiel für 12:13, soll angezeigt werden "Es ist kurz vor viertel Eins". Hier erläutere ich wie ich die zweite Variante der Wort Uhr programmiert habe.
Hier nochmal der Vergleich der beiden Varianten.

Variante 2 arbeitet mit Arrays, das sind sozusagen Listen von Informationen. In diesem Fall enthalten sie Angaben über einen bestimmten Zeitraum und den dazugehörigen Text, der angezeigt werden soll.

Ein Beispiel: "0-5|Es ist gegen [Stunde]" bedeutet, dass wenn die Minuten einer Stunde zwischen 0 und 5 liegen, dann soll der Text "Es ist gegen" angezeigt werden, gefolgt von der aktuellen Stunde. Zum Beispiel, wenn es 12:02 ist, wird angezeigt: "Es ist gegen 12". Das Wichtige, also die Uhrzeit, wird dabei besonders hervorgehoben, indem sie mit einem HTML "b"-Tag umschlossen wird und somit fett dargestellt wird.

Im JavaScript-Code wird mit einer sogenannten "Foreach"-Schleife gearbeitet, das bedeutet, dass für jedes Element in einer Liste eine bestimmte Aktion ausgeführt wird. Die Definition, die den Zeitraum und den Text enthält, wird ausgelesen und verarbeitet. Die Definition wird durch das Zeichen "|" (Pipe) getrennt.

Der Zeitraum wird dann weiter in Startzeitraum und Endzeitraum unterteilt. Der Startzeitraum steht am Anfang, daher wird er mit var startIndex = timeAndTextDefinitionItem.split("|")[0].split("-")[0]; extrahiert. Der Endzeitraum steht nach dem Minus und wird mit var endIndex = timeAndTextDefinitionItem.split("|")[0].split("-")[1]; extrahiert.

Anschließend wird verglichen, ob der aktuelle Zeitraum zwischen dem Start- und Endzeitraum liegt. Wenn dies der Fall ist, wird der dazugehörige Text gesetzt. Dieser Text wird zuvor ausgelesen und der Platzhalter "[Stunde]" bzw. "[Stunde+1]" wird durch die entsprechende Stundenangabe ersetzt.

So wird die zweite Wortuhr programmiert.

See the Pen Wortuhr Alernative 2 by Fabian (@Onkelllepie) on CodePen.

Der Quellcode Variante 3

Die dritte Variante der Wortuhr basiert auf einfachen If-Anweisungen. CSS und HTML sind genau wie bei den anderen Varianten. Nur der Javascript Code ändert sich.
Hier wird die Funktion SetTimeToWords_ByIfDefinition programmiert. Diese erfüllt verschiedene Aufgaben. Hier ist eine zusammenfassende Erklärung:

1. Zeitangabe erstellen:

Die Funktion startet mit der Anzeige der aktuellen Uhrzeit und Millisekunden in einem HTML-Element mit der ID "time". Dadurch wird die Echtzeituhr visualisiert.

document.getElementById("time").innerHTML = dateTimeToWords.toLocaleTimeString() + "." + dateTimeToWords.getMilliseconds();

2. Fallbasierte Textgenerierung:

Der Hauptteil der Funktion besteht aus einer Reihe von if- und else if-Anweisungen, die die aktuelle Minutenanzahl überprüfen. Abhängig von dieser Minutenanzahl wird ein bestimmter Text generiert und in der Variable text aufgebaut.

Beispiel: Wenn die Minutenanzahl genau 0 ist, wird der Text "genau [aktuelle Stunde] Uhr" erstellt und in text gespeichert. Falls die Minutenanzahl weniger als 5 ist, wird der Text "fast fünf Minuten nach [aktuelle Stunde]" generiert. Die aktuelle Stunde wird dabei in Worten und fett dargestellt.

if (dateTimeToWords.getMinutes() == 0) {
    text += "genau <b>" + NumberToWordMax12Hours(dateTimeToWords.getHours()) + "</b> Uhr";
}
else if (dateTimeToWords.getMinutes() <= 5) {
    if (dateTimeToWords.getMinutes() < 5) {
        text += "fast ";
    }
    text += "<b>fünf</b> Minuten nach <b>" + NumberToWordMax12Hours(dateTimeToWords.getHours()) + "</b> ";
}
// Weitere Bedingungen für verschiedene Zeitintervalle...

3. Aktualisierung alle 10 Millisekunden:

Wie immer verwendet die Funktion setTimeout, um sich selbst alle 10 Millisekunden erneut aufzurufen. Dadurch wird die Anzeige dynamisch aktualisiert und die Uhrzeit in Echtzeit dargestellt.

setTimeout(SetTimeToWords_ByIfDefinition, 10);

4. Besondere Betonung in HTML:

Der generierte Text wird durch die Verwendung von HTML-Tags wie <b> und </b> betont. Beispielsweise wird die aktuelle Stunde fett dargestellt.

text += "genau <b>" + NumberToWordMax12Hours(dateTimeToWords.getHours()) + "</b> Uhr";

Die Funktion ermöglicht eine flexible Anpassung des angezeigten Textes basierend auf den aktuellen Minuten der Uhrzeit und bietet gleichzeitig eine visuelle Darstellung der Echtzeituhr. Die genaue Funktionalität hängt von anderen im Code definierten Funktionen und Variablen ab, insbesondere von dateTimeToWords und NumberToWordMax12Hours.

Das Ergebnis seht ihr hier:

See the Pen Untitled by Fabian (@Onkelllepie) on CodePen.

Ich hoffe euch gefällt eine der Wortuhren und programmiert selbst ein wenig um dabei zu lernen wie die Wortuhren funktionieren. Wenn ihr mögt, habe ich hier einige Aufgaben für euch.

• In Variante 1 habe ich ein Muster vorgestellt wie die Zahlen für 24 Stunden und 60 Minuten verallgemeinert werden können, damit man nicht so viel Mühe bei der Programmierung hat. Fällt euch eventuell noch eine andere Möglichkeit ein? Habt Ihr Ideen? Falls ja, dann meldet euch über das Kontaktformular.
• Vielleicht könnt Ihr schon etwas Englisch sprechen und schreiben. Könnt Ihr die Wortuhr ins Englische übersetzen? Oder sogar in beiden Sprachen anzeigen: Deutsch oder Englisch?
• Vielleicht könnt Ihr auch eine Uhr Programmieren die die Wortuhr und eine analoge Uhr zeigt. So kann jemand leichter das Uhren - Lesen erlernen, der die analoge Uhr vielleicht noch nicht so gut kann.

Ich wünsche euch viel Spaß dabei, schickt mir gerne eure Ergebnisse und bei Fragen, wie immer, einfach fragen.