📄 editor.js

📁 wince 电池电源管理文件集 wince 电池电源管理文件集
💻 JS
字号:

function Point(iX, iY)
{
    this.x = iX;
    this.y = iY;
}
var getXY = function( aTag )
{
	try
	{
	
		var oTmp = aTag;
		var pt = new Point(0,0);
		do 
		{
			pt.x += oTmp.offsetLeft;
			pt.y += oTmp.offsetTop;
			oTmp = oTmp.offsetParent;
		} while(oTmp.tagName!="BODY");

	}
	catch (e)
	{
		//
	}
	return pt;
}

var class_EditorMode = function ()
{
	this.NONE = -1;
	this.HTML = 0;
	this.CODE = 1;
	this.UBB = 2;
	this.Preview = 3;
}

var EditorMode = new class_EditorMode;

function class_editor( objectName,editobj,textobj,width,height,onEndEditEvent,subutobj )
{
	var ie = (navigator.appVersion.indexOf("MSIE")!=-1);//IE 
	var ff = (navigator.userAgent.indexOf("Firefox")!=-1);//Firefox

	var editObject = document.getElementById(editobj);
	var editLayerObject = document.getElementById(editobj + "Layer");
	var editHeaderObject = document.getElementById(editobj + "Header");
	var editFooterObject = document.getElementById(editobj + "Footer");
	var editToHTMLObject = document.getElementById(editobj + "ToHTMLMode");
	var editToCODEObject = document.getElementById(editobj + "ToCODEMode");
	var textObject = document.getElementById(textobj);
	var normalObject = document.getElementById("NormalEditor");
	var advObject = document.getElementById("AdvEditor");

	var defaultBody = ''
		+ '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Transitional.dtd">'
		+ '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>blank_page</title><meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" /></head><body style="margin:5px;padding:0px;font-size:9pt;font-family:Verdana"></body></html>';
	var previewBody = "<link type=\"text/css\" rel=\"stylesheet\" href=\"./css/preview.css\"/>";

	this.resizeEnabled = false;

	this.imageDirectory = "./editor/images/";
	this.pluginDirectory = "./editor/plugins/";

	this.Enabled = ( textObject != null && editObject != null && editLayerObject != null );

	if( this.Enabled )
	{
		if ( width != null )
		{
			if ( width.indexOf("%") < 0 )
			{
				if ( !isNaN(parseInt(width)) )
				{
					editLayerObject.style.width = width + "px";
					editObject.style.width = width + "px";
				}
			}else
			{
				ditLayerObject.style.width = width;
				editObject.style.width = width;
			}
		}
		if ( height != null && !isNaN(parseInt(height)) ) editObject.style.height = height + "px";
	}

	this.EditObject = editObject;
	
	this.onEndEdit = onEndEditEvent;

	this.Mode = EditorMode.NONE;

	this.isIE = document.body.innerText != null;

	var Toolbars = {
		"Bold":"加粗文本" ,
		"Italic":"倾斜文本",
		"Underline":"下划线文本",
		"Justifyleft":"左对齐",
		"Justifycenter":"居中对齐",
		"Justifyright":"右对齐",
		"justifyfull":"默认对齐",
		"InsertOrderedList":"编号列表",
		"InsertUnorderedList":"默认列表",
		"Outdent":"减少缩进",
		"Indent":"增加缩进",
		"ForeColor":"前景颜色",
		"BackColor":"背景颜色",
		"FontName":"字体",
		"FontSize":"字号",
		"InsertImage":"添加图片",
		"CreateLink":"创建链接",
		"CreateHidden":"加入条件帖子内容",
		"CreateCode":"高亮代码块"
	};

	this.createToolbar = function ( toolbarstyle )
	{
		editHeaderObject.innerHTML = "";
		var imgdir = this.imageDirectory;
		if ( toolbarstyle != null ) imgdir += "/" + toolbarstyle;
		for ( var itemName in Toolbars )
		{
			editHeaderObject.innerHTML += "<img src='" + imgdir + "/" + itemName + ".gif' alt='" + Toolbars[itemName] + "' class='toolbarButton' onmouseout='" + objectName + ".BlurToolbar(this)' onmouseover='" + objectName + ".FocusToolbar(this)' onmouseup='" + objectName + ".FocusToolbar(this)' onmousedown='" + objectName + ".ClickToolbar(this);' onclick='" + objectName + ".eventSend(\"" + itemName + "\",this)' />";
		}
	}

	var XHTMLEncode = function ( innerhtml )
	{
		var str = innerhtml.replace(/\<strong\>/gi,"<b>");
		str = str.replace(/\<\/strong\>/gi,"</b>");
		str = str.replace(/\<B\>/g,"<b>");
		str = str.replace(/\<\/B\>/g,"</b>");
		str = str.replace(/\<P\>/g,"<p>");
		str = str.replace(/\<\/P\>/g,"</p>");
		str = str.replace(/\<BR\>/gi,"<br/>");
		str = str.replace(/\<P\>&nbsp;\<\/P\>/gi,"");
		str = str.replace(/\<P\>\<\/P\>/gi,"");
		str = str.replace(/\<P\>\<BR\>\<\/P\>/gi,"<br/>");
		return str;
	}

	this.BlurToolbar = function ( obj )
	{
		obj.className = "toolbarButton";
	}

	this.FocusToolbar = function ( obj )
	{
		obj.className = "toolbarButton_Over";
	}
	
	this.ClickToolbar = function ( obj )
	{
		obj.className = "toolbarButton_Down";
	}

	this.eventSend = function ( command,obj,value )
	{
		if ( !this.Enabled || this.Mode != EditorMode.HTML ) return false;

		switch ( command )
		{
			case "CreateLink":
				if ( this.isIE ) 
				{
					editObject.contentWindow.document.execCommand(command, true, value);
					editObject.focus();
				}else
				{
					DMFPostx.appendLink(obj);
				}
				break;
			case "InsertImage":
				DMFPostx.appendImage(obj);
				break;
			case "BackColor":
				DMFPostx.setColor(obj,command);
				break;
			case "ForeColor":
				DMFPostx.setColor(obj,command);
				break;
			case "FontName":
				DMFPostx.ShowFontSelect(obj,command);
				break;
			case "FontSize":
				DMFPostx.setFontSize(obj);
				break;
			case "CreateCode":
				DMFPostx.appendCode(obj);
				break;
			case "CreateHidden":
				DMFPostx.appendHidden(obj);
				break;
			default:
				editObject.contentWindow.document.execCommand(command, true, value);
				editObject.focus();
				break;
		}
	}
	
	this.insertText = function ( text )
	{
		var t = editObject.clientWidth;
		editObject.contentWindow.document.body.innerHTML += text;
		editObject.width = t + "px";
	}

	this.BeginEdit = function ()
	{
		if ( !this.Enabled || this.Mode == EditorMode.HTML ) return false;

		try
		{
			editObject.contentWindow.document.designMode = "On";
			editObject.contentWindow.document.isContentEditable = true;
			if ( this.Mode == EditorMode.CODE ) 
			{
				textObject.value = editObject.contentWindow.document.body.innerText != null ? editObject.contentWindow.document.body.innerText : editObject.contentWindow.document.body.textContent;
				editObject.contentWindow.document.body.innerHTML = textObject.value;
			}
			else
			{
				editObject.contentWindow.document.open();
				editObject.contentWindow.document.write(defaultBody);
				editObject.contentWindow.document.close();
 				editObject.contentWindow.document.body.innerHTML = textObject.value;
				this.createToolbar();
			}
			if ( this.isIE )
			{
			//	editObject.contentWindow.document.body.setCapture();
				editObject.contentWindow.document.body.onkeydown = this.Press;
			}else
			{ 
				editObject.contentWindow.addEventListener("keydown", this.Press, false);
			}
			this.Mode = EditorMode.HTML;
			editToCODEObject.disabled = false;
			editToHTMLObject.disabled = true;
			normalObject.style.display = "none";
			normalObject.innerHTML = "";
			return true;
		}catch(e)
		{
			advObject.style.display = "none";
			advObject.innerHTML = "";
			normalObject.style.display = "block";
			this.Enabled = false;
		}
	}

	var sendProgress = function ()
	{
		var submitButton = $(subutobj);
		submitButton.click();
	}

	this.Press = function (e)
	{
		var event = editObject.contentWindow.event != null ? editObject.contentWindow.event : e;
		switch( event.keyCode )
		{
			case 13:
				if ( event.ctrlKey ) sendProgress();
				break;
			case 83:
				if (event.altKey) sendProgress();
				break;
			default:
				break;
		}
	}

	this.Preview = function ()
	{
		if ( !this.Enabled || this.Mode == EditorMode.Preview ) return false;
		textObject.value = editObject.contentWindow.document.body.innerHTML;
		var tc = textObject.value;
		if ( this.Mode == EditorMode.CODE ) 
		{
			tc = editObject.contentWindow.document.body.innerText != null ? editObject.contentWindow.document.body.innerText : editObject.contentWindow.document.body.textContent;
		}
		editObject.contentWindow.document.designMode = "Off";
		editObject.contentWindow.document.body.innerHTML = tc;
		this.Mode = EditorMode.Preview;
		return true;
	}
	this.codeMode = function ()
	{
		if ( !this.Enabled || this.Mode == EditorMode.CODE ) return false;
		textObject.value = new class_Transform(editObject.contentWindow.document).toXHTML();
		editObject.contentWindow.document.designMode = "On";
		editObject.contentWindow.document.ContentEditable = true;
		if( editObject.contentWindow.document.body.innerText != null )
		{
			editObject.contentWindow.document.body.innerText = textObject.value;
		}else
		{
			editObject.contentWindow.document.body.textContent = textObject.value;
		}
		this.Mode = EditorMode.CODE;
		editToHTMLObject.disabled = false;
		editToCODEObject.disabled = true;
		return true;
	}

	this.Dispose = function ()
	{
		if ( !this.Enabled ) return false;
		//this.codeMode();
		//this.BeginEdit();
		if ( !this.Mode == EditorMode.CODE )
		{
			textObject.value = new class_Transform(editObject.contentWindow.document).toXHTML();
		}else
		{
			if( editObject.contentWindow.document.body.innerText != null )
			{
				textObject.value = editObject.contentWindow.document.body.innerText;
			}else
			{
				textObject.value = editObject.contentWindow.document.body.textContent;
			}
		}
		editObject.contentWindow.document.designMode = "Off";
		if( this.onEndEdit != null ) return this.onEndEdit();
		return true;
	}

	this.reSizeOver = function ( event )
	{
		if ( !this.Enabled || !ie ) return false;		
		ex = event.clientX;
		ey = event.clientY;
		var oxy = getXY(editLayerObject);
		var ow = editLayerObject.clientWidth;
		var oh = editLayerObject.clientHeight;
		if( ex > (oxy.x + ow - 15) && ey > (oxy.y + oh - 15) && ex < (oxy.x + ow + 15) && ey < (oxy.y + oh + 15) )
		{
			editLayerObject.style.cursor = "nw-resize";
			if( this.resizeEnabled && event.button == 1 && (ex - oxy.x - 20) > width && (ey - oxy.y - 60) > height ) 
			{
				editObject.style.width = (ex - oxy.x - 20) + "px";
				editObject.style.height = (ey - oxy.y - 50 - editFooterObject.clientHeight - editHeaderObject.clientHeight) + "px";
				editLayerObject.style.width = (ex - oxy.x) + "px";
				editLayerObject.style.height = (ey - oxy.y) + "px";
			}
		}else
		{
			if( !this.resizeEnabled ) editLayerObject.style.cursor = "";
		}
	}

	this.reSizeStart = function ( event )
	{
		if ( !this.Enabled || !ie ) return false;
		this.resizeEnabled = true;
	}

	this.reSizeEnd = function ( event )
	{
		if ( !this.Enabled || !ie ) return false;
		this.resizeEnabled = false;
		editLayerObject.style.cursor = "default";
	}

	this.createUI = function ()
	{	}
}

var DMFEditor;
var wi,hi;
var eo,to;

function InitProcess(editorobj,textobj,w,h,subutobj)
{
	DMFEditor = new class_editor("DMFEditor",editorobj,textobj,w,h,null,subutobj);
	DMFEditor.BeginEdit();	
}

function drawEditor( editorobj )
{
		var html = '<div id="editorLayer" class="editorLayer" onselectstart="return false"><div id="editorHeader" class="editorHeader" onselectstart="return false"></div><iframe id="editor" frameborder="no" class="editor" width="100%"></iframe><div id="editorFooter" class="editorFooter" onselectstart="return false"><input id="editorToHTMLMode" type="button" value="所见即所得模式" class="button" disabled="disabled" onclick="' + editorobj + '.BeginEdit()"/><input id="editorToCODEMode" type="button" value="普通模式" class="button" disabled="disabled" onclick="' + editorobj + '.codeMode()"/></div></div>';
		document.write(html);
}

function endEdit()
{
	try
	{
		DMFEditor.Dispose();
	}catch(e){}
}

function loadEmotes()
{

	for ( var i = 1;i <= 24 ; i ++ )
	{
		document.write("<img src=\"./image/emote/" + i + ".gif\" alt=\"\" onclick=\"DMFEditor.insertText('<img src=\\'' + this.src + '\\'/>')\" style=\"margin:3px;cursor:pointer\"/>");
		if ( i % 4 == 0 ) document.write("<br/>");
	}
}
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -