Elep

/**
 * This function is used to disable a group of fields when a toggle is disabled,
 * enable it when its enabled ( both during page load and while changing the settings )
 *
 * @param {jQuery} field JQuery object for selected field
 * @param {jQuery} inverse_fields JQuery object for inverse fields.
 * @param {string} attribute The attribute to toggle (defaults to readonly)
 */
function ilj_menu_settings_inverse_fields(field, inverse_fields, attribute = 'readonly') {
  ilj_menu_settings_toggle_fields(field.prop('checked'), inverse_fields, attribute);
  field.on('change', function () {
    ilj_menu_settings_toggle_fields(field.prop('checked'), inverse_fields, attribute);
  });
}

/**
 * Disable the fields and its corresponding row.
 * @param {boolean} toggle Set to disabled or enabled based on this boolean.
 * @param {jQuery} inverse_fields The jQuery object for fields.
 * @param {string} attribute The attribute to toggle.
 */
function ilj_menu_settings_toggle_fields(toggle, inverse_fields, attribute) {
  if (toggle) {
    inverse_fields.each(function () {
      jQuery(this).prop(attribute, false).closest('tr').find('th').removeClass('inactive');
    });
  } else {
    inverse_fields.each(function () {
      jQuery(this).prop(attribute, true).closest('tr').find('th').addClass('inactive');
    });
  }
}
jQuery(function ($) {
  $('#ilj_settings_field_editor_role, #ilj_settings_field_index_generation, #ilj_settings_field_whitelist, #ilj_settings_field_taxonomy_whitelist,#ilj_settings_field_limit_taxonomy_list, #ilj_settings_field_keyword_order, #ilj_settings_field_no_link_tags').ilj_select2({
    minimumResultsForSearch: 10,
    width: '50%'
  });

/**
   * ilj_settings_field_custom_fields_to_link_post, ilj_settings_field_custom_fields_to_link_term now supports
   * the regex rule matching. For example if the user types 'apple' in to the field we have to show the following three
   * options
   *
   * 1. Custom field name starts with 'apple'
   * 2. Custom field name ends with 'apple'
   * 3. Custom field name contains 'apple'
   *
   * To accomplish this behaviour we use the insertTag() option of select2 to dynamically add tags.
   */
  $('#ilj_settings_field_custom_fields_to_link_post, #ilj_settings_field_custom_fields_to_link_term').ilj_select2({
    minimumResultsForSearch: 10,
    width: '50%',
    tags: true,
    insertTag: function (data, tag) {
      // Collect existing ids to perform O(1) lookup in a set.
      var ids = new Set(data.map(e => e.id));
      var startsWithId = `starts_with:${tag.id}`.trim();
      var endsWithId = `ends_with:${tag.id}`.trim();
      var containsId = `contains:${tag.id}`.trim();
      if (!ids.has(startsWithId)) {
        data.push({
          newOption: true,
          id: startsWithId,
          text: ilj_select2_translation.custom_field_starts_with.replace('%s', tag.text)
        });
      }
      if (!ids.has(endsWithId)) {
        data.push({
          newOption: true,
          id: endsWithId,
          text: ilj_select2_translation.custom_field_ends_with.replace('%s', tag.text)
        });
      }
      if (!ids.has(containsId)) {
        data.push({
          newOption: true,
          id: containsId,
          text: ilj_select2_translation.custom_field_has.replace('%s', tag.text)
        });
      }
    }
  });

/***
   * When the user clicks on any one of the dynamically added option, we have to add them to select2 options
   * and make it selected.
   */
  $('#ilj_settings_field_custom_fields_to_link_post, #ilj_settings_field_custom_fields_to_link_term').on('select2:select', function (e) {
    if (e.params.data.newOption) {
      var data = e.params.data;
      // Create a DOM Option and pre-select by default
      var newOption = new Option(data.text, data.id, true, true);
      // Append it to the select using the current selected ID
      $(this).append(newOption).trigger('change');
    }
  });

/**
   * Toggle max incoming links field by limit incoming links toggle.
   */
  ilj_menu_settings_inverse_fields(jQuery('#ilj_settings_field_limit_incoming_links'), jQuery('#ilj_settings_field_max_incoming_links'));
  ilj_dynamicSelect('#ilj_settings_field_blacklist', 'ilj_search_posts', 20);
  ilj_dynamicSelect('#ilj_settings_field_term_blacklist', 'ilj_search_terms', 20);

/**
   * Toggle "links_per_page" and "links_per_target" depending on multiple keyword state
   */
  jQuery('#ilj_settings_field_multiple_keywords').on('change', function () {
    var $inverse_setting_field = jQuery('#ilj_settings_field_links_per_page, #ilj_settings_field_links_per_target, #ilj_settings_field_limit_incoming_links');
    if (this.checked) {
      $inverse_setting_field.each(function () {
        jQuery(this).closest('tr').find('th').addClass('inactive');
      });
      $inverse_setting_field.prop('disabled', true);
      jQuery("#ilj_settings_field_links_per_page").val("0");
      jQuery("#ilj_settings_field_links_per_target").val("0");
      jQuery('#ilj_settings_field_limit_incoming_links').val('0').prop('checked', false).trigger('change');
    } else {
      $inverse_setting_field.each(function () {
        jQuery(this).closest('tr').find('th').removeClass('inactive');
      });
      $inverse_setting_field.prop('disabled', false);
    }
  });
  jQuery('#ilj_settings_field_index_generation').on('change', function () {
    var $inverse_setting_field = jQuery('#ilj_settings_field_hide_status_bar');
    if (this.value == "index_mode_none") {
      $inverse_setting_field.each(function () {
        jQuery(this).closest('tr').find('th').addClass('inactive');
      });
      $inverse_setting_field.prop('disabled', true);
    } else {
      $inverse_setting_field.each(function () {
        jQuery(this).closest('tr').find('th').removeClass('inactive');
      });
      $inverse_setting_field.prop('disabled', false);
    }
  });
  var index_generation_mode = jQuery('#ilj_settings_field_index_generation').val();
  if (index_generation_mode == 'index_mode_none') {
    // Do something here
    var disable_hide_status_bar_option = jQuery("#ilj_settings_field_hide_status_bar");
    disable_hide_status_bar_option.each(function () {
      jQuery(this).closest('tr').find('th').addClass('inactive');
    });
    disable_hide_status_bar_option.prop('disabled', true);
  }
  jQuery(document).ready(function () {
    var $multiple_keywords = jQuery('#ilj_settings_field_multiple_keywords');
    var $inverse_setting_field = jQuery('#ilj_settings_field_links_per_page, #ilj_settings_field_links_per_target');
    if (!$multiple_keywords.length) {
      return;
    }
    if ($multiple_keywords[0].checked) {
      $inverse_setting_field.each(function () {
        jQuery(this).closest('tr').find('th').addClass('inactive');
      });
      $inverse_setting_field.prop('disabled', true);
    } else {
      $inverse_setting_field.prop('disabled', false);
    }
  });

/**
   * Adding Tooltip
   */
  var tipsoConfig = {
    width: '',
    maxWidth: '200',
    useTitle: true,
    delay: 100,
    speed: 500,
    background: '#32373c',
    color: '#eeeeee',
    size: 'small'
  };
  jQuery('.tip').iljtipso(tipsoConfig);
  jQuery(document).on('click', '.button.ilj-cancel-schedules', function (e) {
    e.preventDefault();
    var user_confirmed = confirm(ilj_menu_settings_translation.confirm_cancel_message);
    if (!user_confirmed) {
      return;
    }
    if (jQuery(this).attr('disabled')) {
      return;
    }
    jQuery(this).after(jQuery('<span id="ilj-cancel-schedule-spinner" class="spinner is-active" style="float:none"></span>'));
    var data = {
      'action': 'ilj_cancel_schedules'
    };
    jQuery.ajax({
      url: ajaxurl,
      type: 'POST',
      data: data,
      statusCode: {
        500: function (xhr) {
          if (!'responseJSON' in xhr || !['success', 'error'].includes(xhr.responseJSON.status)) {
            return;
          }
          console.log('Error: ' + xhr.responseJSON.message);
        }
      },
      success: function (data, textStatus, xhr) {
        jQuery('#ilj-cancel-schedule-spinner').remove();

// Check if the success message is not already shown
        if (jQuery('#ilj-cancel-schedule-feedback').length === 0) {
          // Display a success message
          var successMessage = '<div id="ilj-cancel-schedule-feedback" class="notice notice-success is-dismissible"><p>' + ilj_menu_settings_translation.success_message + '</p></div>';
          jQuery(successMessage).insertAfter('.button.ilj-cancel-schedules');

// Remove the notice after 2 seconds
          setTimeout(function () {
            jQuery("#ilj-cancel-schedule-feedback").remove();
          }, 2000);
        }
      }
    });
  });
});