Indexed DB - HTML5 with Visual Studio 2012 - page 262

item.value.row,
item.value.column,
xact);
}
item.continue();
}
}
}

This code creates a transaction that will use both the piece and pieceType object stores. The mode is
not specified and the default value is “readonly”. It then gets the piece object store and calls its openCursor()
method. The onsuccess event handler gets the first object from the event object (using event.target.result ).
If the piece has not been captured, the drawPiece() function is called to display it, which you'll implement next.
You pass in all the properties that it will need such as type, color, row , and column . You'll also pass in the
transaction object so the drawPiece() function can use the same transaction to access the pieceType store.
Calling the continue() method will cause the same event to be raised again, this time supplying the next
object in the event.target.result property. If there are no more objects, the result property will be null. This is
how you'll know all the objects have been processed.
The openCursor() method provides some very basic capabilities to filter the objects that are returned. If
no parameters are supplied it will return all the objects in the store. You can specify a key range using one of the
following:

• IDBKeyRange.only() - specifies a single value and only records that match are returned.
IDBKeyRange.lowerBound()

• - returns only key values greater than the value specified. By
default this is inclusive so it will also return objects with keys that have an exact match as
well but you can change this to only return values that are greater.

•

IDBKeyRange.upperBound() - works just like lowerBound() except it returns values less
than or equal to the value specified. I will demonstrate this later in the chapter.

- allows you to specify both a lower and upper bound. You can
also indicate if either of these values is inclusive.
The following example will return objects where the key is >3 and < = 7 and return them in descending order:

•

IDBKeyRange.bound()

var keyRange = IDBKeyRange.bound(3, 7, false, true);
store.openCursor(keyRange, IDBCursor.PREV);

Retrieving a Single Object
Now you'll implement the drawPiece() function that will draw a single piece on the board. It must first access the
pieceType object store to get the image details. In this case, you'll retrieve a single object using its key. The key to
the pieceType object store is the type property. Add the function shown in Listing 11-7 to the script element.

Listing 11-7. Drawing a single piece

function drawPiece(type, color, row, column, xact) {

var typeStore = xact.objectStore("pieceType");
var request = typeStore.get(type);
request.onsuccess = function (event) {
var img;