57

I think that a javascript game replayer would be interesting and useful.

For a brief list of requirements - something that can display several variations and move comments as well as be fairly easily edited (at least for minor edits).

UPDATE: This has now been implemented!

4
  • 6
    Regardless of options, I think this is an extremely important piece that needs to be here if this forum is to be successful.
    – Eve Freeman
    Commented May 8, 2012 at 14:37
  • 4
    I already upvoted the post and Wes' comment, but I want to say too how crucial I think this feature is for the site to work well and to grow. We can talk about chess without this functionality, but to really talk chess, a tool like this is indispensable. It will certainly help the site draw (and retain) visitors. Be sure to vote if you want this feature, so that we can show SE its importance to users. And if you haven't checked out what Andrew made (in the answer below), I recommend that you do.
    – ETD Mod
    Commented Sep 6, 2012 at 19:53
  • 1
    +1 to the original post
    – Chetter Hummin
    Commented Sep 10, 2012 at 10:40
  • Wow, at last we did it!
    – Binoj Antony
    Commented Dec 20, 2012 at 8:03

5 Answers 5

Reset to default
39

I apologize for the delay, but thanks to Andrew's excellent replayer, this is now finally enabled on the main site. The basic idea is: Indent your PGN by four spaces (you can use the editors "Preformatted text" button or Ctrl-K), and we'll display the board in its place.

It also works in the editor preview, so you can play around and try it out without having to submit anything.

I'll describe the details below; note that this is not final and is very much up for discussion. You are the ones who know best what makes sense, so please be sure to give your feedback, and we'll try to adjust things for you to be as comfortable as possible for you.

What kind of markup is (currently) converted into a player?

An indented block containing just a FEN string will be displayed as a static board without move controls:

r1br2k1/pp3ppp/2n2n2/1Bb3B1/8/2p2N2/PPP2PPP/R4RK1 w - - 1 13

looks like this:

          

A FEN string followed by moves will be displayed with move controls. Example:

6k1/1P3p2/2p3pb/2q4p/2rpPP2/3Q2PP/8/5RK1 b - - 0 2

1... Rb4 2. Rb1 Qb6 3.Rxb4 Qxb4 4. Qa6 Qxb7

is displayed as

          

The FEN string can also be included in a [FEN "..."] PGN header instead.

What kind of markup is (currently) not converted into a player?

An indented block containing only moves is not converted. The reason I decided to go this way is that there are just too many indented blocks on chess.se that contain moves in one way or the other; often just one or two, and often not even based on the initial board position. Displaying all those as a player widget may a) often look wrong, and b) cause an overwhelming amount of players on some question pages.

So you have to be explicit about wanting a replayer widget by providing a FEN string. If your moves start from the initial position, as a shortcut you can just provide an empty FEN string in a PGN header, like this:

[fen ""]

1. e4 e5 2. Nf3 Nc6 3. d4 exd4

which turns into this:

          

Where to go now?

This initial version is a starting point for discussion. Please let me know what makes sense, what doesn't, what could be improved, etc. (Almost) nothing is set in stone yet.

One thing I could imagine to be nice, but am not sure on how to express it in markup, is the idea of "continuation". For example, if the question contains a few moves and asks "what should I do now?", then an answerer could be able to indicate "continue from the situation in the question" and add their additional moves, without being forced to copy & paste from the question.

4
  • 4
    Wow, this is awesome! Thanks for putting it in.
    – Eve Freeman
    Commented Dec 9, 2012 at 18:34
  • I'm looking to propose a widget for another SE instance, what exactly is the process?
    – jayarjo
    Commented Dec 8, 2019 at 17:27
  • Currently, comments are stripped away from the PGN and the notation does not look pretty when there are many moves.
    – Nils Lindemann
    Commented Aug 21, 2022 at 14:53
  • Oops, I see it shows the comments below the board. But when the notation contains many moves, one has to scroll down to see the comments. The board is then not visible.
    – Nils Lindemann
    Commented Aug 21, 2022 at 15:17
20

One of the projects that I was working on for a contracting gig involved creating a javascript chess replayer. The key features that were required were keyboard shortcuts, mouse wheel movement, and support for variations and comments, all of which were implemented. Here's a screenshot; to get a feel for it, you can play through this game, as well as another one that uses the comments and variations features, at the demo page linked to below.

Morphy classic

Since I do think that it's very important to be able to view and share chess games on this site, I put the replayer on github. It's implemented as a jquery plugin, and it's licensed under the MIT License.

Demo page:
http://andrewphoy.github.com/chess-replayer/

GitHub repository:
https://github.com/andrewphoy/chess-replayer

10
  • 1
    Here is another that is pretty advanced: lutanho.net/pgn/pgnviewer.html
    – Robert Kaucher
    Commented Sep 10, 2012 at 12:17
  • 1
    Significantly, I have just tried @Andrew's replayer on two obscure, old, out-of-date Web browsers, lacking special plugins: Iceweasel 3.5.16 and Epiphany 2.30.6. It works beautifully on both. Of course, no one here is any more interested than I am in these, specific old browsers, but that is not the point of this report. The point is that, if it works smoothly on these browsers, it will probably work most anywhere, on most any device. Good work.
    – thb
    Commented Sep 11, 2012 at 14:39
  • 2
    @tbh, thanks, but I have to admit, after reading the first line I was horrified. In my mind, I was expecting "it works terribly in anything less than chrome 37.99". Thanks :)
    – Andrew Mod
    Commented Sep 11, 2012 at 15:18
  • 1
    Yes, very nice job for an initial release. I recommend you figure out a fairly lax open source license to go with and post it prominently somewhere, along with adoption instructions. I'd probably even use it on my blog; the chesstempo one has some complexities I'd rather avoid (they have a more complex set of requirements), and it's somewhat slow when you have many boards on one page.
    – Eve Freeman
    Commented Sep 11, 2012 at 18:28
  • @WesFreeman done, MIT Licensed now. What did you have in mind for adoption directions? I threw together a brief set of instructions on github pages. Anything I'm missing?
    – Andrew Mod
    Commented Sep 11, 2012 at 18:46
  • I guess I was thinking any license-related instructions, but I suppose that one is open enough that it shouldn't matter. Looks great.
    – Eve Freeman
    Commented Sep 12, 2012 at 0:43
  • 1
    +1 for Andrew's solution. Really nice. Works well on my Galaxy s3 and Asus Transformer tablet.
    – Robert Kaucher
    Commented Sep 13, 2012 at 2:21
  • 3
    Hey Andrew, just a heads-up: This looks really great, and we're working on implementing your player on chess.se. Thanks for the project!
    – balpha StaffMod
    Commented Oct 1, 2012 at 6:46
  • @balpha that's wonderful! Feel free to let me know (here or by email) if you need anything else or if parts of the code aren't sufficiently commented.
    – Andrew Mod
    Commented Oct 1, 2012 at 13:44
  • @balpha, fantastic!
    – ETD Mod
    Commented Oct 1, 2012 at 14:46
5

I don't know what would be the best plugin around (especially a free one). I personally like what they use at chess.com, but maybe it's proprietary.

An alternative would be to use a TeX renderer of a chess board... Other stackexchange sites invoke TeX, so it couldn't be that hard.

4

Over at chesspub.com, yabb (yet another bulletin board) based site, you can embed a pgn viewer into your comments with "chessflash". See:

I don't know if there is something special about yabb that enables this, whether they had to configure yabb to allow it, or if it just works without doing anything special, but below is a recent thread where you can see it being used:

http://www.chesspub.com/cgi-bin/yabb2/YaBB.pl?num=1311509071/382

1
  • 6
    I think one of the requirements should be that whatever is chosen be as universally accessible as possible. In my opinion, this would preclude Flash (and for that matter Silverlight or any other plugin) based technologies as these will not be available on most Tablet systems. I know that currently Flash does exist for Android tablets, but it has been abandoned for mobile platforms.
    – Robert Kaucher
    Commented Sep 10, 2012 at 12:20
1

pgn4web, javascript chess games viewer for websites, blogs and live broadcasts, is a great one too.

1
  • +1 I know, the question is answered. But, i think this may help a future reader
    – Cyriac Antony
    Commented Dec 3, 2018 at 15:59

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .