var colorLeft  = "color1";
var colorRight = "color0";

if( document.getElementById )
{
	if( window.addEventListener )
	{
		window.addEventListener('load', make, false);
	}
	else if( window.attachEvent )
	{
		window.attachEvent('onload', make);
	}
}

function make()
{
/*	  var tableResult = document.createElement('table');
	tableResult.setAttribute('id', 'drawer');
	
	for( var i = 0; i != 10; i++ )
	{
		var row = document.createElement('tr');
		
		for( var j = 0; j != 20; j++ )
		{
			var cell = document.createElement('td');
			cell.setAttribute('id', 'drawer-'+i+'-'+j);
			cell.setAttribute('class', 'color0');
			
			row.appendChild(cell);
		}
		
		tableResult.appendChild(row);
	}
	
	var body = document.getElementsByTagName('body').item(0);
	body.insertBefore(tableResult, document.getElementById('submit'));
*/	
	if( window.addEventListener )
	{
		document.getElementById('drawer-palette').addEventListener('mouseup', SetColor, true);
		document.getElementById('drawer').addEventListener('mouseup', Draw, true);
		document.getElementById('buttonGenerate').addEventListener('click', Generate, false);
	}
	else if( window.attachEvent )
	{
		document.getElementById('drawer-palette').attachEvent('onmousedown', SetColor);
		document.getElementById('drawer').attachEvent('onmousedown', Draw);
		document.getElementById('buttonGenerate').attachEvent('onclick', Generate);
	}
}

function LeftColor(object)
{
	object.setAttribute("class", "color" + colorLeft);
}

function SetColor(event)
{
	if( !event.target )
	{
		var objet = window.event.srcElement;
		var event = window.event;
	}
	else
	{
		var objet = event.target;
	}
	
	if( objet.nodeName.toLowerCase() == 'td' )
	{
		if( ( window.attachEvent && event.button == 1 ) || event.button == 0 )
		{
			colorLeft = objet.className;
			document.getElementById('drawer-colors-0').className = objet.className;
		}
		else
		{
			colorRight = objet.className;
			document.getElementById('drawer-colors-1').className = objet.className;
		}
		
		if( event.preventDefault )
		{
			event.preventDefault();
		}
		else
		{
			window.event.returnValue = false;
		}
	}
}

function Draw(event)
{
	if( !event.target )
	{
		var objet = window.event.srcElement;
		var event = window.event;
	}
	else
	{
		var objet = event.target;
	}
	
	if( objet.nodeName.toLowerCase() == 'td' )
	{
		if( ( window.attachEvent && event.button == 1 ) || event.button == 0 )
		{
			objet.className = colorLeft;
		}
		else
		{
			objet.className = colorRight;
		}
		
		if( event.preventDefault )
		{
			event.preventDefault();
		}
		else
		{
			window.event.returnValue = false;
		}
	}
}

function Generate()
{
	var strResult = "";
	
	var aTDs = document.getElementById("drawer").getElementsByTagName("td");

/*	for( var i = 0; i != aTDs.length; ++i ) // Désolé, mais y en a marre de gérer l'inférieur avec IE...
	{
		var color = aTDs[i].className;
		color = color.replace(/color([0-9]*)/g, "$1");

		strResult += "\x03" + color + "," + color + "#";
		
		if ( (i + 1) % 20 == 0 )
		{
			strResult += "\n";
		}
	}
*/

	var prevcolor = "";
	var i = 0;
	var samecolorcount = 0;
	for( var k = 0; k != 10; ++k ) 
	{
		for( var j = 0; j != 20; ++j ) 
		{
			i = j + (k * 20);

			var color = aTDs[i].className;
			color = color.replace(/color([0-9a-z]*)/g, "$1");
			
			if(color != prevcolor) 
			{
				if (samecolorcount) 
				{
					for( var z = 0; z != samecolorcount; ++z ) 
					{
						strResult += "#";
					}
				}

				samecolorcount = 1;
				prevcolor = color;

				if (color != 'inv') 
				{
					strResult += "\x03" + color + "," + color ;
				}
				else 
				{
					strResult += "\x03";
				}
			}
			else 
			{
				++samecolorcount;
			}
			if ( j == 19 )
			{
				if (samecolorcount) 
				{
					for(var z=0;z!=samecolorcount;z++) 
					{
						strResult += "#";
					}
				}

				samecolorcount = 0;
				prevcolor="";
				strResult += "\n";
			}
		}
	}

	if (samecolorcount) 
	{
		for(var z=0;z!=samecolorcount;z++) 
		{
			strResult += "#";
		}
	}
	
	var TextArea = document.getElementById("text");
	TextArea.value = strResult;
	TextArea.select();
}