wp-admin/js/inline-edit-post.js

   1 /* global inlineEditL10n, ajaxurl, typenow */
   2 window.wp = window.wp || {};
   3
   4 var inlineEditPost;
   5 ( function( $, wp ) {
   6 inlineEditPost = {
   7
   8         init : function(){
   9                 var t = this, qeRow = $('#inline-edit'), bulkRow = $('#bulk-edit');
  10
  11                 t.type = $('table.widefat').hasClass('pages') ? 'page' : 'post';
  12                 t.what = '#post-';
  13
  14                 // prepare the edit rows
  15                 qeRow.keyup(function(e){
  16                         if ( e.which === 27 ) {
  17                                 return inlineEditPost.revert();
  18                         }
  19                 });
  20                 bulkRow.keyup(function(e){
  21                         if ( e.which === 27 ) {
  22                                 return inlineEditPost.revert();
  23                         }
  24                 });
  25
  26                 $( '.cancel', qeRow ).click( function() {
  27                         return inlineEditPost.revert();
  28                 });
  29                 $( '.save', qeRow ).click( function() {
  30                         return inlineEditPost.save(this);
  31                 });
  32                 $('td', qeRow).keydown(function(e){
  33                         if ( e.which === 13 && ! $( e.target ).hasClass( 'cancel' ) ) {
  34                                 return inlineEditPost.save(this);
  35                         }
  36                 });
  37
  38                 $( '.cancel', bulkRow ).click( function() {
  39                         return inlineEditPost.revert();
  40                 });
  41
  42                 $('#inline-edit .inline-edit-private input[value="private"]').click( function(){
  43                         var pw = $('input.inline-edit-password-input');
  44                         if ( $(this).prop('checked') ) {
  45                                 pw.val('').prop('disabled', true);
  46                         } else {
  47                                 pw.prop('disabled', false);
  48                         }
  49                 });
  50
  51                 // add events
  52                 $('#the-list').on( 'click', 'a.editinline', function( e ) {
  53                         e.preventDefault();
  54                         inlineEditPost.edit(this);
  55                 });
  56
  57                 $('#bulk-edit').find('fieldset:first').after(
  58                         $('#inline-edit fieldset.inline-edit-categories').clone()
  59                 ).siblings( 'fieldset:last' ).prepend(
  60                         $('#inline-edit label.inline-edit-tags').clone()
  61                 );
  62
  63                 $('select[name="_status"] option[value="future"]', bulkRow).remove();
  64
  65                 $('#doaction, #doaction2').click(function(e){
  66                         var n;
  67
  68                         t.whichBulkButtonId = $( this ).attr( 'id' );
  69                         n = t.whichBulkButtonId.substr( 2 );
  70
  71                         if ( 'edit' === $( 'select[name="' + n + '"]' ).val() ) {
  72                                 e.preventDefault();
  73                                 t.setBulk();
  74                         } else if ( $('form#posts-filter tr.inline-editor').length > 0 ) {
  75                                 t.revert();
  76                         }
  77                 });
  78         },
  79
  80         toggle : function(el){
  81                 var t = this;
  82                 $( t.what + t.getId( el ) ).css( 'display' ) === 'none' ? t.revert() : t.edit( el );
  83         },
  84
  85         setBulk : function(){
  86                 var te = '', type = this.type, c = true;
  87                 this.revert();
  88
  89                 $( '#bulk-edit td' ).attr( 'colspan', $( 'th:visible, td:visible', '.widefat:first thead' ).length );
  90                 // Insert the editor at the top of the table with an empty row above to maintain zebra striping.
  91                 $('table.widefat tbody').prepend( $('#bulk-edit') ).prepend('<tr class="hidden"></tr>');
  92                 $('#bulk-edit').addClass('inline-editor').show();
  93
  94                 $( 'tbody th.check-column input[type="checkbox"]' ).each( function() {
  95                         if ( $(this).prop('checked') ) {
  96                                 c = false;
  97                                 var id = $(this).val(), theTitle;
  98                                 theTitle = $('#inline_'+id+' .post_title').html() || inlineEditL10n.notitle;
  99                                 te += '<div id="ttle'+id+'"><a id="_'+id+'" class="ntdelbutton" title="'+inlineEditL10n.ntdeltitle+'">X</a>'+theTitle+'</div>';
 100                         }
 101                 });
 102
 103                 if ( c ) {
 104                         return this.revert();
 105                 }
 106
 107                 $('#bulk-titles').html(te);
 108                 $('#bulk-titles a').click(function(){
 109                         var id = $(this).attr('id').substr(1);
 110
 111                         $('table.widefat input[value="' + id + '"]').prop('checked', false);
 112                         $('#ttle'+id).remove();
 113                 });
 114
 115                 // enable autocomplete for tags
 116                 if ( 'post' === type ) {
 117                         $( 'tr.inline-editor textarea[data-wp-taxonomy]' ).each( function ( i, element ) {
 118                                 $( element ).wpTagsSuggest();
 119                         } );
 120                 }
 121                 $('html, body').animate( { scrollTop: 0 }, 'fast' );
 122         },
 123
 124         edit : function(id) {
 125                 var t = this, fields, editRow, rowData, status, pageOpt, pageLevel, nextPage, pageLoop = true, nextLevel, f, val, pw;
 126                 t.revert();
 127
 128                 if ( typeof(id) === 'object' ) {
 129                         id = t.getId(id);
 130                 }
 131
 132                 fields = ['post_title', 'post_name', 'post_author', '_status', 'jj', 'mm', 'aa', 'hh', 'mn', 'ss', 'post_password', 'post_format', 'menu_order', 'page_template'];
 133                 if ( t.type === 'page' ) {
 134                         fields.push('post_parent');
 135                 }
 136
 137                 // add the new edit row with an extra blank row underneath to maintain zebra striping.
 138                 editRow = $('#inline-edit').clone(true);
 139                 $( 'td', editRow ).attr( 'colspan', $( 'th:visible, td:visible', '.widefat:first thead' ).length );
 140
 141                 $(t.what+id).removeClass('is-expanded').hide().after(editRow).after('<tr class="hidden"></tr>');
 142
 143                 // populate the data
 144                 rowData = $('#inline_'+id);
 145                 if ( !$(':input[name="post_author"] option[value="' + $('.post_author', rowData).text() + '"]', editRow).val() ) {
 146                         // author no longer has edit caps, so we need to add them to the list of authors
 147                         $(':input[name="post_author"]', editRow).prepend('<option value="' + $('.post_author', rowData).text() + '">' + $('#' + t.type + '-' + id + ' .author').text() + '</option>');
 148                 }
 149                 if ( $( ':input[name="post_author"] option', editRow ).length === 1 ) {
 150                         $('label.inline-edit-author', editRow).hide();
 151                 }
 152
 153                 for ( f = 0; f < fields.length; f++ ) {
 154                         val = $('.'+fields[f], rowData);
 155                         // Deal with Twemoji
 156                         val.find( 'img' ).replaceWith( function() { return this.alt; } );
 157                         val = val.text();
 158                         $(':input[name="' + fields[f] + '"]', editRow).val( val );
 159                 }
 160
 161                 if ( $( '.comment_status', rowData ).text() === 'open' ) {
 162                         $( 'input[name="comment_status"]', editRow ).prop( 'checked', true );
 163                 }
 164                 if ( $( '.ping_status', rowData ).text() === 'open' ) {
 165                         $( 'input[name="ping_status"]', editRow ).prop( 'checked', true );
 166                 }
 167                 if ( $( '.sticky', rowData ).text() === 'sticky' ) {
 168                         $( 'input[name="sticky"]', editRow ).prop( 'checked', true );
 169                 }
 170
 171                 // hierarchical taxonomies
 172                 $('.post_category', rowData).each(function(){
 173                         var taxname,
 174                                 term_ids = $(this).text();
 175
 176                         if ( term_ids ) {
 177                                 taxname = $(this).attr('id').replace('_'+id, '');
 178                                 $('ul.'+taxname+'-checklist :checkbox', editRow).val(term_ids.split(','));
 179                         }
 180                 });
 181
 182                 //flat taxonomies
 183                 $('.tags_input', rowData).each(function(){
 184                         var terms = $(this),
 185                                 taxname = $(this).attr('id').replace('_' + id, ''),
 186                                 textarea = $('textarea.tax_input_' + taxname, editRow),
 187                                 comma = inlineEditL10n.comma;
 188
 189                         terms.find( 'img' ).replaceWith( function() { return this.alt; } );
 190                         terms = terms.text();
 191
 192                         if ( terms ) {
 193                                 if ( ',' !== comma ) {
 194                                         terms = terms.replace(/,/g, comma);
 195                                 }
 196                                 textarea.val(terms);
 197                         }
 198
 199                         textarea.wpTagsSuggest();
 200                 });
 201
 202                 // handle the post status
 203                 status = $('._status', rowData).text();
 204                 if ( 'future' !== status ) {
 205                         $('select[name="_status"] option[value="future"]', editRow).remove();
 206                 }
 207
 208                 pw = $( '.inline-edit-password-input' ).prop( 'disabled', false );
 209                 if ( 'private' === status ) {
 210                         $('input[name="keep_private"]', editRow).prop('checked', true);
 211                         pw.val( '' ).prop( 'disabled', true );
 212                 }
 213
 214                 // remove the current page and children from the parent dropdown
 215                 pageOpt = $('select[name="post_parent"] option[value="' + id + '"]', editRow);
 216                 if ( pageOpt.length > 0 ) {
 217                         pageLevel = pageOpt[0].className.split('-')[1];
 218                         nextPage = pageOpt;
 219                         while ( pageLoop ) {
 220                                 nextPage = nextPage.next('option');
 221                                 if ( nextPage.length === 0 ) {
 222                                         break;
 223                                 }
 224
 225                                 nextLevel = nextPage[0].className.split('-')[1];
 226
 227                                 if ( nextLevel <= pageLevel ) {
 228                                         pageLoop = false;
 229                                 } else {
 230                                         nextPage.remove();
 231                                         nextPage = pageOpt;
 232                                 }
 233                         }
 234                         pageOpt.remove();
 235                 }
 236
 237                 $(editRow).attr('id', 'edit-'+id).addClass('inline-editor').show();
 238                 $('.ptitle', editRow).focus();
 239
 240                 return false;
 241         },
 242
 243         // Ajax saving is only for Quick Edit.
 244         save : function(id) {
 245                 var params, fields, page = $('.post_status_page').val() || '';
 246
 247                 if ( typeof(id) === 'object' ) {
 248                         id = this.getId(id);
 249                 }
 250
 251                 $( 'table.widefat .spinner' ).addClass( 'is-active' );
 252
 253                 params = {
 254                         action: 'inline-save',
 255                         post_type: typenow,
 256                         post_ID: id,
 257                         edit_date: 'true',
 258                         post_status: page
 259                 };
 260
 261                 fields = $('#edit-'+id).find(':input').serialize();
 262                 params = fields + '&' + $.param(params);
 263
 264                 // make ajax request
 265                 $.post( ajaxurl, params,
 266                         function(r) {
 267                                 var $errorSpan = $( '#edit-' + id + ' .inline-edit-save .error' );
 268
 269                                 $( 'table.widefat .spinner' ).removeClass( 'is-active' );
 270                                 $( '.ac_results' ).hide();
 271
 272                                 if (r) {
 273                                         if ( -1 !== r.indexOf( '<tr' ) ) {
 274                                                 $(inlineEditPost.what+id).siblings('tr.hidden').addBack().remove();
 275                                                 $('#edit-'+id).before(r).remove();
 276                                                 $( inlineEditPost.what + id ).hide().fadeIn( 400, function() {
 277                                                         // Move focus back to the Quick Edit link. $( this ) is the row being animated.
 278                                                         $( this ).find( '.editinline' ).focus();
 279                                                         wp.a11y.speak( inlineEditL10n.saved );
 280                                                 });
 281                                         } else {
 282                                                 r = r.replace( /<.[^<>]*?>/g, '' );
 283                                                 $errorSpan.html( r ).show();
 284                                                 wp.a11y.speak( $errorSpan.text() );
 285                                         }
 286                                 } else {
 287                                         $errorSpan.html( inlineEditL10n.error ).show();
 288                                         wp.a11y.speak( inlineEditL10n.error );
 289                                 }
 290                         },
 291                 'html');
 292                 // Prevent submitting the form when pressing Enter on a focused field.
 293                 return false;
 294         },
 295
 296         // Revert is for both Quick Edit and Bulk Edit.
 297         revert : function(){
 298                 var $tableWideFat = $( '.widefat' ),
 299                         id = $( '.inline-editor', $tableWideFat ).attr( 'id' );
 300
 301                 if ( id ) {
 302                         $( '.spinner', $tableWideFat ).removeClass( 'is-active' );
 303                         $( '.ac_results' ).hide();
 304
 305                         if ( 'bulk-edit' === id ) {
 306                                 $( '#bulk-edit', $tableWideFat ).removeClass( 'inline-editor' ).hide().siblings( '.hidden' ).remove();
 307                                 $('#bulk-titles').empty();
 308                                 $('#inlineedit').append( $('#bulk-edit') );
 309                                 // Move focus back to the Bulk Action button that was activated.
 310                                 $( '#' + inlineEditPost.whichBulkButtonId ).focus();
 311                         } else {
 312                                 $('#'+id).siblings('tr.hidden').addBack().remove();
 313                                 id = id.substr( id.lastIndexOf('-') + 1 );
 314                                 // Show the post row and move focus back to the Quick Edit link.
 315                                 $( this.what + id ).show().find( '.editinline' ).focus();
 316                         }
 317                 }
 318
 319                 return false;
 320         },
 321
 322         getId : function(o) {
 323                 var id = $(o).closest('tr').attr('id'),
 324                         parts = id.split('-');
 325                 return parts[parts.length - 1];
 326         }
 327 };
 328
 329 $( document ).ready( function(){ inlineEditPost.init(); } );
 330
 331 // Show/hide locks on posts
 332 $( document ).on( 'heartbeat-tick.wp-check-locked-posts', function( e, data ) {
 333         var locked = data['wp-check-locked-posts'] || {};
 334
 335         $('#the-list tr').each( function(i, el) {
 336                 var key = el.id, row = $(el), lock_data, avatar;
 337
 338                 if ( locked.hasOwnProperty( key ) ) {
 339                         if ( ! row.hasClass('wp-locked') ) {
 340                                 lock_data = locked[key];
 341                                 row.find('.column-title .locked-text').text( lock_data.text );
 342                                 row.find('.check-column checkbox').prop('checked', false);
 343
 344                                 if ( lock_data.avatar_src ) {
 345                                         avatar = $( '<img class="avatar avatar-18 photo" width="18" height="18" alt="" />' ).attr( 'src', lock_data.avatar_src.replace( /&amp;/g, '&' ) );
 346                                         row.find('.column-title .locked-avatar').empty().append( avatar );
 347                                 }
 348                                 row.addClass('wp-locked');
 349                         }
 350                 } else if ( row.hasClass('wp-locked') ) {
 351                         // Make room for the CSS animation
 352                         row.removeClass('wp-locked').delay(1000).find('.locked-info span').empty();
 353                 }
 354         });
 355 }).on( 'heartbeat-send.wp-check-locked-posts', function( e, data ) {
 356         var check = [];
 357
 358         $('#the-list tr').each( function(i, el) {
 359                 if ( el.id ) {
 360                         check.push( el.id );
 361                 }
 362         });
 363
 364         if ( check.length ) {
 365                 data['wp-check-locked-posts'] = check;
 366         }
 367 }).ready( function() {
 368         // Set the heartbeat interval to 15 sec.
 369         if ( typeof wp !== 'undefined' && wp.heartbeat ) {
 370                 wp.heartbeat.interval( 15 );
 371         }
 372 });
 373
 374 })( jQuery, window.wp );