Невеликий фікс модуля Basic Cart в Drupal 9

Нажаль не всі модулі для друпал мають довгострокову підтримку і іноді, коли це невеликий але дієвий модуль, котрий ти використовуєш доволі часто починає працювати не правильно. Добре коли є час і бажання копирсатись в коді та виправляти його, але коли потрібне просте і дієве рішення можна зробити невелику правку - аби як працювало. 

Сьогодні ми виправимо проблему модуля Basic cart для Drupal 9, де при додавання товару у кошик повинен змінюватись текст кнопки додавання. І хоча в налаштуваннях навіть є поле для такого випадку, але в конкретно нашому випадку текст кнопки не змінювався. Тож для вирішиння питання ми відредагуємо стандартний скрипт модуля - basic_cart.js:

(function ($, Drupal, drupalSettings) {
  $(function () {
    $(".basic_cart-get-quantity").each(function () {
      var buttonId = $(this).attr('id');
      if (localStorage.getItem(buttonId) === "in_cart") {
        $(this).text("In Cart");
        $(this).addClass("disabled");
        $(this).attr("href", "#");
        $(this).prop("disabled", true);
      }
    });

    $(".addtocart-quantity-wrapper-container").each(function () {
      var this_id = $(this).attr('id');
      var id_split = this_id.split("_");
      var dynamic_id = "quantitydynamictext_" + id_split[1];
      var quantity_label = drupalSettings.basic_cart.label_value ? drupalSettings.basic_cart.label_value : 'Quantity';

      var dynamic_input = '<label for="edit-quantity" class="js-form-required form-required ' + drupalSettings.basic_cart.label_class
        + '">' + quantity_label + '</label> <input type="text" value="1" class="quantity_dynamic_text form-text required ' + drupalSettings.basic_cart.textfield_class
        + '" id="' + dynamic_id + '">';
      $(this).html(dynamic_input);
    });


    $(document).on('click', ".basic_cart-get-quantity", function (e) {
      e.preventDefault();
      e.stopPropagation();

      var this_ids = $(this).attr('id');
      var id_splited = this_ids.split("_");
      var quantity = $('#quantitydynamictext_' + id_splited[1]).val();

      var basic_cart_throbber = '<div id="basic-cart-ajax-progress-throbber_' + id_splited[1] + '" class="basic_cart-ajax-progress-throbber ajax-progress ajax-progress-throbber"><div class="basic_cart-throbber throbber">&nbsp;</div></div>';
      $('#forquantitydynamictext_' + id_splited[1]).after(basic_cart_throbber);

      if ($(this).hasClass('use-basic_cart-ajax')) {
        $.ajax({
          url: this.href + quantity,
          success: function (result) {

            $(".basic_cart-grid").each(function () {
              $(this).html(result.block);
            });

            $("#" + result.id).hide();
            $("#" + result.id).html(result.text);
            $(".basic_cart-circles").each(function () {
              $(this).html(result.count);
            });

            $("#" + result.id).fadeIn('slow').delay(1000).hide(2000);
            $('#basic-cart-ajax-progress-throbber_' + id_splited[1]).remove();

            var cart_block = $(".cart-block--summary");
            cart_block.addClass("cart_not_empty");
            var button = $("#forquantitydynamictext_" + id_splited[1]);
            button.text("In Cart");
            button.addClass("disabled");
            button.attr("href", "#");
            button.prop("disabled", true);

            localStorage.setItem(button.attr('id'), "in_cart");
          },
          error: function (xhr, ajaxOptions, thrownError) {
            $('#basic-cart-ajax-progress-throbber_' + id_splited[1]).remove();
            if (xhr.status == 403) {
              $('#ajax-addtocart-message-' + id_splited[1]).html('<p class="messages messages--error">You are not allowed to use the shopping cart</p>').show();
            } else {
              $('#ajax-addtocart-message-' + id_splited[1]).html('<p class="messages messages--error">Contact the site administration</p>').show();
            }
          }
        });
      } else {

        window.location.href = this.href + quantity;
      }
    });
  });
})(jQuery, Drupal, drupalSettings);

Також додамо дещо стилів для нвоого класу кнопки::

.disabled {
  pointer-events: none;
  cursor: not-allowed;
}

Тепер при додаванні до кошика товару, кнопка буде змінювати свій стан і зберігати його після перезавантаження сторінки.

Слід зауважити, що це лише швидке рішення, якщо вам потрібне повне виправлення проблеми краще звернутись до розробників модуля.

Простий текст

  • Не дозволено жодних HTML теґів.
  • Рядки й абзаци переносяться автоматично.
  • Адреси вебсторінок та адреси електронної пошти автоматично перетворюються у посилання.
Код мови коментаря.