dynamic/foxystripe

View on GitHub
javascript/quantity.js

Summary

Maintainability
F
1 wk
Test Coverage
;(function ($) {
    var field = $("input[name='x:visibleQuantity']"),
        quantityField = $("input[name='quantity']"),
        getLink = function (element) {
            return element.parent().find("input[name='x:visibleQuantity']").data('link');
        },
        getLinkURL = function (link, data) {
            var delimiter = '?';
            if (link.indexOf('?') != -1) {
                delimiter = '&';
            }
            return link + delimiter + $.param(data)
        },
        getCode = function (element) {
            return element.parent().find("input[name='x:visibleQuantity']").data('code');
        },
        getId = function (element) {
            return element.parent().find("input[name='x:visibleQuantity']").data('id');
        },
        getLimit = function (element) {
            return element.parent().find("input[name='x:visibleQuantity']").data('limit');
        },
        updateLimit = function (element, newLimit) {
            return element.parent().find("input[name='x:visibleQuantity']").data('limit', newLimit);
        },
        getVisibleQuantityField = function (element) {
            return element.parent().parent().find("input[name='x:visibleQuantity']");
        },
        disableIncreaseButton = function(element) {
            element.parent().find("button.increase").attr('disabled', true);
        },
        enableIncreaseButton = function(element) {
            element.parent().find("button.increase").attr('disabled', false);
        },
        hideButtons = function(element) {
            element.parent().find("button.increase, button.reduced")
                .attr('disabled', true)
                .addClass('hidden');
        },
        outOfStock = function(element) {
            var form = element.parents('form[id^=FoxyStripePurchaseForm_PurchaseForm_]')
            var id = form.attr('id');

            form.find('fieldset')
                .html('<h4 id="' + id + '_unavailableText">Currently Out of Stock</h4>');
            form.find('input[name=action_x\\:submit]').remove();
        },
        disableSubmit = function (element) {
            element.parent().parent().parent().find('.fs-add-to-cart-button').attr('disabled', true);
        },
        enableSubmit = function (element) {
            element.parent().parent().parent().find('.fs-add-to-cart-button').attr('disabled', false);
        },
        queryNewValue = function (code, newValue, link, id, clicked) {
            var quantData = {
                'code': code,
                'value': newValue,
                'id': id,
                'isAjax': 1
            };

            $.ajax({
                type: 'get',
                url: getLinkURL(link, quantData),
            }).done(function (response) {
                var data = JSON.parse(response);

                if (data.hasOwnProperty('limit')) {
                    updateLimit(clicked, data.limit);

                    var visibleQuantity = getVisibleQuantityField(clicked);
                    if (data.limit < visibleQuantity.val()) {
                        visibleQuantity.val(data.limit);
                    }

                    if (data.limit == 0) {
                        outOfStock(clicked);
                    } else if (data.limit == 1) {
                        hideButtons(clicked);
                    } else if (data.limit == data.quantity) {
                        disableIncreaseButton(clicked);
                    } else {
                        enableIncreaseButton(clicked);
                    }
                }

                clicked.parent().parent().parent().parent().find("input[name='quantity']")
                    .val(data.quantityGenerated);
                enableSubmit(clicked);
            }).fail(function (xhr) {
                // because the form field no longer exists if it is out of stock
                if (xhr.status == 404 &&
                    xhr.responseText == "I can't handle sub-URLs on class SilverStripe\\Forms\\FormRequestHandler."
                ) {
                    outOfStock(clicked);
                } else {
                    console.log('Error: ' + xhr.responseText);
                }
            });
        };

    $(document).on('click', 'button.increase', function (event) {
        var visibleQuantity = getVisibleQuantityField($(this)),
            currentVal = visibleQuantity.val(),
            newValue = parseInt(currentVal) + 1;

        disableSubmit($(this));
        queryNewValue(getCode($(this)), newValue, getLink($(this)), getId($(this)), $(this));
        visibleQuantity.val(newValue);
    });

    $(document).on('click', 'button.reduced', function (event) {
        var visibleQuantity = getVisibleQuantityField($(this)),
            currentVal = visibleQuantity.val(),
            newValue = parseInt(currentVal) - 1;

        if (currentVal > 1) {
            disableSubmit($(this));
            queryNewValue(getCode($(this)), newValue, getLink($(this)), getId($(this)), $(this));
            visibleQuantity.val(newValue);
        }
    });

    $(document).ready(function() {
        $('button.increase').each(function() {
            var limit = getLimit($(this));
            if (limit == 1) {
                hideButtons($(this));
            } else if (limit == 0) {
                outOfStock($(this));
            }
        });
    });
}(jQuery));