Code viewer for World: P5 chase World

See also direct link to JS.



// ==== Starter World =================================================================================================
// This code is designed for use on the Ancient Brain site.
// This code may be freely copied and edited by anyone on the Ancient Brain site.
// To include a working run of this program on another site, see the "Embed code" links provided on Ancient Brain.
// ====================================================================================================================





// Starter World with Mind for P5 plain API 

// Mind moves object towards target object 
// Get point every time you hit target object, then starts in new position 




// ===================================================================================================================
// === Start of tweaker's box ======================================================================================== 
// ===================================================================================================================

// The easiest things to modify are in this box.
// You should be able to change things in this box without being a JavaScript programmer.
// Go ahead and change some of these. What's the worst that could happen?

AB.maxSteps        = 100;    

AB.screenshotStep  = 50;    

	// AB has its own timer separate to the draw timer. 
	// When this timer ends, we get score and stop draw loop.  
		
AB.drawRunControls = false;
		
const OBJECTSIZE 			= 100;							// Size of objects 
const MOVESTEP   			= OBJECTSIZE / 10 ;				// How much to move each step 
const CLOSE_DISTANCE		= OBJECTSIZE / 2 ;				// Get a point if this close  

const SKYCOLOR 				= "black"; 
const MOVING_OBJECT_COLOR	= "aquamarine";
const TARGET_OBJECT_COLOR	= "navy";
	  
// ===================================================================================================================
// === End of tweaker's box ==========================================================================================
// ===================================================================================================================


// You will need to be some sort of JavaScript programmer to change things below the tweaker's box.





//--- 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;


var fullwidth  = ABWorld.fullwidth();
var fullheight = ABWorld.fullheight();


// global variables:
// modified each time round draw loop 
// disadvantage - Mind could edit these directly 

var x, y;			// position of moving object
var tx, ty;			// position of target object
var score = 0;		// score 




function setup() 		 
{
    var c = createCanvas ( fullwidth, fullheight );		 

// optional - help the AB system find and position the canvas - probably not needed

//		ABWorld.setCanvas ( c );		 

  	background (  SKYCOLOR  ); 

	AB.msg ( " <p> The job of the Mind is to move the object closer to the target. </p> "  );

// set objects start position  

	reset();	
}



function reset()	
// set the two objects to random positions within canvas 
// i.e. center should not be in 0 to max 
// but rather in OBJECTSIZE to max-OBJECTSIZE
{	
	x  = AB.randomIntAtoB ( OBJECTSIZE, fullwidth  - OBJECTSIZE );
	y  = AB.randomIntAtoB ( OBJECTSIZE, fullheight - OBJECTSIZE );
	
	tx = AB.randomIntAtoB ( OBJECTSIZE, fullwidth  - OBJECTSIZE );
	ty = AB.randomIntAtoB ( OBJECTSIZE, fullheight - OBJECTSIZE );
}
	
	

function draw()                
{		
	// --- call Mind --------------------------------------------
	// stop Mind changing global variables:
	// save values in array:
	var old = [ x, y, tx, ty, score ];		// Mind cannot reference this local variable     
	
	// call Mind manually:  
	var a = AB.mind.getAction();  

	// restore global variables from array, in case Mind changed them:
	x 		= old[0]; 
	y 		= old[1];
	tx 		= old[2]; 
	ty 		= old[3];
	score 	= old[4]; 
	
	// Mind can maybe cheat another way. No guarantees. See discussion:  
	// https://ancientbrain.com/fake.scores.php
	// --- end of call Mind --------------------------------------
	
	
	     if ( a == ACTION_LEFT  	) x = x - MOVESTEP ;
	else if ( a == ACTION_RIGHT 	) x = x + MOVESTEP ;
	else if ( a == ACTION_UP		) y = y - MOVESTEP ;
	else if ( a == ACTION_DOWN 		) y = y + MOVESTEP ;
	
	
	// clear background:
  	background (  SKYCOLOR  ); 
	
	// draw target object:
	fill ( TARGET_OBJECT_COLOR ); 	ellipse ( tx, ty, OBJECTSIZE, OBJECTSIZE ); 
	
	// draw moving object:
	fill ( MOVING_OBJECT_COLOR ); 	ellipse ( x, y, OBJECTSIZE, OBJECTSIZE ); 	
	
	// if arrive at target, get a point, and reset a new challenge:
	
	if ( AB.distance2D ( x, y, tx, ty ) < CLOSE_DISTANCE ) 
	{
		score++; 
		reset();
	}
	
	if ( AB.step <= AB.maxSteps )
		AB.msg ( " <p> Step: " + AB.step + " Score: " + score + " </p> ", 2  );
}

 

 
// To send score to scoreboard, define this:

AB.world.getScore = function()
{
	  // optional - stop the draw loop 
	  noLoop();
	  
	//  console.log ( "score " + score ); 
	  return ( score );		
};



 

// --- when re-size page, re-size canvas ----------------------------------------
// have to do this yourself in P5 plain  
	

function reSize()		 
{
	resizeCanvas ( fullwidth, fullheight ); 
	
 	background (  SKYCOLOR  ); 
}



if ( AB.onDesktop() )	window.addEventListener ( "resize", 			function() { 	reSize();  	 	});
else					window.addEventListener ( "orientationchange", 	function() { 	reSize();  	 	});