JS viewer

Syntax-highlighted view of JS of World: MazeWorld_6





// World must define these:
 
const	 	CLOCKTICK 	= 200;					// speed of run - move things every n milliseconds
const		MAXSTEPS 	= 1000;					// length of a run before final score

//---- global constants: -------------------------------------------------------

const gridsize = 12;						// number of squares along side of world	   

const NOBOXES =  Math.trunc ( (gridsize * gridsize) / 10 );
		// density of maze - number of internal boxes
		// (bug) use trunc or can get a non-integer 

const squaresize = 100;					// size of square in pixels
const MAXPOS = gridsize * squaresize;		// length of one side in pixels 
	
const SKYCOLOR 	= 0xddffdd;				// a number, not a string 
const BLANKCOLOR 	= SKYCOLOR ;			// make objects this color until texture arrives (from asynchronous file read)




const show3d = true;						// Switch between 3d and 2d view (both using Three.js) 
 
const startRadiusConst	 	= MAXPOS * 0.8 ;		// distance from centre to start the camera at
const skyboxConst			= MAXPOS * 3 ;		// where to put skybox 
const maxRadiusConst 		= MAXPOS * 10  ;		// maximum distance from camera we will render things  





//--- Mind can pick one of these actions -----------------

const ACTION_LEFT 		= 0;		   
const ACTION_RIGHT 		= 1;
const ACTION_UP 			= 2;		 
const ACTION_DOWN 		= 3;
const ACTION_STAYSTILL 		= 4;

// in initial view, (smaller-larger) on i axis is aligned with (left-right)
// in initial view, (smaller-larger) on j axis is aligned with (away from you - towards you)



// contents of a grid square

const GRID_BLANK 	= 0;
const GRID_WALL 	= 1;
const GRID_MAZE 	= 2;
const GRID_FINISH 	= 3;
 
// --- some useful random functions  -------------------------------------------


function randomfloatAtoB ( A, B )			 
{
 return ( A + ( Math.random() * (B-A) ) );
}

function randomintAtoB ( A, B )			 
{
 return  ( Math.round ( randomfloatAtoB ( A, B ) ) );
}
  
function randomBoolean()			 
{
 if ( Math.random() < 0.5 ) { return false; }
 else { return true; }
}

//---- start of World class -------------------------------------------------------
 
function World() { 


// most of World can be private 
// regular "var" syntax means private variables:


var BOXHEIGHT;		// 3d or 2d box height 


var GRID 	= new Array(gridsize);			// can query GRID about whether squares are occupied, will in fact be initialised as a 2D array   
var WALLS 	= new Array ( 4 * gridsize );		// need to keep handles to wall and maze objects so can find them later to paint them 
var MAZE 	= new Array ( NOBOXES );
var FINISH = new Array (gridsize);
var theagent;

// ai/j = agent position, ei/j = agent previous position and juncI/J = junction location
var ai, aj, ei, ej, juncI, juncJ;
junction = []; //stack

var self = this;						// needed for private fn to call public fn - see below  

// regular "function" syntax means private functions:

function initGrid()
{
 for (var i = 0; i < gridsize ; i++) 
 {
  GRID[i] = new Array(gridsize);		// each element is an array 

  for (var j = 0; j < gridsize ; j++) 
  {
   GRID[i][j] = GRID_BLANK ;
  }
 }
}

function occupied ( i, j )		// is this square occupied
{

 if ( GRID[i][j] == GRID_WALL ) return true;		// fixed objects	 
 if ( GRID[i][j] == GRID_MAZE ) return true;		 
	 
 return false;
}

 
// logically, coordinates are: y=0, x and z all positive (no negative)    
// logically my dimensions are all positive 0 to MAXPOS
// to centre everything on origin, subtract (MAXPOS/2) from all dimensions 

function translate ( x ) 
{
 return ( x - ( MAXPOS/2 ) );
}

//--- skybox ----------------------------------------------------------------------------------------------


function initSkybox() 
{

// x,y,z positive and negative faces have to be in certain order in the array 
 
// mountain skybox, credit:
// http://stemkoski.github.io/Three.js/Skybox.html

  var materialArray = [
 	( new THREE.MeshBasicMaterial ( { map: THREE.ImageUtils.loadTexture( "/uploads/starter/dawnmountain-xpos.png" ), side: THREE.BackSide } ) ),
 	( new THREE.MeshBasicMaterial ( { map: THREE.ImageUtils.loadTexture( "/uploads/starter/dawnmountain-xneg.png" ), side: THREE.BackSide } ) ),
 	( new THREE.MeshBasicMaterial ( { map: THREE.ImageUtils.loadTexture( "/uploads/starter/dawnmountain-ypos.png" ), side: THREE.BackSide } ) ),
 	( new THREE.MeshBasicMaterial ( { map: THREE.ImageUtils.loadTexture( "/uploads/starter/dawnmountain-yneg.png" ), side: THREE.BackSide } ) ),
 	( new THREE.MeshBasicMaterial ( { map: THREE.ImageUtils.loadTexture( "/uploads/starter/dawnmountain-zpos.png" ), side: THREE.BackSide } ) ),
 	( new THREE.MeshBasicMaterial ( { map: THREE.ImageUtils.loadTexture( "/uploads/starter/dawnmountain-zneg.png" ), side: THREE.BackSide } ) )
 	];

  var skyGeometry = new THREE.CubeGeometry ( skyboxConst, skyboxConst, skyboxConst );	
  var skyMaterial = new THREE.MeshFaceMaterial ( materialArray );
  var theskybox = new THREE.Mesh ( skyGeometry, skyMaterial );
  threeworld.scene.add( theskybox );						// We are inside a giant cube
}

function loadTextures()
{

 var loader1 = new THREE.TextureLoader();
 loader1.load ( '/uploads/starter/door.jpg',		function ( thetexture ) {			 
		thetexture.minFilter = THREE.LinearFilter;
		paintWalls ( new THREE.MeshBasicMaterial( { map: thetexture } ) );
	} ); 

 var loader2 = new THREE.TextureLoader();
 loader2.load ( '/uploads/starter/latin.jpg',		function ( thetexture ) {			 
		thetexture.minFilter = THREE.LinearFilter;
		paintMaze ( new THREE.MeshBasicMaterial( { map: thetexture } ) );
 	} ); 

 var loader3 = new THREE.TextureLoader();
 loader3.load ( '/uploads/starter/pacman.jpg',	function ( thetexture ) {			 
		thetexture.minFilter = THREE.LinearFilter;
		theagent.material =  new THREE.MeshBasicMaterial( { map: thetexture } );
	} ); 
	
 var loader4 = new THREE.TextureLoader();
 loader4.load ( '/uploads/brendan1/checkered.jpg',		function ( thetexture ) {			 
		thetexture.minFilter = THREE.LinearFilter;
		paintFinish ( new THREE.MeshBasicMaterial( { map: thetexture } ) );
	} ); 
}

// --- add fixed objects ---------------------------------------- 
   

function initLogicalWalls()		// set up logical walls in data structure, whether doing graphical run or not	
{
 for (var i = 0; i < gridsize ; i++) 
  for (var j = 0; j < gridsize ; j++) 
   if ( ( i==0 ) || ( i==gridsize-1 ) || ( j==0 ) || ( j==gridsize-1 ) )
   {
    	GRID[i][j] = GRID_WALL ;		 
   }
}


function initThreeWalls()		// graphical run only, set up blank boxes, painted later 	
{
 var t = 0;
 for (var i = 0; i < gridsize ; i++) 
  for (var j = 0; j < gridsize ; j++) 
   if ( GRID[i][j] == GRID_WALL )
   {
 	 var shape    = new THREE.BoxGeometry( squaresize, BOXHEIGHT, squaresize );			 
 	 var thecube  = new THREE.Mesh( shape );
	 thecube.material.color.setHex( BLANKCOLOR  );			  
 
    	 thecube.position.x = translate ( i * squaresize );   		// translate my simple (i,j) block-numbering coordinates to three.js (x,y,z) coordinates 
    	 thecube.position.z = translate ( j * squaresize );   	
    	 thecube.position.y =  0;	
 
 	 threeworld.scene.add(thecube);
	 WALLS[t] = thecube;				// save it for later
	 t++; 
   }
}


function paintWalls ( material )		 
{
 for ( var i = 0; i < WALLS.length; i++ )
 { 
   if ( WALLS[i] )  WALLS[i].material = material;
 }
}

function initLogicalFinish()		// set up logical walls in data structure, whether doing graphical run or not	
{
    GRID[2][6] = GRID_FINISH ;
}


function initThreeFinish()		// graphical run only, set up blank boxes, painted later 	
{
 	 var shape    = new THREE.BoxGeometry( squaresize, BOXHEIGHT, squaresize );			 
 	 var thecube  = new THREE.Mesh( shape );
	 thecube.material.color.setHex( BLANKCOLOR  );			  
 
    	 thecube.position.x = translate ( 2 * squaresize );   		// translate my simple (i,j) block-numbering coordinates to three.js (x,y,z) coordinates 
    	 thecube.position.z = translate ( 6 * squaresize );   	
    	 thecube.position.y =  -1;	
 
 	 threeworld.scene.add(thecube);
	 FINISH[0] = thecube;
}


function paintFinish ( material )		 
{
     FINISH.material[0] = material;
}

function initLogicalMaze()		 
{
    
    GRID[1][2] = GRID_MAZE ;
    GRID[1][5] = GRID_MAZE ;
    GRID[1][6] = GRID_MAZE ;
    GRID[1][8] = GRID_MAZE ;
    GRID[1][9] = GRID_MAZE ;
    GRID[1][10] = GRID_MAZE ;
    GRID[2][2] = GRID_MAZE ;
    GRID[2][3] = GRID_MAZE ;
    GRID[2][5] = GRID_MAZE ;
    GRID[3][2] = GRID_MAZE ;
    GRID[3][3] = GRID_MAZE ;
    GRID[3][5] = GRID_MAZE ;
    GRID[3][6] = GRID_MAZE ;
    GRID[3][8] = GRID_MAZE ;
    GRID[3][9] = GRID_MAZE ;
    GRID[4][5] = GRID_MAZE ;
    GRID[4][6] = GRID_MAZE ;
    GRID[4][9] = GRID_MAZE ;
    GRID[5][1] = GRID_MAZE ;
    GRID[5][2] = GRID_MAZE ;
    GRID[5][3] = GRID_MAZE ;
    GRID[5][5] = GRID_MAZE ;
    GRID[5][6] = GRID_MAZE ;
    GRID[5][7] = GRID_MAZE ;
    GRID[5][9] = GRID_MAZE ;
    GRID[6][1] = GRID_MAZE ;
    GRID[6][2] = GRID_MAZE ;
    GRID[6][3] = GRID_MAZE ;
    GRID[6][5] = GRID_MAZE ;
    GRID[6][9] = GRID_MAZE ;
    GRID[7][1] = GRID_MAZE ;
    GRID[7][5] = GRID_MAZE ;
    GRID[7][7] = GRID_MAZE ;
    GRID[7][9] = GRID_MAZE ;
    GRID[7][10] = GRID_MAZE ;
    GRID[8][1] = GRID_MAZE ;
    GRID[8][3] = GRID_MAZE ;
    GRID[8][4] = GRID_MAZE ;
    GRID[8][5] = GRID_MAZE ;
    GRID[8][7] = GRID_MAZE ;
    GRID[9][1] = GRID_MAZE ;
    GRID[9][7] = GRID_MAZE ;
    GRID[9][8] = GRID_MAZE ;
    GRID[9][9] = GRID_MAZE ;
    GRID[10][1] = GRID_MAZE ;
    GRID[10][2] = GRID_MAZE ;
    GRID[10][3] = GRID_MAZE ;
    GRID[10][4] = GRID_MAZE ;
    GRID[10][5] = GRID_MAZE ;
    GRID[10][7] = GRID_MAZE ;
    GRID[10][8] = GRID_MAZE ;
    GRID[10][9] = GRID_MAZE ;
 
}


function initThreeMaze()		  	
{
 var t = 0;
 for (var i = 0; i < gridsize ; i++) 
  for (var j = 0; j < gridsize ; j++) 
   if ( GRID[i][j] == GRID_MAZE )
   {
   	var shape    = new THREE.BoxGeometry( squaresize, BOXHEIGHT, squaresize );			 
  	var thecube  = new THREE.Mesh( shape );
	thecube.material.color.setHex( BLANKCOLOR  );			  

  	thecube.position.x = translate ( i * squaresize );   	
  	thecube.position.z = translate ( j * squaresize );   	
  	thecube.position.y =  0;	
 
 	threeworld.scene.add(thecube);
	MAZE[t] = thecube;		// save it for later
	t++; 
   }
}


function paintMaze ( material )		 
{
 for ( var i = 0; i < MAZE.length; i++ )
 { 
   if ( MAZE[i] )  MAZE[i].material = material;
 }
}


// --- agent functions -----------------------------------

function drawAgent()	// given ai, aj, draw it 
{
  var x = translate ( ai * squaresize );   	
  var z = translate ( aj * squaresize );   	
  var y =  0;	

 theagent.position.x = x;
 theagent.position.y = y;
 theagent.position.z = z;
 threeworld.scene.add(theagent);

 threeworld.follow.copy ( theagent.position );		// follow vector = agent position (for camera following agent)
}


function initLogicalAgent()
{
// start in random location:
 ai = 1;
 aj = 1;
}

function initThreeAgent()
{
 var shape    = new THREE.BoxGeometry( squaresize, BOXHEIGHT, squaresize );			 
 theagent = new THREE.Mesh( shape );
 theagent.material.color.setHex( BLANKCOLOR );	
 drawAgent(); 		  
}


function moveLogicalAgent( a )
{ 
      var i = ai;
     var j = aj;		 

      if ( a == ACTION_LEFT ) 	
      {
          junction.push('not returned');
          i--;
      }
      else if ( a == ACTION_RIGHT ) 	
      {
          i++;
          junction.push('not returned');
      }
      else if ( a == ACTION_UP ) 	
      {
          junction.push('not returned');
          j++;
      }
      else if ( a == ACTION_DOWN ) 	
      {
          junction.push('not returned');
          j--;
      }
      //if at a deadend go back, make last position unreachable so you can move again
      else if(a == 4)
      {
          ei = 0;
          ej = 0;
          junction.push('not returned');
      }
      //returned to junction
      else if(a == 5)
      {
          junction.push('returned');
      }
      //3 way junction, go down 1st
      else if(a == 6)
      {
          j--;
          juncI = ai;
          juncJ = aj;
          junction.push('down 1');
          junction.push('not returned');
      }
      //3 way junction, go right 2nd
      else if(a == 7)
      {
          i++;
          juncI = ai;
          juncJ = aj;
          junction.push('right 2');
          junction.push('not returned');
      }
      //3 way junction, go right 1st
      else if(a == 8)
      {
          i++;
          juncI = ai;
          juncJ = aj;
          junction.push('right 1');
          junction.push('not returned');
      }
      //3 way junction, go down 2nd
      else if(a == 9)
      {
          j--;
          juncI = ai;
          juncJ = aj;
          junction.push('down 2');
          junction.push('not returned');
      }
      //3 way junction, go up 1st
      else if(a == 10)
      {
          j++;
          juncI = ai;
          juncJ = aj;
          junction.push('up 1');
          junction.push('not returned');
      }
      //3 way junction, go left 2nd
      else if(a == 11)
      {
          i--;
          juncI = ai;
          juncJ = aj;
          junction.push('left 2');
          junction.push('not returned');
      }
      //2 way junction, go right 1st
      else if(a == 12)
      {
          i++;
          juncI = ai;
          juncJ = aj;
          junction.push('right');
          junction.push('not returned');
      }
      //2 way junction, go down 1st
      else if(a == 13)
      {
          j--;
          juncI = ai;
          juncJ = aj;
          junction.push('down');
          junction.push('not returned');
      }
      //3 way junction, go left 1st
      else if(a == 14)
      {
          i--;
          juncI = ai;
          juncJ = aj;
          junction.push('left 1');
          j
      }
      //3 way junction, go up 2nd
      else if(a == 15)
      {
          j++;
          juncI = ai;
          juncJ = aj;
          junction.push('up 2');
          junction.push('not returned');
      }

      if ( ! occupied(i,j) ) 
      {
          ai = i;
          aj = j;
      }
}

//--- public functions / interface / API ----------------------------------------------------------

this.endCondition;			// If set to true, run will end. 


this.newRun = function() 
{

// (subtle bug) must reset variables like these inside newRun (in case do multiple runs)

  this.endCondition = false;

 // for all runs:

 	initGrid();
	initLogicalWalls(); 
	initLogicalMaze();
	initLogicalAgent();
	initLogicalFinish();

 // for graphical runs only:

  if ( true  )
  {
	if ( show3d )
	{
	 BOXHEIGHT = squaresize;
	 threeworld.init3d ( startRadiusConst, maxRadiusConst, SKYCOLOR  ); 	
	}	     
	else
	{
	 BOXHEIGHT = 1;
	 threeworld.init2d ( startRadiusConst, maxRadiusConst, SKYCOLOR  ); 		     
	}

	initSkybox();

	// Set up objects first:

	initThreeWalls(); 
	initThreeMaze();
	initThreeAgent();
	initThreeFinish();

	// Then paint them with textures - asynchronous load of textures from files. 
	// The texture file loads return at some unknown future time in some unknown order.
	// Because of the unknown order, it is probably best to make objects first and later paint them, rather than have the objects made when the file reads return.
	// It is safe to paint objects in random order, but might not be safe to create objects in random order. 

	loadTextures();	

  }

};




this.getState = function()
{
  var forOccu =  occupied(ai, aj + 1)
  var leftOccu = occupied(ai - 1, aj)
  var rightOccu = occupied(ai + 1, aj)
  var backOccu = occupied(ai, aj - 1)
  var x = [ ai, aj, forOccu, leftOccu, rightOccu, backOccu, ei, ej, junction, juncI, juncJ ];
  return ( x );
};

this.takeAction = function ( a )
{
  moveLogicalAgent(a);
  if ( a == ACTION_LEFT ) 	
  {
    ei = ai + 1;
    ej = aj;
  }
  else if ( a == ACTION_RIGHT ) 
  {
    ei = ai - 1;
    ej = aj;
  }
  else if ( a == ACTION_UP ) 
  {
    ei = ai
    ej = aj - 1;
  }
  else if ( a == ACTION_DOWN ) 
  {
    ei = ai;
    ej = aj + 1;
  }

  if ( true  )
  {
   drawAgent();
  }


  if ( ai == 2 && aj == 6 )			// if agent blocked in, run over 
  {
	this.endCondition = true;
  }

};



this.endRun = function()
{
 if ( true  )
 {
  if ( this.endCondition )
    $("#user_span6").html( " &nbsp; <font color=red> <B> Run over. </B> </font>   "  );
 }
};



}

//---- end of World class -------------------------------------------------------