
var EtiquettePopupHandler = {
	TYPE_PARTICIPATION_DLG : 0,
	TYPE_POINT_DLG : 1,
	
	LEVEL_NONE: 0,
	LEVEL_PARTICIPATION: 1,
	LEVEL_ETIQUETTE_POINT: 2,
	
	ID_WINDOW: "blog_etiquette_participation",
	ID_NOTIFY_TEXT : "",
	ID_FILL_FORM_TEXT : "을(를) 입력해주셔야 합니다.",	
	ID_CAMPAIGN_GUIDE_TEXT : 
			"이 캠페인에 참여하시면 <strong>참여자 목록에 블로그가 등록</strong>됩니다.<br />\n" +
			"아래의 내용을 정확하게 입력해 주세요.",
			
	ID_PARTICIPATION_URL : "http://valley.egloos.com/exec/event/habit_participation_exec.php",
			
	showWindow: function(type, options){
		this.popup_level = this.LEVEL_NONE;
		this.postHTML = "";
		this.hasAddressAndTitle = false;
		
		this.popupWindow = new Window(this.ID_WINDOW, 
			{
				className: "mac_os_x", 
				width:500, 
				height:(type == this.TYPE_PARTICIPATION_DLG)? 310: 450, 
				resizable:false
			}
		);
	
		if(type == this.TYPE_PARTICIPATION_DLG){
			var element = this.getParticipationElement(this.getValue(options, "address"), this.getValue(options, "title"));
		}else if(type == this.TYPE_POINT_DLG){
			this.hasAddress = this.getValue(options, "address");
			var element = this.getPointDialogElement();
		}
	
		this.popupWindow.getContent().appendChild(element);
		this.popupWindow.showCenter(true);
		this.popupWindow.setDestroyOnClose();
	}, 
	
	getValue: function(options, name){
		if(typeof options != "undefined" && options[name]){
			return options[name];
		}
		return null;
	},
	
	closeContent: function(event){
		if(this.popupWindow){
			if(this.popup_level == this.LEVEL_PARTICIPATION){
				window.location='http://valley.egloos.com/page/event/habit_badge.php';				
			}
			this.popup_level = this.LEVEL_NONE;
			Windows.close(this.ID_WINDOW, event);
		}
	},
	
	postToMyEgloo: function(event){
		if(insert_egloo){
			insert_egloo(this.postHTML);
		}
	},

	
	/**
	 * 현재의 Dialog 내용에서 새로운 다이얼로그의 내용으로 전환할 때 호출됩니다. 
	 */	
	changeContent: function(event){
		// 캠페인 참여하기에서 참여할 때 호출됩니다.
		if(this.popupWindow && this.popup_level == this.LEVEL_PARTICIPATION){
			var address = ($('wbox_address').childNodes.length == 0)? $('wbox_address').value : $('wbox_address').innerHTML;
			var title = ($('wbox_title').childNodes.length == 0)? $('wbox_title').value : $('wbox_title').innerHTML;			
			var email = $('wbox_email').value;
			
			var isCorrectAddress = Validator.hasValue(address) && Validator.checkURL(address);
			var isCorrectEmail = Validator.hasValue(email) && Validator.checkMail(email);
			var isCorrectTitle = Validator.hasValue(title);
//
//			if(!this.hasAddressAndTitle && (address.lastIndexOf("egloos.com") != -1)){
//				isCorrectAddress = false;
//			}

			if(isCorrectAddress && isCorrectEmail && isCorrectTitle){
				// DB에 참가 내용을 전송해야 합니다. 
				new Ajax.Request(this.ID_PARTICIPATION_URL, {
					asynchronus: true, 
					method: "post", 
					parameters:"address=" + encodeURIComponent(address) + 
							"&email=" + encodeURIComponent(email) + "&title=" + encodeURIComponent(title),
					onSuccess: function(response){
//						if(debug){ debug("response : " + response.responseText) }
					}
				});
				
				this.popupWindow.getContent().innerHTML = "";
				this.popupWindow.getContent().appendChild(this.getCompleteParticipationElement());
				this.hasAddressAndTitle = false;
			}else{
				var output="";
				
				if(!isCorrectAddress){
					new Effect.Highlight($('wbox_address'), {endcolor:"#f8f8f6"});
					output += "주소";
				}
				
				if(!isCorrectTitle){
					new Effect.Highlight($('wbox_title'), {endcolor:"#f8f8f6"});
					output = output + ((output == "") ? "제목": ", 제목");
				}
				
				if(!isCorrectEmail){
					new Effect.Highlight($('wbox_email'), {endcolor:"#f8f8f6"});
					output = output + ((output == "") ? "이메일": ", 이메일");					
				}
				
				$('wbox_output').style.width = $('wbox_output').offsetWidth +"px";
				$('wbox_output').style.height = $('wbox_output').offsetHeight +"px";
				$('wbox_output').innerHTML = "<p class='notice'><img src='http://md.egloos.com/img/event" +
						"/etiquette/icon_notice.gif' title='notice'>&nbsp;" + output+ this.ID_FILL_FORM_TEXT +"</p>";
				
			}
		}else if(this.popupWindow && this.popup_level == this.LEVEL_ETIQUETTE_POINT){	
			// 블로그 예절지수에서 확인하기를 누른 경우 호출됩니다.
			var ulElm = $('wbox_checkbox');

			var point = 0;
			for(var i=0; i < ulElm.childNodes.length; i++){
				var liElm = ulElm.childNodes[i];
				var inputElm = liElm.childNodes[0];
				
				switch(i){
					case 0:
						if(inputElm.checked) point += 25.94;
						break;
					case 1:
						if(inputElm.checked) point += 22.22;					
						break;
					case 2:
						if(inputElm.checked) point += 21.48;					
						break;
					case 3:
						if(inputElm.checked) point += 17.03;					
						break;
					case 4:
						if(inputElm.checked) point += 13.33;					
						break;
				}
			}
			
			var point = "" + point;
			var pointIndex;
			
			if((pointIndex = point.indexOf('.')) != -1){
				var IntPart = point.substring(0, pointIndex);
				var pointPart = point.substring(pointIndex, pointIndex+ 3);
				point =IntPart + pointPart;
			}
			
			this.popupWindow.getContent().innerHTML = "";
			this.popupWindow.getContent().appendChild(this.getPointResultElement(point));	
		}
	},
	

	/*
	 *<div id="manner">
	 *	<h1>나의 블로그 예절 지수는?</h1>
	 *
	 *	<div id="content">
	 *		<p class="center">당신의 블로그 예절 지수 입니다.</p>
	 *		<div class="wbox">
	 *			<div class="numerical">
	 *				당신의 블로그 예절 지수는<br />
	 *				<span class="bigfont">99.95점</span> 입니다.
	 *			</div>
	 *			<p class="center">< a href="#" ></p>
	 *		</div>
	 *		<span class="small">위의 주소를 복사하여 포스트에 넣으실 수 있습니다.</span>
	 *		<p class="center">
	 *			<input class="bt" type="button" id="bt40" value="내이글루에 포스트 하기" onfocus="blur();"  /> &nbsp;
	 *			<input class="bt" type="button" id="bt40" value="닫기" onfocus="blur();"  />
	 *		</p>
	 *</div>
	 */
	getPointResultElement: function(point){
		//this.popup_level = this.LEVEL_NONE;
		var divElm = document.createElement("div");
		divElm.id = "manner";
		
		var h1Elm = document.createElement("h1");
		h1Elm.appendChild(document.createTextNode("나의 블로그 예절 지수는?"));
		divElm.appendChild(h1Elm);
		
		var contentDivElm = document.createElement("div");
		contentDivElm.id = "dialog_content";
		divElm.appendChild(contentDivElm);
		
		var pElm = document.createElement("p");
		pElm.className = "center";
		pElm.innerHTML = "당신의 블로그 예절 지수 입니다.";
		contentDivElm.appendChild(pElm);
		
		var numericalDivElm = document.createElement("div");
		numericalDivElm.className = "numerical";
		numericalDivElm.innerHTML = "당신의 블로그 예절 지수는<br />" +
				"<span class=\"bigfont\">" + point + "점</span> 입니다.";
		contentDivElm.appendChild(numericalDivElm);		
		
		var wboxElm = document.createElement("div");
		wboxElm.className = "blogpoint_wbox";
		contentDivElm.appendChild(wboxElm);
		
		var headerHTML = 
			"<div>" +
				"<div style=\"width: 300px; height: 150px; background: url(http://md.egloos.com/img/event/etiquette/bg_numerical.gif) no-repeat;\">" +
					"<div style=\"text-align: right; padding: 80px 20px 0 0; line-height: 180%;\">" +
						"당신의 블로그 예절 지수는<br />" +
						"<span style=\"font-weight: bold; font-size: 24px; color: rgb(255,82,8); font-family: 'Times New Roman','돋움',Times,serif\">";
		var footerHTML = "점</span> 입니다." +
					"</div>" +
				"</div>" +
				"☞ " +
					"<a title=\"나의 블로그 예절 지수는? - 블로그 예절 캠페인\" href=\"http://valley.egloos.com/habit.php\">" +
						"블로그 예절 캠페인" +
					"</a>" +
			"</div>";
		this.postHTML = headerHTML + point + footerHTML;

		var spanElm = document.createElement("span");
		spanElm.innerHTML = "<textarea name='url' cols='' rows='' style='width:450px;height:107px;'>" +
				headerHTML + point + footerHTML + "</textarea>";
		spanElm.childNodes[0].className="banner_code";
		wboxElm.appendChild(spanElm);
		
		wboxElm.appendChild(document.createElement("br"));
		
		var spanElm = document.createElement("span");
		spanElm.className = "banner_small";
		spanElm.appendChild(document.createTextNode("위의 주소를 복사하여 포스트에 넣으실 수 있습니다."));
		wboxElm.appendChild(spanElm);
			
		var pElm = document.createElement("p");
		pElm.className = "center";
		
		if(this.hasAddress){
			var inputElm = document.createElement("input");
			inputElm.className = "bt" 
			inputElm.type = "button";
			inputElm.id = "bt40";
			inputElm.value = "내이글루에 포스트 하기."
			inputElm.onfocus = "blur();";
			Event.observe(inputElm, "click", this.postToMyEgloo.bindAsEventListener(this))
			pElm.appendChild(inputElm);
			
			spanElm = document.createElement("span");
			spanElm.innerHTML = "&nbsp;";
			pElm.appendChild(spanElm);
		}
		
		var inputElm = document.createElement("input");
		inputElm.className = "bt" 
		inputElm.type = "button";
		inputElm.id = "bt40";
		inputElm.value = "닫기"
		inputElm.onfocus = "blur();";
		Event.observe(inputElm, "click", this.closeContent.bindAsEventListener(this))
		pElm.appendChild(inputElm);		
		
		wboxElm.appendChild(pElm);
		setTimeout(function() { Field.focus($("bt40"));}, 400);
		return divElm;
	},
	
	/**
	 * 생성되는 html 코드는 다음과 같습니다. 
	 * <div id="manner">
	 * 		<h1>나의 블로그 예절 지수는?</h1>
	 * 		<div id="dialog_content">
	 * 			<span>아래의 항목 중에 본인이 평소에 지키고 있는 것에만 체크를 해주세요.</span>
	 * 			<div class="wbox">
	 * 				<ul>
	 * 					<li><input name="habits" type="checkbox" value="" /> 저작권을 확인합니다.</li>	
	 * 					<li><input name="habits" type="checkbox" value="" /> 저작권을 확인합니다.</li>
	 * 					<li><input name="habits" type="checkbox" value="" /> 저작권을 확인합니다.</li>
	 * 					<li><input name="habits" type="checkbox" value="" /> 저작권을 확인합니다.</li>
	 * 					<li><input name="habits" type="checkbox" value="" /> 저작권을 확인합니다.</li>
	 * 				</ul>
	 * 			</div>
	 * 		</div>
	 * 		<p class="center">
	 * 			<input class="bt" type="button" id="bt40" value="블로그 예절 지수 확인하기." onfocus="blur();" />
	 * 		</p>
	 *	</div>
	 */	
	getPointDialogElement: function(){
		this.popup_level = this.LEVEL_ETIQUETTE_POINT;
		var divElm = document.createElement("div");
		divElm.id = "manner";
		
		var wbox
		var h1Elm = document.createElement("h1");
		h1Elm.appendChild(document.createTextNode("나의 블로그 예절 지수는?"));
		divElm.appendChild(h1Elm);
		
		var contentDivElm = document.createElement("div");
		contentDivElm.id = "dialog_content"
		divElm.appendChild(contentDivElm);
		contentDivElm.appendChild(document.createTextNode("아래의 항목 중에 본인이 평소에 지키고 있는 것에만 체크를 해주세요."));
		
//		var spanElm = document.createElement("span");
//		spanElm.appendChild(document.createTextNode("아래의 항목 중에 본인이 평소에 지키고 있는 것에만 체크를 해주세요."));
//		contentDivElm.appendChild(spanElm);
		
		var wboxElm = document.createElement("div");
		wboxElm.className = "wbox";
		contentDivElm.appendChild(wboxElm);
		
		var ulElm = document.createElement("ul");
		ulElm.id = "wbox_checkbox"
		wboxElm.appendChild(ulElm);
		
		var liElm = document.createElement("li");
		ulElm.appendChild(liElm);
		var inputElm = document.createElement("input");
		inputElm.type = "checkbox";
		liElm.appendChild(inputElm);
		liElm.appendChild(document.createTextNode(" 블로그 저작권을 존중합니다."));


		var liElm = document.createElement("li");
		ulElm.appendChild(liElm);
		var inputElm = document.createElement("input");
		inputElm.type = "checkbox";
		liElm.appendChild(inputElm);
		liElm.appendChild(document.createTextNode(" 본인 블로그에 남긴 좋은 덧글에는 감사의 표현을 합니다."));
		
		
		var liElm = document.createElement("li");
		ulElm.appendChild(liElm);
		var inputElm = document.createElement("input");
		inputElm.type = "checkbox";
		liElm.appendChild(inputElm);
		liElm.appendChild(document.createTextNode(" 다른 블로그 사이트와 블로거를 존중합니다."));
		
		
		var liElm = document.createElement("li");
		ulElm.appendChild(liElm);
		
		var inputElm = document.createElement("input");
		inputElm.type = "checkbox";
		liElm.appendChild(inputElm);
		liElm.appendChild(document.createTextNode(" 블로거들 간에는 항상 예의를 갖춰 바른말, 고운말을 합니다."));
		
		
		var liElm = document.createElement("li");
		ulElm.appendChild(liElm);
		
		var inputElm = document.createElement("input");
		inputElm.type = "checkbox";
		liElm.appendChild(inputElm);
		liElm.appendChild(document.createTextNode(" 상대방이 남긴 덧글이나 트랙백을 지울 때는 이유를 밝힙니다."));

		var pElm = document.createElement("p");
		pElm.className = "center";
		inputElm = document.createElement("input");
		inputElm.className = "bt" 
		inputElm.type = "button";
		inputElm.id = "bt40";
		inputElm.value = "블로그 예절지수 확인하기."
		inputElm.onfocus = "blur();";
		pElm.appendChild(inputElm);
		contentDivElm.appendChild(pElm);
		
		Event.observe(inputElm, "click", this.changeContent.bindAsEventListener(this));	
		return divElm;
	},
		
	/**
	 * 생성되는 html 코드는 다음과 같습니다. address와 title이 있는 경우에는 이를 따로 체크하지 않습니다. 
	 * <div id=\"manner\">
	 * 		<h1>블로그 예절 캠페인 참여하기</h1>
	 * 		<div id=\"dialog_content\">
	 * 			이 캠페인에 참여하시면 <strong>참여자 목록에 블로그가 등록</strong>됩니다.<br />
	 * 			아래의 내용을 정확하게 입력해 주세요.
	 * 			<div class=\"wbox\">
	 * 				<dl>
	 * 					<dt><label for=\"subject\">이글루 제목</label></dt><dd><input type=\"text\" id=\"name\" size=\"43\" /></dd>
	 * 					<dt><label for=\"description\">이글루 설명</label></dt><dd><input type=\"text\" id=\"name\" size=\"43\" /></dd>
	 * 					<dt><label for=\"email\">이메일</label></dt><dd><input type=\"text\" id=\"name\" size=\"43\" /><br />
	 * 					<span class=\"small\">이메일 주소는 기념품 배송시 필요합니다. 정확하게 입력해 주세요.</span></dd>
	 * 				</dl>
	 * 			</div>
	 * 		<p class=\"center\">
	 * 			<input class=\"bt\" type=\"button\" id=\"bt40\" value=\"이글루를 개설합니다.\" onfocus=\"blur();\"  />
	 * 		</p>
	 * 	</div>
	 */
	getParticipationElement: function(address, title){
		this.popup_level = this.LEVEL_PARTICIPATION;
		var divElm = document.createElement("div");
		divElm.id = "manner";
		
		var h1Elm = document.createElement("h1");
		h1Elm.appendChild(document.createTextNode("블로그 예절 캠페인 참여하기"));
		divElm.appendChild(h1Elm);
		
		var contentDivElm = document.createElement("div");
		contentDivElm.id = "dialog_content";
		divElm.appendChild(contentDivElm);
		
		var guideDivElm = document.createElement("div");
		guideDivElm.id = "wbox_output";
		guideDivElm.innerHTML = this.ID_CAMPAIGN_GUIDE_TEXT;
		contentDivElm.appendChild(guideDivElm);
			
		var wboxElm = document.createElement("div");
		wboxElm.className = "wbox";
		contentDivElm.appendChild(wboxElm);
		
		var dlElm = document.createElement("dl");
		wboxElm.appendChild(dlElm);
		
		var dtElm = document.createElement("dt");
		dtElm.innerHTML = "<label>블로그 주소</label>";
		dlElm.appendChild(dtElm);

		var ddElm = document.createElement("dd");		
		ddElm.style.width = "300px";
		if(address){
			var spanElm = document.createElement("span");
			spanElm.id = "wbox_address";
			spanElm.appendChild(document.createTextNode("http://" + address + ".egloos.com"));
			ddElm.appendChild(spanElm);
		}else{
			var inputElm  = document.createElement("input");
			inputElm.type = "text";
			inputElm.id = "wbox_address";
			inputElm.size = "30";
			inputElm.value = "http://";
			ddElm.appendChild(inputElm);
		}
		dlElm.appendChild(ddElm);		
		
		dtElm = document.createElement("dt");
		dtElm.innerHTML = "<label>블로그 제목</label>";
		dlElm.appendChild(dtElm);

		ddElm = document.createElement("dd");
		ddElm.style.width = "300px";
		if(title){
			var spanElm = document.createElement("span");
			spanElm.id = "wbox_title";
			spanElm.appendChild(document.createTextNode(title));
			ddElm.appendChild(spanElm);
		}else{
			var inputElm  = document.createElement("input");
			inputElm.type = "text";
			inputElm.id = "wbox_title";
			inputElm.size = "30";
			ddElm.appendChild(inputElm);
		}
		dlElm.appendChild(ddElm);		

		dtElm = document.createElement("dt");
		dtElm.innerHTML = "<label>이메일</label>";
		dlElm.appendChild(dtElm);

		ddElm = document.createElement("dd");		
		var inputElm  = document.createElement("input");
		inputElm.type = "text";
		inputElm.id = "wbox_email";
		inputElm.size = "30";
		ddElm.appendChild(inputElm);
		ddElm.appendChild(document.createElement("br"));

		var spanElm = document.createElement("span");
		spanElm.className = "small";
		spanElm.appendChild(document.createTextNode(this.ID_NOTIFY_TEXT));
		ddElm.appendChild(spanElm);
		dlElm.appendChild(ddElm);		
		
		var pElm = document.createElement("p");
		pElm.className = "center";
		inputElm = document.createElement("input");
		inputElm.className = "bt" 
		inputElm.type = "button";
		inputElm.id = "bt40";
		inputElm.value = "참여합니다."
		inputElm.onfocus = "blur();";
		pElm.appendChild(inputElm);
		divElm.appendChild(pElm);

		Event.observe(inputElm, "click", this.changeContent.bindAsEventListener(this));		
		this.hasAddressAndTitle = address && title;		
		this.setFocusElement(this.hasAddressAndTitle);
		return divElm;
	}, 
	
	setFocusElement: function(hasAddressAndTitle){
		if (hasAddressAndTitle) {
			var focusId = "wbox_email";			
		} else {
			var focusId = "wbox_address";			
		}
		setTimeout(function() { 
				var focusElement = $(focusId);
				if(focusElement.setSelectionRange){
					Field.focus($(focusId));
				}else{
					var range = focusElement.createTextRange();
					range.collapse(true);
					range.moveStart("character", Field.getValue(focusElement).length);
					range.select();					
				}
			}, 400);
	},
	
	/**
	 * 생성되는 html 코드는 다음과 같습니다. 
	 * <div id="manner">
	 * 		<h1>블로그 예절 캠페인 참여하기</h1>
	 * 		<div id="dialog_content">
	 * 			<span>성공적으로 캠페인에 참여하셨습니다. <br><br>
	 * 				캠페인 버튼과 배너페이지에서 맘에 드는 버튼이나 배너를 골라 자신의 블로그<br>
	 * 				에 붙여주세요. 추후 참여하신 분들 중 추첨을 통하여 소정의 기념품을 드립니다.
	 * 			</span>
	 * 		</div>
	 * 		<p class="center">
	 * 			<input value="캠페인 배너 고르기." id="bt40" class="bt" type="button"></p>
	 *	</div>
	 */
	getCompleteParticipationElement: function(){
		// this.popup_level = this.LEVEL_NONE;
		var divElm = document.createElement("div");
		divElm.id = "manner";
		
		var h1Elm = document.createElement("h1");
		h1Elm.appendChild(document.createTextNode("블로그 예절 캠페인 참여하기"));
		divElm.appendChild(h1Elm);
		
		var contentDivElm = document.createElement("div");
		contentDivElm.id = "dialog_content";
		divElm.appendChild(contentDivElm);
		
		var pElm = document.createElement("p");
		pElm.className = "center";
		pElm.innerHTML = "<strong style=\"font-size:14px; color: #000;\">\"성공적으로 캠페인에 참여하셨습니다\"</strong>";
		contentDivElm.appendChild(pElm);
		
		var wboxElm = document.createElement("div");
		wboxElm.className = "wbox";
		contentDivElm.appendChild(wboxElm);
		
		pElm = document.createElement("p");
		pElm.className = "desc";
		pElm.innerHTML = "캠페인 배너페이지에서 맘에 드는 배너를 골라 자신의 블로그에 붙여주세요.<br />" +
				"추후 참여하신 분들 중 추첨을 통해 소정의 기념품을 드립니다."
		wboxElm.appendChild(pElm);
		
		var pElm = document.createElement("p");
		pElm.className = "center";
		inputElm = document.createElement("input");
		inputElm.className = "bt" 
		inputElm.type = "button";
		inputElm.id = "bt40";
		inputElm.value = "캠페인 배지 고르기."
		inputElm.onfocus = "blur();";
		Event.observe(inputElm, "click", this.closeContent.bindAsEventListener(this))
		pElm.appendChild(inputElm);
		
		divElm.appendChild(pElm);
		setTimeout(function() { Field.focus($("bt40"));}, 400);
		return divElm;
	}
}
