Author: hhubner Date: 2007-11-29 03:48:29 -0500 (Thu, 29 Nov 2007) New Revision: 2292 Modified: branches/trunk-reorg/projects/scrabble/src/make-letters.lisp branches/trunk-reorg/projects/scrabble/src/web.lisp branches/trunk-reorg/projects/scrabble/website/scrabble.js Log: Keyboard event handling fixes, still not perfect. Modified: branches/trunk-reorg/projects/scrabble/src/make-letters.lisp =================================================================== --- branches/trunk-reorg/projects/scrabble/src/make-letters.lisp 2007-11-27 11:01:50 UTC (rev 2291) +++ branches/trunk-reorg/projects/scrabble/src/make-letters.lisp 2007-11-29 08:48:29 UTC (rev 2292) @@ -65,8 +65,9 @@ (set-rgb-fill 0 0 0)) (set-font bold-font 27) (draw-centered-string 13 7 char-string) - (set-font regular-font 11) - (draw-centered-string 26 3 (princ-to-string score))) + (unless blank-used + (set-font regular-font 11) + (draw-centered-string 26 3 (princ-to-string score)))) (save-png pathname) pathname))) Modified: branches/trunk-reorg/projects/scrabble/src/web.lisp =================================================================== --- branches/trunk-reorg/projects/scrabble/src/web.lisp 2007-11-27 11:01:50 UTC (rev 2291) +++ branches/trunk-reorg/projects/scrabble/src/web.lisp 2007-11-29 08:48:29 UTC (rev 2292) @@ -39,7 +39,8 @@ (encode-json-plist (list :remaining-tiles (remaining-tile-count tile-bag)) stream)) (defmethod encode-json ((tile tile) stream) - (encode-json-plist (list :letter (letter-name-of tile) + (encode-json-plist (list :letter (letter-of tile) + :letter-name (letter-name-of tile) :value (value-of tile)) stream)) Modified: branches/trunk-reorg/projects/scrabble/website/scrabble.js =================================================================== --- branches/trunk-reorg/projects/scrabble/website/scrabble.js 2007-11-27 11:01:50 UTC (rev 2291) +++ branches/trunk-reorg/projects/scrabble/website/scrabble.js 2007-11-29 08:48:29 UTC (rev 2292) @@ -35,51 +35,51 @@ function checkMoveLegality(placedTiles) { - // Given the board and list of placed tiles, either throw an error or - // return if the move is legal. + // Given the board and list of placed tiles, either throw an error or + // return if the move is legal. - var positions = map(function (placement) { return [ placement[0], placement[1] ] }, placedTiles) - .sort(function (a, b) { return (a[0] - b[0]) || (a[1] - b[1])}); + var positions = map(function (placement) { return [ placement[0], placement[1] ] }, placedTiles) + .sort(function (a, b) { return (a[0] - b[0]) || (a[1] - b[1])}); - if (filter(partial(operator.ne, positions[0][0]), map(function (position) { return position[0] }, positions)).length - && filter(partial(operator.ne, positions[0][1]), map(function (position) { return position[1] }, positions)).length) { - throw "not-in-a-row"; - } + if (filter(partial(operator.ne, positions[0][0]), map(function (position) { return position[0] }, positions)).length + && filter(partial(operator.ne, positions[0][1]), map(function (position) { return position[1] }, positions)).length) { + throw "not-in-a-row"; + } - var startOfPlacement = positions[0]; - var endOfPlacement = positions[positions.length - 1]; + var startOfPlacement = positions[0]; + var endOfPlacement = positions[positions.length - 1]; - for (var x = startOfPlacement[0]; x <= endOfPlacement[0]; x++) { - for (var y = startOfPlacement[1]; y <= endOfPlacement[1]; y++) { - if (!letterAt(x, y) && (findValue(positions, [ x, y ]) == -1)) { - throw "placement-with-holes"; - } - } + for (var x = startOfPlacement[0]; x <= endOfPlacement[0]; x++) { + for (var y = startOfPlacement[1]; y <= endOfPlacement[1]; y++) { + if (!letterAt(x, y) && (findValue(positions, [ x, y ]) == -1)) { + throw "placement-with-holes"; + } } + } - if (findValue(positions, [ 7, 7 ]) == -1) { - var found = false; - for (var x = startOfPlacement[0]; !found && (x <= endOfPlacement[0]); x++) { - for (var y = startOfPlacement[1]; !found && (y <= endOfPlacement[1]); y++) { - if (((x > 0) && letterAt(x - 1, y)) - || ((x < 14) && letterAt(x + 1, y)) - || ((y > 0) && letterAt(x, y - 1)) - || ((y < 14) && letterAt(x, y + 1))) { - found = true; - } - } - } - if (!found) { - throw "not-touching-other-tile"; - } + if (findValue(positions, [ 7, 7 ]) == -1) { + var found = false; + for (var x = startOfPlacement[0]; !found && (x <= endOfPlacement[0]); x++) { + for (var y = startOfPlacement[1]; !found && (y <= endOfPlacement[1]); y++) { + if (((x > 0) && letterAt(x - 1, y)) + || ((x < 14) && letterAt(x + 1, y)) + || ((y > 0) && letterAt(x, y - 1)) + || ((y < 14) && letterAt(x, y + 1))) { + found = true; + } + } } + if (!found) { + throw "not-touching-other-tile"; + } + } } // function getFieldScore(x, y) { - return boardScoring[x][y] || 'standard'; + return boardScoring[x][y] || 'standard'; } var theirTrays; @@ -91,235 +91,246 @@ var border = 10; function makeBoard() { - var container = $('playfield'); - board = []; - for (x = 0; x < 15; x++) { - board[x] = []; - for (y = 0; y < 15; y++) { - var element = DIV(); - element.style.position = 'absolute'; - element.style.width = '40px'; - element.style.height = '40px'; - var imageName = (x == 7 && y == 7) ? "start-field" : getFieldScore(x, y); - element.style.backgroundImage = 'url(images/' + imageName + '.png)'; - element.x = x; - element.y = y; - setElementPosition(element, { x: border + x * 44, y: border + y * 44 }); - YAHOO.util.Event.on(element, 'click', emptyTileClicked) - board[x][y] = element; - } - appendChildNodes(container, board[x]); + var container = $('playfield'); + board = []; + for (x = 0; x < 15; x++) { + board[x] = []; + for (y = 0; y < 15; y++) { + var element = DIV(); + element.style.position = 'absolute'; + element.style.width = '40px'; + element.style.height = '40px'; + var imageName = (x == 7 && y == 7) ? "start-field" : getFieldScore(x, y); + element.style.backgroundImage = 'url(images/' + imageName + '.png)'; + element.x = x; + element.y = y; + setElementPosition(element, { x: border + x * 44, y: border + y * 44 }); + YAHOO.util.Event.on(element, 'click', emptyTileClicked) + board[x][y] = element; } + appendChildNodes(container, board[x]); + } - var shuffleButton = DIV(null, "shuffle"); - shuffleButton.style.color = 'white'; - shuffleButton.style.position = 'absolute'; - shuffleButton.onclick = shuffleMyTray; - setElementPosition(shuffleButton, { x: border + 480, y: border + 665 }); - appendChildNodes(container, shuffleButton); + var shuffleButton = DIV(null, "shuffle"); + shuffleButton.style.color = 'white'; + shuffleButton.style.position = 'absolute'; + shuffleButton.onclick = shuffleMyTray; + setElementPosition(shuffleButton, { x: border + 480, y: border + 665 }); + appendChildNodes(container, shuffleButton); - var gameLog = DIV({ id: 'gameLog' }, ""); - gameLog.style.position = 'absolute'; - gameLog.style.width = '280px'; - gameLog.style.height = '250px'; - gameLog.style.textAlign = 'left'; - gameLog.style.overflowY = 'scroll'; - setElementPosition(gameLog, { x: border + 680, y: border + 400 }); - appendChildNodes($('playfield'), gameLog); + var gameLog = DIV({ id: 'gameLog' }, ""); + gameLog.style.position = 'absolute'; + gameLog.style.width = '280px'; + gameLog.style.height = '250px'; + gameLog.style.textAlign = 'left'; + gameLog.style.overflowY = 'scroll'; + setElementPosition(gameLog, { x: border + 680, y: border + 400 }); + appendChildNodes($('playfield'), gameLog); + + var nextTurn = DIV({ id: 'nextTurn' }, ""); + nextTurn.style.position = 'absolute'; + nextTurn.style.width = '280px'; + nextTurn.style.textAlign = 'left'; + setElementPosition(nextTurn, { x: border + 680, y: border + 665 }); + appendChildNodes($('playfield'), nextTurn); } function setLetter(x, y, letter, isBlank) { - var image = IMG({ src: 'images/' + letter + (isBlank ? "-blank" : "") + '.png'}); - image.style.position = 'absolute'; - image.style.top = '3px'; - image.style.left = '3px'; - setElementPosition(image, { x: border + x * 44 + 3, y: border + y * 44 + 3 }); - appendChildNodes($('playfield'), image); - board[x][y].letterNode = image; - board[x][y].letter = letter; + var image = IMG({ src: 'images/' + letter + (isBlank ? "-blank" : "") + '.png'}); + image.style.position = 'absolute'; + image.style.top = '3px'; + image.style.left = '3px'; + setElementPosition(image, { x: border + x * 44 + 3, y: border + y * 44 + 3 }); + appendChildNodes($('playfield'), image); + board[x][y].letterNode = image; + board[x][y].letter = letter; } function placeLetter(x, y, tile) { - var mask = IMG({ src: 'images/mask.png'}); - mask.style.position = 'absolute'; - mask.style.top = '3px'; - mask.style.left = '3px'; - mask.style.zIndex = '20'; - appendChildNodes(board[x][y], mask); - board[x][y].letterNode = tile; - board[x][y].letter = tile.letter; - board[x][y].justPlaced = true; - tile.anim = new YAHOO.util.Motion(tile, { points: { to: [ border + x * 44 + 3, - border + y * 44 + 3 ]}}, - 0.15, - YAHOO.util.Easing.easeBoth); - tile.anim.animate(); + var mask = IMG({ src: 'images/mask.png'}); + mask.style.position = 'absolute'; + mask.style.top = '3px'; + mask.style.left = '3px'; + mask.style.zIndex = '20'; + appendChildNodes(board[x][y], mask); + board[x][y].letterNode = tile; + board[x][y].letter = tile.letter; + board[x][y].justPlaced = true; + tile.anim = new YAHOO.util.Motion(tile, { points: { to: [ border + x * 44 + 3, + border + y * 44 + 3 ]}}, + 0.15, + YAHOO.util.Easing.easeBoth); + tile.anim.animate(); } function letterAt(x, y) { - return board[x][y].letter && !board[x][y].justPlaced; + return board[x][y].letter && !board[x][y].justPlaced; } function Cursor() { - var image = new IMG({ src: 'images/cursor.png' }); - image.style.position = 'absolute'; - image.style.top = '-3px'; - image.style.left = '-3px'; + var image = new IMG({ src: 'images/cursor.png' }); + image.style.position = 'absolute'; + image.style.top = '-3px'; + image.style.left = '-3px'; - this.image = image; - this.x = -1; - this.y = -1; - this.direction = 0; + this.image = image; + this.x = -1; + this.y = -1; + this.direction = 0; - this.set = function(x, y) { - this.x = x; - this.y = y; - appendChildNodes(board[x][y], this.image); - board[x][y].cursor = this.image; - }; + this.set = function(x, y) { + this.x = x; + this.y = y; + appendChildNodes(board[x][y], this.image); + board[x][y].cursor = this.image; + }; - this.clear = function() { - if (this.x != -1) { - removeElement(board[this.x][this.y].cursor); - board[this.x][this.y].cursor = undefined; - this.x = this.y = -1; - this.direction = 0; - } - }; + this.clear = function() { + if (this.x != -1) { + removeElement(board[this.x][this.y].cursor); + board[this.x][this.y].cursor = undefined; + this.x = this.y = -1; + this.direction = 0; + } + }; - this.advance = function(isHoriz) { - var horizontal = 1; - var vertical = 2; - var direction = this.direction; - if (direction == 0) { - // Direction not determined - if (isHoriz != undefined) { - direction = isHoriz ? horizontal : vertical; - } else if (((this.y < 14) && letterAt(this.x, this.y + 1)) - || ((this.y > 1) - && letterAt(this.x, this.y - 1) - && !letterAt(this.x, this.y - 2)) - || ((this.x > 1) - && letterAt(this.x - 1, this.y) - && letterAt(this.x - 2, this.y))) { - direction = vertical; - } else { - direction = horizontal; - } - } - var x = this.x; - var y = this.y; - this.clear(); - this.direction = direction; - if (this.direction == horizontal) { - x++; - } else { - y++; - } - if ((x != 15) && (y != 15)) { - this.set(x, y); - } - }; + this.advance = function(isHoriz) { + var horizontal = 1; + var vertical = 2; + var direction = this.direction; + if (direction == 0) { + // Direction not determined + if (isHoriz != undefined) { + direction = isHoriz ? horizontal : vertical; + } else if (((this.y < 14) && letterAt(this.x, this.y + 1)) + || ((this.y > 1) + && letterAt(this.x, this.y - 1) + && !letterAt(this.x, this.y - 2)) + || ((this.x > 1) + && letterAt(this.x - 1, this.y) + && letterAt(this.x - 2, this.y))) { + direction = vertical; + } else { + direction = horizontal; + } + } + var x = this.x; + var y = this.y; + this.clear(); + this.direction = direction; + if (this.direction == horizontal) { + x++; + } else { + y++; + } + if ((x != 15) && (y != 15)) { + this.set(x, y); + } + }; } var cursor = new Cursor; function emptyTileClicked() { - cursor.clear(); - cursor.set(this.x, this.y); + cursor.clear(); + cursor.set(this.x, this.y); } var move = []; function makeMove(x, y, letter, isBlank) { - move[move.length] = [x, y, letter, isBlank]; - try { - checkMoveLegality(move); - $('move').onclick = submitMove; - $('move').innerHTML = move.toString(); - } - catch (e) { - $('move').onclick = undefined; - $('move').innerHTML = e.toString(); - } + move[move.length] = [x, y, letter, isBlank]; + try { + checkMoveLegality(move); + $('move').onclick = submitMove; + $('move').innerHTML = move.toString(); + } + catch (e) { + $('move').onclick = undefined; + $('move').innerHTML = e.toString(); + } } function clearMove() { - move = []; - $('move').onclick = null; - $('move').innerHTML = '[no move]'; + move = []; + $('move').onclick = null; + $('move').innerHTML = '[no move]'; } function submitMove() { - var queryString = MochiKit.Base.queryString({ move: move.toString(), game: gameID }); - var res = MochiKit.Async.doXHR("/place-tiles", - { method: 'POST', - sendContent: queryString, - headers: { "Content-Type": "application/x-www-form-urlencoded" } }); - res.addCallbacks(moveSuccess, moveFailure); + var queryString = MochiKit.Base.queryString({ move: move.toString(), game: gameID }); + var res = MochiKit.Async.doXHR("/place-tiles", + { method: 'POST', + sendContent: queryString, + headers: { "Content-Type": "application/x-www-form-urlencoded" } }); + res.addCallbacks(moveSuccess, moveFailure); } function moveSuccess(result) { - var response; - try { - response = eval('(' + result.responseText + ')'); - } - catch (e) { - alert("invalid JSON reply: " + result.responseText); - return; - } - if (response.error) { - alert(response.error); - } else { - clearMove(); - makeMyTray(map(function (entry) { return entry.letter }, response.tray)) - } + var response; + try { + response = eval('(' + result.responseText + ')'); + } + catch (e) { + alert("invalid JSON reply: " + result.responseText); + return; + } + if (response.error) { + alert(response.error); + } else { + clearMove(); + makeMyTray(response.tray); + } } function moveFailure(e) { - alert('failed: ' + e); + alert('failed: ' + e); } -var specialKeyCodes = { 59: 'LATIN_CAPITAL_LETTER_U_WITH_DIAERESIS', - 192: 'LATIN_CAPITAL_LETTER_O_WITH_DIAERESIS', - 222: 'LATIN_CAPITAL_LETTER_A_WITH_DIAERESIS' }; +function letterKeyPressed(e) { + alert('foo'); -function letterKeyPressed(type, args, obj) { - var letter = specialKeyCodes[args[0]] || String.fromCharCode(args[0]); - var x = cursor.x; - var y = cursor.y; - var tilePosition = -1; + if (e.which == 0 || e.altKey || e.ctrlKey || e.shiftKey) { + // not a letter key + return; + } + + var letter = String.fromCharCode(e.which).toUpperCase(); + + var x = cursor.x; + var y = cursor.y; + var tilePosition = -1; + for (var i = 0; (tilePosition == -1) && (i < tray.length); i++) { + if (tray[i].letter == letter) { + tilePosition = i; + } + } + if (tilePosition == -1) { for (var i = 0; (tilePosition == -1) && (i < tray.length); i++) { - if (tray[i].letter == letter) { - tilePosition = i; - } + if (tray[i].letter == undefined) { + tilePosition = i; + } } - if (tilePosition == -1) { - for (var i = 0; (tilePosition == -1) && (i < tray.length); i++) { - if (tray[i].letter == undefined) { - tilePosition = i; - } - } + } + if (tilePosition == -1) { + alert("You don't have letter + '" + letter + "'!"); + } else { + var isHoriz; + if (move.length > 0) { + isHoriz = (move[0][0] != x); } - if (tilePosition == -1) { - alert("You don't have that letter!"); - } else { - var isHoriz; - if (move.length > 0) { - isHoriz = (move[0][0] != x); - } - cursor.advance(isHoriz); - if (!letterAt(x, y)) { - var tile = tray[tilePosition]; - tray.splice(tilePosition, 1); - placeLetter(x, y, tile); - makeMove(x, y, letter, tile.letter == undefined); - } + cursor.advance(isHoriz); + if (!letterAt(x, y)) { + var tile = tray[tilePosition]; + tray.splice(tilePosition, 1); + placeLetter(x, y, tile); + makeMove(x, y, tile.letterName, tile.letterName == undefined); } + } } var leftKey = 37; @@ -329,180 +340,176 @@ var backspaceKey = 8; function functionKeyPressed(type, args, obj) { - var x = cursor.x; - var y = cursor.y; + var x = cursor.x; + var y = cursor.y; - switch (args[0]) { - case rightKey: - while (x < 14) - if (!letterAt(++x, y)) - break; - break; - case leftKey: - while (x > 0) - if (!letterAt(--x, y)) - break; - break; - case upKey: - while (y > 0) - if (!letterAt(x, --y)) - break; - break; - case downKey: - while (y < 14) - if (!letterAt(x, ++y)) - break; - break; - } - if ((x >= 0) && (x <= 14) && (y >= 0) && (y <= 14)) { - cursor.clear(); - cursor.set(x, y); - } - YAHOO.util.Event.preventDefault(args[1]); + switch (args[0]) { + case rightKey: + while (x < 14) + if (!letterAt(++x, y)) + break; + break; + case leftKey: + while (x > 0) + if (!letterAt(--x, y)) + break; + break; + case upKey: + while (y > 0) + if (!letterAt(x, --y)) + break; + break; + case downKey: + while (y < 14) + if (!letterAt(x, ++y)) + break; + break; + } + if ((x >= 0) && (x <= 14) && (y >= 0) && (y <= 14)) { + cursor.clear(); + cursor.set(x, y); + } + YAHOO.util.Event.preventDefault(args[1]); } function clearBoard() { - for (x = 0; x < 15; x++) { - for (y = 0; y < 15; y++) { - var letterNode = board[x][y].letterNode; - if (letterNode) { - letterNode.anim = new YAHOO.util.Motion(letterNode, { points: { to: [ border + 7 * 44 + 3, - border + 7 * 44 + 3 ]}}, - 0.15); - letterNode.anim.onComplete.subscribe(function () { removeElement(this); }); - letterNode.anim.animate(); - } - } + for (x = 0; x < 15; x++) { + for (y = 0; y < 15; y++) { + var letterNode = board[x][y].letterNode; + if (letterNode) { + letterNode.anim = new YAHOO.util.Motion(letterNode, { points: { to: [ border + 7 * 44 + 3, + border + 7 * 44 + 3 ]}}, + 0.15); + letterNode.anim.onComplete.subscribe(function () { removeElement(this); }); + letterNode.anim.animate(); + } } + } } function trayClick(letter) { - this.clicked = !this.clicked; - this.anim = new YAHOO.util.Motion(this, { points: { by: [ 0, (this.clicked ? 15 : -15 ) ]}}, 0.15); - this.anim.animate(); + this.clicked = !this.clicked; + this.anim = new YAHOO.util.Motion(this, { points: { by: [ 0, (this.clicked ? 15 : -15 ) ]}}, 0.15); + this.anim.animate(); } function makeMyTray(letters) { - map(removeElement, tray); - tray = []; - for (var i = 0; i < letters.length; i++) { - var element = IMG({src: 'images/' + letters[i] + '.png'}); - element.letter = letters[i]; - element.style.position = 'absolute'; - element.style.width = '34px'; - element.style.height = '34px'; - element.style.zIndex = '10'; - element.onclick = trayClick; - setElementPosition(element, { x: border + 194 + i * 40, y: border + 665 }); - tray[i] = element; - } - appendChildNodes($('playfield'), tray); + map(removeElement, tray); + tray = []; + for (var i = 0; i < letters.length; i++) { + var element = IMG({src: 'images/' + letters[i].letterName + '.png'}); + element.letter = letters[i].letter; + element.letterName = letters[i].letterName; + element.style.position = 'absolute'; + element.style.width = '34px'; + element.style.height = '34px'; + element.style.zIndex = '10'; + element.onclick = trayClick; + setElementPosition(element, { x: border + 194 + i * 40, y: border + 665 }); + tray[i] = element; + } + appendChildNodes($('playfield'), tray); } function shuffleMyTray() { - var count = tray.length; - var newTray = []; - for (var i = 0; i < count; i++) { - do { - index = Math.floor(Math.random() * count); - } while (newTray[index]); - newTray[index] = tray[i]; - newTray[index].anim = new YAHOO.util.Motion(tray[i], { points: { to: [ border + 194 + i * 40, - border + 665 ] }}, - 0.5); - newTray[index].anim.animate(); - newTray[index].clicked = false; - } - tray = newTray; + var count = tray.length; + var newTray = []; + for (var i = 0; i < count; i++) { + do { + index = Math.floor(Math.random() * count); + } while (newTray[index]); + newTray[index] = tray[i]; + newTray[index].anim = new YAHOO.util.Motion(tray[i], { points: { to: [ border + 194 + i * 40, + border + 665 ] }}, + 0.5); + newTray[index].anim.animate(); + newTray[index].clicked = false; + } + tray = newTray; } var otherPlayerIndex = 0; function makeTheirTray (name, tileCount) { - var tray = []; - for (var i = 0; i < tileCount; i++) { - var element = IMG({src: 'images/null.png'}); - element.style.position = 'absolute'; - element.style.width = '34px'; - element.style.height = '34px'; - element.style.zIndex = '10'; - setElementPosition(element, { x: border + 680 + i * 40, y: border + 80 * otherPlayerIndex }); - tray[i] = element; - } - appendChildNodes($('playfield'), tray); + var tray = []; + for (var i = 0; i < tileCount; i++) { + var element = IMG({src: 'images/null.png'}); + element.style.position = 'absolute'; + element.style.width = '34px'; + element.style.height = '34px'; + element.style.zIndex = '10'; + setElementPosition(element, { x: border + 680 + i * 40, y: border + 80 * otherPlayerIndex }); + tray[i] = element; + } + appendChildNodes($('playfield'), tray); - var nameTag = DIV(null, name); - nameTag.style.position = 'absolute'; - nameTag.style.width = '200px'; - nameTag.style.textAlign = 'left'; - setElementPosition(nameTag, { x: border + 680, y: border + 80 * otherPlayerIndex + 50 }); - appendChildNodes($('playfield'), nameTag); - otherPlayerIndex++; + var nameTag = DIV(null, name); + nameTag.style.position = 'absolute'; + nameTag.style.width = '200px'; + nameTag.style.textAlign = 'left'; + setElementPosition(nameTag, { x: border + 680, y: border + 80 * otherPlayerIndex + 50 }); + appendChildNodes($('playfield'), nameTag); + otherPlayerIndex++; } function renderMoveAsText(move) { - var retval = move.participantLogin; - if (move.type == 'move') { - retval += " score: " + move.score; - for (var i = 0; i < move.words.length; i++) { - retval += " " + move.words[i][0] + "(" + move.words[i][1] + ")"; - } - } else { - retval += move.type; + var retval = move.participantLogin; + if (move.type == 'move') { + retval += " score: " + move.score; + for (var i = 0; i < move.words.length; i++) { + retval += " " + move.words[i][0] + "(" + move.words[i][1] + ")"; } + } else { + retval += move.type; + } - return retval; + return retval; } function drawGameState (gameState) { - for (var i = 0; i < gameState.board.length; i++) { - var x = gameState.board[i][0]; - var y = gameState.board[i][1]; - var char = gameState.board[i][2]; - setLetter(x, y, char, gameState.board[i].length > 3); + for (var i = 0; i < gameState.board.length; i++) { + var x = gameState.board[i][0]; + var y = gameState.board[i][1]; + var char = gameState.board[i][2]; + setLetter(x, y, char, gameState.board[i].length > 3); + } + var firstParticipant = gameState.participants[0]; + replaceChildNodes($('nextTurn'), + "It is " + + ((typeof firstParticipant.remainingTiles == 'number') ? (firstParticipant.name + "s") : "your") + + " turn"); + for (var i = 0; i < gameState.participants.length; i++) { + var participant = gameState.participants[i]; + if (typeof participant.remainingTiles == 'number') { + makeTheirTray(participant.name, participant.remainingTiles); + } else { + makeMyTray(participant.remainingTiles); } - for (var i = 0; i < gameState.participants.length; i++) { - var participant = gameState.participants[i]; - if (typeof participant.remainingTiles == 'number') { - makeTheirTray(participant.name, participant.remainingTiles); - } else { - makeMyTray(map(function (entry) { return entry.letter }, participant.remainingTiles)); - } - } - for (var i = 0; i < gameState.moves.length; i++) { - appendChildNodes($('gameLog'), DIV(null, renderMoveAsText(gameState.moves[i]))); - } + } + for (var i = 0; i < gameState.moves.length; i++) { + appendChildNodes($('gameLog'), DIV(null, renderMoveAsText(gameState.moves[i]))); + } } var legalLetters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split(""); function init() { - makeBoard(); + makeBoard(); - var letterKeyCodes = []; - for (var i = 0; i < legalLetters.length; i++) { - letterKeyCodes[i] = legalLetters[i].charCodeAt(0); - } - // add mozilla key codes - letterKeyCodes.push(59); // u" - letterKeyCodes.push(192); // o" - letterKeyCodes.push(222); // a" - var letterKeyListener = new YAHOO.util.KeyListener(document, - { keys: letterKeyCodes }, - { fn: letterKeyPressed, scope: this, correctScope: true }); - letterKeyListener.enable(); + // does not work for ie (document.body needed)? + YAHOO.util.Event.on(window, 'keypress', letterKeyPressed); - var functionKeyListener = new YAHOO.util.KeyListener(document, - { keys: [ leftKey, upKey, rightKey, downKey, backspaceKey ] }, - { fn: functionKeyPressed, scope: this, correctScope: true }); - functionKeyListener.enable(); + var functionKeyListener = new YAHOO.util.KeyListener(document, + { keys: [ leftKey, upKey, rightKey, downKey, backspaceKey ] }, + { fn: functionKeyPressed, scope: this, correctScope: true }); + functionKeyListener.enable(); - var moveDisplay = DIV({ id: 'move' }, "[no move yet]"); - moveDisplay.style.color = 'white'; - moveDisplay.style.position = 'absolute'; - setElementPosition(moveDisplay, { x: border + 550, y: border + 665 }); - appendChildNodes(document.body, moveDisplay); - var d = loadJSONDoc("/game/" + gameID); - d.addCallbacks(drawGameState, function (error) { alert("Request error: " + error.message); }); + var moveDisplay = DIV({ id: 'move' }, "[no move yet]"); + moveDisplay.style.color = 'white'; + moveDisplay.style.position = 'absolute'; + setElementPosition(moveDisplay, { x: border + 550, y: border + 665 }); + appendChildNodes(document.body, moveDisplay); + var d = loadJSONDoc("/game/" + gameID); + d.addCallbacks(drawGameState, function (error) { alert("Request error: " + error.message); }); }