====== Wordle ====== ===== Logik ===== * Die Wortlisten können auch direkt von einer Wordle-Seite kopiert werden. Einfach im JavaScript Code schauen. Meist gibt es zwei Listen: Eine mit zu erratenden Wörtern, und eine mit auch seltenen Wörtern, die als gültig erkannt werden. * Um die Buchstaben zu markieren, in zwei Schritten vorgehen: * Erst die korrekten bestimmen (grün). * Dann unter den nicht-grünen gelbe bestimmen, wobei dann beide Positionen markiert werden müssen: eine als gelb, die andere als gebraucht. Sonst markiert man hier z.B. beide S: GUESS, SORTE. ===== UI ===== Das einfachste ist es wohl, mit einer Tabelle zu arbeiten und dort mit CSS die Buchstaben schön zentrieren und die Zellen quadratisch machen. Für die Färbung sollten Klassen verwendet werden: td { color: white; // plus weitere Formatierungen für grösse, zentrierung, schatten etc. } .normal { background-color: black; } .gelb { background-color: darkyellow; } .gruen { background-color: darkgreen; } Im HTML-Code sieht das dann wie folgt aus In JavaScript können diese Klassen wie folgt manipuliert werden: // Kopiert von https://stackoverflow.com/questions/195951/how-can-i-change-an-elements-class-with-javascript document.getElementById("MyElement").classList.add('MyClass'); document.getElementById("MyElement").classList.remove('MyClass'); if ( document.getElementById("MyElement").classList.contains('MyClass') ) document.getElementById("MyElement").classList.toggle('MyClass');