Changeset 4909


Ignore:
Timestamp:
01/09/10 16:53:44 (5 years ago)
Author:
garry.yao
Message:

Enable ARIA support for common dialog fields.

Location:
CKEditor/branches/features/aria/_source
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • CKEditor/branches/features/aria/_source/plugins/dialog/plugin.js

    r4858 r4909  
    19381938                                        styles = ( stylesArg && stylesArg.call ? stylesArg( elementDefinition ) : stylesArg ) || {},
    19391939                                        attributes = ( attributesArg && attributesArg.call ? attributesArg( elementDefinition ) : attributesArg ) || {},
    1940                                         innerHTML = ( contentsArg && contentsArg.call ? contentsArg( dialog, elementDefinition ) : contentsArg ) || '',
     1940                                        innerHTML = ( contentsArg && contentsArg.call ? contentsArg.call( this, dialog, elementDefinition ) : contentsArg ) || '',
    19411941                                        domId = this.domId = attributes.id || CKEDITOR.tools.getNextNumber() + '_uiElement',
    19421942                                        id = this.id = elementDefinition.id,
  • CKEditor/branches/features/aria/_source/plugins/dialogui/plugin.js

    r4858 r4909  
    1 /*
     1/*
    22Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.
    33For licensing, see LICENSE.html or http://ckeditor.com/license
     
    136136                                                                '</div>',
    137137                                                                '<div class="cke_dialog_ui_labeled_content">',
    138                                                                 contentHtml( dialog, elementDefinition ),
     138                                                                contentHtml.call( this, dialog, elementDefinition ),
    139139                                                                '</div>' );
    140140                                        else
     
    155155                                                                        type : 'html',
    156156                                                                        html : '<span class="cke_dialog_ui_labeled_content">' +
    157                                                                                 contentHtml( dialog, elementDefinition ) +
     157                                                                                contentHtml.call( this, dialog, elementDefinition ) +
    158158                                                                                '</span>'
    159159                                                                }
     
    243243
    244244                                        html.push( '><input ' );
     245
     246                                        attributes[ 'aria-labelledby' ] = this._.labelId;
    245247                                        for ( var i in attributes )
    246248                                                html.push( i + '="' + attributes[i] + '" ' );
     
    335337                                                                id : elementDefinition.id ? elementDefinition.id + '_checkbox' : CKEDITOR.tools.getNextNumber() + '_checkbox'
    336338                                                        }, true ),
    337                                                 html = [],
    338                                                 attributes = { 'class' : 'cke_dialog_ui_checkbox_input', type : 'checkbox' };
     339                                                html = [];
     340
     341                                        var labelId = CKEDITOR.tools.getNextNumber() + '_label';
     342                                        var attributes = { 'class' : 'cke_dialog_ui_checkbox_input', type : 'checkbox', 'aria-labelledby' : labelId };
    339343                                        cleanInnerDefinition( myDefinition );
    340344                                        if ( elementDefinition[ 'default' ] )
    341345                                                attributes.checked = 'checked';
    342346                                        _.checkbox = new CKEDITOR.ui.dialog.uiElement( dialog, myDefinition, html, 'input', null, attributes );
    343                                         html.push( ' <label for="', attributes.id, '">',
     347                                        html.push( ' <label id="', labelId, '" for="', attributes.id, '">',
    344348                                                        CKEDITOR.tools.htmlEncode( elementDefinition.label ),
    345349                                                        '</label>' );
     
    386390                                {
    387391                                        var inputHtmlList = [], html = [],
    388                                                 commonAttributes = { 'class' : 'cke_dialog_ui_radio_item' },
     392                                                commonAttributes = { 'class' : 'cke_dialog_ui_radio_item', 'aria-labelledby' : this._.labelId },
    389393                                                commonName = elementDefinition.id ? elementDefinition.id + '_radio' : CKEDITOR.tools.getNextNumber() + '_radio';
    390394                                        for ( var i = 0 ; i < elementDefinition.items.length ; i++ )
     
    482486                                delete outerDefinition.style;
    483487
     488                                var labelId = CKEDITOR.tools.getNextNumber() + '_label';
    484489                                CKEDITOR.ui.dialog.uiElement.call(
    485490                                        this,
     
    494499                                                title : elementDefinition.label,
    495500                                                hidefocus : 'true',
    496                                                 'class' : elementDefinition['class']
     501                                                'class' : elementDefinition['class'],
     502                                                role : 'button',
     503                                                'aria-labelledby' : labelId
    497504                                        },
    498                                         '<span class="cke_dialog_ui_button">' +
     505                                        '<span id="' + labelId + '" class="cke_dialog_ui_button">' +
    499506                                                CKEDITOR.tools.htmlEncode( elementDefinition.label ) +
    500507                                        '</span>' );
     
    544551                                                html = [],
    545552                                                innerHTML = [],
    546                                                 attributes = { 'class' : 'cke_dialog_ui_input_select' };
     553                                                attributes = { 'class' : 'cke_dialog_ui_input_select', 'aria-labelledby' : this._.labelId };
    547554
    548555                                        // Add multiple and size attributes from element definition.
  • CKEditor/branches/features/aria/_source/themes/default/theme.js

    r4896 r4909  
    172172                                                '>' +
    173173                                                '<table class="cke_dialog', ' ' + CKEDITOR.env.cssClass,
    174                                                         ' cke_', editor.lang.dir, '" style="position:absolute">' +
     174                                                        ' cke_', editor.lang.dir, '" style="position:absolute" role="dialog" aria-labelledby="%title#" a>' +
    175175                                                        '<tr><td>' +
    176176                                                        '<div class="%body">' +
Note: See TracChangeset for help on using the changeset viewer.
© 2003 – 2012 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy