roblib_alter_solr/js/help_modal.js

(function ($, Drupal) {
  Drupal.behaviors.robib_solr_alterlBehavior = {
    attach: function (context, settings) {
      $('#open-modal-link', context).click(function (e) {
        e.preventDefault();
        // Create the modal content
        var modalContent = '<div id="help-modal" class="modal">' +
          '<div class="modal-content">' +
          '<span class="close-button">&times;</span>' +
          '<h3>Append Solr Fields</h3>' +
          '<p>The form allows you append results from one or more Solr fields to an existing Solr field. <br>' +
          'Select Source fields from the dropdowns on the left to append them with a Destination field on the right.' +
          '</p>' +
          '<p>Multiple source fields may be appended to a single destination field.</p>'


        '</div>' +
        '</div>';

        $('body').append(modalContent);
        $('#help-modal').fadeIn();
        $("#open_link-wrapper").fadeOut();

        $('#help-modal .close-button').click(function () {
          $('#help-modal').fadeOut(function () {
            $("#open_link-wrapper").fadeIn();
            $('#help-modal').remove();
          });
        });

        $(window).click(function (event) {
          if ($(event.target).is('#help-modal')) {
            $("#open_link-wrapper").fadeIn();
            $('#help-modal').fadeOut(function () {
              $('#help-modal').remove();
            });
          }
        });
      });
    }
  };
})(jQuery, Drupal);