editor.js

JSP(Java Server Pages)是由Sun Microsystems公司倡导、许多公司参与一起建立的一种动态网页技术标准。 JSP技术是用JAVA语言作为脚本语言的

/**
 * sLinkFieldName：相关的文本框名称。 sInitMode：初始化模式。"CODE","EDIT","VIEW"。
 * sWebEditorName：编辑器名称。
 */
Pn.Editor = function(config) {
	config = config || {};
	this.initConfig = config;
	Pn.apply(this, config);

	// 浏览器版本检测
	this.BrowserInfo = new Object();
	this.BrowserInfo.majorVer = navigator.appVersion.match(/MSIE (.)/)[1];
	this.BrowserInfo.minorVer = navigator.appVersion.match(/MSIE .\.(.)/)[1];
	this.BrowserInfo.isIE55OrMore = this.BrowserInfo.majorVer >= 6
			|| (this.BrowserInfo.majorVer >= 5 && this.BrowserInfo.minorVer >= 5);

	// 当前模式
	this.sCurrMode = null;
	this.bEditMode = null;
	// 编辑器
	this.eWebEditor = document.frames[this.sWebEditorName];
	// 关联的字段
	this.oLinkField = document.getElementsByName(this.sLinkFieldName)[0];
	var url = location.href;
	// 基本路径
	this.sBaseUrl = url.substring(0,url.lastIndexOf('/')+1);
	// 缩放，百分比。
	this.nCurrZoomSize = 100;

	this.sContentFlag = "0";
	this.sContentEdit = "";
	this.sContentLoad = "";

	if (this.sContentFlag == "0") {
		this.sContentEdit = this.oLinkField.value;
		this.sContentLoad = this.oLinkField.value;
		this.sContentFlag = "1";
	}
	// 编辑器的模式及处理内容
	this.setMode(this.sInitMode);
	this.setLinkedField();

}
// 改变模式：代码、编辑、预览
Pn.Editor.prototype.setMode = function(newMode) {
	if (newMode != this.sCurrMode) {
		var sBody = "";
		var msg = "";
		switch (this.sCurrMode) {
			case "CODE" :
				sBody = this.eWebEditor.document.body.innerText;
				break;
			case "EDIT" :
			case "VIEW" :
				sBody = this.eWebEditor.document.body.innerHTML;
				break;
			// 刚打开页面
			default :
				sBody = this.sContentEdit;
				break;
		}
		// 更换状态按钮样式。
		try {
			document.all[this.sWebEditorName + "_CODE"].className = "p-editor-statusbar-off";
			document.all[this.sWebEditorName + "_EDIT"].className = "p-editor-statusbar-off";
			document.all[this.sWebEditorName + "_VIEW"].className = "p-editor-statusbar-off";
			document.all[this.sWebEditorName + "_" + newMode].className = "p-editor-statusbar-on";
		} catch (e) {
		}
		// 换内容
		switch (newMode) {
			case "CODE" :
				this.eWebEditor.document.designMode = "On";
				this.eWebEditor.document.open();
				this.eWebEditor.document.write(this.styleEditorHeader);
				this.eWebEditor.document.body.innerText = sBody;
				this.eWebEditor.document.body.contentEditable = "true";
				this.eWebEditor.document.oncontextmenu = function(){return false};
				this.eWebEditor.document.close();
				this.bEditMode = false;
				break;
			case "EDIT" :
				this.eWebEditor.document.designMode = "On";
				this.eWebEditor.document.open();
				this.eWebEditor.document.write(this.styleEditorHeader);
				this.eWebEditor.document.body.innerHTML = sBody;
				this.eWebEditor.document.body.contentEditable = "true";
				this.eWebEditor.document.oncontextmenu = function(){return false};
				this.eWebEditor.document.execCommand("2D-Position", true, true);
				this.eWebEditor.document.execCommand("MultipleSelection", true,
						true);
				this.eWebEditor.document.execCommand("LiveResize", true, true);
				this.eWebEditor.document.close();
				this.doZoom(this.nCurrZoomSize);
				this.bEditMode = true;
				break;
			case "VIEW" :
				this.eWebEditor.document.designMode = "off";
				this.eWebEditor.document.open();
				this.eWebEditor.document.write(this.styleEditorHeader + sBody);
				this.eWebEditor.document.body.contentEditable = "false";
				this.eWebEditor.document.close();
				this.bEditMode = false;
				break;
		}
		this.sCurrMode = newMode;
		// TODO
		/*
		 * disableChildren(eWebEditor_Toolbar);
		 * 
		 * if ((borderShown != "no") && bEditMode) { borderShown = "no";
		 * showBorders() }
		 */
	}
	// eWebEditor.focus();
}
/**
 * 缩放
 */
Pn.Editor.prototype.doZoom = function(size) {
	this.eWebEditor.document.body.runtimeStyle.zoom = size + "%";
	this.nCurrZoomSize = size;
}

// 设置所属表单的提交或reset事件
Pn.Editor.prototype.setLinkedField = function(size) {
	if (!this.oLinkField) {
		return;
	}
	var oForm = this.oLinkField.form;
	if (!oForm) {
		return;
	}
	// 附加reset、submit事件
	var o = this;
	oForm.attachEvent("onreset", function(){o.attachReset.call(o)});
	oForm.attachEvent("onsubmit", function(){o.attachSubmit.call(o)});
}

// 附加Reset事件
Pn.Editor.prototype.attachReset = function() {
	if (!this.bEditMode) {
		this.setMode('EDIT');
	}
	if (this.bEditMode) {
		this.eWebEditor.document.body.innerHTML = this.sContentLoad;
	} else {
		this.eWebEditor.document.body.innerText = this.sContentLoad;
	}
}
// 附加Submit事件
Pn.Editor.prototype.attachSubmit = function() {
	var oForm = this.oLinkField.form;
	if (!oForm) {
		return;
	}
	var html = this.getHTML();
	this.sContentEdit = html;
	if (this.sCurrMode == "TEXT") {
		html = this.htmlEncode(html);
	}
	if (this.oLinkField.value != null) {
		this.oLinkField.value = html;
	}
}
// 取编辑器的内容
Pn.Editor.prototype.getHTML = function() {
	var html;
	if (this.bEditMode) {
		html = this.eWebEditor.document.body.innerHTML;
	} else {
		html = this.eWebEditor.document.body.innerText;
	}
	var re = new RegExp(this.sBaseUrl.replace(/\//, "\/"), "gi");
	// alert("re:"+re);
	html = html.replace(re, "");
	if ((html.toLowerCase() == "<p>&nbsp;</p>")
			|| (html.toLowerCase() == "<p></p>")) {
		html = "";
	}
	return html;
}
// 替换特殊字符
Pn.Editor.prototype.htmlEncode = function(text) {
	text = text.replace(/&/g, "&amp;");
	text = text.replace(/"/g, "&quot;");
	text = text.replace(/</g, "&lt;");
	text = text.replace(/>/g, "&gt;");
	text = text.replace(/'/g, "&#146;");
	text = text.replace(/\ /g, "&nbsp;");
	text = text.replace(/\n/g, "<br/>");
	text = text.replace(/\t/g, "&nbsp;&nbsp;&nbsp;&nbsp;");
	return text;
}
// 格式化编辑器中的内容
Pn.Editor.prototype.format = function(what, opt) {
	if (!this.validateMode()) {
		return;
	}
	this.eWebEditor.focus();
	if (opt == "RemoveFormat") {
		what = opt;
		opt = null;
	}
	if (opt == null) {
		this.eWebEditor.document.execCommand(what);
	} else {
		this.eWebEditor.document.execCommand(what, "", opt);
	}
	this.eWebEditor.focus();
}
// 检测当前是否允许编辑
Pn.Editor.prototype.validateMode = function() {
	if (this.bEditMode) {
		return true;
	}
	alert("需转换为编辑状态后才能使用编辑功能！");
	this.eWebEditor.focus();
	return false;
}
// 插入特殊对象
Pn.Editor.prototype.insert = function(what) {
	if (!this.validateMode()) {
		return;
	}
	this.eWebEditor.focus();
	var sel = this.eWebEditor.document.selection.createRange();
	switch (what) {
		// 插入分页符
		case "page" :
			this.insertHTML("[NextPage]");
			break;
		// 插入换行符
		case "br" :
			this.insertHTML("<br/>");
			break;
		// 引用片段样式
		case "quote" :
			this.insertHTML('<table width=95% border="0" align="Center" cellpadding="6" cellspacing="0" style="border: 1px Dotted #CCCCCC; TABLE-LAYOUT: fixed"><tr><td bgcolor=#F3F3F3 style="WORD-WRAP: break-word"><font style="color: #990000;font-weight:bold">以下是引用片段：</font><br>'
					+ HTMLEncode(sel.text) + '</td></tr></table>');
			break;
		// 字体变大
		case "big" :
			this.insertHTML("<big>" + sel.text + "</big>");
			break;
		// 字体变小
		case "small" :
			this.insertHTML("<small>" + sel.text + "</small>");
			break;
		default :
			alert("错误参数调用！");
			break;
	}
	sel = null;
}
// 显示无模式对话框
Pn.Editor.prototype.showDialog = function(url, width, height, optValidate) {
	if (optValidate) {
		if (!this.validateMode()) {
			return;
		}
	}
	this.eWebEditor.focus();
	var arr = showModalDialog(url, this.eWebEditor, "dialogWidth:" + width
			+ "px;dialogHeight:" + height + "px;help:no;scroll:no;status:no");
	this.eWebEditor.focus();
}
// 在当前文档位置插入.
Pn.Editor.prototype.insertHTML = function(html) {
	if (!this.validateMode()) return;
	if (this.eWebEditor.document.selection.type.toLowerCase() != "none")
		this.eWebEditor.document.selection.clear() ;
	this.eWebEditor.document.selection.createRange().pasteHTML(html) ; 
}