
nhn.husky.SE2_ImageEditor = jindo.$Class({
	name : "SE2_ImageEditor",
	

	$init : function(elAppContainer){
	  this._assignHTMLObjects( elAppContainer );
	},
	
	_assignHTMLObjects : function(elAppContainer) {
		this.elQELayer = jindo.$$.getSingle("DIV.q_img_wrap", elAppContainer );
		
		this.elTextAlt = jindo.$$.getSingle("INPUT.altimg", this.elQELayer );
		this.elTextWidth = jindo.$$.getSingle("INPUT.widthimg", this.elQELayer );
		this.elTextHeight = jindo.$$.getSingle("INPUT.heightimg", this.elQELayer );
		this.elBtnReset = jindo.$$.getSingle("BUTTON.se2_sreset", this.elQELayer );
		this.elCheckRate = jindo.$$.getSingle("INPUT.se2_srate", this.elQELayer );
		this.elTextBorderSize = jindo.$$.getSingle("INPUT.bordersize", this.elQELayer );
		this.elBtnAddBorder = jindo.$$.getSingle("BUTTON.plus", this.elQELayer );
		this.elBtnDelBorder = jindo.$$.getSingle("BUTTON.minus", this.elQELayer );
		this.elBtnBorderColor = jindo.$$.getSingle("BUTTON.husky_se2m_img_qe_bgcolor_btn", this.elQELayer );
		
		this.elBtnPalette = jindo.$$.getSingle("BUTTON.husky_se2m_img_qe_bgcolor_btn", this.elQELayer);
		this.elPanelPaletteHolder = jindo.$$.getSingle("DIV.husky_se2m_img_qe_bg_paletteHolder", this.elQELayer);
		
		this.elBtnAlign0 = jindo.$$.getSingle("BUTTON.se2_align0", this.elQELayer);
		this.elBtnAlign1 = jindo.$$.getSingle("BUTTON.se2_align1", this.elQELayer);
		this.elBtnAlign2 = jindo.$$.getSingle("BUTTON.se2_align2", this.elQELayer);

	},
	
	$LOCAL_BEFORE_FIRST : function(sMsg){
		this.elCheckRate.checked = true;

		this.oApp.registerBrowserEvent(this.elTextAlt, "change", "APPLY_CHANGE_IMAGE_ALT");
		this.oApp.registerBrowserEvent(this.elTextWidth, "change", "APPLY_CHANGE_IMAGE_WIDTH");
		this.oApp.registerBrowserEvent(this.elTextHeight, "change", "APPLY_CHANGE_IMAGE_HEIGHT");
		this.oApp.registerBrowserEvent(this.elBtnReset, "click", "APPLY_RESET_SIZE");
		
		this.oApp.registerBrowserEvent(this.elBtnAddBorder, "click", "APPLY_ADD_BORDER_SIZE");
		this.oApp.registerBrowserEvent(this.elBtnDelBorder, "click", "APPLY_DEL_BORDER_SIZE");
		
		this.oApp.registerBrowserEvent(this.elBtnPalette, "click", "IMG_QE_TOGGLE_PALETTE");
		
		this.oApp.registerBrowserEvent(this.elBtnAlign0, "click", "APPLY_IMAGE_ALIGN", [""]);
		this.oApp.registerBrowserEvent(this.elBtnAlign1, "click", "APPLY_IMAGE_ALIGN", ["left"]);
		this.oApp.registerBrowserEvent(this.elBtnAlign2, "click", "APPLY_IMAGE_ALIGN", ["right"]);
	},
	
	$ON_APPLY_CHANGE_IMAGE_ALT : function() {
		this.oSelection.alt = this.elTextAlt.value;
	},
	
	$ON_APPLY_IMAGE_ALIGN : function(mode) {
		this.oSelection.style.cssFloat = mode;
		//alert(mode);
	},
	
	$ON_IMG_QE_TOGGLE_PALETTE : function() {
		if(this.elPanelPaletteHolder.parentNode.style.display == "block"){
			this.oApp.exec("HIDE_IMG_QE_PALETTE", []);
		}else{
			this.oApp.exec("SHOW_IMG_QE_PALETTE", []);
		}
	},
	
	$ON_SHOW_IMG_QE_PALETTE : function(){
		this.elPanelPaletteHolder.parentNode.style.display = "block";
		this.oApp.exec("SHOW_COLOR_PALETTE", ["IMG_QE_SET_FROM_PALETTE", this.elPanelPaletteHolder]);
	},
	
	$ON_HIDE_IMG_QE_PALETTE : function(){
		this.elPanelPaletteHolder.parentNode.style.display = "none";
		this.oApp.exec("HIDE_COLOR_PALETTE", []);
	},

	$ON_IMG_QE_SET_FROM_PALETTE : function(sColorCode){
		this.elBtnPalette.style.backgroundColor = sColorCode;
		this.oApp.exec("HIDE_IMG_QE_PALETTE", []);
		this._apply_borderStyle();
	},
	
	_apply_borderStyle : function() {
		this.oSelection.style.border = this.elTextBorderSize.value + "px solid " + this.elBtnPalette.style.backgroundColor;
	},
	
	$ON_APPLY_ADD_BORDER_SIZE : function() {
		var size = Number(this.elTextBorderSize.value);
		if( size < 10 ) { 
			this.elTextBorderSize.value = size+1;
			this._apply_borderStyle();
		}
	},
	
	$ON_APPLY_DEL_BORDER_SIZE : function() {
		var size = Number(this.elTextBorderSize.value);
		if( size > 0 ) { 
			this.elTextBorderSize.value = size-1;
			this._apply_borderStyle();
		}
	},
	
	$ON_APPLY_RESET_SIZE : function() {
		this.elTextWidth.value = this.org_width;
		this.elTextHeight.value = this.org_height;
		
		this.oSelection.removeAttribute('width');
		this.oSelection.removeAttribute('height');
		this.oSelection.style.width = this.elTextWidth.value + "px";
		this.oSelection.style.height = this.elTextHeight.value + "px";
		//this.oSelection.width = this.elTextWidth.value;
		//this.oSelection.height = this.elTextHeight.value;
	},
	
	$ON_APPLY_CHANGE_IMAGE_WIDTH : function() {
		if( this.elCheckRate.checked ) {
			var ratio = this.elTextWidth.value/this.org_width;
			//this.oSelection.height = this.org_height * ratio;
			this.elTextHeight.value = this.org_height * ratio;
		}
		this.oSelection.removeAttribute('width');
		this.oSelection.removeAttribute('height');
		this.oSelection.style.width = this.elTextWidth.value + "px";
		this.oSelection.style.height = this.elTextHeight.value + "px";
		//this.oSelection.width = this.elTextWidth.value;
		//this.oSelection.height = this.elTextHeight.value;
	},

	$ON_APPLY_CHANGE_IMAGE_HEIGHT : function() {
		if( this.elCheckRate.checked ) {
			var ratio = this.elTextHeight.value/this.org_height;
			//this.oSelection.width = this.org_width * ratio;
			this.elTextWidth.value = this.org_width * ratio;
		}
		this.oSelection.removeAttribute('width');
		this.oSelection.removeAttribute('height');
		this.oSelection.style.width = this.elTextWidth.value + "px";
		this.oSelection.style.height = this.elTextHeight.value + "px";
		//this.oSelection.width = this.elTextWidth.value;
		//this.oSelection.height = this.elTextHeight.value;
	},

	
	$ON_EVENT_EDITING_AREA_MOUSEDOWN : function(wevE){
		if ('WYSIWYG' !== this.oApp.getEditingMode()){
			return;
		}

		if(wevE.element.tagName == "IMG" && wevE.element.className != "edMovieImg") {
			this.oSelection = wevE.element;
			
			this.elTextAlt.value = this.oSelection.alt;
			this.elTextWidth.value = this.oSelection.width;
			this.elTextHeight.value = this.oSelection.height;
			
			this.org_width = this.oSelection.width;
			this.org_height = this.oSelection.height;
			
			var borderWidth = parseInt(this.oSelection.style.borderWidth);
			if( this.oSelection.style.borderWidth == "" ) {
				this.elTextBorderSize.value = 0;
			} else {
				this.elTextBorderSize.value = borderWidth;
			}
			this.elBtnPalette.style.backgroundColor = this.elBtnPalette.style.borderColor;
			
			this.oApp.exec("OPEN_QE_LAYER", [this.oSelection, this.elQELayer, "img"] );
		}
	}
	
});


nhn.husky.SE_EditingArea_WYSIWYG.prototype.getIR = function(){

	convertImgToComment(this.iframe.contentWindow.document);
		var sContent = this.iframe.contentWindow.document.body.innerHTML,
			sIR;

		if(this.oApp.applyConverter){
			//convertImgToComment(this.oApp.getWYSIWYGDocument());
			sIR = this.oApp.applyConverter(this.sMode+"_TO_IR", sContent, this.oApp.getWYSIWYGDocument());
		}else{
			sIR = sContent;
		}

		return sIR;
};


nhn.husky.SE_EditingArea_WYSIWYG.prototype.setIR = function(sIR) {
		// [SMARTEDITORSUS-875] HTML 모드의 beautify에서 추가된 공백을 다시 제거
		//sIR = sIR.replace(/(>)([\n\r\t\s]*)([^<]?)/g, "$1$3").replace(/([\n\r\t\s]*)(<)/g, "$2")
		// --[SMARTEDITORSUS-875]
		
		var sContent, 
			oNavigator = this.oApp.oNavigator, 
			bUnderIE11 = oNavigator.ie && document.documentMode < 11, // IE11미만
			sCursorHolder = bUnderIE11 ? "" : "<br>";

		if(this.oApp.applyConverter){
			sContent = this.oApp.applyConverter("IR_TO_"+this.sMode, sIR, this.oApp.getWYSIWYGDocument());
		}else{
			sContent = sIR;
		}

		// [SMARTEDITORSUS-1279] [IE9/10] pre 태그 아래에 \n이 포함되면 개행이 되지 않는 이슈
		/*if(oNavigator.ie && oNavigator.nativeVersion >= 9 && document.documentMode >= 9){
			// [SMARTEDITORSUS-704] \r\n이 있는 경우 IE9 표준모드에서 정렬 시 브라우저가 <p>를 추가하는 문제
			sContent = sContent.replace(/[\r\n]/g,"");
		}*/

		// 편집내용이 없는 경우 커서홀더로 대체
		if(sContent.replace(/[\r\n\t\s]*/,"") === ""){
			if(this.oApp.sLineBreaker !== "BR"){
				sCursorHolder = "<p>" + sCursorHolder + "</p>";
			}
			sContent = sCursorHolder;
		}
		
		sContent = sContent.replace( /<!--<video>/gi, "<img class=\"edMovieImg\" src=\"img/movie.gif\" alt=\"동영상\" id=\"" );
		sContent = sContent.replace( /<\/video>-->/gi, "\" />" );
		sContent = sContent.replace( /<!--<flash>/gi, "&nbsp;<img class=\"edFlashImg\" src=\"img/flash.gif\" alt=\"플래시\" id=\"" );
		sContent = sContent.replace( /<\/flash>-->/gi, "\" />" );
	
		this.iframe.contentWindow.document.body.innerHTML = sContent;

		// [COM-1142] IE의 경우 <p>&nbsp;</p> 를 <p></p> 로 변환
		// [SMARTEDITORSUS-1623] IE11은 <p></p>로 변환하면 라인이 붙어버리기 때문에 IE10만 적용하도록 수정
		if(bUnderIE11 && this.oApp.getEditingMode() === this.sMode){
			var pNodes = this.oApp.getWYSIWYGDocument().body.getElementsByTagName("P");

			for(var i=0, nMax = pNodes.length; i < nMax; i++){
				if(pNodes[i].childNodes.length === 1 && pNodes[i].innerHTML === "&nbsp;"){
					pNodes[i].innerHTML = '';
				}
			}
		}
	
};


function convertImgToComment(doc) {
	var imgList = doc.getElementsByTagName( "img" );

	for( var i=0; i<imgList.length; i++ ) {
		var img = imgList[i];
		var className = img.className;
		if( className == "edMovieImg" && img.src.indexOf("img/movie.gif" ) != -1 ) {
			var strExt  = img.id.substring( img.id.lastIndexOf( "." )+1 );
			/*
			if ((strExt.toLowerCase() != "avi") &&
				(strExt.toLowerCase() != "wmv") && 
				(strExt.toLowerCase() != "mpeg") && 
				(strExt.toLowerCase() != "mpg") && 
				(strExt.toLowerCase() != "mkv") && 
				(strExt.toLowerCase() != "mp4") && 
				(strExt.toLowerCase() != "mov") && 
				(strExt.toLowerCase() != "asf")) {
					continue;
			}
			*/
			var theMovieNode = doc.createComment("<video>" + img.id + "</video>");
			img.parentNode.replaceChild( theMovieNode, img );
			i -=1;
		} else if( className == "edFlashImg" && img.src.indexOf("../images/flash.gif" ) != -1 ) {
			var strExt  = img.id.substring( img.id.lastIndexOf( "." )+1 ).toLowerCase();
			if( strExt != "swf" ) {
				continue;
			}
			var theMovieNode = doc.createComment("<flash>" + img.id + "</flash>");
			img.parentNode.replaceChild( theMovieNode, img );
			i -=1;
		}
	}
}
