WordPress.org
Get WordPress

Make WordPress Core

Ticket #30468: 30468.2.patch

File 30468.2.patch, 16.1 KB (added by afercia, 12 years ago)

Refreshed patch, also removes the missing semicolons fix already committed in r30550

  • src/wp-includes/class-wp-editor.php

     
    14261426                // display: none is required here, see #WP27605
    14271427                ?>
    14281428                <div id="wp-link-backdrop" style="display: none"></div>
    1429                 <div id="wp-link-wrap" class="wp-core-ui<?php echo $search_panel_visible; ?>" style="display: none">
     1429                <div id="wp-link-wrap" class="wp-core-ui<?php echo $search_panel_visible; ?>" style="display: none" role="dialog" aria-labelledby="link-modal-title" tabindex="0">
    14301430                <form id="wp-link" tabindex="-1">
    14311431                <?php wp_nonce_field( 'internal-linking', '_ajax_linking_nonce', false ); ?>
    1432                 <div id="link-modal-title">
    1433                         <?php _e( 'Insert/edit link' ) ?>
    1434                         <button type="button" id="wp-link-close"><span class="screen-reader-text"><?php _e( 'Close' ); ?></span></button>
    1435                 </div>
     1432                <h1 id="link-modal-title"><?php _e( 'Insert/edit link' ) ?></h1>
     1433                <button type="button" id="wp-link-close"><span class="screen-reader-text"><?php _e( 'Close' ); ?></span></button>
    14361434                <div id="link-selector">
    14371435                        <div id="link-options">
    1438                                 <p class="howto"><?php _e( 'Enter the destination URL' ); ?></p>
     1436                                <p class="howto" id="wp-link-howto-url"><?php _e( 'Enter the destination URL' ); ?></p>
    14391437                                <div>
    1440                                         <label><span><?php _e( 'URL' ); ?></span><input id="url-field" type="text" name="href" /></label>
     1438                                        <label><span><?php _e( 'URL' ); ?></span><input id="url-field" type="text" name="href" aria-describedby="wp-link-howto-url" /></label>
    14411439                                </div>
    14421440                                <div>
    14431441                                        <label><span><?php _e( 'Title' ); ?></span><input id="link-title-field" type="text" name="linktitle" /></label>
    14441442                                </div>
    14451443                                <div class="link-target">
    1446                                         <label><span>&nbsp;</span><input type="checkbox" id="link-target-checkbox" /> <?php _e( 'Open link in a new window/tab' ); ?></label>
     1444                                        <label><span></span><input type="checkbox" id="link-target-checkbox" /> <?php _e( 'Open link in a new window/tab' ); ?></label>
    14471445                                </div>
    14481446                        </div>
    1449                         <p class="howto"><a href="#" id="wp-link-search-toggle"><?php _e( 'Or link to existing content' ); ?></a></p>
     1447                        <div class="howto"><button type="button" id="wp-link-search-toggle" class="button" aria-expanded="false"><?php _e( 'Or link to existing content' ); ?></button></div>
    14501448                        <div id="search-panel">
    14511449                                <div class="link-search-wrapper">
    14521450                                        <label>
    14531451                                                <span class="search-label"><?php _e( 'Search' ); ?></span>
    1454                                                 <input type="search" id="search-field" class="link-search-field" autocomplete="off" />
     1452                                                <input type="search" id="search-field" class="link-search-field" autocomplete="off" aria-describedby="query-notice-hint" />
    14551453                                                <span class="spinner"></span>
    14561454                                        </label>
    14571455                                </div>
    1458                                 <div id="search-results" class="query-results" tabindex="0">
    1459                                         <ul></ul>
    1460                                         <div class="river-waiting">
    1461                                                 <span class="spinner"></span>
     1456                                <div role="application" aria-label="<?php esc_attr_e( 'Links:' ); ?>">
     1457                                        <div id="search-results" class="query-results" tabindex="0" role="list" aria-label="<?php esc_attr_e( 'Search results:' ); ?>">
     1458                                                <ul aria-live="polite"></ul>
     1459                                                <div class="river-waiting">
     1460                                                        <span class="spinner"></span>
     1461                                                </div>
    14621462                                        </div>
    1463                                 </div>
    1464                                 <div id="most-recent-results" class="query-results" tabindex="0">
    1465                                         <div class="query-notice" id="query-notice-message">
    1466                                                 <em class="query-notice-default"><?php _e( 'No search term specified. Showing recent items.' ); ?></em>
    1467                                                 <em class="query-notice-hint screen-reader-text"><?php _e( 'Search or use up and down arrow keys to select an item.' ); ?></em>
     1463                                        <div id="most-recent-results" class="query-results" tabindex="0" role="list" aria-labelledby="query-notice-default">
     1464                                                <div class="query-notice" id="query-notice-message">
     1465                                                        <em class="query-notice-default" id="query-notice-default"><?php _e( 'No search term specified. Showing recent items.' ); ?></em>
     1466                                                        <em class="query-notice-hint screen-reader-text" id="query-notice-hint"><?php _e( 'Search or use up and down arrow keys to select an item.' ); ?></em>
     1467                                                </div>
     1468                                                <ul></ul>
     1469                                                <div class="river-waiting">
     1470                                                        <span class="spinner"></span>
     1471                                                </div>
    14681472                                        </div>
    1469                                         <ul></ul>
    1470                                         <div class="river-waiting">
    1471                                                 <span class="spinner"></span>
    1472                                         </div>
    14731473                                </div>
    14741474                        </div>
    14751475                </div>
    14761476                <div class="submitbox">
    14771477                        <div id="wp-link-cancel">
    1478                                 <a class="submitdelete deletion" href="#"><?php _e( 'Cancel' ); ?></a>
     1478                                <button type="button" id="wp-link-cancel-button" class="button"><?php _e( 'Cancel' ); ?></button>
    14791479                        </div>
    14801480                        <div id="wp-link-update">
    14811481                                <input type="submit" value="<?php esc_attr_e( 'Add Link' ); ?>" class="button button-primary" id="wp-link-submit" name="wp-link-submit">

  • src/wp-includes/css/editor.css

     
    919919        padding: 10px;
    920920        margin: 1px 0 0;
    921921        line-height: 150%;
    922         border: 0 none;
     922        border: 0;
    923923        outline: none;
    924924        display: block;
    925925        resize: vertical;
    … …  
    11881188        -webkit-box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.3 );
    11891189        box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.3 );
    11901190        width: 500px;
    1191         height: 250px;
     1191        height: 260px;
    11921192        overflow: hidden;
    11931193        margin-left: -250px;
    11941194        margin-top: -125px;
    … …  
    12201220}
    12211221
    12221222#wp-link-wrap.search-panel-visible {
    1223         height: 500px;
    1224         margin-top: -250px;
     1223        height: 510px;
     1224        margin-top: -255px;
    12251225}
    12261226
    12271227#link-modal-title {
    … …  
    12311231        font-size: 18px;
    12321232        font-weight: 600;
    12331233        line-height: 36px;
     1234        margin: 0;
    12341235        padding: 0 36px 0 16px;
    1235         top: 0;
    1236         right: 0;
    1237         left: 0;
    12381236}
    12391237
    12401238#wp-link-close {
    … …  
    12971295        padding: 0;
    12981296}
    12991297
     1298#wp-link-search-toggle {
     1299        font-style: normal;
     1300}
     1301
    13001302#wp-link-search-toggle:after {
    13011303        display: inline-block;
    1302         font: normal 20px/1 'dashicons';
     1304        font: normal 20px/26px 'dashicons';
    13031305        vertical-align: top;
    13041306        speak: none;
    13051307        -webkit-font-smoothing: antialiased;
    … …  
    13251327        margin: 3px 0;
    13261328}
    13271329
     1330#wp-link div.howto {
     1331        margin: 0 0 12px 85px;
     1332}
     1333
    13281334#wp-link p.howto a {
    13291335        text-decoration: none;
    13301336        color: inherit;
    13311337}
    13321338
    1333 #wp-link-search-toggle {
    1334         cursor: pointer;
    1335 }
    1336 
    13371339#wp-link label input[type="text"] {
    13381340        margin-top: 5px;
    13391341        width: 70%;
    … …  
    13501352
    13511353#wp-link .link-search-field {
    13521354        float: left;
    1353         width: 250px;
    1354         max-width: 70%;
     1355        width: 70%;
    13551356}
    13561357
    13571358#wp-link .link-search-wrapper {
    … …  
    13751376        white-space: nowrap;
    13761377        overflow: hidden;
    13771378        text-overflow: ellipsis;
     1379        max-width: 90%;
    13781380}
    13791381
    1380 #wp-link .link-target label {
    1381         max-width: 70%;
    1382 }
    1383 
    13841382#wp-link .query-results {
    13851383        border: 1px #dfdfdf solid;
    13861384        margin: 0;
    … …  
    13901388        left: 16px;
    13911389        right: 16px;
    13921390        bottom: 16px;
    1393         top: 205px;
     1391        top: 215px;
    13941392}
    13951393
    13961394#wp-link li {
    … …  
    14011399        padding: 4px 6px 4px 10px;
    14021400        cursor: pointer;
    14031401        position: relative;
     1402        outline: 0;
    14041403}
    14051404
    14061405#wp-link .query-notice {
    … …  
    18861885
    18871886#wp-fullscreen-buttons .mce-btn button {
    18881887    margin: 0;
    1889     outline: 0 none;
    1890     border: 0 none;
     1888    outline: 0;
     1889    border: 0;
    18911890    white-space: nowrap;
    18921891    width: auto;
    18931892    background: none;

  • src/wp-includes/js/wplink.js

     
    55        var editor, searchTimer, River, Query,
    66                inputs = {},
    77                rivers = {},
    8                 isTouch = ( 'ontouchend' in document );
     8                isTouch = ( 'ontouchend' in document ),
     9                visible;
    910
    1011        wpLink = {
    1112                timeToTriggerRiver: 150,
    1213                minRiverAJAXDuration: 200,
    1314                riverBottomThreshold: 5,
    14                 keySensitivity: 100,
     15                keySensitivity: 150,
    1516                lastSearch: '',
    1617                textarea: '',
    1718
    … …  
    2829                        inputs.title = $( '#link-title-field' );
    2930                        // Advanced Options
    3031                        inputs.openInNewTab = $( '#link-target-checkbox' );
     32                        inputs.searchToggle = $( '#wp-link-search-toggle' );
    3133                        inputs.search = $( '#search-field' );
    3234                        // Build Rivers
    3335                        rivers.search = new River( $( '#search-results' ) );
    … …  
    4648                                event.preventDefault();
    4749                                wpLink.update();
    4850                        });
    49                         inputs.close.add( inputs.backdrop ).add( '#wp-link-cancel a' ).click( function( event ) {
     51                        inputs.close.add( inputs.backdrop ).add( '#wp-link-cancel-button' ).click( function( event ) {
    5052                                event.preventDefault();
    5153                                wpLink.close();
    5254                        });
    5355
    54                         $( '#wp-link-search-toggle' ).on( 'click', wpLink.toggleInternalLinking );
     56                        inputs.searchToggle.on( 'click', wpLink.toggleInternalLinking );
    5557
    5658                        rivers.elements.on( 'river-select', wpLink.updateFields );
    5759
    … …  
    125127                        // Refresh rivers (clear links, check visibility)
    126128                        rivers.search.refresh();
    127129                        rivers.recent.refresh();
     130                        visible = inputs.wrap.hasClass( 'search-panel-visible' );
    128131
    129132                        if ( wpLink.isMCE() ) {
    130133                                wpLink.mceRefresh();
    … …  
    146149                        if ( ! rivers.recent.ul.children().length ) {
    147150                                rivers.recent.ajax();
    148151                        }
     152
     153                        // Toggle the button aria-expanded attribute.
     154                        if ( visible ) {
     155                                inputs.searchToggle.attr( 'aria-expanded', 'true' );
     156                        } else {
     157                                inputs.searchToggle.attr( 'aria-expanded', 'false' );
     158                        }
    149159                },
    150160
    151161                mceRefresh: function() {
    … …  
    195205                },
    196206
    197207                update: function() {
    198                         if ( wpLink.isMCE() )
     208                        if ( wpLink.isMCE() ) {
    199209                                wpLink.mceUpdate();
    200                         else
     210                        } else {
    201211                                wpLink.htmlUpdate();
     212                        }
    202213                },
    203214
    204215                htmlUpdate: function() {
    … …  
    205216                        var attrs, html, begin, end, cursor, title, selection,
    206217                                textarea = wpLink.textarea;
    207218
    208                         if ( ! textarea )
     219                        if ( ! textarea ) {
    209220                                return;
     221                        }
    210222
    211223                        attrs = wpLink.getAttrs();
    212224
    213225                        // If there's no href, return.
    214                         if ( ! attrs.href || attrs.href == 'http://' )
     226                        if ( ! attrs.href || attrs.href == 'http://' ) {
    215227                                return;
     228                        }
    216229
    217230                        // Build HTML
    218231                        html = '<a href="' + attrs.href + '"';
    … …  
    248261                                cursor      = begin + html.length;
    249262
    250263                                // If no text is selected, place the cursor inside the closing tag.
    251                                 if ( begin == end )
     264                                if ( begin == end ) {
    252265                                        cursor -= '</a>'.length;
     266                                }
    253267
    254268                                textarea.value = textarea.value.substring( 0, begin ) + html +
    255269                                        textarea.value.substring( end, textarea.value.length );
    … …  
    328342                                rivers.search.show();
    329343
    330344                                // Don't search if the keypress didn't change the title.
    331                                 if ( wpLink.lastSearch == search )
     345                                if ( wpLink.lastSearch == search ) {
    332346                                        return;
     347                                }
    333348
    334349                                wpLink.lastSearch = search;
    335350                                waiting = t.parent().find('.spinner').show();
    … …  
    379394                                return;
    380395                        }
    381396
    382                         if ( document.activeElement &&
    383                                 ( document.activeElement.id === 'link-title-field' || document.activeElement.id === 'url-field' ) ) {
     397                        if ( document.activeElement && (
     398                                'wp-link-close' === document.activeElement.id ||
     399                                'link-title-field' === document.activeElement.id ||
     400                                'url-field' === document.activeElement.id ||
     401                                'link-target-checkbox' === document.activeElement.id ||
     402                                'wp-link-search-toggle' === document.activeElement.id ||
     403                                'wp-link-cancel-button' === document.activeElement.id ||
     404                                'wp-link-submit' === document.activeElement.id
     405                                ) ) {
    384406                                return;
    385407                        }
    386408
    … …  
    403425                delayedCallback: function( func, delay ) {
    404426                        var timeoutTriggered, funcTriggered, funcArgs, funcContext;
    405427
    406                         if ( ! delay )
     428                        if ( ! delay ) {
    407429                                return func;
     430                        }
    408431
    409432                        setTimeout( function() {
    410                                 if ( funcTriggered )
     433                                if ( funcTriggered ) {
    411434                                        return func.apply( funcContext, funcArgs );
     435                                }
    412436                                // Otherwise, wait.
    413437                                timeoutTriggered = true;
    414438                        }, delay );
    415439
    416440                        return function() {
    417                                 if ( timeoutTriggered )
     441                                if ( timeoutTriggered ) {
    418442                                        return func.apply( this, arguments );
     443                                }
    419444                                // Otherwise, wait.
    420445                                funcArgs = arguments;
    421446                                funcContext = this;
    … …  
    424449                },
    425450
    426451                toggleInternalLinking: function( event ) {
    427                         var visible = inputs.wrap.hasClass( 'search-panel-visible' );
     452                        visible = inputs.wrap.hasClass( 'search-panel-visible' );
    428453
    429454                        inputs.wrap.toggleClass( 'search-panel-visible', ! visible );
    430455                        setUserSetting( 'wplink', visible ? '0' : '1' );
    431                         inputs[ ! visible ? 'search' : 'url' ].focus();
     456                        if ( ! visible ) {
     457                                inputs.search.focus();
     458                                inputs.searchToggle.attr( 'aria-expanded', 'true' );
     459                        } else {
     460                                inputs.searchToggle.attr( 'aria-expanded', 'false' );
     461                        }
    432462                        event.preventDefault();
    433463                }
    434464        };
    … …  
    471501                select: function( li, event ) {
    472502                        var liHeight, elHeight, liTop, elTop;
    473503
    474                         if ( li.hasClass( 'unselectable' ) || li == this.selected )
     504                        if ( li.hasClass( 'unselectable' ) || li == this.selected ) {
    475505                                return;
     506                        }
    476507
    477508                        this.deselect();
    478                         this.selected = li.addClass( 'selected' );
     509                        this.selected = li.addClass( 'selected' ).attr( 'aria-selected', 'true' ).focus();
    479510                        // Make sure the element is visible
    480511                        liHeight = li.outerHeight();
    481512                        elHeight = this.element.height();
    … …  
    482513                        liTop = li.position().top;
    483514                        elTop = this.element.scrollTop();
    484515
    485                         if ( liTop < 0 ) // Make first visible element
     516                        if ( liTop < 0 ) { // Make first visible element
    486517                                this.element.scrollTop( elTop + liTop );
    487                         else if ( liTop + liHeight > elHeight ) // Make last visible element
     518                        } else if ( liTop + liHeight > elHeight ) { // Make last visible element
    488519                                this.element.scrollTop( elTop + liTop - elHeight + liHeight );
     520                        }
    489521
    490522                        // Trigger the river-select event
    491523                        this.element.trigger( 'river-select', [ li, event, this ] );
    492524                },
    493525                deselect: function() {
    494                         if ( this.selected )
    495                                 this.selected.removeClass( 'selected' );
     526                        if ( this.selected ) {
     527                                this.selected.removeClass( 'selected' ).attr( 'aria-selected', 'false' );
     528                        }
    496529                        this.selected = false;
    497530                },
    498531                prev: function() {
    499                         if ( ! this.visible )
     532                        if ( ! this.visible ) {
    500533                                return;
     534                        }
    501535
    502536                        var to;
    503537                        if ( this.selected ) {
    504538                                to = this.selected.prev( 'li' );
    505                                 if ( to.length )
     539                                if ( to.length ) {
    506540                                        this.select( to );
     541                                }
    507542                        }
    508543                },
    509544                next: function() {
    510                         if ( ! this.visible )
     545                        if ( ! this.visible ) {
    511546                                return;
     547                        }
    512548
    513549                        var to = this.selected ? this.selected.next( 'li' ) : $( 'li:not(.unselectable):first', this.element );
    514                         if ( to.length )
     550                        if ( to.length ) {
    515551                                this.select( to );
     552                        }
    516553                },
    517554                ajax: function( callback ) {
    518555                        var self = this,
    … …  
    519556                                delay = this.query.page == 1 ? 0 : wpLink.minRiverAJAXDuration,
    520557                                response = wpLink.delayedCallback( function( results, params ) {
    521558                                        self.process( results, params );
    522                                         if ( callback )
     559                                        if ( callback ) {
    523560                                                callback( results, params );
     561                                        }
    524562                                }, delay );
    525563
    526564                        this.query.ajax( response );
    527565                },
    528566                change: function( search ) {
    529                         if ( this.query && this._search == search )
     567                        if ( this.query && this._search == search ) {
    530568                                return;
     569                        }
    531570
    532571                        this._search = search;
    533572                        this.query = new Query( search );
    … …  
    546585                                $.each( results, function() {
    547586                                        classes = alt ? 'alternate' : '';
    548587                                        classes += this.title ? '' : ' no-title';
    549                                         list += classes ? '<li class="' + classes + '">' : '<li>';
     588                                        list += classes ? '<li class="' + classes + '" tabindex="-1" role="listitem">' : '<li tabindex="-1" role="listitem">';
    550589                                        list += '<input type="hidden" class="item-permalink" value="' + this.permalink + '" />';
    551590                                        list += '<span class="item-title">';
    552591                                        list += this.title ? this.title : wpLinkL10n.noTitle;
    … …  
    562601                                el = this.element,
    563602                                bottom = el.scrollTop() + el.height();
    564603
    565                         if ( ! this.query.ready() || bottom < this.contentHeight.height() - wpLink.riverBottomThreshold )
     604                        if ( ! this.query.ready() || bottom < this.contentHeight.height() - wpLink.riverBottomThreshold ) {
    566605                                return;
     606                        }
    567607
    568608                        setTimeout(function() {
    569609                                var newTop = el.scrollTop(),
    570610                                        newBottom = newTop + el.height();
    571611
    572                                 if ( ! self.query.ready() || newBottom < self.contentHeight.height() - wpLink.riverBottomThreshold )
     612                                if ( ! self.query.ready() || newBottom < self.contentHeight.height() - wpLink.riverBottomThreshold ) {
    573613                                        return;
     614                                }
    574615
    575616                                self.waiting.show();
    576617                                el.scrollTop( newTop + self.waiting.outerHeight() );
    … …  
    601642                                        '_ajax_linking_nonce' : inputs.nonce.val()
    602643                                };
    603644
    604                         if ( this.search )
     645                        if ( this.search ) {
    605646                                query.search = this.search;
     647                        }
    606648
    607649                        this.querying = true;
    608650