//任何人都可以随意使用或转发，但请保留作者信息
//程序设计：刘佳宇  http://www.xybxy.com  MSN:liujiayu10@hotmail.com
//v1.0  程序出炉
//v1.1  从Word粘贴自动判断，并去除Word标记；回车事件加<br>而非<p>标记

var myobjname;
var mybrowser;
var myeditorform;
var myselection;
var myrange;
var myrange_text;
var mywidth = "500px";
var myheight = "400px";
var skin_path  = "icon/";
var css_path = "myeditor.css";
var font_family = "Courier New";
var menu_border_color = '#aaaaaa';
var menu_bg_color = '#efefef';
var menu_text_color = '#222222';
var menu_selected_color = '#cccccc';
var toolbar_border_color = '#dddddd';
var toolbar_bg_color = '#efefef';
var form_border_color = '#dddddd';
var form_bg_color = '#ffffff';
var toolbar_icon = Array(
	Array('fontname', 'font.gif', '字体'),
	Array('fontsize', 'fontsize.gif', '文字大小'),
	Array('bold', 'bold.gif', '粗体'),
	Array('italic', 'italic.gif', '斜体'),
	Array('underline', 'underline.gif', '下划线'),
	Array('textcolor', 'textcolor.gif', '文字颜色'),
	Array('bgcolor', 'bgcolor.gif', '文字背景'),
	Array('removeformat', 'removeformat.gif', '取消格式'),
	Array('indent', 'indent.gif', '减少缩进'),
	Array('outdent', 'outdent.gif', '增加缩进'),
	Array('left', 'left.gif', '左对齐'),
	Array('center', 'center.gif', '居中'),
	Array('right', 'right.gif', '右对齐'),
	Array('plus300', 'sizeplus.gif', '增高编辑区'),
	Array('minus300', 'sizeminus.gif', '减小编辑区')
);
var font_name = Array(
	Array('SimSun', '宋体'), 
	Array('SimHei', '黑体'), 
	Array('FangSong_GB2312', '仿宋体'), 
	Array('KaiTi_GB2312', '楷体'), 
	Array('NSimSun', '新宋体'), 
	Array('Arial', 'Arial'), 
	Array('Arial Black', 'Arial Black'), 
	Array('Times New Roman', 'Times New Roman'), 
	Array('Courier New', 'Courier New'), 
	Array('Tahoma', 'Tahoma'), 
	Array('Verdana', 'Verdana'), 
	Array('GulimChe', 'GulimChe'), 
	Array('MS Gothic', 'MS Gothic') 
);
var font_size = Array(
	Array(1,'8pt'), 
	Array(2,'9pt'), 
	Array(3,'10pt'), 
	Array(4,'12pt'), 
	Array(5,'14pt'), 
	Array(6,'18pt'), 
	Array(7,'24pt')
);
var color_table = Array(
	"#ff0000", "#ffff00", "#00ff00", "#00ffff", "#0000ff", "#ff00ff", "#ffffff", "#f5f5f5", "#dcdcdc", "#fffafa",
	"#d3d3d3", "#c0c0c0", "#a9a9a9", "#808080", "#696969", "#000000", "#2f4f4f", "#708090", "#778899", "#4682b4",
	"#4169e1", "#6495ed", "#b0c4de", "#7b68ee", "#6a5acd", "#483d8b", "#191970", "#000080", "#00008b", "#0000cd",
	"#1e90ff", "#00bfff", "#87cefa", "#87ceeb", "#add8e6", "#b0e0e6", "#f0ffff", "#e0ffff", "#afeeee", "#00ced1",
	"#5f9ea0", "#48d1cc", "#00ffff", "#40e0d0", "#20b2aa", "#008b8b", "#008080", "#7fffd4", "#66cdaa", "#8fbc8f",
	"#3cb371", "#2e8b57", "#006400", "#008000", "#228b22", "#32cd32", "#00ff00", "#7fff00", "#7cfc00", "#adff2f",
	"#98fb98", "#90ee90", "#00ff7f", "#00fa9a", "#556b2f", "#6b8e23", "#808000", "#bdb76b", "#b8860b", "#daa520",
	"#ffd700", "#f0e68c", "#eee8aa", "#ffebcd", "#ffe4b5", "#f5deb3", "#ffdead", "#deb887", "#d2b48c", "#bc8f8f",
	"#a0522d", "#8b4513", "#d2691e", "#cd853f", "#f4a460", "#8b0000", "#800000", "#a52a2a", "#b22222", "#cd5c5c",
	"#f08080", "#fa8072", "#e9967a", "#ffa07a", "#ff7f50", "#ff6347", "#ff8c00", "#ffa500", "#ff4500", "#dc143c",
	"#ff0000", "#ff1493", "#ff00ff", "#ff69b4", "#ffb6c1", "#ffc0cb", "#db7093", "#c71585", "#800080", "#8b008b",
	"#9370db", "#8a2be2", "#4b0082", "#9400d3", "#9932cc", "#ba55d3", "#da70d6", "#ee82ee", "#dda0dd", "#d8bfd8",
	"#e6e6fa", "#f8f8ff", "#f0f8ff", "#f5fffa", "#f0fff0", "#fafad2", "#fffacd", "#fff8dc", "#ffffe0", "#fffff0",
	"#fffaf0", "#faf0e6", "#fdf5e6", "#faebd7", "#ffe4c4", "#ffdab9", "#ffefd5", "#fff5ee", "#fff0f5", "#ffe4e1"
);
var popup_menu_table = Array(
	"fontname","fontsize", "textcolor", "bgcolor"
);
function GetBrowser(){
	var browser = '';
	var agentInfo = navigator.userAgent.toLowerCase();
	if (agentInfo.indexOf("msie") > -1) {
		var re = new RegExp("msie\\s?([\\d\\.]+)","ig");
		var arr = re.exec(agentInfo);
		if (parseInt(RegExp.$1) >= 5.5) {
			browser = 'IE';
		}
	} else if (agentInfo.indexOf("firefox") > -1) {
		browser = 'FF';
	} else if (agentInfo.indexOf("netscape") > -1) {
		var temp1 = agentInfo.split(' ');
		var temp2 = temp1[temp1.length-1].split('/');
		if (parseInt(temp2[1]) >= 7) {
			browser = 'NS';
		}
	} else if (agentInfo.indexOf("gecko") > -1) {
		browser = 'ML';
	} else if (agentInfo.indexOf("opera") > -1) {
		var temp1 = agentInfo.split(' ');
		var temp2 = temp1[0].split('/');
		if (parseInt(temp2[1]) >= 9) {
			browser = 'OPERA';
		}
	}
	return browser;
}
function CreateToolbar(){
	var htmlData = '<table cellpadding="0" cellspacing="0" border="0" height="26"><tr>';
	for (i = 0; i < toolbar_icon.length; i++) {
		htmlData += '<td style="padding:1px;">' + CreateIcon(toolbar_icon[i]) + '</td>';
	}
	htmlData += '</tr></table>';
	return htmlData;
}
function CreateIcon(icon){
	var str = '<img id="'+ icon[0] +'" src="' + skin_path + icon[1] + '" alt="' + icon[2] + '" title="' + icon[2] + 
			'" align="absmiddle" style="border:1px solid ' + toolbar_bg_color +';cursor:pointer;height:20px;';
	str += '" onclick="javascript:Execute(\''+ icon[0] +'\');" '+
			'onmouseover="javascript:this.style.border=\'1px solid ' + menu_border_color + '\';" ' +
			'onmouseout="javascript:this.style.border=\'1px solid ' + toolbar_bg_color + '\';" ';
	str += '>';
	return str;
}
function PopupMenu(cmd){
	switch (cmd)	{
		case 'fontname':
			var str = '';
			for (i = 0; i < font_name.length; i++) {
				str += '<div style="font-family:' + font_name[i][0] + 
				';padding:2px;width:160px;cursor:pointer;" ' + 
				'onclick="javascript:Execute(\'fontname_end\', \'' + font_name[i][0] + '\');" ' + 
				'onmouseover="javascript:this.style.backgroundColor=\''+menu_selected_color+'\';" ' +
				'onmouseout="javascript:this.style.backgroundColor=\''+menu_bg_color+'\';">' + 
				font_name[i][1] + '</div>';
			}
			str = GetCommonMenu('fontname', str);
			return str;
			break;
		case 'fontsize':
			var str = '';
			for (i = 0; i < font_size.length; i++) {
				str += '<div style="font-size:' + font_size[i][1] + 
				';padding:2px;width:120px;cursor:pointer;" ' + 
				'onclick="javascript:Execute(\'fontsize_end\', \'' + font_size[i][0] + '\');" ' + 
				'onmouseover="javascript:this.style.backgroundColor=\''+menu_selected_color+'\';" ' +
				'onmouseout="javascript:this.style.backgroundColor=\''+menu_bg_color+'\';">' + 
				font_size[i][1] + '</div>';
			}
			str = GetCommonMenu('fontsize', str);
			return str;
			break;
		case 'textcolor':
			var str = '';
			str = DrawColorTable('textcolor');
			return str;
			break;
		case 'bgcolor':
			var str = '';
			str = DrawColorTable('bgcolor');
			return str;
			break;
		default: 
			break;
	}
}
function GetCommonMenu(cmd, content){
	var str = '';
	str += '<div id="popup_'+cmd+'" style="'+GetMenuCommonStyle()+'">';
	str += content;
	str += '</div>';
	return str;
}
function GetMenuCommonStyle(){
	var str = 'position:absolute;top:1px;left:1px;font-size:12px;color:'+menu_text_color+
			';background-color:'+menu_bg_color+';border:solid 1px '+menu_border_color+';z-index:1;display:none;';
	return str;
}
function DrawColorTable(cmd){
	var str = '';
	str += '<div id="popup_'+cmd+'" style="width:160px;padding:2px;'+GetMenuCommonStyle()+'">';
	str += CreateColorTable(cmd);
	str += '</div>';
	return str;
}
function CreateColorTable(cmd, eventStr){
	var str = '';
	str += '<table cellpadding="0" cellspacing="2" border="0">';
	for (i = 0; i < color_table.length; i++) {
		if (i == 0 || (i >= 10 && i%10 == 0)) {
			str += '<tr>';
		}
		str += '<td style="width:12px;height:12px;border:1px solid #aaaaaa;font-size:1px;cursor:pointer;background-color:' +
		color_table[i] + ';" onmouseover="javascript:this.style.borderColor=\'#000000\';' + ((eventStr) ? eventStr : '') + '" ' +
		'onmouseout="javascript:this.style.borderColor=\'#aaaaaa\';" ' + 
		'onclick="javascript:Execute(\''+cmd+'_end\', \'' + color_table[i] + '\');">&nbsp;</td>';
		if (i >= 9 && i%(i-1) == 0) {
			str += '</tr>';
		}
	}
	str += '</table>';
	return str;
}
function WriteFullHtml(documentObj, content){
	var editHtmlData = '';
	editHtmlData += '<html>\r\n<head>\r\n<title>myEditor</title>\r\n';
	editHtmlData += '<link href="'+css_path+'" rel="stylesheet" type="text/css">\r\n</head>\r\n<body>\r\n';
	editHtmlData += content;
	editHtmlData += '\r\n</body>\r\n</html>\r\n';
	documentObj.open();
	documentObj.write(editHtmlData);
	documentObj.close();
}
function DisplayMenu(cmd){
	myeditorform.focus();
	Selection();
	DisableMenu();
	var top, left;
	top = GetTop(cmd);
	left = GetLeft(cmd);
	document.getElementById('popup_'+cmd).style.top =  top.toString(10) + 'px';
	document.getElementById('popup_'+cmd).style.left = left.toString(10) + 'px';
	document.getElementById('popup_'+cmd).style.display = 'block';
}
function DisableMenu(){
	for (i = 0; i < popup_menu_table.length; i++) {
		document.getElementById('popup_'+popup_menu_table[i]).style.display = 'none';
	}
}
function cleanCode(str,update){
	str = str.replace(/<\/?SPAN[^>]*>/gi, "" );
	str = str.replace(/<(\w[^>]*) class=([^ |>]*)([^>]*)/gi, "<$1$3");
	str = str.replace(/<(\w[^>]*) style="([^"]*)"([^>]*)/gi, "<$1$3");
	str = str.replace(/<(\w[^>]*) lang=([^ |>]*)([^>]*)/gi, "<$1$3");
	str = str.replace(/<\\?\?xml[^>]*>/gi, "");
	str = str.replace(/<\/?\w+:[^>]*>/gi, "");
	str = str.replace(/&nbsp;/, " ");
	if (!update){
		insertHTML(str);
	}else{
		return str;
	}
}
function insertHTML(html) {
	var sel = myeditorform.selection.createRange();
	sel.pasteHTML(html) ; 
}
function Execute(cmd, value){
	switch (cmd)	{
		case 'bold':
			SimpleExecute('bold');
			break;
		case 'italic':
			SimpleExecute('italic');
			break;
		case 'underline':
			SimpleExecute('underline');
			break;
		case 'left':
			SimpleExecute('justifyleft');
			break;
		case 'center':
			SimpleExecute('justifycenter');
			break;
		case 'right':
			SimpleExecute('justifyright');
			break;
		case 'removeformat':
			SimpleExecute('removeformat');
			break;
		case 'fontname':
			DisplayMenu(cmd);
			break;
		case 'fontname_end':
			myeditorform.focus();
			mySelect();
			ExecuteValue('fontname', value);
			DisableMenu();
			break;
		case 'fontsize':
			DisplayMenu(cmd);
			break;
		case 'fontsize_end':
			myeditorform.focus();
			value = value.substr(0, 1);
			mySelect();
			ExecuteValue('fontsize', value);
			DisableMenu();
			break;
		case 'textcolor':
			DisplayMenu(cmd);
			break;
		case 'textcolor_end':
			myeditorform.focus();
			mySelect();
			ExecuteValue('ForeColor', value);
			DisableMenu();
			break;
		case 'bgcolor':
			DisplayMenu(cmd);
			break;
		case 'bgcolor_end':
			myeditorform.focus();
			if (mybrowser == 'IE') {
				mySelect();
				ExecuteValue('BackColor', value);
			} else {
				var startRangeNode = myrange.startContainer;
				if (startRangeNode.nodeType == 3) {
					var parent = startRangeNode.parentNode;
					var element = document.createElement("font");
					element.style.backgroundColor = value;
					element.appendChild(myrange.extractContents());
					var startRangeOffset = myrange.startOffset;
					var newRange = document.createRange();
					var afterNode;
					var textNode = startRangeNode;
					startRangeNode = textNode.parentNode;
					var text = textNode.nodeValue;
					var textBefore = text.substr(0, startRangeOffset);
					var textAfter = text.substr(startRangeOffset);
					var beforeNode = document.createTextNode(textBefore);
					var afterNode = document.createTextNode(textAfter);
					startRangeNode.insertBefore(afterNode, textNode);
					startRangeNode.insertBefore(element, afterNode);
					startRangeNode.insertBefore(beforeNode, element);
					startRangeNode.removeChild(textNode);
					newRange.setEnd(afterNode, 0);
					newRange.setStart(afterNode, 0);
					myselection.addRange(newRange);
				}
			}
			DisableMenu();
			break;
		case 'indent':
			SimpleExecute('indent');
			break;
		case 'outdent':
			SimpleExecute('outdent');
			break;
		case 'plus300':
			reSize(300);
			break;
		case 'minus300':
			reSize(-300);
			break;
		default: 
			break;
	}
}
function ExecuteValue(cmd, value){
	myeditorform.execCommand(cmd, false, value);
}
function SimpleExecute(cmd){
	myeditorform.focus();
	myeditorform.execCommand(cmd, false, null);
	DisableMenu();
}
function GetTop(id){
	var top = 28;
	var tmp = '';
	var obj = document.getElementById(id);
	while (eval("obj" + tmp).tagName != "BODY") {
		tmp += ".offsetParent";
		top += eval("obj" + tmp).offsetTop;
	}
	return top;
}
function GetLeft(id){
	var left = 2;
	var tmp = '';
	var obj = document.getElementById(id);
	while (eval("obj" + tmp).tagName != "BODY") {
		tmp += ".offsetParent";
		left += eval("obj" + tmp).offsetLeft;
	}
	return left;
}
function Selection(){
	if (mybrowser == 'IE') {
		myselection = myeditorform.selection;
		myrange = myselection.createRange();
		myrange_text = myrange.text;
	} else {
		myselection = document.getElementById("EditorForm").contentWindow.getSelection();
        myrange = myselection.getRangeAt(0);
		myrange_text = myrange.toString();
	}
}
function mySelect(){
	if (mybrowser == 'IE') {
		myrange.select();
	}
}
function reSize(size){
	var obj=document.getElementById("EditorForm");
	var height = parseInt(obj.offsetHeight);
	if (size>0){
		obj.style.height=height+size+"px";
	}else{
		if (height+size>=parseInt(myheight)-300){
			obj.style.height=height+size+"px";
		}else{
			obj.style.height=height+"px";
		}
	}
}
function onPaste(){
	var sHTML = GetClipboardHTML();
	var re = /<\w[^>]* class="?MsoNormal"?/gi;
	if (re.test(sHTML)){
		alert("您要粘贴的内容好象是从Word中拷出来的，必须先清除Word格式再粘贴！")
		cleanCode(sHTML,false);
		return false;
	}
	return true;
}
function GetClipboardHTML() {
	var oDiv = document.getElementById("Temp_HTML");
	oDiv.innerHTML = "" ;
	var oTextRange = document.body.createTextRange();
	oTextRange.moveToElementText(oDiv);
	oTextRange.execCommand("Paste");
	var sData = oDiv.innerHTML;
	oDiv.innerHTML = "";
	return sData ;
}
function onKeyDown(event){
	if (event.keyCode==13){
		var sel = myeditorform.selection.createRange();
		sel.pasteHTML("<BR>");
		event.cancelBubble = true;
		event.returnValue = false;
		sel.select();
		sel.moveEnd("character", 1);
		sel.moveStart("character", 1);
		sel.collapse(false);
		return false;
	}
}
function myeditor(objName) {
	this.objName = objName;
	this.hiddenName = objName;
	this.width;
	this.height;
	this.skinPath;
	this.cssPath;
	this.menuBorderColor;
	this.menuBgColor;
	this.menuTextColor;
	this.menuSelectedColor;
	this.toolbarBorderColor;
	this.toolbarBgColor;
	this.formBorderColor;
	this.formBgColor;
	this.init = function()	{
		if (this.width) mywidth = this.width;
		if (this.height) myheight = this.height;
		if (this.skinPath) skin_path = this.skinPath;
		if (this.cssPath) css_path = this.cssPath;
		if (this.menuBorderColor) menu_border_color = this.menuBorderColor;
		if (this.menuBgColor) menu_bg_color = this.menuBgColor;
		if (this.menuTextColor) menu_text_color = this.menuTextColor;
		if (this.menuSelectedColor) menu_selected_color = this.menuSelectedColor;
		if (this.toolbarBorderColor) toolbar_border_color = this.toolbarBorderColor;
		if (this.toolbarBgColor) toolbar_bg_color = this.toolbarBgColor;
		if (this.formBorderColor) form_border_color = this.formBorderColor;
		if (this.formBgColor) form_bg_color = this.formBgColor;
		myobjname = this.objName;
		mybrowser = GetBrowser();
	}
	this.show = function()	{
		this.init();
		var widthStyle = 'width:' + mywidth + ';';
		var widthArr = mywidth.match(/(\d+)([px%]{1,2})/);
		var iframeWidthStyle = 'width:' + (parseInt(widthArr[1]) - 2).toString(10) + widthArr[2] + ';';
		var heightStyle = 'height:' + myheight + ';';
		var heightArr = myheight.match(/(\d+)([px%]{1,2})/);
		var iframeHeightStyle = 'height:' + (parseInt(heightArr[1]) - 3).toString(10) + heightArr[2] + ';';
		var htmlData = '<div style="font-family:'+font_family+';">';
		htmlData += '<div style="'+widthStyle+';border:1px solid ' + toolbar_border_color + ';background-color:'+ toolbar_bg_color +'">';
		htmlData += CreateToolbar();
		htmlData += '</div><div id="Temp_HTML" style="visibility: hidden; overflow: hidden; position: absolute; width: 0px; height: 0px"></div>';
		htmlData += '<div id="EditorIframe" style="' + widthStyle + heightStyle + 
			'border:1px solid '+ form_border_color +';border-top:0;">' +
			'<iframe name="EditorForm" id="EditorForm" frameborder="0" style="' + iframeWidthStyle + iframeHeightStyle + 
			'padding:0;margin:0;border:0;"></iframe></div>';
		htmlData += '</div>';
		for (var i = 0; i < popup_menu_table.length; i++) {
			htmlData += PopupMenu(popup_menu_table[i]);
		}
		document.open();
		document.write(htmlData);
		document.close();
		if (mybrowser == 'IE') {
			myeditorform = document.frames("EditorForm").document;
		} else {
			myeditorform = document.getElementById('EditorForm').contentDocument;
		}
		myeditorform.designMode = 'On';
		WriteFullHtml(myeditorform, document.getElementsByName(eval(myobjname).hiddenName)[0].value);
		var el = myeditorform.body;
		if (myeditorform.addEventListener){
			myeditorform.addEventListener('click', DisableMenu, false); 
		} else if (el.attachEvent){
			el.attachEvent('onclick', DisableMenu);
		}
		myeditorform.body.onpaste = onPaste;
		myeditorform.body.onkeydown = new Function("return onKeyDown(EditorForm.event);");
	}
	this.data = function(){
		var htmlResult;
		htmlResult = myeditorform.body.innerHTML;
		DisableMenu();
		htmlResult = cleanCode(htmlResult,true);
		document.getElementsByName(this.hiddenName)[0].value = htmlResult;
		return htmlResult;
	}
}