function draw(x, y) {
  if (isWall(x, y, true)) {
    return;  // No path here.
  }
  var layer = document.getElementById('wallLayer');
  var oldElement = document.getElementById(x + '_' + y);
  if (oldElement) {
    layer.removeChild(oldElement);
  }
  var g = document.createElementNS(SVG_NS, 'g');
  // Every cell has a circle in the middle.
  var element = document.createElementNS(SVG_NS, 'circle');
  element.setAttribute('r', SQUARE_SIZE / 4);
  element.setAttribute('cx', SQUARE_SIZE / 2);
  element.setAttribute('cy', SQUARE_SIZE / 2);
  element.setAttribute('class', 'path');
  g.appendChild(element);
  // Add the north, south, east and west paths as needed.
  if (!isWall(x - 1, y, true)) {
    var element = document.createElementNS(SVG_NS, 'rect');
    element.setAttribute('height', SQUARE_SIZE / 2);
    element.setAttribute('width', SQUARE_SIZE / 2);
    element.setAttribute('x', -1);
    element.setAttribute('y', SQUARE_SIZE / 4);
    element.setAttribute('class', 'path');
    g.appendChild(element);
  }
  if (!isWall(x + 1, y, true)) {
    var element = document.createElementNS(SVG_NS, 'rect');
    element.setAttribute('height', SQUARE_SIZE / 2);
    element.setAttribute('width', SQUARE_SIZE / 2);
    element.setAttribute('x', SQUARE_SIZE / 2);
    element.setAttribute('y', SQUARE_SIZE / 4);
    element.setAttribute('class', 'path');
    g.appendChild(element);
  }
  if (!isWall(x, y - 1, true)) {
    var element = document.createElementNS(SVG_NS, 'rect');
    element.setAttribute('height', SQUARE_SIZE / 2);
    element.setAttribute('width', SQUARE_SIZE / 2);
    element.setAttribute('x', SQUARE_SIZE / 4);
    element.setAttribute('y', -1);
    element.setAttribute('class', 'path');
    g.appendChild(element);
  }
  if (!isWall(x, y + 1, true)) {
    var element = document.createElementNS(SVG_NS, 'rect');
    element.setAttribute('height', SQUARE_SIZE / 2);
    element.setAttribute('width', SQUARE_SIZE  / 2);
    element.setAttribute('x', SQUARE_SIZE / 4);
    element.setAttribute('y', SQUARE_SIZE / 2);
    element.setAttribute('class', 'path');
    g.appendChild(element);
  }
  g.setAttribute('transform', 'translate(' + (x * SQUARE_SIZE + 0.5) + ',' +
                 (y * SQUARE_SIZE + 0.5) + ')');
  g.id = x + '_' + y;
  layer.appendChild(g);
}
// Draw the path at the given location.
Draw the path at the given location.
Draw the path at the given location .
function draw(x, y) {
  if (isWall(x, y, true)) {
    return;  
  }
  var layer = document.getElementById('wallLayer');
  var oldElement = document.getElementById(x + '_' + y);
  if (oldElement) {
    layer.removeChild(oldElement);
  }
  var g = document.createElementNS(SVG_NS, 'g');
  var element = document.createElementNS(SVG_NS, 'circle');
  element.setAttribute('r', SQUARE_SIZE / 4);
  element.setAttribute('cx', SQUARE_SIZE / 2);
  element.setAttribute('cy', SQUARE_SIZE / 2);
  element.setAttribute('class', 'path');
  g.appendChild(element);
  if (!isWall(x - 1, y, true)) {
    var element = document.createElementNS(SVG_NS, 'rect');
    element.setAttribute('height', SQUARE_SIZE / 2);
    element.setAttribute('width', SQUARE_SIZE / 2);
    element.setAttribute('x', -1);
    element.setAttribute('y', SQUARE_SIZE / 4);
    element.setAttribute('class', 'path');
    g.appendChild(element);
  }
  if (!isWall(x + 1, y, true)) {
    var element = document.createElementNS(SVG_NS, 'rect');
    element.setAttribute('height', SQUARE_SIZE / 2);
    element.setAttribute('width', SQUARE_SIZE / 2);
    element.setAttribute('x', SQUARE_SIZE / 2);
    element.setAttribute('y', SQUARE_SIZE / 4);
    element.setAttribute('class', 'path');
    g.appendChild(element);
  }
  if (!isWall(x, y - 1, true)) {
    var element = document.createElementNS(SVG_NS, 'rect');
    element.setAttribute('height', SQUARE_SIZE / 2);
    element.setAttribute('width', SQUARE_SIZE / 2);
    element.setAttribute('x', SQUARE_SIZE / 4);
    element.setAttribute('y', -1);
    element.setAttribute('class', 'path');
    g.appendChild(element);
  }
  if (!isWall(x, y + 1, true)) {
    var element = document.createElementNS(SVG_NS, 'rect');
    element.setAttribute('height', SQUARE_SIZE / 2);
    element.setAttribute('width', SQUARE_SIZE  / 2);
    element.setAttribute('x', SQUARE_SIZE / 4);
    element.setAttribute('y', SQUARE_SIZE / 2);
    element.setAttribute('class', 'path');
    g.appendChild(element);
  }
  g.setAttribute('transform', 'translate(' + (x * SQUARE_SIZE + 0.5) + ',' +
                 (y * SQUARE_SIZE + 0.5) + ')');
  g.id = x + '_' + y;
  layer.appendChild(g);
}
function draw ( x , y ) { if ( isWall ( x , y , true ) ) { return ; } var layer = document . getElementById ( 'wallLayer' ) ; var oldElement = document . getElementById ( x + '_' + y ) ; if ( oldElement ) { layer . removeChild ( oldElement ) ; } var g = document . createElementNS ( SVG_NS , 'g' ) ; var element = document . createElementNS ( SVG_NS , 'circle' ) ; element . setAttribute ( 'r' , SQUARE_SIZE / 4 ) ; element . setAttribute ( 'cx' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'cy' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'class' , 'path' ) ; g . appendChild ( element ) ; if ( ! isWall ( x - 1 , y , true ) ) { var element = document . createElementNS ( SVG_NS , 'rect' ) ; element . setAttribute ( 'height' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'width' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'x' , - 1 ) ; element . setAttribute ( 'y' , SQUARE_SIZE / 4 ) ; element . setAttribute ( 'class' , 'path' ) ; g . appendChild ( element ) ; } if ( ! isWall ( x + 1 , y , true ) ) { var element = document . createElementNS ( SVG_NS , 'rect' ) ; element . setAttribute ( 'height' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'width' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'x' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'y' , SQUARE_SIZE / 4 ) ; element . setAttribute ( 'class' , 'path' ) ; g . appendChild ( element ) ; } if ( ! isWall ( x , y - 1 , true ) ) { var element = document . createElementNS ( SVG_NS , 'rect' ) ; element . setAttribute ( 'height' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'width' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'x' , SQUARE_SIZE / 4 ) ; element . setAttribute ( 'y' , - 1 ) ; element . setAttribute ( 'class' , 'path' ) ; g . appendChild ( element ) ; } if ( ! isWall ( x , y + 1 , true ) ) { var element = document . createElementNS ( SVG_NS , 'rect' ) ; element . setAttribute ( 'height' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'width' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'x' , SQUARE_SIZE / 4 ) ; element . setAttribute ( 'y' , SQUARE_SIZE / 2 ) ; element . setAttribute ( 'class' , 'path' ) ; g . appendChild ( element ) ; } g . setAttribute ( 'transform' , 'translate(' + ( x * SQUARE_SIZE + 0.5 ) + ',' + ( y * SQUARE_SIZE + 0.5 ) + ')' ) ; g . id = x + '_' + y ; layer . appendChild ( g ) ; }
Draw the path at the given location.
Draw the path at the given location .
// No path here. // Every cell has a circle in the middle. // Add the north, south, east and west paths as needed.