]>
git.immae.eu Git - perso/Immae/Projets/packagist/ludivine-ckeditor-component.git/blob - sources/plugins/listblock/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( 'listblock', {
10 var list
= CKEDITOR
.addTemplate( 'panel-list', '<ul role="presentation" class="cke_panel_list">{items}</ul>' ),
11 listItem
= CKEDITOR
.addTemplate( 'panel-list-item', '<li id="{id}" class="cke_panel_listItem" role=presentation>' +
12 '<a id="{id}_option" _cke_focus=1 hidefocus=true' +
14 ' href="javascript:void(\'{val}\')" ' +
15 ' {onclick}="CKEDITOR.tools.callFunction({clickFn},\'{val}\'); return false;"' + // http://dev.ckeditor.com/ticket/188
20 listGroup
= CKEDITOR
.addTemplate( 'panel-list-group', '<h1 id="{id}" class="cke_panel_grouptitle" role="presentation" >{label}</h1>' ),
21 reSingleQuote
= /\'/g,
22 escapeSingleQuotes = function( str
) {
23 return str
.replace( reSingleQuote
, '\\\'' );
26 CKEDITOR
.ui
.panel
.prototype.addListBlock = function( name
, definition
) {
27 return this.addBlock( name
, new CKEDITOR
.ui
.listBlock( this.getHolderElement(), definition
) );
30 CKEDITOR
.ui
.listBlock
= CKEDITOR
.tools
.createClass( {
31 base: CKEDITOR
.ui
.panel
.block
,
33 $: function( blockHolder
, blockDefinition
) {
34 blockDefinition
= blockDefinition
|| {};
36 var attribs
= blockDefinition
.attributes
|| ( blockDefinition
.attributes
= {} );
37 ( this.multiSelect
= !!blockDefinition
.multiSelect
) && ( attribs
[ 'aria-multiselectable' ] = true );
38 // Provide default role of 'listbox'.
39 !attribs
.role
&& ( attribs
.role
= 'listbox' );
41 // Call the base contructor.
42 this.base
.apply( this, arguments
);
44 // Set the proper a11y attributes.
45 this.element
.setAttribute( 'role', attribs
.role
);
48 keys
[ 40 ] = 'next'; // ARROW-DOWN
49 keys
[ 9 ] = 'next'; // TAB
50 keys
[ 38 ] = 'prev'; // ARROW-UP
51 keys
[ CKEDITOR
.SHIFT
+ 9 ] = 'prev'; // SHIFT + TAB
52 keys
[ 32 ] = CKEDITOR
.env
.ie
? 'mouseup' : 'click'; // SPACE
53 CKEDITOR
.env
.ie
&& ( keys
[ 13 ] = 'mouseup' ); // Manage ENTER, since onclick is blocked in IE (http://dev.ckeditor.com/ticket/8041).
55 this._
.pendingHtml
= [];
56 this._
.pendingList
= [];
63 if ( this._
.started
) {
64 var output
= list
.output( { items: this._
.pendingList
.join( '' ) } );
65 this._
.pendingList
= [];
66 this._
.pendingHtml
.push( output
);
67 delete this._
.started
;
71 getClick: function() {
72 if ( !this._
.click
) {
73 this._
.click
= CKEDITOR
.tools
.addFunction( function( value
) {
74 var marked
= this.toggle( value
);
76 this.onClick( value
, marked
);
84 add: function( value
, html
, title
) {
85 var id
= CKEDITOR
.tools
.getNextId();
87 if ( !this._
.started
) {
89 this._
.size
= this._
.size
|| 0;
92 this._
.items
[ value
] = id
;
96 val: escapeSingleQuotes( CKEDITOR
.tools
.htmlEncodeAttr( value
) ),
97 onclick: CKEDITOR
.env
.ie
? 'onclick="return false;" onmouseup' : 'onclick',
98 clickFn: this._
.getClick(),
99 title: CKEDITOR
.tools
.htmlEncodeAttr( title
|| value
),
103 this._
.pendingList
.push( listItem
.output( data
) );
106 startGroup: function( title
) {
109 var id
= CKEDITOR
.tools
.getNextId();
111 this._
.groups
[ title
] = id
;
113 this._
.pendingHtml
.push( listGroup
.output( { id: id
, label: title
} ) );
118 this.element
.appendHtml( this._
.pendingHtml
.join( '' ) );
121 this._
.pendingHtml
= [];
124 toggle: function( value
) {
125 var isMarked
= this.isMarked( value
);
128 this.unmark( value
);
135 hideGroup: function( groupTitle
) {
136 var group
= this.element
.getDocument().getById( this._
.groups
[ groupTitle
] ),
137 list
= group
&& group
.getNext();
140 group
.setStyle( 'display', 'none' );
142 if ( list
&& list
.getName() == 'ul' )
143 list
.setStyle( 'display', 'none' );
147 hideItem: function( value
) {
148 this.element
.getDocument().getById( this._
.items
[ value
] ).setStyle( 'display', 'none' );
151 showAll: function() {
152 var items
= this._
.items
,
153 groups
= this._
.groups
,
154 doc
= this.element
.getDocument();
156 for ( var value
in items
) {
157 doc
.getById( items
[ value
] ).setStyle( 'display', '' );
160 for ( var title
in groups
) {
161 var group
= doc
.getById( groups
[ title
] ),
162 list
= group
.getNext();
164 group
.setStyle( 'display', '' );
166 if ( list
&& list
.getName() == 'ul' )
167 list
.setStyle( 'display', '' );
171 mark: function( value
) {
172 if ( !this.multiSelect
)
175 var itemId
= this._
.items
[ value
],
176 item
= this.element
.getDocument().getById( itemId
);
177 item
.addClass( 'cke_selected' );
179 this.element
.getDocument().getById( itemId
+ '_option' ).setAttribute( 'aria-selected', true );
180 this.onMark
&& this.onMark( item
);
183 markFirstDisplayed: function() {
185 this._
.markFirstDisplayed( function() {
186 if ( !context
.multiSelect
)
191 unmark: function( value
) {
192 var doc
= this.element
.getDocument(),
193 itemId
= this._
.items
[ value
],
194 item
= doc
.getById( itemId
);
196 item
.removeClass( 'cke_selected' );
197 doc
.getById( itemId
+ '_option' ).removeAttribute( 'aria-selected' );
199 this.onUnmark
&& this.onUnmark( item
);
202 unmarkAll: function() {
203 var items
= this._
.items
,
204 doc
= this.element
.getDocument();
206 for ( var value
in items
) {
207 var itemId
= items
[ value
];
209 doc
.getById( itemId
).removeClass( 'cke_selected' );
210 doc
.getById( itemId
+ '_option' ).removeAttribute( 'aria-selected' );
213 this.onUnmark
&& this.onUnmark();
216 isMarked: function( value
) {
217 return this.element
.getDocument().getById( this._
.items
[ value
] ).hasClass( 'cke_selected' );
220 focus: function( value
) {
221 this._
.focusIndex
= -1;
223 var links
= this.element
.getElementsByTag( 'a' ),
229 selected
= this.element
.getDocument().getById( this._
.items
[ value
] ).getFirst();
231 while ( ( link
= links
.getItem( ++i
) ) ) {
232 if ( link
.equals( selected
) ) {
233 this._
.focusIndex
= i
;
239 this.element
.focus();
242 selected
&& setTimeout( function() {