<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[38797] trunk/src: Accessible Tags autocomplete:</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta" style="font-size: 105%">
<dt style="float: left; width: 6em; font-weight: bold">Revision</dt> <dd><a style="font-weight: bold" href="https://core.trac.wordpress.org/changeset/38797">38797</a><script type="application/ld+json">{"@context":"http://schema.org","@type":"EmailMessage","description":"Review this Commit","action":{"@type":"ViewAction","url":"https://core.trac.wordpress.org/changeset/38797","name":"Review Commit"}}</script></dd>
<dt style="float: left; width: 6em; font-weight: bold">Author</dt> <dd>azaozz</dd>
<dt style="float: left; width: 6em; font-weight: bold">Date</dt> <dd>2016-10-14 22:39:49 +0000 (Fri, 14 Oct 2016)</dd>
</dl>
<pre style='padding-left: 1em; margin: 2em 0; border-left: 2px solid #ccc; line-height: 1.25; font-size: 105%; font-family: sans-serif'>Accessible Tags autocomplete:
- Replace suggest.js with UI Autocomplete.
- Use the same settings like in the editor link toolbar.
- Abstract it and add in a new file, tags-suggest.js. Then make it a dependency for the Tags postbox(es) and Quick and Bulk Edit.
- Add `data-wp-taxonomy` on all input elements to improve handling in the UI for custom taxonomies.
Props afercia, azaozz.
See <a href="https://core.trac.wordpress.org/ticket/33902">#33902</a>.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunksrcwpadminincludesclasswppostslisttablephp">trunk/src/wp-admin/includes/class-wp-posts-list-table.php</a></li>
<li><a href="#trunksrcwpadminincludesmetaboxesphp">trunk/src/wp-admin/includes/meta-boxes.php</a></li>
<li><a href="#trunksrcwpadminjsinlineeditpostjs">trunk/src/wp-admin/js/inline-edit-post.js</a></li>
<li><a href="#trunksrcwpadminjstagsboxjs">trunk/src/wp-admin/js/tags-box.js</a></li>
<li><a href="#trunksrcwpincludesscriptloaderphp">trunk/src/wp-includes/script-loader.php</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunksrcwpadminjstagssuggestjs">trunk/src/wp-admin/js/tags-suggest.js</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunksrcwpadminincludesclasswppostslisttablephp"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/wp-admin/includes/class-wp-posts-list-table.php</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/wp-admin/includes/class-wp-posts-list-table.php 2016-10-14 21:37:41 UTC (rev 38796)
+++ trunk/src/wp-admin/includes/class-wp-posts-list-table.php 2016-10-14 22:39:49 UTC (rev 38797)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1550,10 +1550,13 @@
</span><span class="cx" style="display: block; padding: 0 10px"> <?php if ( count( $flat_taxonomies ) && !$bulk ) : ?>
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> <?php foreach ( $flat_taxonomies as $taxonomy ) : ?>
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <?php if ( current_user_can( $taxonomy->cap->assign_terms ) ) : ?>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <?php if ( current_user_can( $taxonomy->cap->assign_terms ) ) :
+ $taxonomy_name = esc_attr( $taxonomy->name );
+
+ ?>
</ins><span class="cx" style="display: block; padding: 0 10px"> <label class="inline-edit-tags">
</span><span class="cx" style="display: block; padding: 0 10px"> <span class="title"><?php echo esc_html( $taxonomy->labels->name ) ?></span>
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <textarea cols="22" rows="1" name="tax_input[<?php echo esc_attr( $taxonomy->name )?>]" class="tax_input_<?php echo esc_attr( $taxonomy->name )?>"></textarea>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <textarea data-wp-taxonomy="<?php echo $taxonomy_name; ?>" cols="22" rows="1" name="tax_input[<?php echo $taxonomy_name; ?>]" class="tax_input_<?php echo $taxonomy_name; ?>"></textarea>
</ins><span class="cx" style="display: block; padding: 0 10px"> </label>
</span><span class="cx" style="display: block; padding: 0 10px"> <?php endif; ?>
</span><span class="cx" style="display: block; padding: 0 10px">
</span></span></pre></div>
<a id="trunksrcwpadminincludesmetaboxesphp"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/wp-admin/includes/meta-boxes.php</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/wp-admin/includes/meta-boxes.php 2016-10-14 21:37:41 UTC (rev 38796)
+++ trunk/src/wp-admin/includes/meta-boxes.php 2016-10-14 22:39:49 UTC (rev 38797)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -431,7 +431,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> <?php if ( $user_can_assign_terms ) : ?>
</span><span class="cx" style="display: block; padding: 0 10px"> <div class="ajaxtag hide-if-no-js">
</span><span class="cx" style="display: block; padding: 0 10px"> <label class="screen-reader-text" for="new-tag-<?php echo $tax_name; ?>"><?php echo $taxonomy->labels->add_new_item; ?></label>
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <p><input type="text" id="new-tag-<?php echo $tax_name; ?>" name="newtag[<?php echo $tax_name; ?>]" class="newtag form-input-tip" size="16" autocomplete="off" aria-describedby="new-tag-<?php echo $tax_name; ?>-desc" value="" />
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <p><input data-wp-taxonomy="<?php echo $tax_name; ?>" type="text" id="new-tag-<?php echo $tax_name; ?>" name="newtag[<?php echo $tax_name; ?>]" class="newtag form-input-tip" size="16" autocomplete="off" aria-describedby="new-tag-<?php echo $tax_name; ?>-desc" value="" />
</ins><span class="cx" style="display: block; padding: 0 10px"> <input type="button" class="button tagadd" value="<?php esc_attr_e('Add'); ?>" /></p>
</span><span class="cx" style="display: block; padding: 0 10px"> </div>
</span><span class="cx" style="display: block; padding: 0 10px"> <p class="howto" id="new-tag-<?php echo $tax_name; ?>-desc"><?php echo $taxonomy->labels->separate_items_with_commas; ?></p>
</span></span></pre></div>
<a id="trunksrcwpadminjsinlineeditpostjs"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/wp-admin/js/inline-edit-post.js</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/wp-admin/js/inline-edit-post.js 2016-10-14 21:37:41 UTC (rev 38796)
+++ trunk/src/wp-admin/js/inline-edit-post.js 2016-10-14 22:39:49 UTC (rev 38797)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -83,7 +83,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> setBulk : function(){
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- var te = '', type = this.type, tax, c = true;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ var te = '', type = this.type, c = true;
</ins><span class="cx" style="display: block; padding: 0 10px"> this.revert();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> $( '#bulk-edit td' ).attr( 'colspan', $( 'th:visible, td:visible', '.widefat:first thead' ).length );
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -114,9 +114,9 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> // enable autocomplete for tags
</span><span class="cx" style="display: block; padding: 0 10px"> if ( 'post' === type ) {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // support multi taxonomies?
- tax = 'post_tag';
- $('tr.inline-editor textarea[name="tax_input['+tax+']"]').suggest( ajaxurl + '?action=ajax-tag-search&tax=' + tax, { delay: 500, minchars: 2, multiple: true, multipleSep: inlineEditL10n.comma } );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $( 'tr.inline-editor textarea[data-wp-taxonomy]' ).each( function ( i, element ) {
+ $( element ).wpTagsSuggest();
+ } );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> $('html, body').animate( { scrollTop: 0 }, 'fast' );
</span><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -196,7 +196,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> textarea.val(terms);
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- textarea.suggest( ajaxurl + '?action=ajax-tag-search&tax=' + taxname, { delay: 500, minchars: 2, multiple: true, multipleSep: inlineEditL10n.comma } );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ textarea.wpTagsSuggest();
</ins><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> // handle the post status
</span></span></pre></div>
<a id="trunksrcwpadminjstagsboxjs"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/wp-admin/js/tags-box.js</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/wp-admin/js/tags-box.js 2016-10-14 21:37:41 UTC (rev 38796)
+++ trunk/src/wp-admin/js/tags-box.js 2016-10-14 22:39:49 UTC (rev 38797)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -4,6 +4,8 @@
</span><span class="cx" style="display: block; padding: 0 10px"> var tagBox, array_unique_noempty;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> ( function( $ ) {
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ var tagDelimiter = ( window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter ) || ',';
+
</ins><span class="cx" style="display: block; padding: 0 10px"> // Return an array with any duplicate, whitespace or empty values removed
</span><span class="cx" style="display: block; padding: 0 10px"> array_unique_noempty = function( array ) {
</span><span class="cx" style="display: block; padding: 0 10px"> var out = [];
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -20,13 +22,17 @@
</span><span class="cx" style="display: block; padding: 0 10px"> };
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> tagBox = {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- clean : function(tags) {
- var comma = window.tagsBoxL10n.tagDelimiter;
- if ( ',' !== comma )
- tags = tags.replace(new RegExp(comma, 'g'), ',');
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ clean : function( tags ) {
+ if ( ',' !== tagDelimiter ) {
+ tags = tags.replace( new RegExp( tagDelimiter, 'g' ), ',' );
+ }
+
</ins><span class="cx" style="display: block; padding: 0 10px"> tags = tags.replace(/\s*,\s*/g, ',').replace(/,+/g, ',').replace(/[,\s]+$/, '').replace(/^[,\s]+/, '');
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( ',' !== comma )
- tags = tags.replace(/,/g, comma);
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ if ( ',' !== tagDelimiter ) {
+ tags = tags.replace( /,/g, tagDelimiter );
+ }
+
</ins><span class="cx" style="display: block; padding: 0 10px"> return tags;
</span><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -35,8 +41,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> num = id.split('-check-num-')[1],
</span><span class="cx" style="display: block; padding: 0 10px"> taxbox = $(el).closest('.tagsdiv'),
</span><span class="cx" style="display: block; padding: 0 10px"> thetags = taxbox.find('.the-tags'),
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- comma = window.tagsBoxL10n.tagDelimiter,
- current_tags = thetags.val().split( comma ),
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ current_tags = thetags.val().split( tagDelimiter ),
</ins><span class="cx" style="display: block; padding: 0 10px"> new_tags = [];
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> delete current_tags[num];
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -48,7 +53,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- thetags.val( this.clean( new_tags.join( comma ) ) );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ thetags.val( this.clean( new_tags.join( tagDelimiter ) ) );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> this.quickClicks( taxbox );
</span><span class="cx" style="display: block; padding: 0 10px"> return false;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -65,7 +70,7 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> disabled = thetags.prop('disabled');
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- current_tags = thetags.val().split( window.tagsBoxL10n.tagDelimiter );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ current_tags = thetags.val().split( tagDelimiter );
</ins><span class="cx" style="display: block; padding: 0 10px"> tagchecklist.empty();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> $.each( current_tags, function( key, val ) {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -106,8 +111,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> flushTags : function( el, a, f ) {
</span><span class="cx" style="display: block; padding: 0 10px"> var tagsval, newtags, text,
</span><span class="cx" style="display: block; padding: 0 10px"> tags = $( '.the-tags', el ),
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- newtag = $( 'input.newtag', el ),
- comma = window.tagsBoxL10n.tagDelimiter;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ newtag = $( 'input.newtag', el );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> a = a || false;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -118,10 +122,10 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> tagsval = tags.val();
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- newtags = tagsval ? tagsval + comma + text : text;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ newtags = tagsval ? tagsval + tagDelimiter + text : text;
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> newtags = this.clean( newtags );
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- newtags = array_unique_noempty( newtags.split( comma ) ).join( comma );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ newtags = array_unique_noempty( newtags.split( tagDelimiter ) ).join( tagDelimiter );
</ins><span class="cx" style="display: block; padding: 0 10px"> tags.val( newtags );
</span><span class="cx" style="display: block; padding: 0 10px"> this.quickClicks( el );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -153,32 +157,29 @@
</span><span class="cx" style="display: block; padding: 0 10px"> },
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> init : function() {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- var t = this, ajaxtag = $('div.ajaxtag');
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ var ajaxtag = $('div.ajaxtag');
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> $('.tagsdiv').each( function() {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- tagBox.quickClicks(this);
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ tagBox.quickClicks( this );
</ins><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $('.tagadd', ajaxtag).click(function(){
- t.flushTags( $(this).closest('.tagsdiv') );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $( '.tagadd', ajaxtag ).click( function() {
+ tagBox.flushTags( $( this ).closest( '.tagsdiv' ) );
</ins><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $('input.newtag', ajaxtag).keyup(function(e){
- if ( 13 == e.which ) {
- tagBox.flushTags( $(this).closest('.tagsdiv') );
- return false;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $( 'input.newtag', ajaxtag ).keyup( function( event ) {
+ if ( 13 == event.which ) {
+ tagBox.flushTags( $( this ).closest( '.tagsdiv' ) );
+ event.preventDefault();
+ event.stopPropagation();
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- }).keypress(function(e){
- if ( 13 == e.which ) {
- e.preventDefault();
- return false;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ }).keypress( function( event ) {
+ if ( 13 == event.which ) {
+ event.preventDefault();
+ event.stopPropagation();
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- }).each( function() {
- var tax = $(this).closest('div.tagsdiv').attr('id');
- $(this).suggest(
- ajaxurl + '?action=ajax-tag-search&tax=' + tax,
- { delay: 500, minchars: 2, multiple: true, multipleSep: window.tagsBoxL10n.tagDelimiter }
- );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ }).each( function( i, element ) {
+ $( element ).wpTagsSuggest();
</ins><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> // save tags on post save/publish
</span></span></pre></div>
<a id="trunksrcwpadminjstagssuggestjs"></a>
<div class="addfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Added: trunk/src/wp-admin/js/tags-suggest.js</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/wp-admin/js/tags-suggest.js (rev 0)
+++ trunk/src/wp-admin/js/tags-suggest.js 2016-10-14 22:39:49 UTC (rev 38797)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -0,0 +1,167 @@
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+( function( $ ) {
+ var tempID = 0;
+ var separator = ( window.tagsSuggestL10n && window.tagsSuggestL10n.tagDelimiter ) || ',';
+
+ function split( val ) {
+ return val.split( new RegExp( separator + '\\s*' ) );
+ }
+
+ function getLast( term ) {
+ return split( term ).pop();
+ }
+
+ $.fn.wpTagsSuggest = function( options ) {
+ var cache;
+ var last;
+ var $element = $( this );
+
+ options = options || {};
+
+ var taxonomy = options.taxonomy || $element.attr( 'data-wp-taxonomy' ) || 'post_tag';
+
+ delete( options.taxonomy );
+
+ options = $.extend( {
+ source: function( request, response ) {
+ var term;
+
+ if ( last === request.term ) {
+ response( cache );
+ return;
+ }
+
+ term = getLast( request.term );
+
+ $.get( window.ajaxurl, {
+ action: 'ajax-tag-search',
+ tax: taxonomy,
+ q: term
+ } ).always( function() {
+ $element.removeClass( 'ui-autocomplete-loading' ); // UI fails to remove this sometimes?
+ } ).done( function( data ) {
+ var value;
+ var terms = [];
+
+ if ( data ) {
+ data = data.split( '\n' );
+
+ for ( value in data ) {
+ var id = ++tempID;
+
+ terms.push({
+ id: id,
+ name: data[value]
+ });
+ }
+
+ cache = terms;
+ response( terms );
+ } else {
+ response( terms );
+ }
+ } );
+
+ last = request.term;
+ },
+ focus: function( event, ui ) {
+ $element.attr( 'aria-activedescendant', 'wp-tags-autocomplete-' + ui.item.id );
+
+ // Don't empty the input field when using the arrow keys to
+ // highlight items. See api.jqueryui.com/autocomplete/#event-focus
+ event.preventDefault();
+ },
+ select: function( event, ui ) {
+ var tags = split( $element.val() );
+ // Remove the last user input.
+ tags.pop();
+ // Append the new tag and an empty element to get one more separator at the end.
+ tags.push( ui.item.name, '' );
+
+ $element.val( tags.join( separator + ' ' ) );
+
+ if ( $.ui.keyCode.TAB === event.keyCode ) {
+ if ( typeof window.uiAutocompleteL10n !== 'undefined' ) {
+ // Audible confirmation message when a tag has been selected.
+ window.wp.a11y.speak( window.uiAutocompleteL10n.itemSelected );
+ }
+
+ event.preventDefault();
+ } else if ( $.ui.keyCode.ENTER === event.keyCode ) {
+ // Do not close Quick Edit / Bulk Edit
+ event.preventDefault();
+ event.stopPropagation();
+ }
+
+ return false;
+ },
+ open: function() {
+ $element.attr( 'aria-expanded', 'true' );
+ },
+ close: function() {
+ $element.attr( 'aria-expanded', 'false' );
+ },
+ minLength: 2,
+ position: {
+ my: 'left top+2'
+ },
+ messages: {
+ noResults: ( typeof window.uiAutocompleteL10n !== 'undefined' ) ? window.uiAutocompleteL10n.noResults : '',
+ results: function( number ) {
+ if ( typeof window.uiAutocompleteL10n !== 'undefined' ) {
+ if ( number > 1 ) {
+ return window.uiAutocompleteL10n.manyResults.replace( '%d', number );
+ }
+
+ return window.uiAutocompleteL10n.oneResult;
+ }
+ }
+ }
+ }, options );
+
+ $element.on( 'keydown', function() {
+ $element.removeAttr( 'aria-activedescendant' );
+ } )
+ .autocomplete( options )
+ .autocomplete( 'instance' )._renderItem = function( ul, item ) {
+ return $( '<li role="option" id="wp-tags-autocomplete-' + item.id + '">' )
+ .text( item.name )
+ .appendTo( ul );
+ };
+
+ $element.attr( {
+ 'role': 'combobox',
+ 'aria-autocomplete': 'list',
+ 'aria-expanded': 'false',
+ 'aria-owns': $element.autocomplete( 'widget' ).attr( 'id' )
+ } )
+ .on( 'focus', function() {
+ var inputValue = split( $element.val() ).pop();
+
+ // Don't trigger a search if the field is empty.
+ // Also, avoids screen readers announce `No search results`.
+ if ( inputValue ) {
+ $element.autocomplete( 'search' );
+ }
+ } )
+ // Returns a jQuery object containing the menu element.
+ .autocomplete( 'widget' )
+ .addClass( 'wp-tags-autocomplete' )
+ .attr( 'role', 'listbox' )
+ .removeAttr( 'tabindex' ) // Remove the `tabindex=0` attribute added by jQuery UI.
+
+ // Looks like Safari and VoiceOver need an `aria-selected` attribute. See ticket #33301.
+ // The `menufocus` and `menublur` events are the same events used to add and remove
+ // the `ui-state-focus` CSS class on the menu items. See jQuery UI Menu Widget.
+ .on( 'menufocus', function( event, ui ) {
+ ui.item.attr( 'aria-selected', 'true' );
+ })
+ .on( 'menublur', function() {
+ // The `menublur` event returns an object where the item is `null`
+ // so we need to find the active item with other means.
+ $( this ).find( '[aria-selected="true"]' ).removeAttr( 'aria-selected' );
+ });
+
+ return this;
+ };
+
+}( jQuery ) );
</ins><span class="cx" style="display: block; padding: 0 10px">Property changes on: trunk/src/wp-admin/js/tags-suggest.js
</span><span class="cx" style="display: block; padding: 0 10px">___________________________________________________________________
</span></span></pre></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Added: svn:eol-style</h4></div>
<ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+native
</ins><span class="cx" style="display: block; padding: 0 10px">\ No newline at end of property
</span><a id="trunksrcwpincludesscriptloaderphp"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/wp-includes/script-loader.php</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/wp-includes/script-loader.php 2016-10-14 21:37:41 UTC (rev 38796)
+++ trunk/src/wp-includes/script-loader.php 2016-10-14 22:39:49 UTC (rev 38797)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -234,6 +234,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> 'oneResult' => __( '1 result found. Use up and down arrow keys to navigate.' ),
</span><span class="cx" style="display: block; padding: 0 10px"> /* translators: %d: Number of results found when using jQuery UI Autocomplete */
</span><span class="cx" style="display: block; padding: 0 10px"> 'manyResults' => __( '%d results found. Use up and down arrow keys to navigate.' ),
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ 'itemSelected' => __( 'Item selected.' ),
</ins><span class="cx" style="display: block; padding: 0 10px"> ) );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> // deprecated, not used in core, most functionality is included in jQuery 1.3
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -241,7 +242,6 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> // jQuery plugins
</span><span class="cx" style="display: block; padding: 0 10px"> $scripts->add( 'jquery-color', "/wp-includes/js/jquery/jquery.color.min.js", array('jquery'), '2.1.1', 1 );
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $scripts->add( 'suggest', "/wp-includes/js/jquery/suggest$suffix.js", array('jquery'), '1.1-20110113', 1 );
</del><span class="cx" style="display: block; padding: 0 10px"> $scripts->add( 'schedule', '/wp-includes/js/jquery/jquery.schedule.js', array('jquery'), '20m', 1 );
</span><span class="cx" style="display: block; padding: 0 10px"> $scripts->add( 'jquery-query', "/wp-includes/js/jquery/jquery.query.js", array('jquery'), '2.1.7', 1 );
</span><span class="cx" style="display: block; padding: 0 10px"> $scripts->add( 'jquery-serialize-object', "/wp-includes/js/jquery/jquery.serialize-object.js", array('jquery'), '0.2', 1 );
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -249,6 +249,9 @@
</span><span class="cx" style="display: block; padding: 0 10px"> $scripts->add( 'jquery-table-hotkeys', "/wp-includes/js/jquery/jquery.table-hotkeys$suffix.js", array('jquery', 'jquery-hotkeys'), false, 1 );
</span><span class="cx" style="display: block; padding: 0 10px"> $scripts->add( 'jquery-touch-punch', "/wp-includes/js/jquery/jquery.ui.touch-punch.js", array('jquery-ui-widget', 'jquery-ui-mouse'), '0.2.2', 1 );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Not used any more, registered for backwards compatibility.
+ $scripts->add( 'suggest', "/wp-includes/js/jquery/suggest$suffix.js", array('jquery'), '1.1-20110113', 1 );
+
</ins><span class="cx" style="display: block; padding: 0 10px"> // Masonry v2 depended on jQuery. v3 does not. The older jquery-masonry handle is a shiv.
</span><span class="cx" style="display: block; padding: 0 10px"> // It sets jQuery as a dependency, as the theme may have been implicitly loading it this way.
</span><span class="cx" style="display: block; padding: 0 10px"> $scripts->add( 'imagesloaded', "/wp-includes/js/imagesloaded.min.js", array(), '3.2.0', 1 );
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -523,8 +526,10 @@
</span><span class="cx" style="display: block; padding: 0 10px"> 'postBoxEmptyString' => __( 'Drag boxes here' ),
</span><span class="cx" style="display: block; padding: 0 10px"> ) );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $scripts->add( 'tags-box', "/wp-admin/js/tags-box$suffix.js", array( 'jquery', 'suggest' ), false, 1 );
- did_action( 'init' ) && $scripts->localize( 'tags-box', 'tagsBoxL10n', array(
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $scripts->add( 'tags-box', "/wp-admin/js/tags-box$suffix.js", array( 'jquery', 'tags-suggest' ), false, 1 );
+
+ $scripts->add( 'tags-suggest', "/wp-admin/js/tags-suggest$suffix.js", array( 'jquery-ui-autocomplete', 'wp-a11y' ), false, 1 );
+ did_action( 'init' ) && $scripts->localize( 'tags-suggest', 'tagsSuggestL10n', array(
</ins><span class="cx" style="display: block; padding: 0 10px"> 'tagDelimiter' => _x( ',', 'tag delimiter' ),
</span><span class="cx" style="display: block; padding: 0 10px"> ) );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -584,7 +589,7 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> $scripts->add( 'theme', "/wp-admin/js/theme$suffix.js", array( 'wp-backbone', 'wp-a11y' ), false, 1 );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $scripts->add( 'inline-edit-post', "/wp-admin/js/inline-edit-post$suffix.js", array( 'jquery', 'suggest', 'wp-a11y' ), false, 1 );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $scripts->add( 'inline-edit-post', "/wp-admin/js/inline-edit-post$suffix.js", array( 'jquery', 'tags-suggest', 'wp-a11y' ), false, 1 );
</ins><span class="cx" style="display: block; padding: 0 10px"> did_action( 'init' ) && $scripts->localize( 'inline-edit-post', 'inlineEditL10n', array(
</span><span class="cx" style="display: block; padding: 0 10px"> 'error' => __( 'Error while saving the changes.' ),
</span><span class="cx" style="display: block; padding: 0 10px"> 'ntdeltitle' => __( 'Remove From Bulk Edit' ),
</span></span></pre>
</div>
</div>
</body>
</html>