webcit/tiny_mce/plugins/contextmenu/editor_plugin_src.js

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