https://www.aila.org/store/js/add-to-cart.js?1789390028

1/* global $ */
2/* global DEBUG_MODE */
3
4const cartUrl = '/shop/customers/view-shopping-cart';
5const loadingIcon = '<i class="fas fa-spinner fa-spin"></i>';
6const addToCartIcon = '<i class="fas fa-cart-plus"></i>';
7
8document.addEventListener("DOMContentLoaded", function (event) {
9    "use strict";
10
11    document.addEventListener('click', function (event) {
12
13        const element = event.target.closest('a');
14        if (element === null) {
15            return;
16        }
17
18        if (element.matches('[data-ecommerce-action=addToCart')) {
19            let loading = element.querySelector('.loading');
20            let loaded = element.querySelector('.loaded');
21
22            if (loading !== null) {
23                loading.classList.toggle('d-none');
24            }
25
26            if (loaded != null) {
27                loaded.classList.toggle('d-none');
28            }
29        }
30    })
31
32    document.addEventListener('oecommerce-update-ui', function (event) {
33        if (event.detail && event.detail.cart) {
34            lockAddToCartButton(event.detail.cart);
35        }
36    });
37
38    document.addEventListener('click', function (event) {
39        const element = event.target;
40
41        if (element.matches('.gallery-image.swappable')) {
42            const mainImage = document.getElementById('gallery-image-main');
43
44            if (mainImage == null) {
45                printDebug('Main image not found!');
46
47                return;
48            }
49
50            if (!mainImage.hasAttribute('src') || !element.hasAttribute('src')) {
51                printDebug('Main image/swap image "src" attribute not found!');
52
53                return;
54            }
55
56            const oldSrc = mainImage.getAttribute('src');
57
58            // Swap main and image and clicked element
59            mainImage.setAttribute('src', element.src);
60            element.setAttribute('src', oldSrc);
61        }
62    });
63});
64
65function lockButton(button, text = LABEL_ALREADY_IN_CART)
66{
67    // Change button color to dark
68    button.classList.remove('navy50');
69    button.classList.add('blue50');
70
71    // Change button text
72    button.textContent = text;
73
74    // Disable button
75    button.classList.add('disabled');   // for <a>s
76    button.disabled = true;             // for <button>s
77
78    let $button = $(button);
79
80    let classes = $button.attr("class") + " cart-override";
81    let $cartLink = $(`<a href="${CART_URL}" class="${classes}">${LABEL_ALREADY_IN_CART}</a>`);
82    $cartLink.removeClass("disabled");
83    $button.after($cartLink);
84    $button.hide();
85}
86
87function lockAddToCartButton(cart)
88{
89    if (!cart) {
90        return;
91    }
92
93    if (!cart.hasOwnProperty('line_items')) {
94        return;
95    }
96
97    cart.line_items.forEach(function (line_item) {
98        if (!line_item.hasOwnProperty('product_id')) {
99            return;
100        }
101        if (line_item.hasOwnProperty("combo_id") && line_item.combo_id && line_item.combo_id.length > 0) {
102            return;
103        }
104        if (line_item.hasOwnProperty("is_ailalink_subscription") && line_item.is_ailalink_subscription) {
105            let ailalinkButtons = document.querySelectorAll("a.is-ailalink, button.is-ailalink");
106            ailalinkButtons.forEach(function (button) {
107                lockButton(button, "Limit One");
108            });
109        }
110
111        // show the success alert
112        let successModalAlert = '.modal.show .success-' + line_item.product_id;
113        $(successModalAlert).show();
114
115        let addToCartButton = $('#addToCartButton' + line_item.product_id);
116        // Change button color to dark
117        addToCartButton.removeClass('btn-primary');
118        addToCartButton.removeClass('btn-secondary');
119        addToCartButton.addClass('btn-dark');
120
121        // Change button text
122        addToCartButton.text(LABEL_ALREADY_IN_CART);
123
124        // Disable button
125        addToCartButton.prop('disabled', true);
126
127        const selectorSuffix = `[data-ecommerce-action="addToCart"][data-product-id="${line_item.product_id}"]`;
128        const ctaButtons = document.querySelectorAll(`a${selectorSuffix}, button${selectorSuffix}`);
129
130        if (ctaButtons.length === 0) {
131            return;
132        }
133
134        ctaButtons.forEach(function (button) {
135            lockButton(button);
136        });
137    });
138}
139
140function printDebug(debugMessage)
141{
142    if (DEBUG_MODE) {

143        console.debug(`add - to - cart: ${debugMessage}`);
144    }
145}
146
147function chk_attestation_scroll(e)
148{
149    let elem = $(e.currentTarget);
150    if ((elem[0].scrollHeight - elem.scrollTop())-10 <= elem.outerHeight()) {
151        // If attestation has been scrolled entirely, enable agree to terms
152        elem.next("div").find(".agree-to-terms").prop("disabled", false).removeClass("disabled");
153    }
154}
155
156$(document).ready(function () {
157    $(".add-to-cart-quantity").change(function (e) {
158        let quantity = $(this);
159        let productId = quantity.attr("data-product-id");
160        let cartButton = $(`.add-to-cart-button[data-product-id="${productId}"]`);
161
162        cartButton.attr('data-quantity', quantity.val());
163    });
164
165    if (window.location.hash) {
166        $(`a[href$="${window.location.hash}"]`).tab("show");
167    }
168
169    // Disabled all agree to terms
170    $('.agree-to-terms').prop("disabled", true).addClass("disabled");
171    $('.attestions').on('scroll', chk_attestation_scroll);
172
173});