[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 Justify commands.

   8   */
   9  
  10  (function()
  11  {
  12  	function getState( editor, path )
  13      {
  14          var firstBlock = path.block || path.blockLimit;
  15  
  16          if ( !firstBlock || firstBlock.getName() == 'body' )
  17              return CKEDITOR.TRISTATE_OFF;
  18  
  19          return ( getAlignment( firstBlock, editor.config.useComputedState ) == this.value ) ?
  20              CKEDITOR.TRISTATE_ON :
  21              CKEDITOR.TRISTATE_OFF;
  22      }
  23  
  24  	function getAlignment( element, useComputedState )
  25      {
  26          useComputedState = useComputedState === undefined || useComputedState;
  27  
  28          var align = useComputedState ?
  29              element.getComputedStyle( 'text-align' ) :
  30              element.getStyle( 'text-align' ) || element.getAttribute( 'align' ) || '';
  31  
  32          align && ( align = align.replace( /-moz-|-webkit-|start|auto/i, '' ) );
  33  
  34          !align && useComputedState && ( align = element.getComputedStyle( 'direction' ) == 'rtl' ? 'right' : 'left' );
  35  
  36          return align;
  37      }
  38  
  39  	function onSelectionChange( evt )
  40      {
  41          var command = evt.editor.getCommand( this.name );
  42          command.state = getState.call( this, evt.editor, evt.data.path );
  43          command.fire( 'state' );
  44      }
  45  
  46  	function justifyCommand( editor, name, value )
  47      {
  48          this.name = name;
  49          this.value = value;
  50  
  51          var classes = editor.config.justifyClasses;
  52          if ( classes )
  53          {
  54              switch ( value )
  55              {
  56                  case 'left' :
  57                      this.cssClassName = classes[0];
  58                      break;
  59                  case 'center' :
  60                      this.cssClassName = classes[1];
  61                      break;
  62                  case 'right' :
  63                      this.cssClassName = classes[2];
  64                      break;
  65                  case 'justify' :
  66                      this.cssClassName = classes[3];
  67                      break;
  68              }
  69  
  70              this.cssClassRegex = new RegExp( '(?:^|\\s+)(?:' + classes.join( '|' ) + ')(?=$|\\s)' );
  71          }
  72      }
  73  
  74      justifyCommand.prototype = {
  75          exec : function( editor )
  76          {
  77              var selection = editor.getSelection(),
  78                  enterMode = editor.config.enterMode;
  79  
  80              if ( !selection )
  81                  return;
  82  
  83              var bookmarks = selection.createBookmarks(),
  84                  ranges = selection.getRanges( true );
  85  
  86              var cssClassName = this.cssClassName,
  87                  iterator,
  88                  block;
  89  
  90              var useComputedState = editor.config.useComputedState;
  91              useComputedState = useComputedState === undefined || useComputedState;
  92  
  93              for ( var i = ranges.length - 1 ; i >= 0 ; i-- )
  94              {
  95                  iterator = ranges[ i ].createIterator();
  96                  iterator.enlargeBr = enterMode != CKEDITOR.ENTER_BR;
  97  
  98                  while ( ( block = iterator.getNextParagraph() ) )
  99                  {
 100                      block.removeAttribute( 'align' );
 101                      block.removeStyle( 'text-align' );
 102  
 103                      // Remove any of the alignment classes from the className.

 104                      var className = cssClassName && ( block.$.className =
 105                          CKEDITOR.tools.ltrim( block.$.className.replace( this.cssClassRegex, '' ) ) );
 106  
 107                      var apply =
 108                          ( this.state == CKEDITOR.TRISTATE_OFF ) &&
 109                          ( !useComputedState || ( getAlignment( block, true ) != this.value ) );
 110  
 111                      if ( cssClassName )
 112                      {
 113                          // Append the desired class name.

 114                          if ( apply )
 115                              block.addClass( cssClassName );
 116                          else if ( !className )
 117                              block.removeAttribute( 'class' );
 118                      }
 119                      else if ( apply )
 120                          block.setStyle( 'text-align', this.value );
 121                  }
 122  
 123              }
 124  
 125              editor.focus();
 126              editor.forceNextSelectionCheck();
 127              selection.selectBookmarks( bookmarks );
 128          }
 129      };
 130  
 131      CKEDITOR.plugins.add( 'justify',
 132      {
 133          init : function( editor )
 134          {
 135              var left = new justifyCommand( editor, 'justifyleft', 'left' ),
 136                  center = new justifyCommand( editor, 'justifycenter', 'center' ),
 137                  right = new justifyCommand( editor, 'justifyright', 'right' ),
 138                  justify = new justifyCommand( editor, 'justifyblock', 'justify' );
 139  
 140              editor.addCommand( 'justifyleft', left );
 141              editor.addCommand( 'justifycenter', center );
 142              editor.addCommand( 'justifyright', right );
 143              editor.addCommand( 'justifyblock', justify );
 144  
 145              editor.ui.addButton( 'JustifyLeft',
 146                  {
 147                      label : editor.lang.justify.left,
 148                      command : 'justifyleft'
 149                  } );
 150              editor.ui.addButton( 'JustifyCenter',
 151                  {
 152                      label : editor.lang.justify.center,
 153                      command : 'justifycenter'
 154                  } );
 155              editor.ui.addButton( 'JustifyRight',
 156                  {
 157                      label : editor.lang.justify.right,
 158                      command : 'justifyright'
 159                  } );
 160              editor.ui.addButton( 'JustifyBlock',
 161                  {
 162                      label : editor.lang.justify.block,
 163                      command : 'justifyblock'
 164                  } );
 165  
 166              editor.on( 'selectionChange', CKEDITOR.tools.bind( onSelectionChange, left ) );
 167              editor.on( 'selectionChange', CKEDITOR.tools.bind( onSelectionChange, right ) );
 168              editor.on( 'selectionChange', CKEDITOR.tools.bind( onSelectionChange, center ) );
 169              editor.on( 'selectionChange', CKEDITOR.tools.bind( onSelectionChange, justify ) );
 170          },
 171  
 172          requires : [ 'domiterator' ]
 173      });
 174  })();
 175  
 176  CKEDITOR.tools.extend( CKEDITOR.config,
 177      {
 178          justifyClasses : null
 179      } );