/*\r
-Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.\r
+Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.\r
For licensing, see LICENSE.html or http://ckeditor.com/license\r
*/\r
\r
\r
onLoad : function()\r
{\r
- CKEDITOR.ui.panel.prototype.addListBlock = function( name, multiSelect )\r
+ CKEDITOR.ui.panel.prototype.addListBlock = function( name, definition )\r
{\r
- return this.addBlock( name, new CKEDITOR.ui.listBlock( this.getHolderElement(), multiSelect ) );\r
+ return this.addBlock( name, new CKEDITOR.ui.listBlock( this.getHolderElement(), definition ) );\r
};\r
\r
CKEDITOR.ui.listBlock = CKEDITOR.tools.createClass(\r
{\r
base : CKEDITOR.ui.panel.block,\r
\r
- $ : function( blockHolder, multiSelect )\r
+ $ : function( blockHolder, blockDefinition )\r
{\r
- // Call the base contructor.\r
- this.base( blockHolder );\r
+ blockDefinition = blockDefinition || {};\r
+\r
+ var attribs = blockDefinition.attributes || ( blockDefinition.attributes = {} );\r
+ ( this.multiSelect = !!blockDefinition.multiSelect ) &&\r
+ ( attribs[ 'aria-multiselectable' ] = true );\r
+ // Provide default role of 'listbox'.\r
+ !attribs.role && ( attribs.role = 'listbox' );\r
\r
- this.multiSelect = !!multiSelect;\r
+ // Call the base contructor.\r
+ this.base.apply( this, arguments );\r
\r
var keys = this.keys;\r
keys[ 40 ] = 'next'; // ARROW-DOWN\r
keys[ 9 ] = 'next'; // TAB\r
keys[ 38 ] = 'prev'; // ARROW-UP\r
keys[ CKEDITOR.SHIFT + 9 ] = 'prev'; // SHIFT + TAB\r
- keys[ 32 ] = 'click'; // SPACE\r
+ keys[ 32 ] = CKEDITOR.env.ie ? 'mouseup' : 'click'; // SPACE\r
+ CKEDITOR.env.ie && ( keys[ 13 ] = 'mouseup' ); // Manage ENTER, since onclick is blocked in IE (#8041).\r
\r
this._.pendingHtml = [];\r
this._.items = {};\r
add : function( value, html, title )\r
{\r
var pendingHtml = this._.pendingHtml,\r
- id = 'cke_' + CKEDITOR.tools.getNextNumber();\r
+ id = CKEDITOR.tools.getNextId();\r
\r
if ( !this._.started )\r
{\r
- pendingHtml.push( '<ul class=cke_panel_list>' );\r
+ pendingHtml.push( '<ul role="presentation" class=cke_panel_list>' );\r
this._.started = 1;\r
+ this._.size = this._.size || 0;\r
}\r
\r
this._.items[ value ] = id;\r
\r
pendingHtml.push(\r
- '<li id=', id, ' class=cke_panel_listItem>' +\r
- '<a _cke_focus=1 hidefocus=true' +\r
+ '<li id=', id, ' class=cke_panel_listItem role=presentation>' +\r
+ '<a id="', id, '_option" _cke_focus=1 hidefocus=true' +\r
' title="', title || value, '"' +\r
- ' href="javascript:void(\'', value, '\')"' +\r
- ' onclick="CKEDITOR.tools.callFunction(', this._.getClick(), ',\'', value, '\'); return false;">',\r
+ ' href="javascript:void(\'', value, '\')" ' +\r
+ ( CKEDITOR.env.ie ? 'onclick="return false;" onmouseup' : 'onclick' ) + // #188\r
+ '="CKEDITOR.tools.callFunction(', this._.getClick(), ',\'', value, '\'); return false;"',\r
+ ' role="option"' +\r
+ ' aria-posinset="' + ++this._.size + '">',\r
html || value,\r
'</a>' +\r
'</li>' );\r
{\r
this._.close();\r
\r
- var id = 'cke_' + CKEDITOR.tools.getNextNumber();\r
+ var id = CKEDITOR.tools.getNextId();\r
\r
this._.groups[ title ] = id;\r
\r
- this._.pendingHtml.push( '<h1 id=', id, ' class=cke_panel_grouptitle>', title, '</h1>' );\r
+ this._.pendingHtml.push( '<h1 role="presentation" id=', id, ' class=cke_panel_grouptitle>', title, '</h1>' );\r
},\r
\r
commit : function()\r
{\r
this._.close();\r
this.element.appendHtml( this._.pendingHtml.join( '' ) );\r
+\r
+ var items = this._.items,\r
+ doc = this.element.getDocument();\r
+ for ( var value in items )\r
+ doc.getById( items[ value ] + '_option' ).setAttribute( 'aria-setsize', this._.size );\r
+ delete this._.size;\r
+\r
this._.pendingHtml = [];\r
},\r
\r
if ( !this.multiSelect )\r
this.unmarkAll();\r
\r
- this.element.getDocument().getById( this._.items[ value ] ).addClass( 'cke_selected' );\r
+ var itemId = this._.items[ value ],\r
+ item = this.element.getDocument().getById( itemId );\r
+ item.addClass( 'cke_selected' );\r
+\r
+ this.element.getDocument().getById( itemId + '_option' ).setAttribute( 'aria-selected', true );\r
+ this.element.setAttribute( 'aria-activedescendant', itemId + '_option' );\r
+\r
+ this.onMark && this.onMark( item );\r
},\r
\r
unmark : function( value )\r
{\r
- this.element.getDocument().getById( this._.items[ value ] ).removeClass( 'cke_selected' );\r
+ var doc = this.element.getDocument(),\r
+ itemId = this._.items[ value ],\r
+ item = doc.getById( itemId );\r
+\r
+ item.removeClass( 'cke_selected' );\r
+ doc.getById( itemId + '_option' ).removeAttribute( 'aria-selected' );\r
+\r
+ this.onUnmark && this.onUnmark( item );\r
},\r
\r
unmarkAll : function()\r
\r
for ( var value in items )\r
{\r
- doc.getById( items[ value ] ).removeClass( 'cke_selected' );\r
+ var itemId = items[ value ];\r
+\r
+ doc.getById( itemId ).removeClass( 'cke_selected' );\r
+ doc.getById( itemId + '_option' ).removeAttribute( 'aria-selected' );\r
}\r
+\r
+ this.onUnmark && this.onUnmark();\r
},\r
\r
isMarked : function( value )\r
link,\r
i = -1;\r
\r
- while( ( link = links.getItem( ++i ) ) )\r
+ while ( ( link = links.getItem( ++i ) ) )\r
{\r
if ( link.equals( selected ) )\r
{\r
Got questions, comments, patches, etc.? Contact Jason Woofenden