//	網格選取程式
var	mouse_x			=	0 ;
var	mouse_y			=	0 ;
var	grid_selector	=	new Array() ;
var	initial			=	false ;
var	this_grid		=	null ;
var	shift_x			=	0 ;
var	shift_y			=	0 ;
var	shift_z			=	0 ;
var	indicator		=	1 ;
var	grid_id			=	'' ;
var	max_x			=	0 ;
var	max_y			=	0 ;
var	min_x			=	0 ;
var	min_y			=	0 ;
/*
document.documentElement.onmousemove	=	where_is_mouse ;
function	where_is_mouse	() {
	window.status	=	event.x + ':' + event.y ;
}
*/
function	grid_focus(event) {
	document.documentElement.onmousemove	=	grid_tracker ;
	window.onmousemove						=	grid_tracker ;
}
function	grid_tracker(event) {
	if	(initial == false)	grid_initial() ;
	if	(!event)			var event = window.event ;

	mouse_on(event) ;
	if		(mouse_x >= max_x || mouse_y >= max_y)	unload_grid_tracker() ;
	else if	(mouse_x <  min_x || mouse_y <  min_y)	unload_grid_tracker() ;
	else if	(indicator == 1)	{
		var	_x	=	Math.floor(mouse_x / 10) + 1;
		var	_y	=	Math.floor(mouse_y / 10) + 1;
		grid_text("第 " + _x + " 行；第 " + _y + " 列") ;
		grid_indicator(_x,_y) ;
	}
	else if	(indicator == 0) {
		if	(grid_selector.length == 2)	{
			var	p1,p2,w,h,cells ;
			p1		=	grid_selector[0].split(',') ;
			p2		=	grid_selector[1].split(',') ;
			w		=	Math.abs(p1[0] - p2[0]) + 1 ;
			h		=	Math.abs(p1[1] - p2[1]) + 1 ;
			cells	=	w * h ;
			grid_text('選了 ' + w + ' * ' + h + ' 共計 ' + cells + ' 格') ;
		}
	}
}
function	grid_initial() {
	this_grid	=	getDIV		('grid') ;
	shift_x		=	getIDLeft	(this_grid) + 1 ;
	shift_y		=	getIDTop	(this_grid) + 1 ;
	shift_z		=	Math.max	(getIDLayer	(this_grid) - 2,0) ;	//	IE DOM 連物件位置都會算錯? XD
	initial		=	true ;
}
function	mouse_on(event) {
	//	滑鼠位置
	switch	(browser)	{
		case	'Firefox'	:
			mouse_x	=	event.pageX - shift_x ;
			mouse_y	=	event.pageY - shift_y ;
			break ;
		case	'Netscape Navigator'	:
			mouse_x	=	event.pageX - shift_x ;
			mouse_y	=	event.pageY - shift_y ;
			break ;
		default	:
			//	IE 的畫面左上角座標 = 2:2 ?? 莫名其妙 XD
			mouse_x	=	event.x - shift_x + document.body.scrollLeft + document.documentElement.scrollLeft - 2 - shift_z ;
			mouse_y	=	event.y - shift_y + document.body.scrollTop + document.documentElement.scrollTop - 2 ;
	}
}
function	grid_text(message) {
	var	grid_text		=	getDIV('grid_text') ;
	grid_text.innerHTML	=	(message != '')
						?	"<DIV CLASS=\"grid_text\" STYLE=\"LEFT:" + (mouse_x + shift_x + 15) 
							+ "px;TOP:"  + (mouse_y + shift_y + 5) + "px;\"><NOBR>" + message + "</NOBR></DIV>"
						:	'' ;
}
function	grid_indicator	(x,y) {
	getDIV("grid_indicator").innerHTML	=	"<DIV CLASS=\"grid_cell\" STYLE=\""
		+	" LEFT:" + (x * 10 - 10 + shift_x + shift_z) + "px;"
		+	" TOP:"  + (y * 10 - 10 + shift_y) + "px;"
		+	"\""
		+	" onmousedown=\"grid_maker(" + x + "," + y + ");\""
		+	" onmouseout=\"unload_grid_tracker()\"><TABLE WIDTH=\"10\" HEIGHT=\"10\"><TR><TD></TD></TR></TABLE></DIV>" ;
}
function	unload_grid_tracker() {
	grid_text('') ;
	getDIV('grid_indicator').innerHTML	= '' ;
}
function	grid_erase	() {
	grid_selector					=	new Array() ;
	grid_text('') ;
	getDIV("spot_lock").innerHTML	=	"" ;
	indicator						=	1 ;
	document.CSI.X.value			=	'' ;
	document.CSI.Y.value			=	'' ;
	document.CSI.W.value			=	'' ;
	document.CSI.H.value			=	'' ;
	document.CSI.SUM.value			=	'' ;
	document.CSI.COST.value			=	'' ;
}
function	grid_maker	(x,y) {
	//	寫入網格記錄
	if	(grid_selector.length == 2) grid_selector = new Array() ;
	grid_selector.push(x+','+y) ;
	grid_painter() ;
	unload_grid_tracker() ;
}
function	grid_painter() {
	if		(grid_selector.length == 0)	return	;
	else if	(grid_selector.length == 1) {	//	選第一個
		var	coordinate	=	grid_selector[0].split(',') ;
		var	grid_x		=	coordinate[0] * 10 - 10 + shift_x + shift_z ;
		var	grid_y		=	coordinate[1] * 10 - 10 + shift_y ;
		getDIV("spot_lock").innerHTML	=	"<DIV CLASS=\"grid_mark\" STYLE=\""
			+	"LEFT:"	+ grid_x + "px;TOP:" + grid_y + "px;visibility:visible"
			+	"\""
			+	" onmouseover=\"unload_grid_tracker()\""
			+	" onmousedown=\"grid_maker(" + coordinate[0] + "," + coordinate[1] + ")\"></DIV>" ;
	}
	else	{	//	完成選擇
		var	coordinate1,grid_x1,grid_y1 ;
		coordinate1	=	grid_selector[0].split(',') ;
		grid_x1		=	coordinate1[0] * 10 - 10 + shift_x + shift_z ;
		grid_y1		=	coordinate1[1] * 10 - 10 + shift_y ;
		var	coordinate2,grid_x2,grid_y2 ;
		coordinate2	=	grid_selector[1].split(',') ;
		grid_x2		=	coordinate2[0] * 10 - 10 + shift_x + shift_z ;
		grid_y2		=	coordinate2[1] * 10 - 10 + shift_y ;
		var	grid_width,grid_height,grid_x,grid_y ;
		//	-2 為邊界寬度
		grid_width		=	Math.abs(grid_x1 - grid_x2) + 10 ;
		grid_x			=	Math.min(grid_x1,grid_x2) ;
		grid_height		=	Math.abs(grid_y1 - grid_y2) + 10 ;
		grid_y			=	Math.min(grid_y1,grid_y2) ;
		switch	(browser)	{
			case	'Firefox'	:
				grid_width		-=	2 ;
				grid_height		-=	2 ;
				break ;
			case	'Netscape Navigator'	:
				grid_width		-=	2 ;
				grid_height		-=	2 ;
				break ;
			default	:
		}

		getDIV("spot_lock").innerHTML	=	"<DIV CLASS=\"grid_area\" STYLE=\""
			+	"width:" + grid_width + "px;height:" + grid_height + "px;"
			+	"left:" + grid_x + "px;top:"  + grid_y + "px;visibility:visible"
			+	"\""
			+	" onmouseover=\"indicator=0\""
			+	" onmouseout=\"indicator=1\""
			+	" onClick=\"purchase()\"></DIV>" ;
		purchase() ;
	}
}
function	purchase() {
	if	(grid_selector.length == 2)	{
		var	p1	=	grid_selector[0].split(',') ;
		var	p2	=	grid_selector[1].split(',') ;
		var	x	=	Math.min(p1[0],p2[0]) ;
		var	y	=	Math.min(p1[1],p2[1]) ;
		var	w	=	Math.abs(p1[0] - p2[0]) + 1 ;
		var	h	=	Math.abs(p1[1] - p2[1]) + 1 ;
		xajax_grid_select(grid_id,x,y,w,h) ;
	}
}

window.onresize	=	grid_initial ;