_source/plugins/placeholder/plugin.js

   1 /*\r
   2 Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.\r
   3 For licensing, see LICENSE.html or http://ckeditor.com/license\r
   4 */\r
   5 \r
   6 /**\r
   7  * @fileOverview The "placeholder" plugin.\r
   8  *\r
   9  */\r
  10 \r
  11 (function()\r
  12 {\r
  13         var placeholderReplaceRegex = /\[\[[^\]]+\]\]/g;\r
  14         CKEDITOR.plugins.add( 'placeholder',\r
  15         {\r
  16                 requires : [ 'dialog' ],\r
  17                 lang : [ 'en' ],\r
  18                 init : function( editor )\r
  19                 {\r
  20                         var lang = editor.lang.placeholder;\r
  21 \r
  22                         editor.addCommand( 'createplaceholder', new CKEDITOR.dialogCommand( 'createplaceholder' ) );\r
  23                         editor.addCommand( 'editplaceholder', new CKEDITOR.dialogCommand( 'editplaceholder' ) );\r
  24 \r
  25                         editor.ui.addButton( 'CreatePlaceholder',\r
  26                         {\r
  27                                 label : lang.toolbar,\r
  28                                 command :'createplaceholder',\r
  29                                 icon : this.path + 'placeholder.gif'\r
  30                         });\r
  31 \r
  32                         if ( editor.addMenuItems )\r
  33                         {\r
  34                                 editor.addMenuGroup( 'placeholder', 20 );\r
  35                                 editor.addMenuItems(\r
  36                                         {\r
  37                                                 editplaceholder :\r
  38                                                 {\r
  39                                                         label : lang.edit,\r
  40                                                         command : 'editplaceholder',\r
  41                                                         group : 'placeholder',\r
  42                                                         order : 1,\r
  43                                                         icon : this.path + 'placeholder.gif'\r
  44                                                 }\r
  45                                         } );\r
  46 \r
  47                                 if ( editor.contextMenu )\r
  48                                 {\r
  49                                         editor.contextMenu.addListener( function( element, selection )\r
  50                                                 {\r
  51                                                         if ( !element || !element.data( 'cke-placeholder' ) )\r
  52                                                                 return null;\r
  53 \r
  54                                                         return { editplaceholder : CKEDITOR.TRISTATE_OFF };\r
  55                                                 } );\r
  56                                 }\r
  57                         }\r
  58 \r
  59                         editor.on( 'doubleclick', function( evt )\r
  60                                 {\r
  61                                         var element = evt.data.element;\r
  62                                         if ( element.data( 'cke-placeholder' ) )\r
  63                                                 evt.data.dialog = 'editplaceholder';\r
  64                                 });\r
  65 \r
  66                         editor.addCss(\r
  67                                 '.cke_placeholder' +\r
  68                                 '{' +\r
  69                                         'background-color: #ffff00;' +\r
  70                                         ( CKEDITOR.env.gecko ? 'cursor: default;' : '' ) +\r
  71                                 '}'\r
  72                         );\r
  73 \r
  74                         editor.on( 'contentDom', function()\r
  75                                 {\r
  76                                         editor.document.getBody().on( 'resizestart', function( evt )\r
  77                                                 {\r
  78                                                         if ( editor.getSelection().getSelectedElement().data( 'cke-placeholder' ) )\r
  79                                                                 evt.data.preventDefault();\r
  80                                                 });\r
  81                                 });\r
  82 \r
  83                         CKEDITOR.dialog.add( 'createplaceholder', this.path + 'dialogs/placeholder.js' );\r
  84                         CKEDITOR.dialog.add( 'editplaceholder', this.path + 'dialogs/placeholder.js' );\r
  85                 },\r
  86                 afterInit : function( editor )\r
  87                 {\r
  88                         var dataProcessor = editor.dataProcessor,\r
  89                                 dataFilter = dataProcessor && dataProcessor.dataFilter,\r
  90                                 htmlFilter = dataProcessor && dataProcessor.htmlFilter;\r
  91 \r
  92                         if ( dataFilter )\r
  93                         {\r
  94                                 dataFilter.addRules(\r
  95                                 {\r
  96                                         text : function( text )\r
  97                                         {\r
  98                                                 return text.replace( placeholderReplaceRegex, function( match )\r
  99                                                         {\r
 100                                                                 return CKEDITOR.plugins.placeholder.createPlaceholder( editor, null, match, 1 );\r
 101                                                         });\r
 102                                         }\r
 103                                 });\r
 104                         }\r
 105 \r
 106                         if ( htmlFilter )\r
 107                         {\r
 108                                 htmlFilter.addRules(\r
 109                                 {\r
 110                                         elements :\r
 111                                         {\r
 112                                                 'span' : function( element )\r
 113                                                 {\r
 114                                                         if ( element.attributes && element.attributes[ 'data-cke-placeholder' ] )\r
 115                                                                 delete element.name;\r
 116                                                 }\r
 117                                         }\r
 118                                 });\r
 119                         }\r
 120                 }\r
 121         });\r
 122 })();\r
 123 \r
 124 CKEDITOR.plugins.placeholder =\r
 125 {\r
 126         createPlaceholder : function( editor, oldElement, text, isGet )\r
 127         {\r
 128                 var element = new CKEDITOR.dom.element( 'span', editor.document );\r
 129                 element.setAttributes(\r
 130                         {\r
 131                                 contentEditable         : 'false',\r
 132                                 'data-cke-placeholder'  : 1,\r
 133                                 'class'                 : 'cke_placeholder'\r
 134                         }\r
 135                 );\r
 136 \r
 137                 text && element.setText( text );\r
 138 \r
 139                 if ( isGet )\r
 140                         return element.getOuterHtml();\r
 141 \r
 142                 if ( oldElement )\r
 143                 {\r
 144                         if ( CKEDITOR.env.ie )\r
 145                         {\r
 146                                 element.insertAfter( oldElement );\r
 147                                 // Some time is required for IE before the element is removed.\r
 148                                 setTimeout( function()\r
 149                                         {\r
 150                                                 oldElement.remove();\r
 151                                                 element.focus();\r
 152                                         }, 10 );\r
 153                         }\r
 154                         else\r
 155                                 element.replace( oldElement );\r
 156                 }\r
 157                 else\r
 158                         editor.insertElement( element );\r
 159         }\r
 160 };\r