Board Game Arena

Hi again,

I'm trying to get the hang of using the Stock and/or Zone JS components in a game I'm developing (Villagers). This is a tableau-building card game with a central mechanic being the building of production chains by stacking higher powered cards on top of lower ones, with the added complexity of being able to "branch" two chains off of one starting card. I think I've got the serverside PHP groundwork laid pretty well for allowing this branching structure, but I'm totally lost on how to do this for the graphics/clientside JS.

Right now, I'm trying to figure out if making these branching structures for the cards in the tableaus would be doable with either the Stock and/or the Zone components in the BGA codebase- would they? And if so, does anyone know of a good BGA game, either up on the main site or in development, that I could use as a model for building this structure?

Thanks,
Collin

If the main driver in your container choice is the arrangement of objects, I would look into the Custom mode for the Zone object (see example at the bottom of the page)

Assuming that the branching locations are not predetermined, I would probably go about this by making a utility function that injects a jstpl template div and creates new zones at each branch point. I'm not aware of any games that have something like this already built.

For reference, These are the main driving features that would lead me to choose a stock over a zone:
1. The objects are simple sprites that don't need to exist outside of the container.
2. I would need to use the features and event handlers for selecting objects.

Thanks for the reply,

One other (slightly related) question: If I've got a set of 6 different decks that I also want to display in a row, each next to the other, would the best way to do this be with 6 zones, or with a stock?

And can zones be included in a stock element? To give the extra functionality of stocks?

That depends on what you mean by "displaying" the deck. If you need to show an array of fully visible cards for each deck, it would make sense to have a container for each deck. If you just need to see a single card from each deck, I would go with a single stock or zone.

I suppose you could inject html into the stock item that would be associated with a zone, but I would caution that the lifetime of stock items in the DOM is handled entirely by the stock object, the stock has a grid arrangement that can't be customized beyond a single item-margin variable, and changing window size or inserting items might have unexpected results since stock handles this automatically. It might be more trouble than it's worth to have the outer object be a stock.

Just to be clear. Stocks and zones themselves are Javascript objects that you would have to construct somewhere in this that are associated with an div or other element in the DOM when their create method is called.

Edit: I haven't looked through the code, but King's Guild makes effective use of containers for a variety of situations such as embedded objects. It might be a good precedent to study.

Thanks for the pointers- I'll have a look at the King's Guild code

Oh, wait, one last thing: if I need to move cards from a player's hand (currently a Stock object) into their tableau with the branching structure (which sounds like it should be a Zone object), is there an easy/best practice way to move an item from a Stock object to a Zone object? And also, is there an easy way to handle sprites for Zone objects?

Thanks!

The Hearts tutorial gives an example of playing a card from a stock.

http://en.doc.boardgamearena.com/Tutori ... ronisation

A key takeaway is that you let the stock delete the item, then create a new card representation with a jstpl block. This is what you would place in the Zone.