table-operations.js

Typo3, 开源里边最强大的

				alert(TableOperations.I18N["Please click into some cell"]);
				break;
			}
			var tr = cell.parentElement;
			var no_cols = prompt(TableOperations.I18N["How many columns would you like to merge?"], 2);
			if (!no_cols) break;
			var no_rows = prompt(TableOperations.I18N["How many rows would you like to merge?"], 2);
			if (!no_rows) break;
			var cell_index = cell.cellIndex;
			while (no_rows-- > 0) {
				td = tr.cells[cell_index];
				cells = [td];
				for (var i = 1; i < no_cols; ++i) {
					td = td.nextSibling;
					if (!td) break;
					cells.push(td);
				}
				rows[tablePartsIndex[tr.parentNode.tagName.toLowerCase()]].push(cells);
				tr = tr.nextSibling;
				if (!tr) break;
			}
		}
		for (var k = tableParts.length; --k >= 0;) {
			var cellHTML = "";
			for (var i = 0; i < rows[k].length; ++i) {
					// i && (cellHTML += "<br />");
				var cells = rows[k][i];
				if(!cells) continue;
				for (var j=0; j < cells.length; ++j) {
					// j && (cellHTML += "&nbsp;");
				var cell = cells[j];
				cellHTML += cell.innerHTML;
				if(i || j) {
					if(cell.parentNode.cells.length == 1) cell.parentNode.parentNode.removeChild(cell.parentNode);
						else cell.parentNode.removeChild(cell);
				}
				}
			}
			try {
				var td = rows[k][0][0];
				td.innerHTML = cellHTML;
				td.rowSpan = rows[k].length;
				td.colSpan = rows[k][0].length;
				editor.selectNodeContents(td);
			} catch(e) { }
		}
		
		editor.forceRedraw();
		editor.focusEditor();
		break;

		// PROPERTIES
	    case "TO-table-prop":
		this.dialogTableProperties();
		break;
	    case "TO-row-prop":
		this.dialogRowCellProperties(false);
		break;
	    case "TO-cell-prop":
		this.dialogRowCellProperties(true);
		break;
	    case "TO-toggle-borders":
		var tables = editor._doc.getElementsByTagName("table");
		if (tables.length != 0) {
			editor.borders = true;
			for (var ix=0; ix < tables.length; ix++) editor.borders = editor.borders && /htmlarea-showtableborders/.test(tables[ix].className);
			for (ix=0; ix < tables.length; ix++) {
				if (!editor.borders) HTMLArea._addClass(tables[ix],'htmlarea-showtableborders');
					else HTMLArea._removeClass(tables[ix],'htmlarea-showtableborders');
			}
		}
		break;
	    default:
		alert("Button [" + button_id + "] not yet implemented");
	}
};

TableOperations.getLength = function(value) {
	var len = parseInt(value);
	if (isNaN(len)) len = "";
	return len;
};

// Applies the style found in "params" to the given element.
TableOperations.processStyle = function(params,element) {
	var style = element.style;
	for (var i in params) {
		var val = params[i];
		switch (i) {
		    case "f_st_backgroundColor":
			style.backgroundColor = val;
			break;
		    case "f_st_color":
			style.color = val;
			break;
		    case "f_st_backgroundImage":
			if (/\S/.test(val)) {
				style.backgroundImage = "url(" + val + ")";
			} else {
				style.backgroundImage = "";
			}
			break;
		    case "f_st_borderWidth":
		    	if (/\S/.test(val)) {
				style.borderWidth = val + "px";
			} else {
				style.borderWidth = "";
			}
			if (params["f_st_borderStyle"] == "none") style.borderWidth = "0px";
			if (params["f_st_borderStyle"] == "not set") style.borderWidth = "";
			break;
		    case "f_st_borderStyle":
			style.borderStyle = (val != "not set") ? val : "";
			break;
		    case "f_st_borderColor":
			style.borderColor = val;
			break;
		    case "f_st_borderCollapse":
			style.borderCollapse = val ? "collapse" : "";
			break;
		    case "f_st_width":
			if (/\S/.test(val)) {
				style.width = val + params["f_st_widthUnit"];
			} else {
				style.width = "";
			}
			break;
		    case "f_st_height":
			if (/\S/.test(val)) {
				style.height = val + params["f_st_heightUnit"];
			} else {
				style.height = "";
			}
			break;
		    case "f_st_textAlign":
			if (val == "character") {
				var ch = params["f_st_textAlignChar"];
				if (ch == '"') {
					ch = '\\"';
				}
				style.textAlign = '"' + ch + '"';
			} else {
				style.textAlign = (val != "not set") ? val : "";
			}
			break;
		    case "f_st_vertAlign":
			style.verticalAlign = (val != "not set") ? val : "";
			break;
		    case "f_st_float":
			if (HTMLArea.is_ie) { 
				style.styleFloat = (val != "not set") ? val : "";
			} else { 
				style.cssFloat = (val != "not set") ? val : "";
			}
			break;
// 		    case "f_st_margin":
// 			style.margin = val + "px";
// 			break;
// 		    case "f_st_padding":
// 			style.padding = val + "px";
// 			break;
		}
	}
};

// Returns an HTML element for a widget that allows color selection.  That is,
// a button that contains the given color, if any, and when pressed will popup
// the sooner-or-later-to-be-rewritten select_color.html dialog allowing user
// to select some color.  If a color is selected, an input field with the name
// "f_st_"+name will be updated with the color value in #123456 format.
TableOperations.createColorButton = function(w, doc, editor, color, name) {
	if (!color) {
		color = "";
	} else if (!/#/.test(color)) {
		color = HTMLArea._colorToRgb(color);
	}

	var df = doc.createElement("span");
 	var field = doc.createElement("input");
	field.type = "hidden";
	df.appendChild(field);
 	field.name = "f_st_" + name;
 	field.id = "f_st_" + name;
	field.value = color;
	var button = doc.createElement("span");
	button.className = "buttonColor";
	df.appendChild(button);
	var span = doc.createElement("span");
	span.className = "chooser";
	span.style.backgroundColor = color;
	button.appendChild(span);
	button.onmouseover = function() { if (!this.disabled) this.className += " buttonColor-hilite"; };
	button.onmouseout = function() { if (!this.disabled) this.className = "buttonColor"; };
	span.onclick = function() {
		if (this.parentNode.disabled) return false;
		var selectColorPlugin = editor.plugins.SelectColor;
		if (selectColorPlugin) selectColorPlugin = selectColorPlugin.instance;
		if (selectColorPlugin) {
			selectColorPlugin.dialogSelectColor("color", span, field, w);
		} else { 
			editor._popupDialog("select_color.html", function(color) {
				if (color) {
					span.style.backgroundColor = "#" + color;
					field.value = "#" + color;
				}
			}, color, 200, 182, w);
		}
	};
	var span2 = doc.createElement("span");
	span2.innerHTML = "&#x00d7;";
	span2.className = "nocolor";
	span2.title = TableOperations.I18N["Unset color"];
	button.appendChild(span2);
	span2.onmouseover = function() { if (!this.parentNode.disabled) this.className += " nocolor-hilite"; };
	span2.onmouseout = function() { if (!this.parentNode.disabled) this.className = "nocolor"; };
	span2.onclick = function() {
		span.style.backgroundColor = "";
		field.value = "";
	};
	return df;
};
TableOperations.buildTitle = function(doc,i18n,content,title) {
	var div = doc.createElement("div");
	div.className = "title";
	div.innerHTML = i18n[title];
	content.appendChild(div);
	doc.title = i18n[title];
};
TableOperations.buildDescriptionFieldset = function(doc,el,i18n,content) {
	var fieldset = doc.createElement("fieldset");
	TableOperations.insertLegend(doc, i18n, fieldset, "Description");
	TableOperations.insertSpace(doc, fieldset);
	var f_caption = "";
	var capel = el.getElementsByTagName("caption")[0];
	if (capel) f_caption = capel.innerHTML;
	TableOperations.buildInput(doc, el, i18n, fieldset, "f_caption", "Caption:", "Description of the nature of the table", "", "", f_caption, "fr", "value", "");
	TableOperations.insertSpace(doc, fieldset);
	TableOperations.buildInput(doc, el, i18n, fieldset, "f_summary", "Summary:", "Summary of the table purpose and structure", "", "", el.summary, "fr", "value", "");
	TableOperations.insertSpace(doc, fieldset);
	content.appendChild(fieldset);
};
TableOperations.buildRowGroupFieldset = function(w,doc,editor,el,i18n,content) {
	var fieldset = doc.createElement("fieldset");
	TableOperations.insertLegend(doc, i18n, fieldset, "Row group");
	TableOperations.insertSpace(doc, fieldset);
	selected = el.parentNode.tagName.toLowerCase();
	var selectScope = TableOperations.buildSelectField(doc, el, i18n, fieldset, "f_rowgroup", "Row group:", "fr", "", "Table section", ["Table body", "Table header", "Table footer"], ["tbody", "thead", "tfoot"], new RegExp((selected ? selected : "tbody"), "i"));
	TableOperations.insertSpace(doc, fieldset);
	content.appendChild(fieldset);
};
TableOperations.buildCellTypeFieldset = function(w,doc,editor,el,i18n,content) {
	var fieldset = doc.createElement("fieldset");
	TableOperations.insertLegend(doc, i18n, fieldset, "Cell Type and Scope");
	TableOperations.insertSpace(doc, fieldset);
	var ul = doc.createElement("ul");
	fieldset.appendChild(ul);
	var li = doc.createElement("li");
	ul.appendChild(li);
	var selectType = TableOperations.buildSelectField(doc, el, i18n, li, "f_cell_type", "Type of cell", "fr", "", "Specifies the type of cell", ["Normal", "Header"], ["td", "th"], new RegExp(el.tagName.toLowerCase(), "i"));
	selectType.onchange = function() { TableOperations.setStyleOptions(doc, editor, el, i18n, this); };
	var li = doc.createElement("li");
	ul.appendChild(li);
	selected = el.scope.toLowerCase();
	(selected.match(/([^\s]*)\s/)) && (selected = RegExp.$1);
	var selectScope = TableOperations.buildSelectField(doc, el, i18n, li, "f_scope", "Scope", "fr", "", "Scope of header cell", ["Not set", "scope_row", "scope_column", "scope_rowgroup"], ["not set", "row", "col", "rowgroup"], new RegExp((selected ? selected : "not set"), "i"));
	TableOperations.insertSpace(doc, fieldset);
	content.appendChild(fieldset);
};
TableOperations.getCssLabelsClasses = function(cssArray,i18n,tagName,selectedIn) {
	var cssLabels = new Array();
	var cssClasses = new Array();
	cssLabels[0] = i18n["Default"];
	cssClasses[0] = "none";
	var selected = selectedIn;
	var cls = selected.split(" ");
	var nonReservedClassName = false;
	for (var ia = cls.length; ia > 0;) {
		if(!HTMLArea.reservedClassNames.test(cls[--ia])) {
			selected = cls[ia];
			nonReservedClassName = true;
			break;
		}
	}
	var found = false, i = 1, cssClass;
	if(cssArray[tagName]) {
		for(cssClass in cssArray[tagName]){
			if(cssClass != "none") {
				cssLabels[i] = cssArray[tagName][cssClass];
				cssClasses[i] = cssClass;
				if(cssClass == selected) found = true;
				i++;
			} else {
				cssLabels[0] = cssArray[tagName][cssClass];
			}
		}
	}
	if(cssArray['all']){
		for(cssClass in cssArray['all']){
			cssLabels[i] = cssArray['all'][cssClass];
			cssClasses[i] = cssClass;
			if(cssClass == selected) found = true;
			i++;
		}
	}
	if(selected && nonReservedClassName && !found) {
		cssLabels[i] = i18n["Undefined"];
		cssClasses[i] = selected;
	}
	return [cssLabels, cssClasses, selected];
};
TableOperations.setStyleOptions = function(doc,editor,el,i18n,typeSelect) {
	var tagName = typeSelect.value;
	var select = doc.getElementById("f_class");
	if (!select) return false;
	var obj = editor.config.customSelects["DynamicCSS-class"];
	if (obj && obj.loaded) var cssArray = obj.cssArray;
		else return false;
	var cssLabelsClasses = TableOperations.getCssLabelsClasses(cssArray,i18n,tagName,el.className);
	var options = cssLabelsClasses[0];
	var values = cssLabelsClasses[1];
	var selected = cssLabelsClasses[2];
	var selectedReg = new RegExp((selected ? selected : "none"), "i");
	while(select.options.length>0) select.options[select.length-1] = null;
	select.selectedIndex = 0;
	var option;
	for (var i = 0; i < options.length; ++i) {
		option = doc.createElement("option");
		select.appendChild(option);
		option.value = values[i];
		option.appendChild(doc.createTextNode(options[i]));
		option.selected = selectedReg.test(values[i]);
	}
	if(select.options.length>1) select.disabled = false;