// make them global
	var canvas;
	var ctx;
      function draw(){
        canvas = document.getElementById('canvas');
        if (canvas.getContext){
          ctx = canvas.getContext('2d');

		  var img = new Image();  
		  
		  img.onload = function(){  
			// execute drawImage statements here 
			//	ctx.drawImage(img, -25, 0, 450, (img.height));
				ctx.globalAlpha = 0.4;
			} 

		  img.src = 'sunset.png'; // Set source path 
        }
      }
	  function drawLetter(e)
	  {
		if (e.keyCode==8)
		{
			ctx.clearRect (0, 0,  420, 420);
			draw();
			document.getElementById('seeds').innerHTML = ' ';
			if (e.preventDefault)
			{
				e.preventDefault();
			}
			else
			{
				e.returnValue = false;
			}
			return false;
		}
  		if (((e.keyCode > 64)&&(e.keyCode < 91)))
		{
			document.getElementById('seeds').innerHTML += String.fromCharCode(e.keyCode).toLowerCase();
			var img = new Image();   // Create new Image object  
			img.onload = function(){  
			// execute drawImage statements here 
				ctx.drawImage(img, 10, 8, (img.width/1.7), (img.height/1.7));
			} 

			img.src = 'aierbazzi_800_black_100_'+String.fromCharCode(e.keyCode)+'.gif'; // Set source path  
		}
		else if (((e.keyCode > 47)&&(e.keyCode < 58))||(e.keyCode == 32))
		{
			document.getElementById('seeds').innerHTML += String.fromCharCode(e.keyCode);
			if (e.preventDefault)
			{
				e.preventDefault();
			}
			else
			{
				e.returnValue = false;
			}
			return false;
		}
	}
	function clearSeeds()
	{
		document.getElementById('seeds').value='';
	}