var x_max = 21;
var y_max = 10;
var imageIcon = new Array();
imageIcon[ 0 ] = './image/Icon32Gray.gif';
imageIcon[ 1 ] = './image/Icon32.gif';
var modeIcon = 0;
var modeIconMax = 4;


// タイル状の画像を配置する関数
function printTile()
{
	var textHtml = '';
	for( y = 1 ; y <= y_max ; y++ )
	{
		textHtml += '<div style = "line-height:0em;">';
		for( x = 1 ; x <= x_max ; x++ )
		{
			textHtml += '<img style = "margin:0px 0px 2px 2px" id = "icon_' + x + '_' + y + '" src = "' + imageIcon[ 0 ] + '" alt = "cheltenham software" onclick = "changeMode();resetImage();swapImage(' + x + ',' + y + ',1);" onmouseover = "swapImage(' + x + ',' + y + ',1);" onmouseout = "swapImage(' + x + ',' + y + ',0);" />';
		}
		textHtml += '</div>';
	}
	document.getElementById( 'Icon' ).innerHTML = textHtml;
}

// パターンにより画像をスワップする関数
function swapImage( x_target, y_target, flag )
{
	for( y = 1 ; y <= y_max ; y++ )
	{
		for( x = 1 ; x <= x_max ; x++ )
		{
			var gx = x - x_target;
			var gy = y - y_target;
			var fx = Math.abs( gx );
			var fy = Math.abs( gy );

			// fx = 0, fy = 0
			if( modeIcon == 0 )
			{
				if( fx == 0 || fy == 0 )
				{
					document.getElementById( 'icon_' + x + '_' + y ).src = imageIcon[ flag ];
				}
			}
			// fy = abs( fx )
			else if( modeIcon == 1 )
			{
				if( fy == fx )
				{
					document.getElementById( 'icon_' + x + '_' + y ).src = imageIcon[ flag ];
				}
			}
			// sqrt( fx ** 2 + fy ** 2 ) = 3
			else if( modeIcon == 2 )
			{
				for( k = 0 ; k <= Math.max( x_max, y_max ) ; k += 3 )
				{
					if( Math.floor( Math.sqrt( fx * fx + fy * fy ) ) == k )
					{
						document.getElementById( 'icon_' + x + '_' + y ).src = imageIcon[ flag ];
					}
				}
			}
			// 
			else if( modeIcon == 3 )
			{
				if( gy == Math.ceil( 2.7 * Math.sin( gx * Math.PI / 12 ) ) )
				{
					document.getElementById( 'icon_' + x + '_' + y ).src = imageIcon[ flag ];
				}
			}
		}
	}
}

function resetImage()
{
	for( y = 1 ; y <= y_max ; y++ )
	{
		for( x = 1 ; x <= x_max ; x++ )
		{
			document.getElementById( 'icon_' + x + '_' + y ).src = imageIcon[ 0 ];
		}
	}
}

function changeMode()
{
	modeIcon++;
	modeIcon = modeIcon % modeIconMax;
}

// タイルを表示
printTile();

// タイトル文字
cheltenhamText_displayTextGradually( "LabelGreeting", 'タイル状に並んだパネルで遊んでみましょう。', 500, 20 );