User:Fred Gandt/sandbox/chessDemo

{{documentation|content={{lua|Module:Sandbox/Fred Gandt/chessDemo}}

Setup
If deployed site wide, the CSS can be split in two; some delivered to style the demos for users with JavaScript disabled, and the rest to handle the scripted display. The noscript rendering supports the display of an animated .gif which is hidden when the JS loads. The unscripted rendering is identical to the scripted except that the animated .gif shows instead of the interactive board and the controls (buttons) are omitted.
 * These .gifs should be created by a MediaWiki Extension using the ImageMagick PHP library. This is an efficient method of obtaining standardised and consistent fallbacks for all demos.

To correctly render the examples below, and test creating more (on any other pages i.e. in your user sandbox):
 * Add  to your common.js.

For demonstration, all the CSS is loaded by the JS.

TODO
 Demos may not render correctly at any time due to ongoing development. Purge.
 * 1) Accept various forms of move (including PGN) and setup (including FEN) inputs to empower a wider range of editors (no special knowledge required).
 * 2) Build extension to generate animated .gif fallback for users with JS disabled (ImageMagick).

Syntax

 * Size, position and display adjustment:
 * width in pixels (optional - defaults to "200")
 * float "left", "right" or "none" (optional - defaults to "right")
 * clear "left", "right", "both" or "none" (optional - defaults to "both")
 * notation "collapsible" or "collapsed", "left" or "right", or "hidden" (optional - defaults to uncollapsible display underneath the board)
 * columns "number" of columns of notation - will occasionally render one fewer than stated due to maths (optional - defaults to "1")
 * columnwidth "number" of pixels each column should be wide (optional - has no effect unless the notation is "left" or "right" - defaults to "120")
 * numbering "number" with which to begin the notation count or "no" to disable numbering (optional - defaults to "1")
 * controls "mini", "medi" or "none" (optional - defaults to showing all controls)
 * If controls are omitted, autostart will default to "yes"


 * Orientation of board:
 * orientation "black" or empty (optional - defaults to orientation from white's perspective)


 * Demo title and details:
 * title wikitext (optional)
 * information wikitext (optional)


 * Speed of automatic play:
 * speed "seconds" between moves (optional - defaults to "2")


 * Start automatic playing on page load:
 * autostart "yes" (optional)


 * Specify a move to start the demo at:
 * initial "number" of the move after which to start or "end" to start at the end (optional - defaults to the beginning) i.e.:
 * "12" will show the board as if the first 12 moves had already been played
 * "end" will show the board as if all the moves had already been played


 * Specify the pieces and positions at the beginning:
 * setup "color alphanumeral, color alphanumeral, ... " (optional - defaults to the full game start setup)


 * Moves with notation and comments:
 * 1 → &infin; "alphanumeral notation"
 * Optional commentary on a new line:

| 1 = Move commentary (optional) Move commentary (optional)
 * 2 =
 * 3 =
 * 4 =
 * 5 ...

Move notation helper
To assist in creation: 

Autostarting, short demo with no title or information, no controls and notation disabled


Short demo with notation disabled (using helper template)


Autostarting short demo with no title or information and mini controls


Short automatically starting demo with custom notation and medium controls
 

Short demos with simplified notation
 

Full game demo with collapsed notation with initial position at the end


Full real game demo with initial position before the first checking move


Example articles
Copies of current chess articles, with chessDemos used in place of Chess diagrams.
 * /Example article 1: A copy of Deep Blue versus Garry Kasparov (incomplete).
 * /Example article 2: A copy of Deep Blue versus Kasparov, 1996, Game 1.
 * others to follow

}}