pgn4web live broadcast: flash replacement

What about replacing with a broadly supported technology a well known live chess broadcast client based on the adobe flash technology and therefore not supported by mobile devices such as android phones and tablets, the iphone and the ipad? This page shows equivalent functionality based on HTML5 (javascript + css) that works on mobile devices as well.

basic example

This replicates the flash based client layout and functionality:

advanced example

This shows additional functionality of the pgn4web viewer, including customized colors, customized chess pieces and integrated user/engine analysis board:

more examples

Please find below links to few more live chess broadcast examples showing the multiple options available from pgn4web:

• live compact view
• live fullscreen view
• live mosaic view
• live results view

end user hints for the client user interface

• use the arrow keys to move throughout the game
• click on the dots at the bottom or click on square F5 for the list of available games
• click on square H5 for a fullscreen view, then use the browser's back button to return to this page
• click on square E8 of the main board to activate the analysis board, copying the postion from the main board and starting the built-in chess engine (if supported by the web browser); try moves and variations clicking the from/to squares on the analysis board.
• click on square H8 for further general help

webmaster hints to setup a live games broadcast

The following instructions refer to the basic example; the advanced example including the integrated user/engine analysis board is relatively more complex, please contact the pgn4web project for detailed instructions based on specific requirements.

• copy the pgn4web files on the server, for instance in the folder accessible as http://example.com/somewhere/pgn4web/
• reuse the same tools that generate the chess moves for the flash based client processing the inputs from the electronic boards
• configure those tools to save games as a PGN file accessible as http://example.com/somewhere/pgn4web/live/live.pgn, including clock information if available
• replace the flash object in the live web pages with an inline frame using a src url similar to the example of this page, such as http://example.com/somewhere/pgn4web/dynamic-frame.html?
• set the inline frame height/width as appropriate to each live web page on the server and add any desired iframe css style property
• done
• more info about configuration options at the pgn4web wiki