[bknr-cvs] r2292 - in branches/trunk-reorg/projects/scrabble: src website

bknr at bknr.net bknr at bknr.net
Thu Nov 29 08:48:29 UTC 2007


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); });
 }




More information about the Bknr-cvs mailing list