skins/ckeditor/_source/plugins/pagebreak/plugin.js

   1 /*
   2 Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.
   3 For licensing, see LICENSE.html or http://ckeditor.com/license
   4 */
   5
   6 /**
   7  * @file Horizontal Page Break
   8  */
   9
  10 // Register a plugin named "pagebreak".
  11 CKEDITOR.plugins.add( 'pagebreak',
  12 {
  13         init : function( editor )
  14         {
  15                 // Register the command.
  16                 editor.addCommand( 'pagebreak', CKEDITOR.plugins.pagebreakCmd );
  17
  18                 // Register the toolbar button.
  19                 editor.ui.addButton( 'PageBreak',
  20                         {
  21                                 label : editor.lang.pagebreak,
  22                                 command : 'pagebreak'
  23                         });
  24
  25                 var cssStyles = [
  26                         '{' ,
  27                                 'background: url(' + CKEDITOR.getUrl( this.path + 'images/pagebreak.gif' ) + ') no-repeat center center;' ,
  28                                 'clear: both;' ,
  29                                 'width:100%; _width:99.9%;' ,
  30                                 'border-top: #999999 1px dotted;' ,
  31                                 'border-bottom: #999999 1px dotted;' ,
  32                                 'padding:0;' ,
  33                                 'height: 5px;' ,
  34                                 'cursor: default;' ,
  35                         '}'
  36                         ].join( '' ).replace(/;/g, ' !important;' );    // Increase specificity to override other styles, e.g. block outline.
  37
  38                 // Add the style that renders our placeholder.
  39                 editor.addCss( 'div.cke_pagebreak' + cssStyles );
  40
  41                 // Opera needs help to select the page-break.
  42                 CKEDITOR.env.opera && editor.on( 'contentDom', function()
  43                 {
  44                         editor.document.on( 'click', function( evt )
  45                         {
  46                                 var target = evt.data.getTarget();
  47                                 if ( target.is( 'div' ) && target.hasClass( 'cke_pagebreak')  )
  48                                         editor.getSelection().selectElement( target );
  49                         });
  50                 });
  51         },
  52
  53         afterInit : function( editor )
  54         {
  55                 var label = editor.lang.pagebreakAlt;
  56
  57                 // Register a filter to displaying placeholders after mode change.
  58                 var dataProcessor = editor.dataProcessor,
  59                         dataFilter = dataProcessor && dataProcessor.dataFilter,
  60                         htmlFilter = dataProcessor && dataProcessor.htmlFilter;
  61
  62                 if ( htmlFilter )
  63                 {
  64                         htmlFilter.addRules(
  65                         {
  66                                 attributes : {
  67                                         'class' : function( value, element )
  68                                         {
  69                                                 var className =  value.replace( 'cke_pagebreak', '' );
  70                                                 if ( className != value )
  71                                                 {
  72                                                         var span = CKEDITOR.htmlParser.fragment.fromHtml( '<span style="display: none;">&nbsp;</span>' );
  73                                                         element.children.length = 0;
  74                                                         element.add( span );
  75                                                         var attrs = element.attributes;
  76                                                         delete attrs[ 'aria-label' ];
  77                                                         delete attrs.contenteditable;
  78                                                         delete attrs.title;
  79                                                 }
  80                                                 return className;
  81                                         }
  82                                 }
  83                         }, 5 );
  84                 }
  85
  86                 if ( dataFilter )
  87                 {
  88                         dataFilter.addRules(
  89                                 {
  90                                         elements :
  91                                         {
  92                                                 div : function( element )
  93                                                 {
  94                                                         var attributes = element.attributes,
  95                                                                 style = attributes && attributes.style,
  96                                                                 child = style && element.children.length == 1 && element.children[ 0 ],
  97                                                                 childStyle = child && ( child.name == 'span' ) && child.attributes.style;
  98
  99                                                         if ( childStyle && ( /page-break-after\s*:\s*always/i ).test( style ) && ( /display\s*:\s*none/i ).test( childStyle ) )
 100                                                         {
 101                                                                 attributes.contenteditable = "false";
 102                                                                 attributes[ 'class' ] = "cke_pagebreak";
 103                                                                 attributes[ 'data-cke-display-name' ] = "pagebreak";
 104                                                                 attributes[ 'aria-label' ] = label;
 105                                                                 attributes[ 'title' ] = label;
 106
 107                                                                 element.children.length = 0;
 108                                                         }
 109                                                 }
 110                                         }
 111                                 });
 112                 }
 113         },
 114
 115         requires : [ 'fakeobjects' ]
 116 });
 117
 118 CKEDITOR.plugins.pagebreakCmd =
 119 {
 120         exec : function( editor )
 121         {
 122                 var label = editor.lang.pagebreakAlt;
 123
 124                 // Create read-only element that represents a print break.
 125                 var pagebreak = CKEDITOR.dom.element.createFromHtml(
 126                         '<div style="' +
 127                         'page-break-after: always;"' +
 128                         'contenteditable="false" ' +
 129                         'title="'+ label + '" ' +
 130                         'aria-label="'+ label + '" ' +
 131                         'data-cke-display-name="pagebreak" ' +
 132                         'class="cke_pagebreak">' +
 133                         '</div>', editor.document );
 134
 135                 var ranges = editor.getSelection().getRanges( true );
 136
 137                 editor.fire( 'saveSnapshot' );
 138
 139                 for ( var range, i = ranges.length - 1 ; i >= 0; i-- )
 140                 {
 141                         range = ranges[ i ];
 142
 143                         if ( i < ranges.length -1 )
 144                                 pagebreak = pagebreak.clone( true );
 145
 146                         range.splitBlock( 'p' );
 147                         range.insertNode( pagebreak );
 148                         if ( i == ranges.length - 1 )
 149                         {
 150                                 var next = pagebreak.getNext();
 151                                 range.moveToPosition( pagebreak, CKEDITOR.POSITION_AFTER_END );
 152
 153                                 // If there's nothing or a non-editable block followed by, establish a new paragraph
 154                                 // to make sure cursor is not trapped.
 155                                 if ( !next || next.type == CKEDITOR.NODE_ELEMENT && !next.isEditable() )
 156                                         range.fixBlock( true, editor.config.enterMode == CKEDITOR.ENTER_DIV ? 'div' : 'p'  );
 157
 158                                 range.select();
 159                         }
 160                 }
 161
 162                 editor.fire( 'saveSnapshot' );
 163         }
 164 };