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
 12jQuery( 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});
201