Skip to content

Commit

Permalink
Merge branch 't/11133'
Browse files Browse the repository at this point in the history
  • Loading branch information
@oleq
oleq committed Jan 2, 2014
2 parents ac305ed + 9a7d261 commit 77ab1b8
Show file tree
Hide file tree
Showing 2 changed files with 142 additions and 126 deletions.
1 change: 1 addition & 0 deletions CHANGES.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ CKEditor 4 Changelog
* [#11350](http://dev.ckeditor.com/ticket/11350): The default value of [`config.contentsCss`](http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-contentsCss) is affected by [`CKEDITOR.getUrl`](http://docs.ckeditor.com/#!/api/CKEDITOR-method-getUrl).
* [#11097](http://dev.ckeditor.com/ticket/11097): Improved the [Autogrow](http://ckeditor.com/addon/autogrow) plugin performance when dealing with very big tables.
* [#11290](http://dev.ckeditor.com/ticket/11290): Removed redundant code in `sourcedialog` plugin.
* [#11133](http://dev.ckeditor.com/ticket/11133): [Pagebreak](http://ckeditor.com/addon/pagebreak) becomes editable if pasted.

## CKEditor 4.3.1

Expand Down
267 changes: 141 additions & 126 deletions plugins/pagebreak/plugin.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,137 +7,152 @@
* @fileOverview Horizontal Page Break
*/

// Register a plugin named "pagebreak".
CKEDITOR.plugins.add( 'pagebreak', {
requires: 'fakeobjects',

lang: 'af,ar,bg,bn,bs,ca,cs,cy,da,de,el,en,en-au,en-ca,en-gb,eo,es,et,eu,fa,fi,fo,fr,fr-ca,gl,gu,he,hi,hr,hu,id,is,it,ja,ka,km,ko,ku,lt,lv,mk,mn,ms,nb,nl,no,pl,pt,pt-br,ro,ru,si,sk,sl,sq,sr,sr-latn,sv,th,tr,ug,uk,vi,zh,zh-cn', // %REMOVE_LINE_CORE%
icons: 'pagebreak,pagebreak-rtl', // %REMOVE_LINE_CORE%
hidpi: true, // %REMOVE_LINE_CORE%
onLoad: function() {
var cssStyles = [
'{',
'background: url(' + CKEDITOR.getUrl( this.path + 'images/pagebreak.gif' ) + ') no-repeat center center;',
'clear: both;',
'width:100%; _width:99.9%;',
'border-top: #999999 1px dotted;',
'border-bottom: #999999 1px dotted;',
'padding:0;',
'height: 5px;',
'cursor: default;',
'}'
].join( '' ).replace( /;/g, ' !important;' ); // Increase specificity to override other styles, e.g. block outline.

// Add the style that renders our placeholder.
CKEDITOR.addCss( 'div.cke_pagebreak' + cssStyles );
},
init: function( editor ) {
if ( editor.blockless )
return;

// Register the command.
editor.addCommand( 'pagebreak', CKEDITOR.plugins.pagebreakCmd );

// Register the toolbar button.
editor.ui.addButton && editor.ui.addButton( 'PageBreak', {
label: editor.lang.pagebreak.toolbar,
command: 'pagebreak',
toolbar: 'insert,70'
} );

// Opera needs help to select the page-break.
CKEDITOR.env.opera && editor.on( 'contentDom', function() {
editor.document.on( 'click', function( evt ) {
var target = evt.data.getTarget();
if ( target.is( 'div' ) && target.hasClass( 'cke_pagebreak' ) )
editor.getSelection().selectElement( target );
'use strict';

( function() {
// Register a plugin named "pagebreak".
CKEDITOR.plugins.add( 'pagebreak', {
requires: 'fakeobjects',
lang: 'af,ar,bg,bn,bs,ca,cs,cy,da,de,el,en,en-au,en-ca,en-gb,eo,es,et,eu,fa,fi,fo,fr,fr-ca,gl,gu,he,hi,hr,hu,id,is,it,ja,ka,km,ko,ku,lt,lv,mk,mn,ms,nb,nl,no,pl,pt,pt-br,ro,ru,si,sk,sl,sq,sr,sr-latn,sv,th,tr,ug,uk,vi,zh,zh-cn', // %REMOVE_LINE_CORE%
icons: 'pagebreak,pagebreak-rtl', // %REMOVE_LINE_CORE%
hidpi: true, // %REMOVE_LINE_CORE%
onLoad: function() {
var cssStyles = (
'background:url(' + CKEDITOR.getUrl( this.path + 'images/pagebreak.gif' ) + ') no-repeat center center;' +
'clear:both;' +
'width:100%;' +
'border-top:#999 1px dotted;' +
'border-bottom:#999 1px dotted;' +
'padding:0;' +
'height:5px;' +
'cursor:default;'
).replace( /;/g, ' !important;' ); // Increase specificity to override other styles, e.g. block outline.

// Add the style that renders our placeholder.
CKEDITOR.addCss( 'div.cke_pagebreak{' + cssStyles + '}' );
},

init: function( editor ) {
if ( editor.blockless )
return;

// Register the command.
editor.addCommand( 'pagebreak', CKEDITOR.plugins.pagebreakCmd );

// Register the toolbar button.
editor.ui.addButton && editor.ui.addButton( 'PageBreak', {
label: editor.lang.pagebreak.toolbar,
command: 'pagebreak',
toolbar: 'insert,70'
} );
} );
},

afterInit: function( editor ) {
var label = editor.lang.pagebreak.alt;

// Register a filter to displaying placeholders after mode change.
var dataProcessor = editor.dataProcessor,
dataFilter = dataProcessor && dataProcessor.dataFilter,
htmlFilter = dataProcessor && dataProcessor.htmlFilter;

if ( htmlFilter ) {
htmlFilter.addRules( {
attributes: {
'class': function( value, element ) {
var className = value.replace( 'cke_pagebreak', '' );
if ( className != value ) {
var span = CKEDITOR.htmlParser.fragment.fromHtml( '<span style="display: none;">&nbsp;</span>' ).children[ 0 ];
element.children.length = 0;
element.add( span );
var attrs = element.attributes;
delete attrs[ 'aria-label' ];
delete attrs.contenteditable;
delete attrs.title;

// Opera needs help to select the page-break.
CKEDITOR.env.opera && editor.on( 'contentDom', function() {
editor.document.on( 'click', function( evt ) {
var target = evt.data.getTarget();
if ( target.is( 'div' ) && target.hasClass( 'cke_pagebreak' ) )
editor.getSelection().selectElement( target );
} );
} );
},

afterInit: function( editor ) {
// Register a filter to displaying placeholders after mode change.
var dataProcessor = editor.dataProcessor,
dataFilter = dataProcessor && dataProcessor.dataFilter,
htmlFilter = dataProcessor && dataProcessor.htmlFilter,
styleRegex = /page-break-after\s*:\s*always/i,
childStyleRegex = /display\s*:\s*none/i;

function upcastPageBreak( element ) {
CKEDITOR.tools.extend( element.attributes, attributesSet( editor.lang.pagebreak.alt ), true );

element.children.length = 0;
}

if ( htmlFilter ) {
htmlFilter.addRules( {
attributes: {
'class': function( value, element ) {
var className = value.replace( 'cke_pagebreak', '' );
if ( className != value ) {
var span = CKEDITOR.htmlParser.fragment.fromHtml( '<span style="display: none;">&nbsp;</span>' ).children[ 0 ];
element.children.length = 0;
element.add( span );
var attrs = element.attributes;
delete attrs[ 'aria-label' ];
delete attrs.contenteditable;
delete attrs.title;
}
return className;
}
return className;
}
}
}, { applyToAll: true, priority: 5 } );
}

if ( dataFilter ) {
dataFilter.addRules( {
elements: {
div: function( element ) {
var attributes = element.attributes,
style = attributes && attributes.style,
child = style && element.children.length == 1 && element.children[ 0 ],
childStyle = child && ( child.name == 'span' ) && child.attributes.style;

if ( childStyle && ( /page-break-after\s*:\s*always/i ).test( style ) && ( /display\s*:\s*none/i ).test( childStyle ) ) {
attributes.contenteditable = "false";
attributes[ 'class' ] = "cke_pagebreak";
attributes[ 'data-cke-display-name' ] = "pagebreak";
attributes[ 'aria-label' ] = label;
attributes[ 'title' ] = label;

element.children.length = 0;
}, { applyToAll: true, priority: 5 } );
}

if ( dataFilter ) {
dataFilter.addRules( {
elements: {
div: function( element ) {
// The "internal form" of a pagebreak is pasted from clipboard.
// ACF may have distorted the HTML because "internal form" is
// different than "data form". Make sure that element remains valid
// by re-upcasting it (#11133).
if ( element.attributes[ 'data-cke-pagebreak' ] )
upcastPageBreak( element );

// Check for "data form" of the pagebreak. If both element and
// descendants match, convert them to internal form.
else if ( styleRegex.test( element.attributes.style ) ) {
var child = element.children[ 0 ];

if ( child && child.name == 'span' && childStyleRegex.test( child.attributes.style ) )
upcastPageBreak( element );
}
}
}
}
} );
} );
}
}
}
} );

// TODO Much probably there's no need to expose this object as public object.

CKEDITOR.plugins.pagebreakCmd = {
exec: function( editor ) {
var label = editor.lang.pagebreak.alt;

// Create read-only element that represents a print break.
var pagebreak = CKEDITOR.dom.element.createFromHtml( '<div style="' +
'page-break-after: always;"' +
'contenteditable="false" ' +
'title="' + label + '" ' +
'aria-label="' + label + '" ' +
'data-cke-display-name="pagebreak" ' +
'class="cke_pagebreak">' +
'</div>', editor.document );

editor.insertElement( pagebreak );
},
context: 'div',
allowedContent: {
div: {
styles: '!page-break-after'
} );

// TODO Much probably there's no need to expose this object as public object.
CKEDITOR.plugins.pagebreakCmd = {
exec: function( editor ) {
// Create read-only element that represents a print break.
var pagebreak = editor.document.createElement( 'div', {
attributes: attributesSet( editor.lang.pagebreak.alt )
} );

editor.insertElement( pagebreak );
},
span: {
match: function( element ) {
var parent = element.parent;
return parent && parent.name == 'div' && parent.styles[ 'page-break-after' ];
context: 'div',
allowedContent: {
div: {
styles: '!page-break-after'
},
styles: 'display'
}
},
requiredContent: 'div{page-break-after}'
};
span: {
match: function( element ) {
var parent = element.parent;
return parent && parent.name == 'div' && parent.styles[ 'page-break-after' ];
},
styles: 'display'
}
},
requiredContent: 'div{page-break-after}'
};

// Returns an object representing all the attributes
// of the "internal form" of the pagebreak element.
function attributesSet( label ) {
return {
'aria-label': label,
'class': 'cke_pagebreak',
contenteditable: 'false',
'data-cke-display-name': 'pagebreak',
'data-cke-pagebreak': 1,
style: 'page-break-after: always',
title: label
};
}
} )();

0 comments on commit 77ab1b8

Please sign in to comment.