(function ($, Drupal, drupalSettings) {
    $(document).ready(function () {
      // User login form
      $("#content #user-login-form .form-type-textfield label").text(
        $("#content #user-login-form .form-type-textfield label")
          .text()
          .replace("Username", "Username or e-mail address")
      );
	  $("#block-userlogin #user-login-form .form-type-textfield label").text(
        $("#block-userlogin #user-login-form .form-type-textfield label")
          .text()
          .replace("Username or email address.", "Email")
      );
      $("#content #user-login-form").prepend(
        '<p class="heading-text mt-5">Please login using your email address to access members-only content.</p>'
      );
      $("#content #user-login-form .form-type-textfield").append(
        '<span class="field-desc">You may login with either your assigned username or your e-mail address.</span>'
      );
      $("#content #user-login-form .form-type-password").append(
        '<span class="field-desc">The password field is case sensitive.</span>'
      );
  
      // get window width
      // $(window).resize(function() {
      var windowWidth = $(window).width();
      if (windowWidth < 1024) {
        $("ul#superfish-main-navigation-accordion li .menuparent").click(
          function (event) {
            var element = $(this);
            var offsetX = event.offsetX;
            var elementWidth = element.width();
            var calculated_width = windowWidth - 50;
            // if (clickPercentageX >= 75 && clickPercentageY >= 75) {
            if (offsetX <= calculated_width) {
              window.location.href = element.attr("href");
            }
          }
        );
      }
      // });
  
      // Caption for images
      // Select all the images within the body tag
      $("body #content .field--name-field-body img, body #content .field--name-body img").each(function () {
        var altText = $(this).attr("alt"); // Get the alt text of the image
        var caption = $("<figcaption class='caption'>").text(altText); // Create a caption element with the alt text
    
        // Copy the CSS properties from the image to the caption
        var imgStyles = getComputedStyle(this);
    
        // Set width with px string and check float attribute
        var widthWithoutPx = parseInt(imgStyles.width, 10);
        var float_area = imgStyles.float;
    
        // Checking width of images
        if (widthWithoutPx < '450') {
          // If float left then it will apply
          if (float_area == 'left') {
              var parentDiv = $("<div style='float:left;'>");
              $(this).wrap(parentDiv);
          }else if(float_area == 'right' || $(this).hasClass('align-right')){
            var parentDiv = $("<div style='float:right;display: grid;'>");
            $(this).wrap(parentDiv);
          } else {
            var parentDiv = $("<div>");
            $(this).wrap(parentDiv);
          }
  
          parentDiv.css({
              width: imgStyles.width,
              float: imgStyles.float,
          });
          caption.css({
              width: imgStyles.width,
          });
    
        } else if (widthWithoutPx > '450') {

          if (float_area == 'left') {
            var parentDiv = $("<div style='float:left;'>");
            $(this).wrap(parentDiv);
            
          } else if (float_area == 'right' || $(this).hasClass('align-right') ) {
              var parentDiv = $("<div style='float:right;display: grid;'>");
              $(this).wrap(parentDiv);
            } else {
                var parentDiv = $("<div'>");
                $(this).wrap(parentDiv);
            }
            parentDiv.css({
                width: imgStyles.width,
                float: imgStyles.float,
            });
            caption.css({
                width: imgStyles.width,
            });
        } else {
            caption.css({
                width: imgStyles.width,
                float: imgStyles.float,
            });
        }
    
        if (altText !== "") {
          $(this).after(caption);
        }
    });
    

	  
	  // Remove target _blank attr 
      if ($("body").hasClass("role-staff_administrator") == true) {
	    $(".view-staff .view-content .views-row").each(function() {
		    var title_link = $(this).find('.content-title-link').text();
		    $(this).find('.title a').attr('href', title_link);
	    });
        $('.whole-staff .title a[target="_blank"]').removeAttr('target');
      }

      // var currentUrl = window.location.href;        
      // const url = new URL(currentUrl);
      // const pathAfterRoot = url.pathname;
      // const pathSegments = pathAfterRoot.split('/');      
      // const firstSegment = pathSegments[1];      
      // console.log(firstSegment);

    // Access the user ID from drupalSettings.
    
    
    var currentPath = window.location.pathname;
    var pathParts = currentPath.split('/');
    // Check if the first part of the path is '/users or user'
    if (pathParts.includes('user') || pathParts.includes('users')) {
      var userId = drupalSettings.mytheme.userId;
      $(".change-password").attr("href", "https://www.armscontrol.org/user/" + userId + "/edit");
    }




    });
  })(jQuery, Drupal, drupalSettings);