Logo Onlinespiele-Sammlung
Let…the…game…play
  • Pacman
  • Mastermind
  • Othello
  • Sokoban
  • Memory
  • Tetris
  • Ladybug
  • Minesweeper
  • Frogger
 
 

Othelly
 
 

Das Spiel

"Othelly" habe ich das schöne, nach Othello-Art funktionierende Spiel von Kelly Yancey nun getauft, nachdem ich es ein wenig umgebaut und erweitert habe; es hat zwar noch keine höhere Intelligenz als das Original (mein Plan sieht vor, ihm diese dereinst noch zu geben), aber es besitzt nun eine ganze Reihe weiterer (Einstell-)Möglichkeiten, die es berechtigen, eine eigene Seite in Anspruch zu nehmen und es ein wenig als "mein" Spiel erscheinen zu lassen.

Hier kannst Du das Programm in der von Kelly ursprünglich beabsichtigten Form zum Spielen gegen den Computer benutzen. Nach meiner Erweiterungsarbeit kannst Du mit ihm nun auch gegen einen anderen Menschen (am selben Computer) spielen; außerdem kannst Du Züge zurücknehmen, indem Du auf den linken Pfeil unter dem Spiel klickst; das Spiel speichert sämtliche Züge und gibt sie zum Schluss im Eingabefeld unter dem Spiel aus.
Falls Du nicht weißt, wie das Spiel Othello bzw. Reversi funktioniert, solltest Du erst die Othellolitis studieren; dort findest Du die Grundlagen des Spiels, aber auch Informationen über ausgefeiltere Strategien.

Alle meine Spiele findest Du auf p-six.de/sign

........
........
........
...O#...
...#O...
........
........
........
 
Original: (c) 2000, 2001 Kelly Yancey

nach oben
   
 

Darstellung von Spielstellungen

Im Zwei-Spieler-Modus kann das Spiel nun auch dazu dienen, Spielstellungen in Tutorials und Strategieführern darzustellen; dazu müssen die Spielstellungen in einem bestimmten Format in den HTML-Quellcode der Seite eingebaut sein.
Hier als Beispiel die Ausgangsposition eines Spiels mit zwei weißen Steinen, dargestellt durch einen Buchstaben (großes O), zwei schwarzen Steinen, durch die Raute (#) dargestellt, und ansonsten leeren Feldern, die durch den Punkt (.) symbolisiert werden:

	<div class="othello-game">
		<pre class="othello-board-code">
			........
			........
			........
			...O#...
			...#O...
			........
			........
			........
		</pre>
		<input type="text" class="gameplay" value="" />
	</div>

Das Programm liest diesen Code beim Aufruf der Seite automatisch aus und baut an seiner Stelle ein vollständiges Spiel auf, mit dem ganz normal im Zwei-Spieler-Modus gespielt werden kann.
Man kann jedoch auch jede beliebige Spielstellung kodieren und erhält ein Spiel, das diese Stellung sichtbar macht.
Im folgenden siehst Du eine Spielsituation vom Internationalen Turnier von Cambridge 1987 zwischen Pete Bhagat (Schwarz) und Joel Feinstein (Weiß), wie letzterer sie in seiner Strategie-Lektion "Die Kunst vier Ecken zu opfern" zur Veranschaulichung verwendet, zuerst in Code-Form und darunter das, was das Programm daraus macht.

..OOOO..
#.O#OO..
##OOOOOO
#O###OOO
.OO#OOOO
OOOOOOOO
..#OOO..
.###.O..

..OOOO..
#.O#OO..
##OOOOOO
#O###OOO
.OO#OOOO
OOOOOOOO
..#OOO..
.###.O..

Othelly bietet aber auch eine einfachere Möglichkeit, eine Stellung in einem Spiel anzuzeigen: man kann ans Ende eines Transkripts sämtlicher Züge den Zug angeben, an dem das Spiel angezeigt werden soll:
F5 D6 C3 D3 C4 F4 F6 G5 E6 D7 E3 C5 F3 E7 H5 E2 C6 D2 C2 G3 F1 E1 D1 G4 F7 H4 H3 C1 B1 B6 H6 B5 E8 D8 C8 G6 B4 A3 C7 F8 G8 F2 A6 G7 A5 A4 A2 B3 H8 H7 G1 G2 B2 A1 H1 B8 A8 H2 B7 A7 > 10
Hier wird das Spiel also bis zum 10. Zug ausgeführt und in dieser Stellung dargestellt. Das Spiel kann dann ebenfalls weitergespielt werden.

........
........
........
...O#...
...#O...
........
........
........

Eine andere Möglichkeiten, Spielstellungen bildlich darzustellen, möchte ich hier am Rande erwähnen: KenSoft bietet und zwar ebenfalls in Javascript das Programm jOthello für diesen Zweck an. jOthello kann auch Spielstellungen einiger anderer Spiele, wie Schach, Dame und Go darstellen und sogar animieren; die angezeigten Spiele können aber nicht wie ein normales Spiel fortgesetzt werden.
   
 

Replay von Spielen

Das Programm besitzt aber noch eine weitere Eigenschaft: man kann ihm eine Abfolge von Zügen im Format "b1 a1 A5 B2 F5G3H8" usw. mitgeben und die Züge dann durch Klicks auf die beiden Buttons links und rechts neben der Eingabe vor- und zurückspielen. Man kann so auch vollständige Partien nachvollziehen.

Dem folgenden Spiel ist das Endspiel der Weltmeisterschaft 2010 zwischen Yusuke TAKANASHI (Schwarz) - Michele BORASSI (Weiß) implantiert; Klicks auf den rechten Pfeil führen durch die Partie.

........
........
........
...O#...
...#O...
........
........
........

Endspiel um die Weltmeisterschaft 2010: Yusuke TAKANASHI (Schwarz) - Michele BORASSI (Weiß)

Nun muss man sich nicht mit dieser einen "voreingestellten" Partie begnügen; man kann auch andere Spiele nachspielen, indem man ihr Transkript in der unten gezeigten Form in das Eingabefeld unter dem Spiel eingibt.
Hier ist das Transkript des Weltmeisterschaftsendspiels der Frauen von 2010 zwischen Veronica STENBERG (Schwarz) und Jiska HELMES (Weiß): F5 D6 C3 D3 C4 F4 C5 B3 C2 F6 G5 E3 G4 B5 B4 C6 D7 E7 E2 E6 D2 C1 C7 D8 A6 A4 B6 G6 A2 D1 E1 F1 F2 H5 F8 E8 C8 A3 A5 F7 H4 H3 H6 H7 G3 G1 G2 F3 B7 G7 H8 G8 H2 A7 A8 B8 B2 H1 A1 B1. Du kannst es kopieren und in das Eingabefeld einfügen; danach musst Du allerdings "RESET" drücken, damit es eingelesen wird.
Hier noch eine Partie des Semifinales von 2011 zwischen Matthias Berg (Weiß) und Piyanat Aunchulee (Schwarz), die mit 38 zu 26 an Matthias Berg ging: F5 D6 C3 D3 C4 F4 F6 G5 E6 D7 E3 C5 F3 E7 H5 E2 C6 D2 C2 G3 F1 E1 D1 G4 F7 H4 H3 C1 B1 B6 H6 B5 E8 D8 C8 G6 B4 A3 C7 F8 G8 F2 A6 G7 A5 A4 A2 B3 H8 H7 G1 G2 B2 A1 H1 B8 A8 H2 B7 A7

Alle Züge können auch zurückgenommen werden, indem man den linken Pfeil klickt.
   
 

Weitere Programme für Replays von Spielen

Mein Programm "Othelly" ist natürlich nicht das einzige Programm, das Replays und Spielstellungen darstellen kann. Ich habe die Möglichkeiten, auf die ich bisher im Netz gestoßen bin, nachfolgend hier eingebaut und soweit möglich, auch angepasst.
Falls es noch mehr geben sollte, bitte ich um konkrete Hinweise!

  1. Ein ziemlich abgefahrenes Programm (in Javascript) für Replays und sogar zur Analyse von Spielstellungen ist Hamlite (Hamlet Lite), das vom Japaner K. Kawami seit 2011 entwickelt wird. Leider sind alle verfügbaren Texte dazu ausschließlich auf Japanisch (doch der GOOGLE-Übersetzer hilft hier ein wenig weiter).
    Die offizielle Webseite hamlet-ajax.appspot.com zeigt das Widget in Aktion.

    WOC 2011 Final (1/3)
    Hiroki Nobukawa [45-19] Piyanat Aunchulee

    Die beste Zugmöglichkeit (AI) kann man sich ab dem 44. Zug anzeigen lassen; alle möglichen Positionen werden mit Zahlen markiert, die die Qualität des Zuges angeben.

    Der Nachteil von Hamlite (außer, dass alle Anleitungen nur in Japanisch vorhanden sind) ist, dass es eine Verbindung zum Server des Betreibers benötigt, um zu funktionieren.

  2. Ein sehr schönes Javascript-Programm, KOBRO genannt, hat Wladimir Khlebnikau (Владимир Хлебников) aus Weißrussland 2007 ins Netz entlassen, mit dem allerdings nur ein Spiel pro Seite angezeigt werden kann.
    Ich habe einen kleinen Bug beseitigt und es ein bisschen bearbeitet, so dass es jetzt auch farblich verändert werden kann.

    Die Button und Eingabefelder bedeuten folgendes bzw. zeigen folgendes an:

    • s Ausgangsstellung wiederherstellen
    • 1. Eingabefeld: Anzahl der Züge
    • 2. Eingabefeld: Steine Schwarz - Weiß
    • >< zur Ausgangsstellung zurückgehen (nachdem man eigene Züge getätigt hat)
    • <-- die eigenen Züge schrittweise zur Ausgansstellung zurückgehen
    • <<< Startstellung
    • << schrittweise zur Startstellung zurückgehen
    • >> schrittweise zum Spielende vorgehen
    • >>> zum Spielende springen

    KOBRO liest das Transkript einer kompletten Partie Othello/Reversi ein, zeigt eine festzulegende Spielstellung an und kann weitergespielt werden.

    Wie ich gerade (20-Oktober-2013) von Uladzimir persönlich erfahren habe, hat er seinen Othello-Browser schon vor einiger Zeit selbst überarbeitet und ihm ein noch besseres, moderneres Kleid gegeben. Man kann zwar immer noch nur eine Partie auf einer Seite anzeigen, aber er hat dieses Problem ausgezeichnet gelöst, indem man neue Partien mit einem Klick am selben Ort darstellen kann. Ich finde, dass auch die Schalter klarer und verständlicher geworden sind. Außerdem ist sein Programm in der Lage, Spielstellungen zu illustrieren.
    Du findest sein Programm auf seiner liebevoll gepflegten Seite othello.gomel.by. Dort gibt es auch ein ausführliches Othello-Tutorial, in dem das Programm zur Darstellung von Spielstellungen ausgiebig genutzt wird.

    Ich zitiere von Wladimirs Seite einige Partien weißrussischer Meisterschaften sowie zwei Spielstellungen aus dem Tutorial, damit sich jeder ein Bild von den Fähigkeiten des Programms machen kann

    • Finale 2012: Lomasky 28-36 Khlebnikau
    • Finale 2010: Khlebnikau 39-25 Tishchenko
    • ДЕНЬ ПОБЕДЫ (Tag des Sieges) 2010, Finale: Lomasky 23-41 Khlebnikau
    • ДЕНЬ ПОБЕДЫ (Tag des Sieges) 2010, Semifinale: Kriwoschejev 16-48 Lomasky
    • диаграмму (Diagramm) 9
    • диаграмму (Diagramm) 10

  3. Wer lieber auf ein JAVA-Applet zurückgreifen möchte, um Othello-Partien nachvollziehen zu können, dem steht auf LiveOthello ein feines Programm von Bruno Causse, Emmanuel Lazard and Stéphane Nicolet zur freien Verfügung.

    Auf LiveOthello.com lassen sichh Hunderte von Partien nachspielen.

  4. Ein ausgezeichnetes Applet ist auch die japanische Entwicklung RIA, die zahlreiche Konfigurationsmöglichkeiten bietet.

    WOC 2011 Final (1/3)
    Hiroki Nobukawa [45-19] Piyanat Aunchulee

    Es gibt einen Replay- und Autoplay-Modus; im Replay-Modus kann man auch in einen normalen Setz-Modus wechseln (Button ganz rechts). Der Endspiel-Löser (zweiter Button von rechts) zeigt an, wohin man am besten den nächsten Zug machen sollte, um möglichst zu gewinnen.

  5. Ein weiteres Applet für diesen Zweck hat vor langer Zeit schon Leonid Shifman entwickelt; auch das ist immer noch brauchbar, obwohl es nicht zu den schönsten gehört und nicht die Nummer des Zuges anzeigt.

    Ein Klick auf das Bildchen macht das Spielfeld sichtbar.

  6. Als vorletzte Möglichkeit habe ich noch das schöne Applet von Yukinobu Goto (後藤幸信氏) zu bieten, das bei Hasera.net eingesetzt wird, um den Erfolg verschiedener Eröffnungen zu zeigen. Hier ist allerdings die Kodierung der Spiele etwas anders und aufwändiger.

    
		<PARAM name="Line1" value="47 46 17 23 26 24 27 49">
		<PARAM name="Line2" value="57 58 09 14 22 29 48 50">
		<PARAM name="Line3" value="42 08 03 04 15 19 35 36">
		<PARAM name="Line4" value="41 12 05 () ## 06 34 51">
		<PARAM name="Line5" value="44 13 07 ## () 01 37 40">
		<PARAM name="Line6" value="16 18 11 02 10 20 28 39">
		<PARAM name="Line7" value="45 38 32 30 25 21 59 54">
		<PARAM name="Line8" value="43 56 33 31 52 53 60 55">

    7. Das Applet zeigt eine Variante der Spieleröffnung "Tiger".
    Es lässt sich einstellen, welche Zugnummern angezeigt werden (Number: 1 = letzter Zug, 2 = nächster Zug, 3 = beides)

  7. Emmett Nicholas hat ebenfalls ein Javascript-Programm erstellt, mit dem man sich Replays der Weltmeiserschaftsendspiele von 2003 bis 2009 ansehen kann; man kann sie allerdings nur Schritt für Schritt nachvollziehen.
    Das Programm enthält keinen Hinweis, ob es zur allgemeinen Verwendung freigegeben ist.

Hamlite, KOBRO sowie die ersten drei JAVA-Programme bieten eine einfache Möglichkeit, das Spiel in einem bestimmten Zustand (nach einem bestimmten Zug) anzuzeigen.
   
 

Nutzung / Download

Zu meiner eigenen Erbauung habe ich den Code in Form einer Klasse angelegt; dies bietet außerdem den Vorteil, dass man mehrere Spiele auf die vorgestellte Art in eine Seite einbinden kann.
Kelly Yancey hat sein Spiel zur Nutzung und Bearbeitung (unter ein paar Auflagen) frei gegeben; deshalb halte ich es ebenso und stelle das Programm jedermann zur Verfügung, der es benutzen oder bearbeiten will.
Hier kannst Du es Dir ansehen: reversi-board-class.js; mit ein paar Anpassungen der globalen Variablen und der Stylesheets lässt es sich leicht auch in andere Umgebungen integrieren. Download von Javascript, Grafiken und CSS (zip, 16 KB)

nach oben