//顯示表情菜單
function showFace(showid, target) {


	var div = $('#face_bg')[0];
	if(div) {
		div.parentNode.removeChild(div);
	}
	div = document.createElement('div');
	div.id = 'face_bg';
	div.style.position = 'absolute';
	div.style.left = div.style.top = '0px';
	div.style.width = '100%';
	div.style.height = document.body.scrollHeight + 'px';
	div.style.backgroundColor = '#000';
	div.style.zIndex = 10000;
	div.style.display = 'none';
	div.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(opacity=0,finishOpacity=100,style=0)';
	div.style.opacity = 0;
	div.onclick = function() {
		//$(showid+'_menu').style.display = 'none';
		$('#face_bg')[0].style.display = 'none';
	}
	
	

	
	$('#append_parent')[0].appendChild(div);
	
	var show_menu = document.getElementById(showid + '_menu');
	if (show_menu != null)
	{
	    show_menu.style.display = '';
	}
	
//	if($(showid + '_menu') != null) {
//		$(showid+'_menu').style.display = '';
//	} 
    
    else {
		var faceDiv = document.createElement("div");
		faceDiv.id = showid+'_menu';
		faceDiv.className = 'facebox';
		faceDiv.style.position = 'absolute';
		
		
		
		var faceul = document.createElement("ul");
		for(i=1; i<31; i++) {
			var faceli = document.createElement("li");
			faceli.innerHTML = '<img src="image/face/'+i+'.gif" onclick="insertFace(\''+showid+'\','+i+', \''+ target +'\')" style="cursor:pointer; position:relative;" />';
			faceul.appendChild(faceli);
		}
		faceDiv.appendChild(faceul);
		$('#append_parent')[0].appendChild(faceDiv)
	}
	//定位菜單
	setMenuPosition(showid, 0);
	div.style.display = '';
}
//插入表情
function insertFace(showid, id, target) {
	var faceText = '[em:'+id+':]';
	if($(target) != null) {
		insertContent(target, faceText);
	}
	$('#'+showid+'_menu')[0].style.display = 'none';
	$('#face_bg')[0].style.display = 'none';
}

function textCounter(obj, showid, maxlimit) {
	var len = strLen(obj.value);
	var showobj = $('#'+showid)[0];
	if(len > maxlimit) {
		obj.value = getStrbylen(obj.value, maxlimit);
		showobj.innerHTML = '0';
	} else {
		showobj.innerHTML = maxlimit - len;
	}
	if(maxlimit - len > 0) {
		showobj.parentNode.style.color = "";
	} else {
		showobj.parentNode.style.color = "red";
	}
	
}
function getStrbylen(str, len) {
	var num = 0;
	var strlen = 0;
	var newstr = "";
	var obj_value_arr = str.split("");
	for(var i = 0; i < obj_value_arr.length; i ++) {
		if(i < len && num + byteLength(obj_value_arr[i]) <= len) {
			num += byteLength(obj_value_arr[i]);
			strlen = i + 1;
		}
	}
	if(str.length > strlen) {
		newstr = str.substr(0, strlen);
	} else {
		newstr = str;
	}
	return newstr;
}
function byteLength (sStr) {
	aMatch = sStr.match(/[^\x00-\x80]/g);
	return (sStr.length + (! aMatch ? 0 : aMatch.length));
}
function strLen(str) {
	var charset = document.charset; 
	var len = 0;
	for(var i = 0; i < str.length; i++) {
		len += str.charCodeAt(i) < 0 || str.charCodeAt(i) > 255 ? (charset == "utf-8" ? 3 : 2) : 1;
	}
	return len;
}

function setMenuPosition(showid, offset) {
	var showobj = $('#'+ showid)[0];
	var menuobj = $('#'+showid + '_menu')[0];
	if(isUndefined(offset)) offset = 0;
	if(showobj) {
		showobj.pos = fetchOffset(showobj);
		showobj.X = showobj.pos['left'];
		showobj.Y = showobj.pos['top'];
		showobj.w = showobj.offsetWidth;
		showobj.h = showobj.offsetHeight;
		menuobj.w = menuobj.offsetWidth;
		menuobj.h = menuobj.offsetHeight;
		if(offset != -1) {
			menuobj.style.left = (showobj.X + menuobj.w > document.body.clientWidth) && (showobj.X + showobj.w - menuobj.w >= 0) ? showobj.X + showobj.w - menuobj.w + 'px' : showobj.X + 'px';
			menuobj.style.top = offset == 1 ? showobj.Y + 'px' : (offset == 2 || ((showobj.Y + showobj.h + menuobj.h > document.documentElement.scrollTop + document.documentElement.clientHeight) && (showobj.Y - menuobj.h >= 0)) ? (showobj.Y - menuobj.h) + 'px' : showobj.Y + showobj.h + 'px');
		} else if(offset == -1) {
			menuobj.style.left = (document.body.clientWidth-menuobj.w)/2 + 'px';
			var divtop = document.documentElement.scrollTop + (document.documentElement.clientHeight-menuobj.h)/2;
			if(divtop > 100) divtop = divtop - 100;
			menuobj.style.top = divtop + 'px';
		}
		if(menuobj.style.clip && !is_opera) {
			menuobj.style.clip = 'rect(auto, auto, auto, auto)';
		}
	}
}

function fetchOffset(obj) {
	var left_offset = obj.offsetLeft;
	var top_offset = obj.offsetTop;
	while((obj = obj.offsetParent) != null) {
		left_offset += obj.offsetLeft;
		top_offset += obj.offsetTop;
	}
	return { 'left' : left_offset, 'top' : top_offset };
}