]>
git.immae.eu Git - perso/Immae/Projets/packagist/ludivine-ckeditor-component.git/blob - plugins/format/plugin.js
2 * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
3 * For licensing, see LICENSE.md or http://ckeditor.com/license
6 CKEDITOR
.plugins
.add( 'format', {
8 // jscs:disable maximumLineLength
9 lang: 'af,ar,az,bg,bn,bs,ca,cs,cy,da,de,de-ch,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,oc,pl,pt,pt-br,ro,ru,si,sk,sl,sq,sr,sr-latn,sv,th,tr,tt,ug,uk,vi,zh,zh-cn', // %REMOVE_LINE_CORE%
10 // jscs:enable maximumLineLength
11 init: function( editor
) {
12 if ( editor
.blockless
)
15 var config
= editor
.config
,
16 lang
= editor
.lang
.format
;
18 // Gets the list of tags from the settings.
19 var tags
= config
.format_tags
.split( ';' );
21 // Create style objects for all defined styles.
25 for ( var i
= 0; i
< tags
.length
; i
++ ) {
27 var style
= new CKEDITOR
.style( config
[ 'format_' + tag
] );
28 if ( !editor
.filter
.customConfig
|| editor
.filter
.check( style
) ) {
30 styles
[ tag
] = style
;
31 styles
[ tag
]._
.enterMode
= editor
.config
.enterMode
;
32 allowedContent
.push( style
);
36 // Hide entire combo when all formats are rejected.
37 if ( stylesCount
=== 0 )
40 editor
.ui
.addRichCombo( 'Format', {
42 title: lang
.panelTitle
,
44 allowedContent: allowedContent
,
47 css: [ CKEDITOR
.skin
.getPath( 'editor' ) ].concat( config
.contentsCss
),
49 attributes: { 'aria-label': lang
.panelTitle
}
53 this.startGroup( lang
.panelTitle
);
55 for ( var tag
in styles
) {
56 var label
= lang
[ 'tag_' + tag
];
58 // Add the tag entry to the panel list.
59 this.add( tag
, styles
[ tag
].buildPreview( label
), label
);
63 onClick: function( value
) {
65 editor
.fire( 'saveSnapshot' );
67 var style
= styles
[ value
],
68 elementPath
= editor
.elementPath();
70 editor
[ style
.checkActive( elementPath
, editor
) ? 'removeStyle' : 'applyStyle' ]( style
);
72 // Save the undo snapshot after all changes are affected. (#4899)
73 setTimeout( function() {
74 editor
.fire( 'saveSnapshot' );
78 onRender: function() {
79 editor
.on( 'selectionChange', function( ev
) {
80 var currentTag
= this.getValue(),
81 elementPath
= ev
.data
.path
;
85 for ( var tag
in styles
) {
86 if ( styles
[ tag
].checkActive( elementPath
, editor
) ) {
87 if ( tag
!= currentTag
)
88 this.setValue( tag
, editor
.lang
.format
[ 'tag_' + tag
] );
93 // If no styles match, just empty it.
101 for ( var name
in styles
) {
102 var style
= styles
[ name
];
104 // Check if that style is enabled in activeFilter.
105 if ( !editor
.activeFilter
.check( style
) )
106 this.hideItem( name
);
111 refresh: function() {
112 var elementPath
= editor
.elementPath();
117 // Check if element path contains 'p' element.
118 if ( !elementPath
.isContextFor( 'p' ) ) {
119 this.setState( CKEDITOR
.TRISTATE_DISABLED
);
123 // Check if there is any available style.
124 for ( var name
in styles
) {
125 if ( editor
.activeFilter
.check( styles
[ name
] ) )
128 this.setState( CKEDITOR
.TRISTATE_DISABLED
);
135 * A list of semicolon-separated style names (by default: tags) representing
136 * the style definition for each entry to be displayed in the Format drop-down list
137 * in the toolbar. Each entry must have a corresponding configuration in a
138 * setting named `'format_(tagName)'`. For example, the `'p'` entry has its
139 * definition taken from [config.format_p](#!/api/CKEDITOR.config-cfg-format_p).
141 * Read more in the [documentation](#!/guide/dev_format)
142 * and see the [SDK sample](http://sdk.ckeditor.com/samples/format.html).
144 * config.format_tags = 'p;h2;h3;pre';
146 * @cfg {String} [format_tags='p;h1;h2;h3;h4;h5;h6;pre;address;div']
147 * @member CKEDITOR.config
149 CKEDITOR
.config
.format_tags
= 'p;h1;h2;h3;h4;h5;h6;pre;address;div';
152 * The style definition to be used to apply the `Normal` format.
154 * Read more in the [documentation](#!/guide/dev_format)
155 * and see the [SDK sample](http://sdk.ckeditor.com/samples/format.html).
157 * config.format_p = { element: 'p', attributes: { 'class': 'normalPara' } };
159 * @cfg {Object} [format_p={ element: 'p' }]
160 * @member CKEDITOR.config
162 CKEDITOR
.config
.format_p
= { element: 'p' };
165 * The style definition to be used to apply the `Normal (DIV)` format.
167 * Read more in the [documentation](#!/guide/dev_format)
168 * and see the [SDK sample](http://sdk.ckeditor.com/samples/format.html).
170 * config.format_div = { element: 'div', attributes: { 'class': 'normalDiv' } };
172 * @cfg {Object} [format_div={ element: 'div' }]
173 * @member CKEDITOR.config
175 CKEDITOR
.config
.format_div
= { element: 'div' };
178 * The style definition to be used to apply the `Formatted` format.
180 * Read more in the [documentation](#!/guide/dev_format)
181 * and see the [SDK sample](http://sdk.ckeditor.com/samples/format.html).
183 * config.format_pre = { element: 'pre', attributes: { 'class': 'code' } };
185 * @cfg {Object} [format_pre={ element: 'pre' }]
186 * @member CKEDITOR.config
188 CKEDITOR
.config
.format_pre
= { element: 'pre' };
191 * The style definition to be used to apply the `Address` format.
193 * Read more in the [documentation](#!/guide/dev_format)
194 * and see the [SDK sample](http://sdk.ckeditor.com/samples/format.html).
196 * config.format_address = { element: 'address', attributes: { 'class': 'styledAddress' } };
198 * @cfg {Object} [format_address={ element: 'address' }]
199 * @member CKEDITOR.config
201 CKEDITOR
.config
.format_address
= { element: 'address' };
204 * The style definition to be used to apply the `Heading 1` format.
206 * Read more in the [documentation](#!/guide/dev_format)
207 * and see the [SDK sample](http://sdk.ckeditor.com/samples/format.html).
209 * config.format_h1 = { element: 'h1', attributes: { 'class': 'contentTitle1' } };
211 * @cfg {Object} [format_h1={ element: 'h1' }]
212 * @member CKEDITOR.config
214 CKEDITOR
.config
.format_h1
= { element: 'h1' };
217 * The style definition to be used to apply the `Heading 2` format.
219 * Read more in the [documentation](#!/guide/dev_format)
220 * and see the [SDK sample](http://sdk.ckeditor.com/samples/format.html).
222 * config.format_h2 = { element: 'h2', attributes: { 'class': 'contentTitle2' } };
224 * @cfg {Object} [format_h2={ element: 'h2' }]
225 * @member CKEDITOR.config
227 CKEDITOR
.config
.format_h2
= { element: 'h2' };
230 * The style definition to be used to apply the `Heading 3` format.
232 * Read more in the [documentation](#!/guide/dev_format)
233 * and see the [SDK sample](http://sdk.ckeditor.com/samples/format.html).
235 * config.format_h3 = { element: 'h3', attributes: { 'class': 'contentTitle3' } };
237 * @cfg {Object} [format_h3={ element: 'h3' }]
238 * @member CKEDITOR.config
240 CKEDITOR
.config
.format_h3
= { element: 'h3' };
243 * The style definition to be used to apply the `Heading 4` format.
245 * Read more in the [documentation](#!/guide/dev_format)
246 * and see the [SDK sample](http://sdk.ckeditor.com/samples/format.html).
248 * config.format_h4 = { element: 'h4', attributes: { 'class': 'contentTitle4' } };
250 * @cfg {Object} [format_h4={ element: 'h4' }]
251 * @member CKEDITOR.config
253 CKEDITOR
.config
.format_h4
= { element: 'h4' };
256 * The style definition to be used to apply the `Heading 5` format.
258 * Read more in the [documentation](#!/guide/dev_format)
259 * and see the [SDK sample](http://sdk.ckeditor.com/samples/format.html).
261 * config.format_h5 = { element: 'h5', attributes: { 'class': 'contentTitle5' } };
263 * @cfg {Object} [format_h5={ element: 'h5' }]
264 * @member CKEDITOR.config
266 CKEDITOR
.config
.format_h5
= { element: 'h5' };
269 * The style definition to be used to apply the `Heading 6` format.
271 * Read more in the [documentation](#!/guide/dev_format)
272 * and see the [SDK sample](http://sdk.ckeditor.com/samples/format.html).
274 * config.format_h6 = { element: 'h6', attributes: { 'class': 'contentTitle6' } };
276 * @cfg {Object} [format_h6={ element: 'h6' }]
277 * @member CKEDITOR.config
279 CKEDITOR
.config
.format_h6
= { element: 'h6' };