// JavaScript Document
function 시작등록(func) {
	var oldonLoad = window.onload;
	if (typeof window.onload != 'function') {
			window.onload = func;
	}else {
		window.onload = function(){
			oldonLoad();
			func();
		}
	}
}

/*
 자바스크립트로 슈팅게임 만들어보자.
 여기부터 게임관련 코드 시작입니다.
*/

// 전역변수선언시작
var UNIT;
var Debug;
var control_button ;
var BG;

var delay = 160;

시작등록(유닛정의);
function 유닛정의() {
	UNIT = document.getElementById("UNIT").getElementsByTagName("img");		//움직임을 제어할 유닛 정의

	for (i=0;i<UNIT.length;i++) {
		UNIT[i].PIC_normal = new Array;
		UNIT[i].cnt = 0;
		}	
	// 여기서부터 자바스크립트로 애니메이션을 제어하기 위한 그림을 등록하는 곳입니다. //
	UNIT[0].PIC_normal[0] = "player1-0.png";
	UNIT[0].PIC_normal[1] = "player1-1.png";
	UNIT[0].PIC_normal[2] = "player1-2.png";
	UNIT[0].PIC_normal[3] = "player1-3.png";
	UNIT[0].PIC_normal[4] = "player1-3.png";
	UNIT[0].PIC_normal[5] = "player1-3.png";
	UNIT[0].PIC_normal[6] = "player1-2.png";
	UNIT[0].PIC_normal[7] = "player1-1.png";
	UNIT[0].width = 64;
	UNIT[0].height = 64;
	UNIT[0].health = 100;
	UNIT[0].life = 3;
	UNIT[0].move = 110;
	UNIT[0].setAttribute("style","top:100px; left:100px");
	
	BG = document.getElementById("background").getElementsByTagName("p"); 	//배경 정의.
	for (i=0; i<BG.length; i++) {
		BG[i].style.top= (i*10)-100 + "px";
		BG[i].style.left = 0 + "px";
	}

	BG[0].move = 10 ;
	BG[1].move = 30;
	BG[2].move = 60;
	BG[3].move = 100;
	BG[4].move = 200;
	// 여기까지 자바스크립트로 애니메이션을 제어하기 위한 그림을 등록하는 곳입니다. //
}

시작등록(디버그정의);
function 디버그정의(){
	debug = document.getElementById("debug"); 								//디버그용 출력창 정의
	for(i=0;i<UNIT.length;i++){ 
		debug.innerHTML = debug.innerHTML+ "<p></p>";
	}
	debug_p = document.getElementById("debug").getElementsByTagName("p");
}
function 디버그출력(){
	for(i=0;i<UNIT.length;i++){
		debug_p[i].innerHTML = " UNIT["+i+"].x_start:"+UNIT[i].x_start + " UNIT["+i+"].y_start:"+UNIT[i].y_start ;
	}
}


시작등록(유닛좌표계산);
function 유닛좌표계산(){
	for (i=0; i<UNIT.length;i++) {
		UNIT[i].x_start = parseInt(UNIT[i].style.left);
		UNIT[i].y_start = parseInt(UNIT[i].style.top);
		UNIT[i].x_end = UNIT[i].x_start + UNIT[i].width ;
		UNIT[i].y_end = UNIT[i].y_start + UNIT[i].height ;
		UNIT[i].dead_x_start = UNIT[i].x_start + Math.floor(UNIT[i].width/4);
		UNIT[i].dead_y_start = UNIT[i].y_start + Math.floor(UNIT[i].height/4);
		UNIT[i].dead_x_end = UNIT[i].x_end - Math.floor(UNIT[i].width/4);
		UNIT[i].dead_y_end = UNIT[i].y_end - Math.floor(UNIT[i].height/4);
	}
	
}
시작등록(배경좌표계산);
function 배경좌표계산(){
	for (i=0; i<BG.length; i++) {
		BG[i].x = parseInt(BG[i].style.left);
		BG[i].y = parseInt(BG[i].style.top);
	}
}
시작등록(버튼정의);
function 버튼정의() {
// 여기부터 버튼 의 동작을 정의합니다. 
	control_button = document.getElementById("control").getElementsByTagName("a")	

	
	control_button[0].onmouseup= function () {	//왼쪽 위
			moveElement(0, UNIT[0].x_start - UNIT[0].move, UNIT[0].y_start - UNIT[0].move, delay);
			for (i=0;i<BG.length;i++) {		
				moveBG(i, BG[i].x + BG[i].move, BG[i].y + BG[i].move ,delay);
			}

		}	
	control_button[1].onmouseup= function () {	//위쪽으로
			moveElement(0, UNIT[0].x_start, UNIT[0].y_start - UNIT[0].move, delay)
			for (i=0;i<BG.length;i++) {		
				moveBG(i, BG[i].x, BG[i].y + BG[i].move ,delay);
			}
		}
	control_button[2].onmouseup= function () {	//오른쪽 위
			moveElement(0, UNIT[0].x_start + UNIT[0].move, UNIT[0].y_start - UNIT[0].move, delay)
			for (i=0;i<BG.length;i++) {		
				moveBG(i, BG[i].x - BG[i].move, BG[i].y + BG[i].move ,delay);
			}

		}	
	control_button[3].onmouseup= function () {	//왼쪽으로	
			moveElement(0, UNIT[0].x_start - UNIT[0].move, UNIT[0].y_start, delay)
			for (i=0;i<BG.length;i++) {		
				moveBG(i, BG[i].x + BG[i].move, BG[i].y ,delay);
			}

		}
	control_button[5].onmouseup= function () {	//오른쪽으로	
			moveElement(0, UNIT[0].x_start + UNIT[0].move, UNIT[0].y_start, delay)
			for (i=0;i<BG.length;i++) {		
				moveBG(i, BG[i].x - BG[i].move, BG[i].y ,delay);
			}		
		}
	control_button[6].onmouseup= function () {	//왼쪽아래로
			moveElement(0, UNIT[0].x_start - UNIT[0].move, UNIT[0].y_start + UNIT[0].move, delay)
			for (i=0;i<BG.length;i++) {		
				moveBG(i, BG[i].x + BG[i].move, BG[i].y - BG[i].move ,delay);
			}
		
		}
	control_button[7].onmouseup= function () {	//아래로	
			moveElement(0, UNIT[0].x_start, UNIT[0].y_start + UNIT[0].move, delay)
			for (i=0;i<BG.length;i++) {		
				moveBG(i, BG[i].x, BG[i].y - BG[i].move ,delay);
			}
		}
	control_button[8].onmouseup= function () {	//오른쪽아래로
			moveElement(0, UNIT[0].x_start + UNIT[0].move, UNIT[0].y_start + UNIT[0].move, delay)
			for (i=0;i<BG.length;i++) {		
				moveBG(i, BG[i].x - BG[i].move, BG[i].y - BG[i].move ,delay);
			}
		
		}

// 여기까지 버튼의 동작을 정의하는곳입니다.
}

function moveBG(xy) {
	if (xy = 0) {
	}
}


시작등록(움직이기);
function 움직이기() {
	for (i=0;i<UNIT.length;i++) {
		UNIT[i].Interval = setInterval ("Anime("+i+")",delay);
	}

}

function Anime(i) {
	if (UNIT[i].cnt>=UNIT[i].PIC_normal.length-1) UNIT[i].cnt=0;
	UNIT[i].cnt++;
	UNIT[i].setAttribute("src",UNIT[i].PIC_normal[UNIT[i].cnt]);

}


function moveElement(UNIT_NO,final_x,final_y,interval) {	
		if (!document.getElementById) return false;	
		if (UNIT[UNIT_NO].movement) clearTimeout(UNIT[UNIT_NO].movement);

		var xpos = UNIT[UNIT_NO].x_start;
		var ypos = UNIT[UNIT_NO].y_start;
		

		if (xpos == final_x && ypos == final_y) {
			유닛좌표계산();
			return true;}
			
		if (xpos < final_x) { var dist = Math.ceil ((final_x-xpos)/10); xpos = xpos + dist;}
		if (xpos > final_x) { var dist = Math.ceil ((xpos-final_x)/10); xpos = xpos - dist;}
		if (ypos < final_y) { var dist = Math.ceil ((final_y-ypos)/10); ypos = ypos + dist;}
		if (ypos > final_y) { var dist = Math.ceil ((ypos-final_y)/10); ypos = ypos - dist;}
		
		UNIT[UNIT_NO].x_start = xpos;
		UNIT[UNIT_NO].y_start = ypos ;
		충돌검사(UNIT_NO);

		
		var repeat = "moveElement('"+UNIT_NO+"',"+final_x+","+final_y+","+interval+")";
		UNIT[UNIT_NO].movement = setTimeout (repeat,interval);
}

function moveBG(BG_NO,final_x,final_y,interval) {	
		if (!document.getElementById) return false;	
		if (BG[BG_NO].movement) clearTimeout(BG[BG_NO].movement);
		
		var xpos = BG[BG_NO].x;
		var ypos = BG[BG_NO].y;	
		if (xpos == final_x && ypos == final_y ) {
			배경좌표계산();
			return true;}
			
		if (xpos < final_x) { var dist = Math.ceil ((final_x-xpos)/10); xpos = xpos + dist;}
		if (xpos > final_x) { var dist = Math.ceil ((xpos-final_x)/10); xpos = xpos - dist;}
		if (ypos < final_y) { var dist = Math.ceil ((final_y-ypos)/10); ypos = ypos + dist;}
		if (ypos > final_y) { var dist = Math.ceil ((ypos-final_y)/10); ypos = ypos - dist;}

		BG[BG_NO].x = xpos;
		BG[BG_NO].y = ypos;
		//BG[BG_NO].style.left = BG[BG_NO].x + "px";
		//BG[BG_NO].style.top = BG[BG_NO].y + "px";
		
		var repeat = "moveBG('"+BG_NO+"',"+final_x+","+final_y+","+interval+")";
		BG[BG_NO].movement = setTimeout (repeat,interval);
}



function 충돌검사(i){

	
	if (UNIT[0].x_start < 0) {
		UNIT[0].x_start = 0;
		배경좌표계산();
		control_button[0].style.display="none";
		control_button[3].style.display="none";
		control_button[6].style.display="none";
	}
	if (UNIT[0].y_start < 0) {
		UNIT[0].y_start = 0;
		배경좌표계산();
		control_button[0].style.display="none";
		control_button[1].style.display="none";
		control_button[2].style.display="none";
	}
	if (UNIT[0].y_start > 300 - UNIT[0].height){
		UNIT[0].y_start = 300 - UNIT[0].height;
		배경좌표계산();
		control_button[6].style.display="none";
		control_button[7].style.display="none";
		control_button[8].style.display="none";		
	}
	if (UNIT[0].x_start > 500 - UNIT[0].width){
		UNIT[0].x_start = 500 - UNIT[0].width;
		배경좌표계산();
		control_button[2].style.display="none";
		control_button[5].style.display="none";
		control_button[8].style.display="none";		
	} 
	if (UNIT[0].x_start > 0 && UNIT[0].y_start > 0) control_button[0].style.display="block";
	if (UNIT[0].y_start > 0) control_button[1].style.display="block";
	if (UNIT[0].y_start > 0 && UNIT[0].x_start < 500 - UNIT[0].width) control_button[2].style.display="block";
	if (UNIT[0].x_start > 0) control_button[3].style.display="block";
	if (UNIT[0].x_start < 500 - UNIT[0].width) control_button[5].style.display="block";
	if (UNIT[0].x_start > 0 && UNIT[0].y_start < 300 - UNIT[0].height) control_button[6].style.display="block";
	if (UNIT[0].y_start < 300 - UNIT[0].height) control_button[7].style.display="block";
	if (UNIT[0].x_start < 500 - UNIT[0].width && UNIT[0].y_start < 300 - UNIT[0].height) control_button[8].style.display="block";

	
	
	UNIT[i].style.left = UNIT[i].x_start + "px";
	UNIT[i].style.top = UNIT[i].y_start + "px";
	for (j=0;j<BG.length;j++) {
		BG[j].style.left = BG[j].x + "px";
		BG[j].style.top = BG[j].y + "px";
	}	
	디버그출력();
}