[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   * @fileOverview The "sourcearea" plugin. It registers the "source" editing

   8   *        mode, which displays the raw data being edited in the editor.

   9   */
  10  
  11  CKEDITOR.plugins.add( 'sourcearea',
  12  {
  13      requires : [ 'editingblock' ],
  14  
  15      init : function( editor )
  16      {
  17          var sourcearea = CKEDITOR.plugins.sourcearea,
  18              win = CKEDITOR.document.getWindow();
  19  
  20          editor.on( 'editingBlockReady', function()
  21              {
  22                  var textarea,
  23                      onResize;
  24  
  25                  editor.addMode( 'source',
  26                      {
  27                          load : function( holderElement, data )
  28                          {
  29                              if ( CKEDITOR.env.ie && CKEDITOR.env.version < 8 )
  30                                  holderElement.setStyle( 'position', 'relative' );
  31  
  32                              // Create the source area <textarea>.

  33                              editor.textarea = textarea = new CKEDITOR.dom.element( 'textarea' );
  34                              textarea.setAttributes(
  35                                  {
  36                                      dir : 'ltr',
  37                                      tabIndex : CKEDITOR.env.webkit ? -1 : editor.tabIndex,
  38                                      'role' : 'textbox',
  39                                      'aria-label' : editor.lang.editorTitle.replace( '%1', editor.name )
  40                                  });
  41                              textarea.addClass( 'cke_source' );
  42                              textarea.addClass( 'cke_enable_context_menu' );
  43  
  44                              var styles =
  45                              {
  46                                  // IE7 has overflow the <textarea> from wrapping table cell.

  47                                  width    : CKEDITOR.env.ie7Compat ?  '99%' : '100%',
  48                                  height    : '100%',
  49                                  resize    : 'none',
  50                                  outline    : 'none',
  51                                  'text-align' : 'left'
  52                              };
  53  
  54                              // Having to make <textarea> fixed sized to conque the following bugs:

  55                              // 1. The textarea height/width='100%' doesn't constraint to the 'td' in IE6/7.

  56                              // 2. Unexpected vertical-scrolling behavior happens whenever focus is moving out of editor

  57                              // if text content within it has overflowed. (#4762)

  58                              if ( CKEDITOR.env.ie )
  59                              {
  60                                  onResize = function()
  61                                  {
  62                                      // Holder rectange size is stretched by textarea,

  63                                      // so hide it just for a moment.

  64                                      textarea.hide();
  65                                      textarea.setStyle( 'height', holderElement.$.clientHeight + 'px' );
  66                                      textarea.setStyle( 'width', holderElement.$.clientWidth + 'px' );
  67                                      // When we have proper holder size, show textarea again.

  68                                      textarea.show();
  69                                  };
  70  
  71                                  editor.on( 'resize', onResize );
  72                                  win.on( 'resize', onResize );
  73                                  setTimeout( onResize, 0 );
  74                              }
  75                              else
  76                              {
  77                                  // By some yet unknown reason, we must stop the

  78                                  // mousedown propagation for the textarea,

  79                                  // otherwise it's not possible to place the caret

  80                                  // inside of it (non IE).

  81                                  textarea.on( 'mousedown', function( evt )
  82                                      {
  83                                          evt.data.stopPropagation();
  84                                      } );
  85                              }
  86  
  87                              // Reset the holder element and append the

  88                              // <textarea> to it.

  89                              holderElement.setHtml( '' );
  90                              holderElement.append( textarea );
  91                              textarea.setStyles( styles );
  92  
  93                              editor.fire( 'ariaWidget', textarea );
  94  
  95                              textarea.on( 'blur', function()
  96                                  {
  97                                      editor.focusManager.blur();
  98                                  });
  99  
 100                              textarea.on( 'focus', function()
 101                                  {
 102                                      editor.focusManager.focus();
 103                                  });
 104  
 105                              // The editor data "may be dirty" after this point.

 106                              editor.mayBeDirty = true;
 107  
 108                              // Set the <textarea> value.

 109                              this.loadData( data );
 110  
 111                              var keystrokeHandler = editor.keystrokeHandler;
 112                              if ( keystrokeHandler )
 113                                  keystrokeHandler.attach( textarea );
 114  
 115                              setTimeout( function()
 116                              {
 117                                  editor.mode = 'source';
 118                                  editor.fire( 'mode' );
 119                              },
 120                              ( CKEDITOR.env.gecko || CKEDITOR.env.webkit ) ? 100 : 0 );
 121                          },
 122  
 123                          loadData : function( data )
 124                          {
 125                              textarea.setValue( data );
 126                              editor.fire( 'dataReady' );
 127                          },
 128  
 129                          getData : function()
 130                          {
 131                              return textarea.getValue();
 132                          },
 133  
 134                          getSnapshotData : function()
 135                          {
 136                              return textarea.getValue();
 137                          },
 138  
 139                          unload : function( holderElement )
 140                          {
 141                              textarea.clearCustomData();
 142                              editor.textarea = textarea = null;
 143  
 144                              if ( onResize )
 145                              {
 146                                  editor.removeListener( 'resize', onResize );
 147                                  win.removeListener( 'resize', onResize );
 148                              }
 149  
 150                              if ( CKEDITOR.env.ie && CKEDITOR.env.version < 8 )
 151                                  holderElement.removeStyle( 'position' );
 152                          },
 153  
 154                          focus : function()
 155                          {
 156                              textarea.focus();
 157                          }
 158                      });
 159              });
 160  
 161          editor.addCommand( 'source', sourcearea.commands.source );
 162  
 163          if ( editor.ui.addButton )
 164          {
 165              editor.ui.addButton( 'Source',
 166                  {
 167                      label : editor.lang.source,
 168                      command : 'source'
 169                  });
 170          }
 171  
 172          editor.on( 'mode', function()
 173              {
 174                  editor.getCommand( 'source' ).setState(
 175                      editor.mode == 'source' ?
 176                          CKEDITOR.TRISTATE_ON :
 177                          CKEDITOR.TRISTATE_OFF );
 178              });
 179      }
 180  });
 181  
 182  /**

 183   * Holds the definition of commands an UI elements included with the sourcearea

 184   * plugin.

 185   * @example

 186   */
 187  CKEDITOR.plugins.sourcearea =
 188  {
 189      commands :
 190      {
 191          source :
 192          {
 193              modes : { wysiwyg:1, source:1 },
 194              editorFocus : false,
 195  
 196              exec : function( editor )
 197              {
 198                  if ( editor.mode == 'wysiwyg' )
 199                      editor.fire( 'saveSnapshot' );
 200                  editor.getCommand( 'source' ).setState( CKEDITOR.TRISTATE_DISABLED );
 201                  editor.setMode( editor.mode == 'source' ? 'wysiwyg' : 'source' );
 202              },
 203  
 204              canUndo : false
 205          }
 206      }
 207  };