[Summary view] [Print] [Text view]

   1  /*

   2  Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.

   3  For licensing, see LICENSE.html or http://ckeditor.com/license

   4  */
   5  
   6  /**

   7   * @file Forms Plugin

   8   */
   9  
  10  CKEDITOR.plugins.add( 'forms',
  11  {
  12      init : function( editor )
  13      {
  14          var lang = editor.lang;
  15  
  16          editor.addCss(
  17              'form' +
  18              '{' +
  19                  'border: 1px dotted #FF0000;' +
  20                  'padding: 2px;' +
  21              '}\n' );
  22  
  23          editor.addCss(
  24              'img.cke_hidden' +
  25              '{' +
  26                  'background-image: url(' + CKEDITOR.getUrl( this.path + 'images/hiddenfield.gif' ) + ');' +
  27                  'background-position: center center;' +
  28                  'background-repeat: no-repeat;' +
  29                  'border: 1px solid #a9a9a9;' +
  30                  'width: 16px !important;' +
  31                  'height: 16px !important;' +
  32              '}' );
  33  
  34          // All buttons use the same code to register. So, to avoid

  35          // duplications, let's use this tool function.

  36          var addButtonCommand = function( buttonName, commandName, dialogFile )
  37          {
  38              editor.addCommand( commandName, new CKEDITOR.dialogCommand( commandName ) );
  39  
  40              editor.ui.addButton( buttonName,
  41                  {
  42                      label : lang.common[ buttonName.charAt(0).toLowerCase() + buttonName.slice(1) ],
  43                      command : commandName
  44                  });
  45              CKEDITOR.dialog.add( commandName, dialogFile );
  46          };
  47  
  48          var dialogPath = this.path + 'dialogs/';
  49          addButtonCommand( 'Form',            'form',            dialogPath + 'form.js' );
  50          addButtonCommand( 'Checkbox',        'checkbox',        dialogPath + 'checkbox.js' );
  51          addButtonCommand( 'Radio',            'radio',        dialogPath + 'radio.js' );
  52          addButtonCommand( 'TextField',        'textfield',    dialogPath + 'textfield.js' );
  53          addButtonCommand( 'Textarea',        'textarea',        dialogPath + 'textarea.js' );
  54          addButtonCommand( 'Select',            'select',        dialogPath + 'select.js' );
  55          addButtonCommand( 'Button',            'button',        dialogPath + 'button.js' );
  56          addButtonCommand( 'ImageButton',    'imagebutton',    CKEDITOR.plugins.getPath('image') + 'dialogs/image.js' );
  57          addButtonCommand( 'HiddenField',    'hiddenfield',    dialogPath + 'hiddenfield.js' );
  58  
  59          // If the "menu" plugin is loaded, register the menu items.

  60          if ( editor.addMenuItems )
  61          {
  62              editor.addMenuItems(
  63                  {
  64                      form :
  65                      {
  66                          label : lang.form.menu,
  67                          command : 'form',
  68                          group : 'form'
  69                      },
  70  
  71                      checkbox :
  72                      {
  73                          label : lang.checkboxAndRadio.checkboxTitle,
  74                          command : 'checkbox',
  75                          group : 'checkbox'
  76                      },
  77  
  78                      radio :
  79                      {
  80                          label : lang.checkboxAndRadio.radioTitle,
  81                          command : 'radio',
  82                          group : 'radio'
  83                      },
  84  
  85                      textfield :
  86                      {
  87                          label : lang.textfield.title,
  88                          command : 'textfield',
  89                          group : 'textfield'
  90                      },
  91  
  92                      hiddenfield :
  93                      {
  94                          label : lang.hidden.title,
  95                          command : 'hiddenfield',
  96                          group : 'hiddenfield'
  97                      },
  98  
  99                      imagebutton :
 100                      {
 101                          label : lang.image.titleButton,
 102                          command : 'imagebutton',
 103                          group : 'imagebutton'
 104                      },
 105  
 106                      button :
 107                      {
 108                          label : lang.button.title,
 109                          command : 'button',
 110                          group : 'button'
 111                      },
 112  
 113                      select :
 114                      {
 115                          label : lang.select.title,
 116                          command : 'select',
 117                          group : 'select'
 118                      },
 119  
 120                      textarea :
 121                      {
 122                          label : lang.textarea.title,
 123                          command : 'textarea',
 124                          group : 'textarea'
 125                      }
 126                  });
 127          }
 128  
 129          // If the "contextmenu" plugin is loaded, register the listeners.

 130          if ( editor.contextMenu )
 131          {
 132              editor.contextMenu.addListener( function( element )
 133                  {
 134                      if ( element && element.hasAscendant( 'form', true ) && !element.isReadOnly() )
 135                          return { form : CKEDITOR.TRISTATE_OFF };
 136                  });
 137  
 138              editor.contextMenu.addListener( function( element )
 139                  {
 140                      if ( element && !element.isReadOnly() )
 141                      {
 142                          var name = element.getName();
 143  
 144                          if ( name == 'select' )
 145                              return { select : CKEDITOR.TRISTATE_OFF };
 146  
 147                          if ( name == 'textarea' )
 148                              return { textarea : CKEDITOR.TRISTATE_OFF };
 149  
 150                          if ( name == 'input' )
 151                          {
 152                              var type = element.getAttribute( 'type' );
 153  
 154                              if ( type == 'text' || type == 'password' )
 155                                  return { textfield : CKEDITOR.TRISTATE_OFF };
 156  
 157                              if ( type == 'button' || type == 'submit' || type == 'reset' )
 158                                  return { button : CKEDITOR.TRISTATE_OFF };
 159  
 160                              if ( type == 'checkbox' )
 161                                  return { checkbox : CKEDITOR.TRISTATE_OFF };
 162  
 163                              if ( type == 'radio' )
 164                                  return { radio : CKEDITOR.TRISTATE_OFF };
 165  
 166                              if ( type == 'image' )
 167                                  return { imagebutton : CKEDITOR.TRISTATE_OFF };
 168                          }
 169  
 170                          if ( name == 'img' && element.getAttribute( '_cke_real_element_type' ) == 'hiddenfield' )
 171                              return { hiddenfield : CKEDITOR.TRISTATE_OFF };
 172                      }
 173                  });
 174          }
 175  
 176          editor.on( 'doubleclick', function( evt )
 177              {
 178                  var element = evt.data.element;
 179  
 180                  if ( element.is( 'form' ) )
 181                      evt.data.dialog = 'form';
 182                  else if ( element.is( 'select' ) )
 183                      evt.data.dialog = 'select';
 184                  else if ( element.is( 'textarea' ) )
 185                      evt.data.dialog = 'textarea';
 186                  else if ( element.is( 'img' ) && element.getAttribute( '_cke_real_element_type' ) == 'hiddenfield' )
 187                      evt.data.dialog = 'hiddenfield';
 188                  else if ( element.is( 'input' ) )
 189                  {
 190                      var type = element.getAttribute( 'type' );
 191  
 192                      switch ( type )
 193                      {
 194                          case 'text' : case 'password':
 195                              evt.data.dialog = 'textfield';
 196                              break;
 197                          case 'button' : case 'submit' : case 'reset' :
 198                              evt.data.dialog = 'button';
 199                              break;
 200                          case 'checkbox' :
 201                              evt.data.dialog = 'checkbox';
 202                              break;
 203                          case 'radio' :
 204                              evt.data.dialog = 'radio';
 205                              break;
 206                          case 'image' :
 207                              evt.data.dialog = 'imagebutton';
 208                              break;
 209                      }
 210                  }
 211              });
 212      },
 213  
 214      afterInit : function( editor )
 215      {
 216          var dataProcessor = editor.dataProcessor,
 217              htmlFilter = dataProcessor && dataProcessor.htmlFilter,
 218              dataFilter = dataProcessor && dataProcessor.dataFilter;
 219  
 220          // Cleanup certain IE form elements default values.

 221          if ( CKEDITOR.env.ie )
 222          {
 223              htmlFilter && htmlFilter.addRules(
 224              {
 225                  elements :
 226                  {
 227                      input : function( input )
 228                      {
 229                          var attrs = input.attributes,
 230                              type = attrs.type;
 231                          if ( type == 'checkbox' || type == 'radio' )
 232                              attrs.value == 'on' && delete attrs.value;
 233                      }
 234                  }
 235              } );
 236          }
 237  
 238          if ( dataFilter )
 239          {
 240              dataFilter.addRules(
 241              {
 242                  elements :
 243                  {
 244                      input : function( element )
 245                      {
 246                          if ( element.attributes.type == 'hidden' )
 247                              return editor.createFakeParserElement( element, 'cke_hidden', 'hiddenfield' );
 248                      }
 249                  }
 250              } );
 251          }
 252      },
 253      requires : [ 'image', 'fakeobjects' ]
 254  } );
 255  
 256  if ( CKEDITOR.env.ie )
 257  {
 258      CKEDITOR.dom.element.prototype.hasAttribute = function( name )
 259      {
 260          var $attr = this.$.attributes.getNamedItem( name );
 261  
 262          if ( this.getName() == 'input' )
 263          {
 264              switch ( name )
 265              {
 266                  case 'class' :
 267                      return this.$.className.length > 0;
 268                  case 'checked' :
 269                      return !!this.$.checked;
 270                  case 'value' :
 271                      var type = this.getAttribute( 'type' );
 272                      if ( type == 'checkbox' || type == 'radio' )
 273                          return this.$.value != 'on';
 274                      break;
 275                  default:
 276              }
 277          }
 278  
 279          return !!( $attr && $attr.specified );
 280      };
 281  }