Using and Managing Bitmap Images - Beginning HTML5 Games with CreateJS - page 90

for (i = 0; i < l; i++) {
piece = new createjs.Bitmap('img/mam.png');
piece.sourceRect = new createjs.Rectangle(col * PUZZLE_SIZE,
row * PUZZLE_SIZE, PUZZLE_SIZE, PUZZLE_SIZE);
piece.homePoint = {x:col * PUZZLE_SIZE, y: row * PUZZLE_SIZE};
piece.x = piece.homePoint.x;
piece.y = piece.homePoint.y;
stage.addChild(piece);
pieces[i] = piece;
col ++;
if (col === PUZZLE_COLUMNS) {
col = 0;
row ++;
}
}
}
function shufflePuzzle() {
var i, piece, randomIndex;
var col = 0;
var row = 0;
var p = [];
p = p.concat(pieces);
var l = p.length;
for (i = 0; i < l; i++) {
randomIndex= Math.floor(Math.random() * p.length)
piece = p[randomIndex];
p.splice(randomIndex, 1);
createjs.Tween.get(piece).to({x:col * PUZZLE_SIZE, y:row * PUZZLE_SIZE},200);
piece.addEventListener('click', onPieceClick);
col++;
if (col === PUZZLE_COLUMNS) {
col = 0;
row++;
}
}
}
function onPieceClick(e) {
if (selectedPieces === 2) {
return;
}
var piece = e.target;
var matrix = new createjs.ColorMatrix().adjustColor(15, 10, 100, 180);
piece.filters = [
new createjs.ColorMatrixFilter(matrix)
];
piece.cache(0, 0, PUZZLE_SIZE, PUZZLE_SIZE);
selectedPieces.push(piece);
if (selectedPieces.length === 2) {
swapPieces();
}
}