﻿/*--
标题：UBB编辑器
设计：王集鹄
博客：http://blog.csdn.net/zswang
日期：2008年10月19日
--*/

if (!Common.scripts["UbbEditor"]) {
	loadCss("/Scripts/UbbEditor.css?version=2008111001");
	Common.scripts["UbbEditor"] = true;
}

function UbbEditor(parent, width, height, maxLength) {
	this.parent = typeof parent == "object" ? parent : document.body;
	this.width = width;
	this.height = height;
	this.maxLength = typeof maxLength == "number" ? maxLength : 0;
	
	this.table_panel = document.createElement("table");
	this.table_panel.className = "UbbEditor";
	this.table_panel.cellPadding = "0px";
	this.table_panel.cellSpacing = "0px";
	this.toolbarHeight = 24;
	this.statusHeight = 24;
	this.parent.appendChild(this.table_panel);
	
	this.tr_toolbar = this.table_panel.insertRow(-1);
	this.td_toolbar = this.tr_toolbar.insertCell(-1);
	this.td_toolbar.style.height = this.toolbarHeight + "px";
	
	this.tr_editor = this.table_panel.insertRow(-1);
	this.td_editor = this.tr_editor.insertCell(-1);
	this.td_editor.className = "td_editor";
	this.td_editor.style.height = (this.height - this.toolbarHeight - this.statusHeight - 4) + "px";

	this.tr_status = this.table_panel.insertRow(-1);
	this.td_status = this.tr_status.insertCell(-1);
	this.td_status.style.height = this.statusHeight + "px";

	this.toolbar = new Toolbar(this.td_toolbar);

	var sizes = [9, 10, 11, 12, 14, 16, 18, 20];
	this.popup_size = new PopupBox(this.parent);
	this.table_size = document.createElement("table");
	this.table_size.style.fontSize = "12px";
	this.table_size.cellSpacing = "6";
	this.table_size.cellPadding = "0";
	this.table_size.border = "0";
	this.table_size.fontFamily = "Verdana,Arial,Helvetica,sans-serif";
	this.tr_size = this.table_size.insertRow(-1);
	this.td_sizes = {};
	var self = this;
	for (var i = 0; i < sizes.length; i++) {
		this.td_sizes[i] = this.tr_size.insertCell(-1);
		with (this.td_sizes[i].style) {
			background = "#FFFFFF";
			border = "1px solid #D4D0C8";
			textAlign = "center";
			cursor = "default";
			height = "18px";
			cursor = "pointer";
		}
		setElementText(this.td_sizes[i], sizes[i] + "px");
		this.td_sizes[i].size = sizes[i] + "px";
		this.td_sizes[i].onclick = function() {
			self.setSelectText("[size=" + this.size + "]" + self.getSelectText() + "[/size]");
			self.popup_size.close();
		}
	}
	this.popup_size.div_box.appendChild(this.table_size);
	
	this.toolbar.addButton("字体大小", "icon fontsize", "css"
		,function () { 
			publics.counter('click_fontsize', location);
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}
			self.popup_size.popup(0, 5, this, "bottom");
		}
	);
	this.toolbar.addSeparator();
	this.toolbar.addButton("粗体", "icon bold", "css"
		,function () { 
			publics.counter('click_bold', location);
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}
			self.setSelectText("[b]" + self.getSelectText() + "[/b]");
		}
	);
	this.toolbar.addButton("斜体", "icon italic", "css"
		,function () { 
			publics.counter('click_italic', location);
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}  
			self.setSelectText("[i]" + self.getSelectText() + "[/i]");
		}
	);
	this.toolbar.addButton("下划线", "icon underline", "css"
		,function () { 
			publics.counter('click_underline', location);
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}  
			self.setSelectText("[u]" + self.getSelectText() + "[/u]");
		}
	);
	this.toolbar.addButton("删除线", "icon strike", "css"
		,function () { 
			publics.counter('click_strike', location);
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}  
			self.setSelectText("[s]" + self.getSelectText() + "[/s]");
		}
	);
	this.toolbar.addSeparator();

	this.toolbar.addButton("表情", "icon face", "css"
		,function () { 
			if (!self.popup_em) {
				self.popup_em = new PopupBox(document.body, 24 * 15, 24 * 6);
				self.table_em = document.createElement("table");
				self.table_em.cellPadding = "0px";
				self.table_em.cellSpacing = "0px";
				self.table_em.className = "table_em";
				for (var j = 0; j < 6; j++) {
					var tr = self.table_em.insertRow(-1);
					for (i = 0; i < 15; i++) {
						var td = tr.insertCell(-1);
						var img = document.createElement("img");
						img.alt = j * 15 + i;
						img.src = "/Images/em/" + img.alt + ".gif";
						img.alt = "[em" + img.alt + "]";
						img.style.cursor = "pointer";
						img.onclick = function () {
							self.setSelectText(this.alt);
							self.popup_em.close();
						}
						td.appendChild(img);
					}
				}
				self.popup_em.div_box.appendChild(self.table_em);
			}
			publics.counter('click_facial', location);
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}
			self.popup_em.popup(0, 24, this);
		}
	);
	
	this.popup_color = new PopupBox(document.body, 4 * 24 - 4, 3 * 24 - 4);
	this.table_color = document.createElement("table");
	this.table_color.cellPadding = "2px";
	this.table_color.cellSpacing = "2px";
	this.table_color.className = "table_color";
	for (j = 0; j < 3; j++) {
		tr = this.table_color.insertRow(-1);
		for (i = 0; i < 4; i++) {
			td = tr.insertCell(-1);
			var div = document.createElement("div");
			div.style.width = "16px";
			div.style.height = "16px";
			div.title = [
				["#cc0000", "#fb940b", "#ffff00", "#00cc00"]
				,["#03c0c6", "#0000ff", "#762ca7", "#ff98bf"]
				,["#cccccc", "#999999", "#ff00ff", "#885418"]
			][j][i];
			div.style.backgroundColor = div.title;
			div.onclick = function () {
				self.setSelectText("[color=" + this.title + "]" + self.getSelectText() + "[/color]");
				self.popup_color.close();
			}
			td.appendChild(div);
		}
	}
	this.popup_color.div_box.appendChild(this.table_color);

	this.toolbar.addButton("颜色", "icon color", "css"
		,function () { 
			publics.counter('click_color', location);
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}
			self.popup_color.popup(0, 24, this);
		}
	);
	
	this.toolbar.addSeparator();
	this.popup_link = new PopupBox(document.body, 300, 26);
	this.input_link = document.createElement("input");
	this.input_link.style.margin = "1px";
	this.input_link.type = "text";
	this.input_link.style.width = "250px";
	this.input_link.onkeydown = function(e) {
		if (!e) e = window.event;
		switch (e.keyCode | e.which | e.charCode) {
			case 13:
				self.button_link.onclick();
				break;
		}
	}
	this.popup_link.div_box.appendChild(this.input_link);

	this.button_link = document.createElement("input");
	this.button_link.style.margin = "1px";
	this.button_link.type = "button";
	this.button_link.style.width = "40px";
	this.button_link.value = "确定";
	this.button_link.onclick = function() {
		self.setSelectText("[" + self.input_link.title + "=" + self.input_link.value + "]" + 
			self.getSelectText() + "[/" + self.input_link.title + "]");
		self.popup_link.close();
	}
	this.popup_link.div_box.appendChild(this.button_link);

	this.toolbar.addButton("链接", "icon link", "css"
		,function () { 
			publics.counter('click_link', location);
			self.input_link.value = "";
			self.input_link.title = "url";
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}
			self.popup_link.popup(0, 24, this);
			self.input_link.focus();
		}
	);

	this.toolbar.addButton("图片", "icon image", "css"
		,function () { 
			publics.counter('click_image', location);
			self.input_link.value = "";
			self.input_link.title = "img";
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}
			self.popup_link.popup(0, 24, this);
			self.input_link.focus();
		}
	);
	
	this.toolbar.addButton("引用", "icon quote", "css"
		,function () { 
			publics.counter('click_quote', location);
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}  
			self.setSelectText("[quote=引用]" + self.getSelectText() + "[/quote]");
		}
	);

	this.toolbar.addButton("代码", "icon code", "css"
		,function () { 
			publics.counter('click_strike', location);
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}  
			self.setSelectText("[code]" + self.getSelectText() + "[/code]");
		}
	);

	this.toolbar.addSeparator();
	this.toolbar.addButton("居中", "icon center", "css"
		,function () { 
			publics.counter('click_center', location);
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}  
			self.setSelectText("[center]" + self.getSelectText() + "[/center]");
		}
	);

	this.toolbar.addButton("居右", "icon right", "css"
		,function () { 
			publics.counter('click_right', location);
			if (document.selection) {
				self.textarea_editor.focus();
				self.range_focus = document.selection.createRange();
			}  
			self.setSelectText("[right]" + self.getSelectText() + "[/right]");
		}
	);

	this.textarea_editor = document.createElement("textarea");
	this.textarea_editor.className = "textarea_editor";
	this.textarea_editor.style.height = this.td_editor.style.height;
	this.textarea_editor.style.width = "100%";
	if (this.maxLength > 0) {
		this.textarea_editor.onpropertychange = function() {
			self.digitalCard.setDigital(self.maxLength - this.value.length);
		}

		if (typeof this.textarea_editor.addEventListener == "function") {
			this.textarea_editor.addEventListener("keypress", this.textarea_editor.onpropertychange, false);
			this.textarea_editor.addEventListener("keyup", this.textarea_editor.onpropertychange, false); 
			this.textarea_editor.addEventListener("input", this.textarea_editor.onpropertychange, false);
		}
	}
	this.td_editor.appendChild(this.textarea_editor);
	
	this.div_left = document.createElement("div");
	this.div_left.className = "div_left";
	this.td_status.appendChild(this.div_left);
	
	
	this.label_disable = document.createElement("label");
	this.label_disable.innerHTML = "禁用UBB";
	this.div_left.appendChild(this.label_disable);
	
	this.checkbox_disable = document.createElement("input");
	this.checkbox_disable.type = "checkbox";
	this.checkbox_disable.className = "checkbox_disable";
	this.label_disable.insertBefore(this.checkbox_disable, this.label_disable.firstChild);

	if (this.maxLength > 0) {
		this.table_right = document.createElement("table");
		this.table_right.className = "table_right";
		this.td_status.appendChild(this.table_right);

		this.tr_hint = this.table_right.insertRow(-1);
		this.td_hintInfo = this.tr_hint.insertCell(-1);
		this.td_hintInfo.innerHTML = "您还可输入";
		this.td_hintDigital = this.tr_hint.insertCell(-1);
		this.td_hintUnit = this.tr_hint.insertCell(-1);
		this.td_hintUnit.innerHTML = "字符";	
		this.digitalCard = new DigitalCard(this.td_hintDigital, this.maxLength);
	}
	if (this.width) this.table_panel.style.width = this.width;
	this.table_panel.style.height = this.height + "px";
}

UbbEditor.prototype.dispose = function() {
	this.disposed = true;
	for (var i in this) {
		if (this[i].disposed) continue;
		if (typeof this[i].dispose == "function") this[i].dispose();
		if (typeof this[i].parentNode == "object")
			this[i].parentNode.removeChild(this[i]);
		delete this[i];
	}
}

UbbEditor.prototype.setSelectText = function(value) {
	setSelectText(this.textarea_editor, value, this.range_focus);
	if (this.maxLength > 0)
		this.digitalCard.setDigital(this.maxLength - this.textarea_editor.value.length);
}

UbbEditor.prototype.getSelectText = function() {
	this.textarea_editor.focus();
	if (this.range_focus && this.range_focus.parentElement() == this.textarea_editor)
		return this.range_focus.text;
	else if (document.selection)
		return document.selection.createRange().text;
	else if (typeof this.textarea_editor.selectionStart != "undefined")
		return this.textarea_editor.value.substring(
			this.textarea_editor.selectionStart, this.textarea_editor.selectionEnd);
}

UbbEditor.prototype.getText = function() {
	return this.textarea_editor.value;
}

UbbEditor.prototype.setText = function(value) {
	this.textarea_editor.value = value;
}

UbbEditor.prototype.getDisable = function() {
	return this.checkbox_disable.checked;
}

UbbEditor.prototype.setDisable = function(value) {
	this.checkbox_disable.checked = value;
}

UbbEditor.prototype.getError = function(title) {
	var error = "";
	var text = this.getText();
	if (strTrim(text) == "")
		error += '"' + title + '" 不能为空。\n';
	if (this.maxLength && text.length > this.maxLength)
		error += '"' + title + '" 不能多于' + this.maxLength + '个字符。\n';
	return error;
}