Mixing HTML5 Video and Canvas - HTML5 Canvas - page 304

function canvasApp() {
if (!canvasSupport()) {
return;
}
function drawScreen () {
//Background
context.fillStyle = '#303030';
context.fillRect(0, 0, theCanvas.width, theCanvas.height);
//Box
context.strokeStyle = '#FFFFFF';
context.strokeRect(5, 5, theCanvas.width−10, theCanvas.height−10);
for (var c = 0; c < cols; c++) {
for (var r = 0; r < rows; r++) {
var tempPiece = board[c][r];
var imageX = tempPiece.finalCol*partWidth;
var imageY = tempPiece.finalRow*partHeight;
var placeX = c*partWidth+c*xPad+startXOffset;
var placeY = r*partHeight+r*yPad+startYOffset;
//context.drawImage(videoElement , imageX, imageY, partWidth, partHeight);
context.drawImage(videoElement, imageX, imageY, partWidth, partHeight,
placeX, placeY, partWidth, partHeight);
if (tempPiece.selected) {
context.strokeStyle = '#FFFF00';
context.strokeRect( placeX, placeY, partWidth, partHeight);
}
}
}
}
function randomizeBoard(board) {
var newBoard = new Array();
var cols = board.length;
var rows = board[0].length
for (var i = 0; i < cols; i++) {
newBoard[i] = new Array();
for (var j =0; j < rows; j++) {
var found = false;
var rndCol = 0;
var rndRow = 0;
while (!found) {
var rndCol = Math.floor(Math.random() * cols);
var rndRow = Math.floor(Math.random() * rows);
if (board[rndCol][rndRow] != false) {
found = true;
}
}