def

Perhaps it's not too clear from the documentation, but it is possible to layer images on top of each other in MXit. There is no imposed limit to the number of frames you can use.

For example, you can have a background image, a foreground image, and a selection image frame. This is how you can do client side changes to your table.

• Background layer -
• Pieces layer -
• Selection layer -

For example chess is a bunch of layered images. Transparent PNG’s is what you would use.

In code: Each table has a cell that can contain an array of indexes that points to a frame in a frameset.

For example: A cell containing the list of frames: “i=bg.1_fg.7” means "For this cell, paint bg.1 and fg.7 on top of each other".

To know which frame to paint over which one, you have to look at the “layer” attribute of each image strip. The order in which images are drawn are such that a layer of 0 will be drawn first and then an image from an image strip with a layer of 1 will be drawn on top of it.

For example:
::op=is|nm=bg|dat=iVBORw0KGgoAAAA%3d%3d|v=63398|fw =8|fh=8|layer=0:
::op=is|nm=fg|dat=iVBORw0KGgoAAAA%3d%3d|v=633988|f w=8|fh=8|layer=1:
, in this case the frame in bg should be painted first in a cell, and then the frame in fg should be painted on top of it.


Other Features of Tables
SelectionFrame - The default selection frame is a blue rectangle. You can set this property to specify which frames should be used as your selection frame. This can be use to have a special crosshair or mouse cursor even to represent the user's current selection frame.

DefaultSelection - This means that when you click on a cell that allows placements to be placed, then what set of frames should be used as if the user had selected something? For example, you have an empty board, and everytime you click on a cell, it places a green ball. The green ball was never selected, but it is the default selection that gets placed.

SelectionRect - The coordinates of the position where the selection rectangle should be placed. Basically where you want the cursor to start off at.


Actions
Each cell has a list of select actions that get applied when you select something and a place action that gets applied when you place something. For example, a typical on placement rule would be: place the selected frame foreground layer on this cell.

A cell can be a place action, a select action or a submit action.
A select action happens when a cell is selected (e.g.pick up a piece, draw the selection frame over it).
The place actions occur when a selection is placed (e.g place the piece frame on the placeable cell and clear the selection piece frame).
And a submit action submits the current selections and placement(s) to your app.

After a bunch of moves are made you can submit the table, either automatically or manually, which returns all the selected and all the placed cell’s so that your game engine can make a decision on what to do, e.g. check is a valid move, change the table appropriately etc.

Action rules
This section describes how the client responds when a user clicks on cells, based on the actions that could be configured for each cell.

• User clicks on selectable cell
• If a placement has already been made on another cell, then all previous selections and placements are cleared before the operation is processed. Otherwise a new selection is just made.
• If this cell has previously been selected, then the state of the cell is returned to it's default.
• If selection limit has been reached (with this selection) and autosubmit is enabled, then all current selections and placements are cleared and the selection results (including this selection) is submitted to the app.
• If selection limit has been reached (with previous selection - when autosubmit is disabled) then all current selections and placements are cleared and only the new selection will be performed.
  
  User clicks on placeable cell
• If a placement has already been made on this cell, it is ignored.
• If there is already a selection, then the changeSelected set of images are applied to the selected cell and the changePlaced set of images are applied to the newly placed cell.
• If there is no selection, but there is a set of default selection images, then the changePlaced set of images are applied to the newly placed cell, where the current selection frame (.s) becomes the default selection images (see ds).
• If placement limit has been reached (with this placement) and autosubmit is enabled, then all current selections and placements are cleared and the selection and placement results (including this placement) is submitted to the app.
• If placement limit has been reached (with previous placement - when autosubmit is disabled) then all current selections and placements are cleared and not further action is performed.
  
  User clicks on submit cell
• All current selections and placements are submitted to the app. Even if no items are currently selected the call is still made – just with empty data.