projekte:wordle [https://fginfo.ksbg.ch Fachgruppe Informatik der KSBG]

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.

====== 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:
<code css>
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;
}
</code>
Im HTML-Code sieht das dann wie folgt aus
<code html>
<td class="normal"></td>
</code>
In JavaScript können diese Klassen wie folgt manipuliert werden:
<code javascript>
// 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');
</code>