// Set up global object: xmlHttp

var xmlHttp = false;

if(window.XMLHttpRequest){
	xmlHttp = new XMLHttpRequest();
	//xmlHttp.overrideMimeType('text/xml');
}else if(window.ActiveXObject){
	xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}


// Define Constants

var PREFIX_ELEMENT_DIV_COMMENT = "commentsForPostId-";

var FORM_INFORM = "\"*\"표시 항목은 필수입력 사항입니다.";
var FORM_LABEL_AUTHOR = "이름*";
var FORM_LABEL_EMAIL = "전자우편* (비공개)";
var FORM_LABEL_URL = "웹사이트";
var FORM_LABEL_SUBMIT = "확인";


// Ajax functions: Comment

function getPostIdFromElement(element){
	var tokens = element.id.split("-");
	return tokens[1];
}

function getCommentDivByPostId(postId){
	//return document.getElementById(PREFIX_ELEMENT_DIV_COMMENT + postId);
	var element = document.getElementById(PREFIX_ELEMENT_DIV_COMMENT + postId);

	// Script.aculo.us Effect를 위한 2nd Div element 생성..
	element.appendChild(document.createElement("div"));
	return element.firstChild;
}

function toggleCommentList(nsEvent){
	var anEvent = (nsEvent) ? nsEvent : window.event;
	var aSrc = (anEvent.target) ? anEvent.target : anEvent.srcElement;
	var postId = getPostIdFromElement(aSrc);
	
	var commentDivElement = getCommentDivByPostId(postId);
	
	if(commentDivElement.hasChildNodes()){
		//commentDivElement.style.display = (commentDivElement.style.display == "none") ? "block" : "none";
		Effect.toggle(PREFIX_ELEMENT_DIV_COMMENT + postId, "blind", {duration: 0.5});
	}else{
		requestComments(postId);
	}
	
	return stopEvent(anEvent);
}

function requestComments(postId){
	xmlHttp.onreadystatechange = proceedComments;
	xmlHttp.open("GET", "/?comments_popup=" + postId, true);
	xmlHttp.send("");
}

function proceedComments(){
	if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
		var responseArray = decodeJSON(xmlHttp.responseText);
		
		// Script.aculo.us Effect를 위해 Div display를 none으로 설정.
		var divElement = document.getElementById(PREFIX_ELEMENT_DIV_COMMENT + responseArray.post_ID);
		divElement.style.display = "none";
		
		if(responseArray.comments.length > 0) buildComments(responseArray.post_ID, responseArray.comments);
		buildCommentForm(responseArray.post_ID);
		
		// Script.aculo.us Effect toggle.
		Effect.toggle(PREFIX_ELEMENT_DIV_COMMENT + responseArray.post_ID, "blind", {duration: 0.5});
	}
}

function buildComments(postId, comments){
	var commentDivElement = getCommentDivByPostId(postId);
	
	var commentsElement = createElementWithAttr("ol","", "commentlist", null, null);
	
	// Comment List 생성
	
	var isAlt = false; // Comment List Background 처리

	for(var i = 0; i < comments.length; i++){
		var commentNode = document.createElement("li");
		commentNode.className = (!isAlt) ? "comment" : "comment alt";
		isAlt = !isAlt;
		
		
		// Trackback일 경우 표시.
		if(comments[i].comment_type == "trackback"){
			commentNode.appendChild(createElementWithAttr("span", "", "comment_type", null, document.createTextNode("(TrackBack)")));
		}

		var commentAuthorNode;
		if(comments[i].comment_author_url != ""){
			commentNode.appendChild(commentAuthorNode = createElementWithAttr("a", "", "comment_author", {"href":comments[i].comment_author_url}, document.createTextNode(comments[i].comment_author)));
		}else{
			commentNode.appendChild(commentAuthorNode = createElementWithAttr("span", "", "comment_author", null, document.createTextNode(comments[i].comment_author)));
		}
		
		// 공백 추가
		commentNode.appendChild(document.createTextNode(" "));
		
		var commentContentNode = createElementWithAttr("p", "", "comment_content", null, null);
		
		// innerHTML이 가능하다면,
		if(commentNode.innerHTML){
			comments[i].comment_content = comments[i].comment_content.replace(/\n/g,"<br \/>");
			comments[i].comment_content = comments[i].comment_content.replace(/([a-zA-Z]+:\/\/.*)\s?/g,"<a href=\"$1\">$1</a>");
			
			commentContentNode.innerHTML = comments[i].comment_content;
		}else{
			commentContentNode.appendChild(document.createTextNode(comments[i].comment_content));
		}
		commentNode.appendChild(commentContentNode);

		// 공백 추가
		commentNode.appendChild(document.createTextNode(" "));
		
		commentNode.appendChild(createElementWithAttr("span", "", "comment_date", null, document.createTextNode(comments[i].comment_date)));

		commentsElement.appendChild(commentNode);
	}
	
	commentDivElement.appendChild(commentsElement);
}

function buildCommentForm(postId){
	var commentDivElement = getCommentDivByPostId(postId);
	
	var commentForm = createElementWithAttr("form","","commentform",{"action":"/comments-post.php","method":"post"}, null); // Single 과 구분. 임시적. form의 className은 변경 예정.

	var commentInformP = document.createElement("p");
	var commentInformSmall = document.createElement("small");
	commentInformSmall.appendChild(document.createTextNode(FORM_INFORM));
	commentInformP.appendChild(commentInformSmall);
	commentForm.appendChild(commentInformP);
	
	var commentAuthorP = document.createElement("p");
	commentAuthorP.appendChild(createElementWithAttr("input", "", "textInput", {"type":"text","name":"author","tabindex":"1","aria-required":"true"}, null));
	commentAuthorP.appendChild(createElementWithAttr("label", "", "", {"for":"author"}, document.createTextNode(FORM_LABEL_AUTHOR)));
	commentForm.appendChild(commentAuthorP);

	var commentEmailP = document.createElement("p");
	commentEmailP.appendChild(createElementWithAttr("input", "", "textInput", {"type":"text","name":"email","tabindex":"2","aria-required":"true"}, null));
	commentEmailP.appendChild(createElementWithAttr("label", "", "", {"for":"email"}, document.createTextNode(FORM_LABEL_EMAIL)));
	commentForm.appendChild(commentEmailP);

	var commentUrlP = document.createElement("p");
	commentUrlP.appendChild(createElementWithAttr("input", "", "textInput", {"type":"text","name":"url","tabindex":"3"}, null));
	commentUrlP.appendChild(createElementWithAttr("label", "", "", {"for":"url"}, document.createTextNode(FORM_LABEL_URL)));
	commentForm.appendChild(commentUrlP);

	var commentContentP = document.createElement("p");
	commentContentP.appendChild(createElementWithAttr("textarea", "", "textInput", {"name":"comment","cols":"100%","rows":"10","tabindex":"4"}, null));
	commentForm.appendChild(commentContentP);

	var commentButtonsP = createElementWithAttr("p", "", "buttons", null, null);
	commentButtonsP.appendChild(createElementWithAttr("input", "", "", {"type":"submit","name":"submit","tabindex":"5","value":FORM_LABEL_SUBMIT}, null));
	commentButtonsP.appendChild(createElementWithAttr("input", "", "", {"type":"hidden","name":"comment_post_ID","value":postId}, null));
	commentButtonsP.appendChild(createElementWithAttr("input", "", "", {"type":"hidden","name":"comment_parent","value":"0"}, null));
	commentForm.appendChild(commentButtonsP);

	commentDivElement.appendChild(commentForm);
}


// Utility functions

function decodeJSON(jsonText){
	var anObject = false;
	eval("anObject = (" + jsonText + ");");
	return anObject;
}

function createElementWithAttr(tagName, id, className, attr, children){ // tagName 과 attr 연관 배열로 Element를 생서하는 함수
	var anElement = document.createElement(tagName);

	if(id != "") anElement.id = id;
	if(className != "") anElement.className = className;
	
	for(var key in attr){
		anElement.setAttribute(key, attr[key]);
	}
	
	if(children != null) anElement.appendChild(children);
	
	return anElement;
}

function listenEvent(target, eventName, handler){
	var onEventName = "on" + eventName;
	
	if(target.addEventListener) target.addEventListener(eventName, handler, false);
	else if(target.attachEvent) target.attachEvent(onEventName, handler);
	else target[onEventName] = handler;
}

function stopEvent(anEvent){
	if(anEvent.stopPropagation) anEvent.stopPropagation();
	else anEvent.cancelBubble = true;
	
	if(anEvent.preventDefault) anEvent.preventDefault();
	else anEvent.returnValue = false;

	return false;
}


// Set up events

function registerCommentsEvent(){
	if (!xmlHttp) return false;

	var commentAnchors = document.getElementsByTagName("A");

	for(var i in commentAnchors){
		if(commentAnchors[i].className == "commentAnchor"){
			listenEvent(commentAnchors[i], "click", toggleCommentList);
		}
	}
}

function unregisterCommentsEvent(){
	if (!xmlHttp) return true;
	if (!window.detachEvent) return true;

	var commentAnchors = document.getElementsByTagName("A");

	for(var i in commentAnchors){
		if(commentAnchors[i].className == "commentAnchor"){
			commentAnchors[i].detachEvent("onclick", toggleCommentList);
		}
		
	}
}

function hideiPhoneURLTextField(){
	if(navigator.userAgent.match(/.*Mobile.*Safari/)) window.scrollTo(0, 1);
}

function windowLoadHandler(){
	hideiPhoneURLTextField();
	registerCommentsEvent();
}

function windowUnloadHandler(){
	unregisterCommentsEvent()
}

listenEvent(window, "load", windowLoadHandler);
listenEvent(window, "unload", windowUnloadHandler);