/********************************************
 * Dialog 박스 적용을 위한 prototype 코드임.
 * 
 * TO DO
 * hangame_Dialog
 * - CSS 기반으로 디자인이 적용될 수 있도록 추가 코드 필요.
 * - resizing시 위치 보정 기능 추가.
 * - 메소드 및 기타 인터페이스 최적화 필요. 
 * 
 * @author 이의호 
 */

function iebody() {
    return (document.compatMode != "BackCompat"? document.documentElement : document.body);
}

var hangame_Blind = {
	show: function(show) {
		hangame_Blind.init();
		hangame_Blind.fixSize();
		
		hangame_Blind.blind.style.display = show ? "block" : "none";
	},

	init: function() {
		if( hangame_Blind.blind == null ) {
			hangame_Blind.blind = document.createElement("div");
			for( var prop in hangame_Blind.css ) {
				hangame_Blind.blind.style[prop] = hangame_Blind.css[prop];
			}
			hangame_Blind.blind.innerHTML = " ";
			
			hangame_Blind.blind.style.width = document.body.scrollWidth;
			hangame_Blind.blind.style.height = document.body.scrollHeight;
			
			document.body.insertBefore( hangame_Blind.blind );
			addEventHandler("onresize", hangame_Blind.fixSize );
		}
	},
	
	fixSize : function() {
		hangame_Blind.blind.style.width = document.body.scrollWidth;
		hangame_Blind.blind.style.height = document.body.scrollHeight;
	},
	
	css: {
		position:"absolute", display:"none", top:0, left:0,
		cursor:"not-allowed", backgroundColor:"#000000",
		filter:"alpha(opacity=50)", opacity:0.5,
		zIndex: 10001
	}
}

var hangame_Dialog = function() {
	this.container = document.createElement("div");
	this.container.className = "pop_layer";
	this.container.style.zIndex = 10002;
	this.container.style.display = "none";
	
	this.container.dialog = this;

	document.body.appendChild( this.container );
	// addEventHandler("onresize", fixPosition);
}

hangame_Dialog.prototype.fixPosition = function() {
	var clientWidth = iebody().clientWidth;
	var clientHeight = iebody().clientHeight;
	
	var left = (clientWidth - this.container.offsetWidth) / 2;
	var top = (clientHeight - this.container.offsetHeight) / 2;
	this.container.style.left = left;
	this.container.style.top = top;
}

hangame_Dialog.prototype.show = function() {
	var zIndexBack = this.container.style.zIndex;
	this.container.style.zIndex = -1;
	this.container.style.display = "block";
	
	//this.fixPosition();
	
	hangame_Blind.show(true);	
	this.container.style.zIndex = zIndexBack;
}

hangame_Dialog.prototype.hide = function() {
	hangame_Blind.show(false);
	this.container.style.display = "none";
}

hangame_Dialog.prototype.setContent = function(htmlContent) {
	this.container.innerHTML = htmlContent;
}

hangame_Dialog.prototype.setCloseButtonVisible = function(visible) {
	this.closeButtonVisible = visible;
}

hangame_Dialog.close = function(e) {
	if(!e) {
		e = window.event;
	}
	var node = e.target ? e.target : e.srcElement;
	var count = 0;
	while ((node != null) && (count < 5)) {
		if (node.dialog) {
			node.dialog.hide();
			return false;
		}
		node = node.parentNode;
		count++;
	}
	return false;
}

hangame_Dialog.prototype.alert = function(callbackOk, callbackClose) {
	/*
	this.buttonArea = document.createElement("div");
	this.buttonArea.className = "btn";

	this.buttonOK = document.createElement("a");
	this.buttonOK.innerHTML = '<img src="<d:svr name="img_tetris_beta"/>/main/btn_layer_ok.gif" width="58" height="18" alt="확인">';
	this.buttonOK.onclick = function() {
		hangame_Dialog.close();
		if( typeof(callbackOk) == 'function') { callbackOk(); }
	}
	this.buttonArea.appendChild(this.buttonOK);
	
	this.container.appendChild(this.buttonArea);
	*/
	function okProc() {
		hangame_Dialog.close();
		if( typeof(callbackOk) == 'function') { 
			callbackOk(); 
		}
		return false;
	}
		
	var allLinks = this.container.getElementsByTagName('a');
	for( var i = 0; i < allLinks.length; i++ ) {
		var link = allLinks[i];
		if ( link.name == "ok" ) {
			link.onclick = okProc;
		}
	}
	
	if( this.closeButtonVisible == true ) {
		this.closeButtonArea = document.createElement("div");
		this.closeButtonArea.className = "close";
		
		this.closeButton = document.createElement("a");
		this.closeButton.innerHTML = '<img src="<d:svr name="img_tetris_beta"/>/main/btn_close_popup.gif" width="20" height="19" alt="닫기">';
		this.closeButton.onclick = function() {
				hangame_Dialog.close();
				if( typeof(callbackClose) == "function") {
					callbackClose();
				}
			}
		this.closeButtonArea.appendChild(this.closeButton);
		this.container.appendChild(this.closeButtonArea);
	}
	
	this.show();
}

hangame_Dialog.prototype.confirm = function( callbackOk, callbackCancel, callbackClose ) {
	/*
	this.buttonArea = document.createElement("div");
	this.buttonArea.className = "btn";
	
	this.buttonOK = document.createElement("a");
	this.buttonOK.innerHTML = '<img src="<d:svr name="img_tetris_beta"/>/main/btn_layer_delete.gif" width="58" height="18" alt="삭제하기">';
	this.buttonOK.onclick = function() {
			hangame_Dialog.close();
			if( typeof(callbackOk) == 'function') { callbackOk(); }
		}
	this.buttonArea.appendChild(this.buttonOK);

	this.buttonCancel = document.createElement("a");
	this.buttonCancel.innerHTML = '<img src="<d:svr name="img_tetris_beta"/>/main/btn_layer_refuse.gif" width="58" height="18" alt="거절" class="second">';
	this.buttonCancel.onclick = function() {
			hangame_Dialog.close();
			if( typeof(callbackCancel) == 'function') {
				callbackCancel();
			}
		}
	this.buttonArea.appendChild(this.buttonCancel);
	
	this.container.appendChild(this.buttonArea);
	*/
	function okProc() {
		hangame_Dialog.close();
		if( typeof(callbackOk) == 'function') { 
			callbackOk(); 
		}
		return false;
	}
	
	function cancleProc() {
		hangame_Dialog.close();
		if( typeof(callbackCancel) == 'function') {
			callbackCancel();
		}
		return false;
	}
		
	var allLinks = this.container.getElementsByTagName('a');
	for( var i = 0; i < allLinks.length; i++ ) {
		var link = allLinks[i];
		if ( link.name == "ok" ) {
			link.onclick = okProc;
		} else if ( link.name == "cancle" ) {
			link.onclick = cancleProc;
		}
	}

	if( this.closeButtonVisible == true ) {
		this.closeButtonArea = document.createElement("div");
		this.closeButtonArea.className = "close";
		
		this.closeButton = document.createElement("a");
		this.closeButton.innerHTML = '<img src="<d:svr name="img_tetris_beta"/>/main/btn_close_popup.gif" width="20" height="19" alt="닫기">';
		this.closeButton.onclick = function() {
				hangame_Dialog.close();
				if( typeof(callbackClose) == 'function' ) {
					callbackClose();
				}
			}
		this.closeButtonArea.appendChild(this.closeButton);
		this.container.appendChild(this.closeButtonArea);
	}
	
	this.show();
}


/**
 * <input type="button" value="test layer" onclick="testDialog();">
 * 이런 식으로 테스트 코드를 작성하여 확인해볼 것.
 */
function testDialog(testCase, closeShow) {
	var dialog = new hangame_Dialog();
	var content = "";
	
	// 공통
	if( closeShow == "true") {
		dialog.setCloseButtonVisible(true);	// or false
	} else {
		dialog.setCloseButtonVisible(false);
	}
	
	switch(testCase) {
	// alert test
	case "alert":
		content = '<p class="main_cont bg2">';
		content += '<span class="tx1">빛나는펄님완전짱 (pearl*****) 님과 <br>테트리스 패밀리가 되었습니다.</span><br>';
		content += '<span class="tx2">테트리스 패밀리 리스트를 확인해주세요!<br>(빈 영역이 없을 경우 \'숨겨진 패밀리 리스트\'<br>에서 확인가능합니다.)</span>';
		content += '</p>';
		dialog.setContent(content);
		// dialog.alert(function() { alert('ok'); }, function() { alert('close'); });
		dialog.alert(function() { alert('ok'); } );
		break;
		
	// confirm test
	case "confirm":
		content = '<p class="main_cont">';
		content += '<span class="tx1">패밀리 리스트에서 삭제하시겠습니까?</span><br>';
		content += '<span class="tx2">삭제시 상대방에게 메시지가 발송되며<br>패밀리 관계가 해제됩니다.</span>';
		content += '</p>';
		dialog.setContent(content);
		dialog.confirm( function() { alert('ok click'); }, function() { alert('cancel click'); }, function() { alert('close click'); } );	
	}
}