includes/clientside/tinymce/plugins/contextmenu/editor_plugin_src.js
changeset 1 fe660c52c48f
equal deleted inserted replaced
0:902822492a68 1:fe660c52c48f
       
     1 /**
       
     2  * $Id: editor_plugin_src.js 201 2007-02-12 15:56:56Z spocke $
       
     3  *
       
     4  * @author Moxiecode
       
     5  * @copyright Copyright © 2004-2007, Moxiecode Systems AB, All rights reserved.
       
     6  */
       
     7 
       
     8 /* Import plugin specific language pack */
       
     9 if (!tinyMCE.settings['contextmenu_skip_plugin_css']) {
       
    10 	tinyMCE.loadCSS(tinyMCE.baseURL + "/plugins/contextmenu/css/contextmenu.css");
       
    11 }
       
    12 
       
    13 var TinyMCE_ContextMenuPlugin = {
       
    14 	// Private fields
       
    15 	_contextMenu : null,
       
    16 
       
    17 	getInfo : function() {
       
    18 		return {
       
    19 			longname : 'Context menus',
       
    20 			author : 'Moxiecode Systems AB',
       
    21 			authorurl : 'http://tinymce.moxiecode.com',
       
    22 			infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/contextmenu',
       
    23 			version : tinyMCE.majorVersion + "." + tinyMCE.minorVersion
       
    24 		};
       
    25 	},
       
    26 
       
    27 	initInstance : function(inst) {
       
    28 		// Is not working on MSIE 5.0 or Opera no contextmenu event
       
    29 		if (tinyMCE.isMSIE5_0 && tinyMCE.isOpera)
       
    30 			return;
       
    31 
       
    32 		TinyMCE_ContextMenuPlugin._contextMenu = new TinyMCE_ContextMenu({
       
    33 			commandhandler : "TinyMCE_ContextMenuPlugin._commandHandler",
       
    34 			spacer_image : tinyMCE.baseURL + "/plugins/contextmenu/images/spacer.gif"
       
    35 		});
       
    36 
       
    37 		// Add hide event handles
       
    38 		tinyMCE.addEvent(inst.getDoc(), "click", TinyMCE_ContextMenuPlugin._hideContextMenu);
       
    39 		tinyMCE.addEvent(inst.getDoc(), "keypress", TinyMCE_ContextMenuPlugin._hideContextMenu);
       
    40 		tinyMCE.addEvent(inst.getDoc(), "keydown", TinyMCE_ContextMenuPlugin._hideContextMenu);
       
    41 		tinyMCE.addEvent(document, "click", TinyMCE_ContextMenuPlugin._hideContextMenu);
       
    42 		tinyMCE.addEvent(document, "keypress", TinyMCE_ContextMenuPlugin._hideContextMenu);
       
    43 		tinyMCE.addEvent(document, "keydown", TinyMCE_ContextMenuPlugin._hideContextMenu);
       
    44 
       
    45 		// Attach contextmenu event
       
    46 		if (tinyMCE.isGecko) {
       
    47 			tinyMCE.addEvent(inst.getDoc(), "contextmenu", function(e) {TinyMCE_ContextMenuPlugin._showContextMenu(tinyMCE.isMSIE ? inst.contentWindow.event : e, inst);});
       
    48 		} else
       
    49 			tinyMCE.addEvent(inst.getDoc(), "contextmenu", TinyMCE_ContextMenuPlugin._onContextMenu);
       
    50 	},
       
    51 
       
    52 	// Private plugin internal methods
       
    53 
       
    54 	_onContextMenu : function(e) {
       
    55 		var elm = tinyMCE.isMSIE ? e.srcElement : e.target;
       
    56 		var targetInst, body;
       
    57 
       
    58 		// Find instance
       
    59 		if ((body = tinyMCE.getParentElement(elm, "body")) != null) {
       
    60 			for (var n in tinyMCE.instances) {
       
    61 				var inst = tinyMCE.instances[n];
       
    62 				if (!tinyMCE.isInstance(inst))
       
    63 					continue;
       
    64 
       
    65 				if (body == inst.getBody()) {
       
    66 					targetInst = inst;
       
    67 					break;
       
    68 				}
       
    69 			}
       
    70 
       
    71 			return TinyMCE_ContextMenuPlugin._showContextMenu(tinyMCE.isMSIE ? targetInst.contentWindow.event : e, targetInst);
       
    72 		}
       
    73 	},
       
    74 
       
    75 	_showContextMenu : function(e, inst) {
       
    76 		function getAttrib(elm, name) {
       
    77 			return elm.getAttribute(name) ? elm.getAttribute(name) : "";
       
    78 		}
       
    79 
       
    80 		var x, y, elm, contextMenu;
       
    81 		var pos = tinyMCE.getAbsPosition(inst.iframeElement);
       
    82 
       
    83 		x = tinyMCE.isMSIE ? e.screenX : pos.absLeft + (e.pageX - inst.getBody().scrollLeft);
       
    84 		y = tinyMCE.isMSIE ? e.screenY : pos.absTop + (e.pageY - inst.getBody().scrollTop);
       
    85 		elm = tinyMCE.isMSIE ? e.srcElement : e.target;
       
    86 
       
    87 		contextMenu = this._contextMenu;
       
    88 		contextMenu.inst = inst;
       
    89 
       
    90 		// Mozilla needs some time
       
    91 		window.setTimeout(function () {
       
    92 			var theme = tinyMCE.getParam("theme");
       
    93 
       
    94 			contextMenu.clearAll();
       
    95 			var sel = inst.selection.getSelectedText().length != 0 || elm.nodeName == "IMG";
       
    96 
       
    97 			// Default items
       
    98 			contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/cut.gif", "$lang_cut_desc", "Cut", "", !sel);
       
    99 			contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/copy.gif", "$lang_copy_desc", "Copy", "", !sel);
       
   100 			contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/paste.gif", "$lang_paste_desc", "Paste", "", false);
       
   101 
       
   102 			if (sel || (elm ? (elm.nodeName == 'A' && tinyMCE.getAttrib(elm, 'name') == '') || (elm.nodeName == 'IMG') : false)) {
       
   103 				contextMenu.addSeparator();
       
   104 				contextMenu.addItem(tinyMCE.baseURL + "/themes/advanced/images/link.gif", "$lang_link_desc", inst.hasPlugin("advlink") ? "mceAdvLink" : "mceLink");
       
   105 				contextMenu.addItem(tinyMCE.baseURL + "/themes/advanced/images/unlink.gif", "$lang_unlink_desc", "unlink", "", (elm ? (elm.nodeName != 'A') && (elm.nodeName != 'IMG') : true));
       
   106 			}
       
   107 
       
   108 			// Get element
       
   109 			elm = tinyMCE.getParentElement(elm, "img,table,td" + (inst.hasPlugin("advhr") ? ',hr' : ''));
       
   110 			if (elm) {
       
   111 				switch (elm.nodeName) {
       
   112 					case "IMG":
       
   113 						contextMenu.addSeparator();
       
   114 
       
   115 						// If flash
       
   116 						if (tinyMCE.hasPlugin('flash') && tinyMCE.getAttrib(elm, 'class').indexOf('mceItemFlash') != -1)
       
   117 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/flash/images/flash.gif", "$lang_flash_props", "mceFlash");
       
   118 						else if (tinyMCE.hasPlugin('media') && /mceItem(Flash|ShockWave|WindowsMedia|QuickTime|RealMedia)/.test(tinyMCE.getAttrib(elm, 'class')))
       
   119 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/flash/images/flash.gif", "$lang_media_title", "mceMedia");
       
   120 						else
       
   121 							contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/image.gif", "$lang_image_props_desc", inst.hasPlugin("advimage") ? "mceAdvImage" : "mceImage");
       
   122 						break;
       
   123 
       
   124 					case "HR":
       
   125 						contextMenu.addSeparator();
       
   126 						contextMenu.addItem(tinyMCE.baseURL + "/plugins/advhr/images/advhr.gif", "$lang_insert_advhr_desc", "mceAdvancedHr");
       
   127 						break;
       
   128 
       
   129 					case "TABLE":
       
   130 					case "TD":
       
   131 						// Is table plugin loaded
       
   132 						if (inst.hasPlugin("table")) {
       
   133 							var colspan = (elm.nodeName == "TABLE") ? "" : getAttrib(elm, "colspan");
       
   134 							var rowspan = (elm.nodeName == "TABLE") ? "" : getAttrib(elm, "rowspan");
       
   135 
       
   136 							colspan = colspan == "" ? "1" : colspan;
       
   137 							rowspan = rowspan == "" ? "1" : rowspan;
       
   138 
       
   139 							contextMenu.addSeparator();
       
   140 							contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/cut.gif", "$lang_table_cut_row_desc", "mceTableCutRow");
       
   141 							contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/copy.gif", "$lang_table_copy_row_desc", "mceTableCopyRow");
       
   142 							contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/paste.gif", "$lang_table_paste_row_before_desc", "mceTablePasteRowBefore", "", inst.tableRowClipboard == null);
       
   143 							contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/paste.gif", "$lang_table_paste_row_after_desc", "mceTablePasteRowAfter", "", inst.tableRowClipboard == null);
       
   144 
       
   145 	/*						contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/justifyleft.gif", "$lang_justifyleft_desc", "JustifyLeft", "", false);
       
   146 							contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/justifycenter.gif", "$lang_justifycenter_desc", "JustifyCenter", "", false);
       
   147 							contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/justifyright.gif", "$lang_justifyright_desc", "JustifyRight", "", false);
       
   148 							contextMenu.addItem(tinyMCE.baseURL + "/themes/" + theme + "/images/justifyfull.gif", "$lang_justifyfull_desc", "JustifyFull", "", false);*/
       
   149 							contextMenu.addSeparator();
       
   150 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table.gif", "$lang_table_desc", "mceInsertTable", "insert");
       
   151 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table.gif", "$lang_table_props_desc", "mceInsertTable");
       
   152 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table_cell_props.gif", "$lang_table_cell_desc", "mceTableCellProps");
       
   153 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table_delete.gif", "$lang_table_del", "mceTableDelete");
       
   154 							contextMenu.addSeparator();
       
   155 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table_row_props.gif", "$lang_table_row_desc", "mceTableRowProps");
       
   156 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table_insert_row_before.gif", "$lang_table_row_before_desc", "mceTableInsertRowBefore");
       
   157 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table_insert_row_after.gif", "$lang_table_row_after_desc", "mceTableInsertRowAfter");
       
   158 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table_delete_row.gif", "$lang_table_delete_row_desc", "mceTableDeleteRow");
       
   159 							contextMenu.addSeparator();
       
   160 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table_insert_col_before.gif", "$lang_table_col_before_desc", "mceTableInsertColBefore");
       
   161 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table_insert_col_after.gif", "$lang_table_col_after_desc", "mceTableInsertColAfter");
       
   162 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table_delete_col.gif", "$lang_table_delete_col_desc", "mceTableDeleteCol");
       
   163 							contextMenu.addSeparator();
       
   164 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table_split_cells.gif", "$lang_table_split_cells_desc", "mceTableSplitCells", "", (colspan == "1" && rowspan == "1"));
       
   165 							contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table_merge_cells.gif", "$lang_table_merge_cells_desc", "mceTableMergeCells", "", false);
       
   166 						}
       
   167 						break;
       
   168 				}
       
   169 			}  else {
       
   170 				// Add table specific
       
   171 				if (inst.hasPlugin("table")) {
       
   172 					contextMenu.addSeparator();
       
   173 					contextMenu.addItem(tinyMCE.baseURL + "/plugins/table/images/table.gif", "$lang_table_desc", "mceInsertTable", "insert");
       
   174 				}
       
   175 			}
       
   176 
       
   177 			contextMenu.show(x, y);
       
   178 		}, 10);
       
   179 
       
   180 		// Cancel default handeling
       
   181 		tinyMCE.cancelEvent(e);
       
   182 		return false;
       
   183 	},
       
   184 
       
   185 	_hideContextMenu : function() {
       
   186 		if (TinyMCE_ContextMenuPlugin._contextMenu)
       
   187 			TinyMCE_ContextMenuPlugin._contextMenu.hide();
       
   188 	},
       
   189 
       
   190 	_commandHandler : function(command, value) {
       
   191 		var cm = TinyMCE_ContextMenuPlugin._contextMenu;
       
   192 
       
   193 		cm.hide();
       
   194 
       
   195 		// UI must be true on these
       
   196 		var ui = false;
       
   197 		if (command == "mceInsertTable" || command == "mceTableCellProps" || command == "mceTableRowProps" || command == "mceTableMergeCells")
       
   198 			ui = true;
       
   199 
       
   200 		if (command == "Paste")
       
   201 			value = null;
       
   202 
       
   203 		if (tinyMCE.getParam("dialog_type") == "modal" && tinyMCE.isMSIE) {
       
   204 			// Cell properties will generate access denied error is this isn't done?!
       
   205 			window.setTimeout(function() {
       
   206 				cm.inst.execCommand(command, ui, value);
       
   207 			}, 100);
       
   208 		} else
       
   209 			cm.inst.execCommand(command, ui, value);
       
   210 	}
       
   211 };
       
   212 
       
   213 tinyMCE.addPlugin("contextmenu", TinyMCE_ContextMenuPlugin);
       
   214 
       
   215 // Context menu class
       
   216 
       
   217 function TinyMCE_ContextMenu(settings) {
       
   218 	var doc, self = this;
       
   219 
       
   220 	// Default value function
       
   221 	function defParam(key, def_val) {
       
   222 		settings[key] = typeof(settings[key]) != "undefined" ? settings[key] : def_val;
       
   223 	}
       
   224 
       
   225 	this.isMSIE = (navigator.appName == "Microsoft Internet Explorer");
       
   226 
       
   227 	// Setup contextmenu div
       
   228 	this.contextMenuDiv = document.createElement("div");
       
   229 	this.contextMenuDiv.className = "contextMenu";
       
   230 	this.contextMenuDiv.setAttribute("class", "contextMenu");
       
   231 	this.contextMenuDiv.style.display = "none";
       
   232 	this.contextMenuDiv.style.position = 'absolute';
       
   233 	this.contextMenuDiv.style.zindex = 1000;
       
   234 	this.contextMenuDiv.style.left = '0';
       
   235 	this.contextMenuDiv.style.top = '0';
       
   236 	this.contextMenuDiv.unselectable = "on";
       
   237 
       
   238 	document.body.appendChild(this.contextMenuDiv);
       
   239 
       
   240 	// Setup default values
       
   241 	defParam("commandhandler", "");
       
   242 	defParam("spacer_image", "images/spacer.gif");
       
   243 
       
   244 	this.items = new Array();
       
   245 	this.settings = settings;
       
   246 	this.html = "";
       
   247 
       
   248 	// IE Popup
       
   249 	if (tinyMCE.isMSIE && !tinyMCE.isMSIE5_0 && !tinyMCE.isOpera) {
       
   250 		this.pop = window.createPopup();
       
   251 		doc = this.pop.document;
       
   252 		doc.open();
       
   253 		doc.write('<html><head><link href="' + tinyMCE.baseURL + '/plugins/contextmenu/css/contextmenu.css" rel="stylesheet" type="text/css" /></head><body unselectable="yes" class="contextMenuIEPopup"></body></html>');
       
   254 		doc.close();
       
   255 	}
       
   256 };
       
   257 
       
   258 TinyMCE_ContextMenu.prototype = {
       
   259 	clearAll : function() {
       
   260 		this.html = "";
       
   261 		this.contextMenuDiv.innerHTML = "";
       
   262 	},
       
   263 
       
   264 	addSeparator : function() {
       
   265 		this.html += '<tr class="contextMenuItem"><td class="contextMenuIcon"><img src="' + this.settings['spacer_image'] + '" width="20" height="1" class="contextMenuImage" /></td><td><img class="contextMenuSeparator" width="1" height="1" src="' + this.settings['spacer_image'] + '" /></td></tr>';
       
   266 	},
       
   267 
       
   268 	addItem : function(icon, title, command, value, disabled) {
       
   269 		if (title.charAt(0) == '$')
       
   270 			title = tinyMCE.getLang(title.substring(1));
       
   271 
       
   272 		var onMouseDown = '';
       
   273 		var html = '';
       
   274 
       
   275 		if (tinyMCE.isMSIE && !tinyMCE.isMSIE5_0)
       
   276 			onMouseDown = 'contextMenu.execCommand(\'' + command + '\', \'' + value + '\');return false;';
       
   277 		else
       
   278 			onMouseDown = this.settings['commandhandler'] + '(\'' + command + '\', \'' + value + '\');return false;';
       
   279 
       
   280 		if (icon == "")
       
   281 			icon = this.settings['spacer_image'];
       
   282 
       
   283 		if (!disabled)
       
   284 			html += '<tr class="contextMenuItem">';
       
   285 		else
       
   286 			html += '<tr class="contextMenuItemDisabled">';
       
   287 
       
   288 		html += '<td class="contextMenuIcon"><img src="' + icon + '" width="20" height="20" class="contextMenuImage" /></td>';
       
   289 		html += '<td><div class="contextMenuText">';
       
   290 		html += '<a href="javascript:void(0);" onclick="' + onMouseDown + '" onmousedown="return false;">&#160;';
       
   291 
       
   292 		// Add text
       
   293 		html += title;
       
   294 
       
   295 		html += '&#160;</a>';
       
   296 		html += '</div></td>';
       
   297 		html += '</tr>';
       
   298 
       
   299 		// Add to main
       
   300 		this.html += html;
       
   301 	},
       
   302 
       
   303 	show : function(x, y) {
       
   304 		var vp, width, height, yo;
       
   305 
       
   306 		if (this.html == "")
       
   307 			return;
       
   308 
       
   309 		var html = '';
       
   310 
       
   311 		html += '<a href="#"></a><table border="0" cellpadding="0" cellspacing="0">';
       
   312 		html += this.html;
       
   313 		html += '</table>';
       
   314 
       
   315 		this.contextMenuDiv.innerHTML = html;
       
   316 
       
   317 		// Get dimensions
       
   318 		this.contextMenuDiv.style.display = "block";
       
   319 		width = this.contextMenuDiv.offsetWidth;
       
   320 		height = this.contextMenuDiv.offsetHeight;
       
   321 		this.contextMenuDiv.style.display = "none";
       
   322 
       
   323 		if (tinyMCE.isMSIE && !tinyMCE.isMSIE5_0 && !tinyMCE.isOpera) {
       
   324 			// Setup popup and show
       
   325 			this.pop.document.body.innerHTML = '<div class="contextMenu">' + html + "</div>";
       
   326 			this.pop.document.tinyMCE = tinyMCE;
       
   327 			this.pop.document.contextMenu = this;
       
   328 			this.pop.show(x, y, width, height);
       
   329 		} else {
       
   330 			vp = this.getViewPort();
       
   331 			yo = tinyMCE.isMSIE5_0 ? document.body.scrollTop : self.pageYOffset;
       
   332 			this.contextMenuDiv.style.left = (x > vp.left + vp.width - width ? vp.left + vp.width - width : x) + 'px';
       
   333 			this.contextMenuDiv.style.top = (y > vp.top + vp.height - height ? vp.top + vp.height - height : y) + 'px';
       
   334 			this.contextMenuDiv.style.display = "block";
       
   335 		}
       
   336 	},
       
   337 
       
   338 	getViewPort : function() {
       
   339 		return {
       
   340 			left : self.pageXOffset || self.document.documentElement.scrollLeft || self.document.body.scrollLeft,
       
   341 			top: self.pageYOffset || self.document.documentElement.scrollTop || self.document.body.scrollTop,
       
   342 			width : document.documentElement.offsetWidth || document.body.offsetWidth,
       
   343 			height : self.innerHeight || document.documentElement.clientHeight || document.body.clientHeight
       
   344 		};
       
   345 	},
       
   346 
       
   347 	hide : function() {
       
   348 		if (tinyMCE.isMSIE && !tinyMCE.isMSIE5_0 && !tinyMCE.isOpera)
       
   349 			this.pop.hide();
       
   350 		else
       
   351 			this.contextMenuDiv.style.display = "none";
       
   352 	},
       
   353 
       
   354 	execCommand : function(command, value) {
       
   355 		eval(this.settings['commandhandler'] + "(command, value);");
       
   356 	}
       
   357 };