Changeset 4908

Timestamp:

01/08/10 17:06:44 (3 years ago)

Author:

garry.yao

Message:

Enable ARIA support for context menu.

Location:

CKEditor/branches/features/aria/_source

Files:

• lang/en.js (modified) (1 diff)
• plugins/contextmenu/plugin.js (modified) (2 diffs)
• plugins/menu/plugin.js (modified) (8 diffs)

CKEditor/branches/features/aria/_source/lang/en.js

@@ -556 +556 @@
         },
 
+        contextMenu :
+        {
+                panelTitle : 'context menu options',
+                panelVoiceLabel: ''
+        },
+
         div :
         {

CKEditor/branches/features/aria/_source/plugins/contextmenu/plugin.js

@@ -36 +36 @@
                         },
                         this);
+
+                this._.definiton =
+                {
+                        panel:
+                        {
+                                className : editor.skinClass + ' cke_contextmenu',
+                                aria :
+                                {
+                                        'aria-label' : editor.lang.contextMenu.panelTitle,
+                                        'aria-describedby' : editor.lang.contextMenu.panelVoiceLabel
+                                }
+                        }
+                };
         },
 
@@ -52 +65 @@
                         else
                         {
-                                menu = this._.menu = new CKEDITOR.menu( editor );
+                                menu = this._.menu = new CKEDITOR.menu( editor, this._.definiton );
                                 menu.onClick = CKEDITOR.tools.bind( function( item )
                                 {

CKEditor/branches/features/aria/_source/plugins/menu/plugin.js

@@ -52 +52 @@
         CKEDITOR.menu = CKEDITOR.tools.createClass(
         {
-                $ : function( editor, level )
-                {
+                $ : function( editor, definition )
+                {
+                        definition = this._.definition = definition || {};
                         this.id = 'cke_' + CKEDITOR.tools.getNextNumber();
 
@@ -59 +60 @@
                         this.items = [];
 
-                        this._.level = level || 1;
+                        this._.level = definition.level || 1;
+
+                        var panelDefinition = CKEDITOR.tools.extend( {}, definition.panel,
+                        {
+                                css : editor.skin.editor.css,
+                                level : this._.level - 1,
+                                block : {}
+                        } );
+
+                        var aria = panelDefinition.block.aria = ( panelDefinition.aria || {} );
+                        // Provide default role of 'menu'.
+                        !aria.role && ( aria.role = 'menu' );
+                        this._.panelDefinition = panelDefinition;
                 },
 
@@ -84 +97 @@
                                 else
                                 {
-                                        menu = this._.subMenu = new CKEDITOR.menu( this.editor, this._.level + 1 );
+                                        menu = this._.subMenu = new CKEDITOR.menu( this.editor,
+                                                                   CKEDITOR.tools.extend( {}, this._.definition, { level : this._.level + 1 }, true ) );
                                         menu.parent = this;
                                         menu.onClick = CKEDITOR.tools.bind( this.onClick, this );
@@ -136 +150 @@
                                 if ( !panel )
                                 {
-                                        panel = this._.panel = new CKEDITOR.ui.floatPanel( this.editor, CKEDITOR.document.getBody(),
-                                                {
-                                                        css : editor.skin.editor.css,
-                                                        level : this._.level - 1,
-                                                        className : editor.skinClass + ' cke_contextmenu'
-                                                },
-                                                this._.level);
+                                        panel = this._.panel = new CKEDITOR.ui.floatPanel( this.editor,
+                                                CKEDITOR.document.getBody(),
+                                                this._.panelDefinition,
+                                                this._.level );
 
                                         panel.onEscape = CKEDITOR.tools.bind( function()
@@ -158 +169 @@
 
                                         // Create an autosize block inside the panel.
-                                        var block = panel.addBlock( this.id );
+                                        var block = panel.addBlock( this.id, this._.panelDefinition.block );
                                         block.autoSize = true;
 
@@ -300 +311 @@
                                 classes += ' ' + this.className;
 
+                        var hasSubMenu = this.getItems;
+
                         output.push(
                                 '<span class="cke_menuitem">' +
@@ -307 +320 @@
                                         ' tabindex="-1"' +
                                         '_cke_focus=1' +
-                                        ' hidefocus="true"' );
+                                        ' hidefocus="true"' +
+                                        ' role="menuitem"' +
+                                        ( hasSubMenu ? 'aria-haspopup="true"' : '' ) +
+                                        ( state == CKEDITOR.TRISTATE_DISABLED ? 'aria-disabled="true"' : '' ) +
+                                        ( state == CKEDITOR.TRISTATE_ON ? 'aria-pressed="true"' : '' ) );
 
                         // Some browsers don't cancel key events in the keydown but in the
@@ -339 +356 @@
                                                 '<span class="cke_label">' );
 
-                        if ( this.getItems )
+                        if ( hasSubMenu )
                         {
                                 output.push(