Grid based games – Part 3: Adjacent cells

In this part the adjacent cells of the acual node are called. This can get handy if we want to implement some kind of pathfinding algorithm. The base for this code is part 2.2. See part 1 for the creation of the basic grid.

Here is what we are going to create. By clicking a tile its adjacent cells are shown. By the color of the line one can also distinguish between blocked and unblocked neighbors.

First we add a new MovieClip() right after the tileFocus clip.

var tileNeighbors = new MovieClip();
tileNeighbors.mouseEnabled = false;
addChild(tileNeighbors);

The following code replaces the old mouseClickHandler:

function mouseClickHandler ( event:* )
{
  if ( actualNode !== null )
  {
    if ( actualNode.blocked == false )
    {
      actualNode.blocked = true;
      drawTile(actualNode.tileRef, 0x000000, 1);
    }
    else
    {
      actualNode.blocked = false;
      drawTile(actualNode.tileRef, 0x66ff66, 1);
    }
    var neighs:Array = getNeighbors(actualNode);
    tileNeighbors.graphics.clear();
    for each ( var nObj in neighs )
    {
      if ( nObj.blocked == false )
      {
        tileNeighbors.graphics.lineStyle(1, 0x0000ff);
        tileNeighbors.graphics.drawRect(actualNode.xPos - 7.5, actualNode.yPos - 7.5, 15, 15);
        tileNeighbors.graphics.drawRect(nObj.xPos - 2.5, nObj.yPos - 2.5, 5, 5);
        tileNeighbors.graphics.moveTo(
          actualNode.xPos + ( nObj.xPos - actualNode.xPos ) * 0.25,
          actualNode.yPos + ( nObj.yPos - actualNode.yPos ) * 0.25);
        tileNeighbors.graphics.lineTo(
          nObj.xPos + ( actualNode.xPos - nObj.xPos ) * 0.1,
          nObj.yPos + ( actualNode.yPos - nObj.yPos ) * 0.1);
      }
      else
      {
         tileNeighbors.graphics.lineStyle(1, 0xff0000);
         tileNeighbors.graphics.drawRect(actualNode.xPos - 7.5, actualNode.yPos - 7.5, 15, 15);
         tileNeighbors.graphics.drawRect(nObj.xPos - 2.5, nObj.yPos - 2.5, 5, 5);
         tileNeighbors.graphics.moveTo(
           actualNode.xPos + ( nObj.xPos - actualNode.xPos ) * 0.25,
           actualNode.yPos + ( nObj.yPos - actualNode.yPos ) * 0.25);
         tileNeighbors.graphics.lineTo(
           nObj.xPos + ( actualNode.xPos - nObj.xPos ) * 0.1,
           nObj.yPos + ( actualNode.yPos - nObj.yPos ) * 0.1);
      }
    }
  }
}

The mouseClickHandler now contains the drawing function for the adjacent cells. If a neighbor is not blocked a blue rectangle and line are drawn. If it is blocked the same is done in red.
The next code goes below the getNode function.

function stringToNode ( nodeString )
{
 var nodePos = posArray.indexOf(nodeString);
 if ( nodePos > -1 )
  {
   return nodeArray[nodePos];
  }
  else
  {
   return null;
  }
}

Don’t forget to alter the stringToNode function to the one above.

function getNeighbors ( centerNode )
{
  var u = centerNode.u;
  var v = centerNode.v;
  var sArray:Array = new Array();
  sArray.push((u-1)+"."+(v-1));
  sArray.push((u-1)+"."+(v  ));
  sArray.push((u-1)+"."+(v+1));
  sArray.push((u  )+"."+(v-1));
  sArray.push((u  )+"."+(v+1));
  sArray.push((u+1)+"."+(v-1));
  sArray.push((u+1)+"."+(v  ));
  sArray.push((u+1)+"."+(v+1));
  var resultArray:Array = new Array();
  for each ( var sObj in sArray )
  {
    var nObj = stringToNode(sObj);
    if ( nObj !== null)
    {
      resultArray.push(nObj);
    }
  }
  return resultArray;
}

This function just traces the neighbors possible positions. The stringToNode function verifies if the node exists and returns an array with the available node references.

For your convenience and on multiple request here is the source: ZIP (70KB).

This entry was posted in as3, flash, game development, Grid Based Games, grids, mochiads and tagged , , , . Bookmark the permalink.
Be Sociable, Share!

6 Responses to Grid based games – Part 3: Adjacent cells

  1. Pingback: Grid based games – Part 2.2: The basic grid with interaction alternative « LÞ kegogrog blog

  2. Andrew says:

    Hey,

    Great tutorial. You’ve helped me out so much.

    I’m having some trouble with Part 3. I do what you say to do in the tutorial, adding to the step 2.2 code from the previous tut. When I try to run the script I get an error.

    var nObj = stringToNode(sObj);
    

    That is causing the error. It says that “stringToNode()” is expecting two arguements which is true when you look at function stringToNode ( uPos, vPos ) from part 2.2.

    Any ideas on how I can fix this? I’m fairly new to ActionScript and most of your stuff is well beyond me. I’m actually learning as I go which is neat but hard.

    Any help is greatly appreciated and if/when my project is complete I have no problem putting your name or website url in the credits.

    Thank you!

    Andrew

    • kegogrog says:

      Ah yes. I must have changed it in the progress. You can either change the line to

      var nObj = stringToNode(sObj.u, sObj.v);
      

      or change the stringToNode function to

      function stringToNode ( nodeString )
      {
        var nodePos = posArray.indexOf(nodeString);
        if ( nodePos > -1 )
        {
          return nodeArray[nodePos];
        }
        else
        {
          return null;
        }
      }
      
  3. Jokero says:

    Doesnt work the way u said.

    think its got to be

    var nObj = stringToNode(sObj.u, sObj.v);
    

    ps

    why don’t you publish the source code?

  4. Appreciative says:
    var nObj = stringToNode(sObj.u, sObj.v);
    

    Do this and it doesn’t work because sObj.u and oObj.v are undefined properties.

    function stringToNode ( nodeString )
    {
     var nodePos = posArray.indexOf(nodeString);
     if ( nodePos > -1 )
     {
       return nodeArray[nodePos];
     }
     else
     {
      return null;
     }
    }
    

    Do this and the program fails in other places where you have called stringToNode using 2 parameters other than this one snag, your tutorial has been brilliant!
    would you please post the entire source for step 3, using your completed version that worked?
    thanks so much in advance =)

    • kegogrog says:

      I promise to update that post as soon as I can (latest will be the end of week 34).

      Sorry for the delay in comment approval, I was visiting Party San Open Air last weekend.

Leave a Reply

Your email address will not be published.