Getting Started

Setting up Marshall is meant to be easy. It reads PGN game data and builds a player to display it. The biggest thing you need to do is tell it how to find the PGN data you want it to display.

This is done in two ways. The easiest way is the way mentioned in the README file: put the PGN data in a separate div (I'll keep talking about this as a div, but it can actually be any HTML element, Marshall doesn't care) and tell Marshall the id of the div. (NOTE: if you use AJAX to load the div with new PGN data, you'll need to remove the old player and tell Marshall to create the player again.)

<div id="mypgndata">PGN Data here.....</div>

Now we need to decide where to locate the player and put an empty div there, with an id that relates it to the PGN data. The player div can be located anywhere on the page it's appropriate to put a div, and the data div doesn't need to be anywhere near it. The demo file, for example, has the player divs at the top of the page, and the data divs at the bottom, and in a different order.

The id for the player div should be the same as the data div, but with "_board" added at the end of it (if you decide to use the more complex alternative source for the PGN data, you don't need the special source div; Marshall will just put the player inside the div you tell it about):

<div id="mypgndata_board"></div>

Now all you need is to start Marshall and give the name of the PGN data div:

<script>var game = new MarshallPGN.Game("mypgndata");</script>

The new MarshallPGN.Game is what starts up Marshall. All the game = bit does is give Marshall a place to work out of. As you can see, mypgndata is what tells Marshall where to find the data, and Marshall builds the id for the player from that.

There are many configuration options for customizing the player. To use them, you include them after the data div id:

<script>var game = new MarshallPGN.Game("mypgndata", {"flipped": true", "skipToMove": "10w"});</script>

That would tell Marshall to flip the board (put black on the bottom) and to start the game display at the position before White's 10th move.

These are just a couple of the configuration options available. The wiki holds a complete list of configuration options and what they do.

Next Step: Styling The Player