////============================================
//// expo13.js, 05/02/09, by ralph abraham
//// place a blot (with two JS files)
//// based upon expo12
	
	
//// SETUP

	// wait for the browser to load
	window.onload = function() {
	// set up background basic template
		base00(); // draw entire canvas
		//drawblot(20, 20, 10);
	};
	
    // setup single white canvas
	function base00()  {
		var canvas = document.getElementById("canvas"); // only one canvas
		var ctx = canvas.getContext("2d");
		// setup whole rectangle (x0, y0, width, height)
		ctx.clearRect(0, 0, 320, 280);
 		ctx.fillStyle = "black"; //  bg color
 		ctx.fillRect (0, 0, 320, 280);
	};
	
	// draw a blot
	function drawblot(x, y, w) {
		var canvas = document.getElementById("canvas"); // only one canvas
		var ctx = canvas.getContext("2d");
		//ctx.clearRect(x, y, w, w);
 		ctx.fillStyle = "yellow"; //  colored rect
 		ctx.fillRect (x, y, w, w);
	};


// this is for interaction
	document.onclick = function(ev) { // may need mouseup
	var xnow = ev.clientX; // may need ev.X or ev.layerX, etc
  	var ynow = ev.clientY - 50; // offset from top viewport to top canvas
	//alert ("coords: (" + xnow + ", " + ynow + ")"); // for debug
	drawblot(xnow, ynow, 10); // 10 is size of blot
	};
    
////////// END ///////////