[Summary view] [Print] [Text view]

   1  /**
   2   * Contains logic for deleting and adding tags.
   3   *
   4   * For deleting tags it makes a request to the server to delete the tag.
   5   * For adding tags it makes a request to the server to add the tag.
   6   *
   7   * @output wp-admin/js/tags.js
   8   */
   9  
  10   /* global ajaxurl, wpAjax, showNotice, validateForm */
  11  
  12  jQuery( function($) {
  13  
  14      var addingTerm = false;
  15  
  16      /**
  17       * Adds an event handler to the delete term link on the term overview page.
  18       *
  19       * Cancels default event handling and event bubbling.
  20       *
  21       * @since 2.8.0
  22       *
  23       * @return {boolean} Always returns false to cancel the default event handling.
  24       */
  25      $( '#the-list' ).on( 'click', '.delete-tag', function() {
  26          var t = $(this), tr = t.parents('tr'), r = true, data;
  27  
  28          if ( 'undefined' != showNotice )
  29              r = showNotice.warn();
  30  
  31          if ( r ) {
  32              data = t.attr('href').replace(/[^?]*\?/, '').replace(/action=delete/, 'action=delete-tag');
  33  
  34              tr.children().css('backgroundColor', '#faafaa');
  35  
  36              // Disable pointer events and all form controls/links in the row
  37              tr.css('pointer-events', 'none');
  38              tr.find(':input, a').prop('disabled', true).attr('tabindex', -1);
  39  
  40              /**
  41               * Makes a request to the server to delete the term that corresponds to the
  42               * delete term button.
  43               *
  44               * @param {string} r The response from the server.
  45               *
  46               * @return {void}
  47               */
  48              $.post(ajaxurl, data, function(r){
  49                  var message;
  50                  if ( '1' == r ) {
  51                      $('#ajax-response').empty();
  52                      let nextFocus = tr.next( 'tr' ).find( 'a.row-title' );
  53                      let prevFocus = tr.prev( 'tr' ).find( 'a.row-title' );
  54                      // If there is neither a next row or a previous row, focus the tag input field.
  55                      if ( nextFocus.length < 1 && prevFocus.length < 1 ) {
  56                          nextFocus = $( '#tag-name' ).trigger( 'focus' );
  57                      } else {
  58                          if ( nextFocus.length < 1 ) {
  59                              nextFocus = prevFocus;
  60                          }
  61                      }
  62  
  63                      tr.fadeOut('normal', function(){ tr.remove(); });
  64  
  65                      /**
  66                       * Removes the term from the parent box and the tag cloud.
  67                       *
  68                       * `data.match(/tag_ID=(\d+)/)[1]` matches the term ID from the data variable.
  69                       * This term ID is then used to select the relevant HTML elements:
  70                       * The parent box and the tag cloud.
  71                       */
  72                      $('select#parent option[value="' + data.match(/tag_ID=(\d+)/)[1] + '"]').remove();
  73                      $('a.tag-link-' + data.match(/tag_ID=(\d+)/)[1]).remove();
  74                      nextFocus.trigger( 'focus' );
  75                      message = wp.i18n.__( 'The selected tag has been deleted.' );
  76              
  77                  } else if ( '-1' == r ) {
  78                      message = wp.i18n.__( 'Sorry, you are not allowed to do that.' );
  79                      $('#ajax-response').empty().append('<div class="notice notice-error"><p>' + message + '</p></div>');
  80                      resetRowAfterFailure( tr );
  81  
  82                  } else {
  83                      message = wp.i18n.__( 'An error occurred while processing your request. Please try again later.' );
  84                      $('#ajax-response').empty().append('<div class="notice notice-error"><p>' + message + '</p></div>');
  85                      resetRowAfterFailure( tr );
  86                  }
  87                  wp.a11y.speak( message, 'assertive' );
  88              });
  89          }
  90  
  91          return false;
  92      });
  93  
  94      /**
  95       * Restores the original UI state of a table row after an AJAX failure.
  96       *
  97       * @param {jQuery} tr The table row to reset.
  98       * @return {void}
  99       */
 100  	function resetRowAfterFailure( tr ) {
 101          tr.children().css( 'backgroundColor', '' );
 102          tr.css( 'pointer-events', '' );
 103          tr.find( ':input, a' ).prop( 'disabled', false ).removeAttr( 'tabindex' );
 104      }
 105  
 106      /**
 107       * Adds a deletion confirmation when removing a tag.
 108       *
 109       * @since 4.8.0
 110       *
 111       * @return {void}
 112       */
 113      $( '#edittag' ).on( 'click', '.delete', function( e ) {
 114          if ( 'undefined' === typeof showNotice ) {
 115              return true;
 116          }
 117  
 118          // Confirms the deletion, a negative response means the deletion must not be executed.
 119          var response = showNotice.warn();
 120          if ( ! response ) {
 121              e.preventDefault();
 122          }
 123      });
 124  
 125      /**
 126       * Adds an event handler to the form submit on the term overview page.
 127       *
 128       * Cancels default event handling and event bubbling.
 129       *
 130       * @since 2.8.0
 131       *
 132       * @return {boolean} Always returns false to cancel the default event handling.
 133       */
 134      $('#submit').on( 'click', function(){
 135          var form = $(this).parents('form');
 136  
 137          if ( addingTerm ) {
 138              // If we're adding a term, noop the button to avoid duplicate requests.
 139              return false;
 140          }
 141  
 142          addingTerm = true;
 143          form.find( '.submit .spinner' ).addClass( 'is-active' );
 144  
 145          /**
 146           * Does a request to the server to add a new term to the database
 147           *
 148           * @param {string} r The response from the server.
 149           *
 150           * @return {void}
 151           */
 152          $.post(ajaxurl, $('#addtag').serialize(), function(r){
 153              var res, parent, term, indent, i;
 154  
 155              addingTerm = false;
 156              form.find( '.submit .spinner' ).removeClass( 'is-active' );
 157  
 158              $('#ajax-response').empty();
 159              res = wpAjax.parseAjaxResponse( r, 'ajax-response' );
 160  
 161              if ( res.errors && res.responses[0].errors[0].code === 'empty_term_name' ) {
 162                  validateForm( form );
 163              }
 164  
 165              if ( ! res || res.errors ) {
 166                  return;
 167              }
 168  
 169              parent = form.find( 'select#parent' ).val();
 170  
 171              // If the parent exists on this page, insert it below. Else insert it at the top of the list.
 172              if ( parent > 0 && $('#tag-' + parent ).length > 0 ) {
 173                  // As the parent exists, insert the version with - - - prefixed.
 174                  $( '.tags #tag-' + parent ).after( res.responses[0].supplemental.noparents );
 175              } else {
 176                  // As the parent is not visible, insert the version with Parent - Child - ThisTerm.
 177                  $( '.tags' ).prepend( res.responses[0].supplemental.parents );
 178              }
 179  
 180              $('.tags .no-items').remove();
 181  
 182              if ( form.find('select#parent') ) {
 183                  // Parents field exists, Add new term to the list.
 184                  term = res.responses[1].supplemental;
 185  
 186                  // Create an indent for the Parent field.
 187                  indent = '';
 188                  for ( i = 0; i < res.responses[1].position; i++ )
 189                      indent += '&nbsp;&nbsp;&nbsp;';
 190  
 191                  form.find( 'select#parent option:selected' ).after( '<option value="' + term.term_id + '">' + indent + term.name + '</option>' );
 192              }
 193  
 194              $('input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):visible, textarea:visible', form).val('');
 195          });
 196  
 197          return false;
 198      });
 199  
 200  });