Make WordPress Core

Changeset 19484


Ignore:
Timestamp:
11/30/2011 01:27:33 AM (15 years ago)
Author:
azaozz
Message:

Add ARIA related attributes (first take), props DrewAPicture, see #19394

Location:
trunk
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-admin/menu-header.php

    r19101 r19484  
    4242                $admin_is_parent = false;
    4343                $class = array();
     44                $aria_attributes = 'tabindex="1" role="menuitem"';
    4445
    4546                if ( $first ) {
     
    5455                }
    5556
    56                 if ( ( $parent_file && $item[2] == $parent_file ) || ( empty($typenow) && $self == $item[2] ) )
     57                if ( ( $parent_file && $item[2] == $parent_file ) || ( empty($typenow) && $self == $item[2] ) ) {
    5758                        $class[] = ! empty( $submenu_items ) ? 'wp-has-current-submenu wp-menu-open' : 'current';
    58                 else
     59                } else {
    5960                        $class[] = 'wp-not-current-submenu';
     61                        if ( ! empty( $submenu_items ) )
     62                                $aria_attributes .= ' aria-haspopup="true"';   
     63                }
    6064
    6165                if ( ! empty( $item[4] ) )
     
    6367
    6468                $class = $class ? ' class="' . join( ' ', $class ) . '"' : '';
    65                 $tabindex = ' tabindex="1"';
    6669                $id = ! empty( $item[5] ) ? ' id="' . preg_replace( '|[^a-zA-Z0-9_:.]|', '-', $item[5] ) . '"' : '';
    6770                $img = '';
     
    8487                        if ( ! empty( $menu_hook ) || ( ('index.php' != $submenu_items[0][2]) && file_exists( WP_PLUGIN_DIR . "/$menu_file" ) ) ) {
    8588                                $admin_is_parent = true;
    86                                 echo "<div class='wp-menu-image'><a href='admin.php?page={$submenu_items[0][2]}'>$img</a></div>$arrow<a href='admin.php?page={$submenu_items[0][2]}'$class$tabindex>$title</a>";
     89                                echo "<div class='wp-menu-image'><a href='admin.php?page={$submenu_items[0][2]}'>$img</a></div>$arrow<a href='admin.php?page={$submenu_items[0][2]}'$class $aria_attributes>$title</a>";
    8790                        } else {
    88                                 echo "\n\t<div class='wp-menu-image'><a href='{$submenu_items[0][2]}'>$img</a></div>$arrow<a href='{$submenu_items[0][2]}'$class$tabindex>$title</a>";
     91                                echo "\n\t<div class='wp-menu-image'><a href='{$submenu_items[0][2]}'>$img</a></div>$arrow<a href='{$submenu_items[0][2]}'$class $aria_attributes>$title</a>";
    8992                        }
    9093                } elseif ( ! empty( $item[2] ) && current_user_can( $item[1] ) ) {
     
    9598                        if ( ! empty( $menu_hook ) || ( ('index.php' != $item[2]) && file_exists( WP_PLUGIN_DIR . "/$menu_file" ) ) ) {
    9699                                $admin_is_parent = true;
    97                                 echo "\n\t<div class='wp-menu-image'><a href='admin.php?page={$item[2]}'>$img</a></div>$arrow<a href='admin.php?page={$item[2]}'$class$tabindex>{$item[0]}</a>";
     100                                echo "\n\t<div class='wp-menu-image'><a href='admin.php?page={$item[2]}'>$img</a></div>$arrow<a href='admin.php?page={$item[2]}'$class $aria_attributes>{$item[0]}</a>";
    98101                        } else {
    99                                 echo "\n\t<div class='wp-menu-image'><a href='{$item[2]}'>$img</a></div>$arrow<a href='{$item[2]}'$class$tabindex>{$item[0]}</a>";
     102                                echo "\n\t<div class='wp-menu-image'><a href='{$item[2]}'>$img</a></div>$arrow<a href='{$item[2]}'$class $aria_attributes>{$item[0]}</a>";
    100103                        }
    101104                }
    102105
    103106                if ( ! empty( $submenu_items ) ) {
    104                         echo "\n\t<div class='wp-submenu'><div class='wp-submenu-wrap'>";
     107                        echo "\n\t<div class='wp-submenu' role='menu'><div class='wp-submenu-wrap'>";
    105108                        echo "<div class='wp-submenu-head'>{$item[0]}</div><ul>";
    106109                        $first = true;
     
    152155
    153156                                        $sub_item_url = esc_url( $sub_item_url );
    154                                         echo "<li$class><a href='$sub_item_url'$class$tabindex>$title</a></li>";
     157                                        echo "<li$class><a href='$sub_item_url'$class $aria_attributes>$title</a></li>";
    155158                                } else {
    156                                         echo "<li$class><a href='{$sub_item[2]}'$class$tabindex>$title</a></li>";
     159                                        echo "<li$class><a href='{$sub_item[2]}'$class $aria_attributes>$title</a></li>";
    157160                                }
    158161                        }
     
    170173
    171174<div id="adminmenuback"></div>
    172 <div id="adminmenuwrap">
     175<div id="adminmenuwrap" role="navigation">
    173176<div id="adminmenushadow"></div>
    174 <ul id="adminmenu">
     177<ul id="adminmenu" role="menu">
    175178
    176179<?php
  • trunk/wp-includes/class-wp-admin-bar.php

    r19434 r19484  
    180180
    181181                ?>
    182                 <div id="wpadminbar" class="<?php echo $class; ?>">
    183                         <div class="quicklinks">
     182                <div id="wpadminbar" class="<?php echo $class; ?>" role="navigation">
     183                        <div class="quicklinks" role="menubar">
    184184                                <?php foreach ( $this->root->children as $group ) {
    185185                                        $this->render_group( $group, 'ab-top-menu' );
     
    219219                                $class .= ' ' . $node->meta['class'];
    220220
    221                         ?><ul id="<?php echo esc_attr( "wp-admin-bar-{$node->id}" ); ?>" class="<?php echo esc_attr( $class ); ?>"><?php
     221                        ?><ul id="<?php echo esc_attr( "wp-admin-bar-{$node->id}" ); ?>" class="<?php echo esc_attr( $class ); ?>" role="menu"><?php
    222222                                foreach ( $node->children as $item ) {
    223223                                        $this->render_item( $item );
     
    227227                // Wrap the subgroups in a div and render each individual subgroup.
    228228                elseif ( ! $is_single_group ):
    229                         ?><div id="<?php echo esc_attr( "wp-admin-bar-{$node->id}-container" ); ?>" class="ab-group-container"><?php
     229                        ?><div id="<?php echo esc_attr( "wp-admin-bar-{$node->id}-container" ); ?>" class="ab-group-container" role="menu"><?php
    230230                                foreach ( $groups as $group ) {
    231231                                        $this->render_group( $group, $class );
     
    241241                $is_parent = (bool) $node->children;
    242242                $has_link  = (bool) $node->href;
    243 
    244                 $menuclass = $is_parent ? 'menupop' : '';
     243                $tabindex = isset($node->meta['tabindex']) ? (int) $node->meta['tabindex'] : 10;
     244
     245                $menuclass = '';
     246                $aria_attributes = 'tabindex="' . $tabindex . '" role="menuitem"';
     247
     248                if ( $is_parent ) {
     249                        $menuclass = 'menupop';
     250                        $aria_attributes .= ' aria-haspopup="true"';
     251                }
     252
    245253                if ( ! empty( $node->meta['class'] ) )
    246254                        $menuclass .= ' ' . $node->meta['class'];
    247255
    248                 $tabindex = !empty($node->meta['tabindex']) ? $node->meta['tabindex'] : 10;
    249256                ?>
    250257
    251258                <li id="<?php echo esc_attr( "wp-admin-bar-{$node->id}" ); ?>" class="<?php echo esc_attr( $menuclass ); ?>"><?php
    252259                        if ( $has_link ):
    253                                 ?><a class="ab-item" tabindex="<?php echo (int) $tabindex; ?>" href="<?php echo esc_url( $node->href ) ?>"<?php
     260                                ?><a class="ab-item" <?php echo $aria_attributes; ?> href="<?php echo esc_url( $node->href ) ?>"<?php
    254261                                        if ( ! empty( $node->meta['onclick'] ) ) :
    255262                                                ?> onclick="<?php echo esc_js( $node->meta['onclick'] ); ?>"<?php
     
    263270                                ?>><?php
    264271                        else:
    265                                 ?><div class="ab-item ab-empty-item" tabindex="<?php echo (int) $tabindex; ?>"><?php
     272                                ?><div class="ab-item ab-empty-item" <?php echo $aria_attributes; ?>><?php
    266273                        endif;
    267274
Note: See TracChangeset for help on using the changeset viewer.