CouponCodeInput.js

/**
 * CouponCodeInput
 *
 * @module package/quiqqer/coupons/bin/frontend/classes/CouponCodeInput
 * @author www.pcsg.de (Patrick Müller)
 */
define('package/quiqqer/coupons/bin/frontend/controls/CouponCodeInput', [

    'qui/controls/Control',
    'qui/controls/loader/Loader',

    'package/quiqqer/coupons/bin/frontend/CouponCodes',

    'Ajax',
    'Locale',
    'Mustache',

    'text!package/quiqqer/coupons/bin/frontend/controls/CouponCodeInput.html',
    'css!package/quiqqer/coupons/bin/frontend/controls/CouponCodeInput.css'

], function (QUIControl, QUILoader, CouponCodes, QUIAjax, QUILocale, Mustache, template) {
    "use strict";

    var lg = 'quiqqer/coupons';

    return new Class({

        Extends: QUIControl,
        Type   : 'package/quiqqer/coupons/bin/frontend/controls/CouponCodeInput',

        Binds: [
            '$submit'
        ],

        initialize: function (options) {
            this.parent(options);

            this.$Input   = null;
            this.Loader   = new QUILoader();
            this.$running = false;

            this.addEvents({
                onInject: this.$onInject
            });
        },

        /**
         * Event: onInject
         */
        $onInject: function () {
            var self     = this;
            var lgPrefix = 'controls.frontend.CouponCodeInput.template.';

            this.$Elm.addClass('quiqqer-coupons-field');

            this.$Elm.set('html', Mustache.render(template, {
                labelInput           : QUILocale.get(lg, lgPrefix + 'labelInput'),
                labelInputPlaceholder: QUILocale.get(lg, lgPrefix + 'labelInputPlaceholder'),
                submitBtnText        : QUILocale.get(lg, lgPrefix + 'submitBtnText')
            }));

            this.Loader.inject(this.$Elm);

            this.$Input = this.$Elm.getElement('input[name="code"]');

            this.$Input.addEvent('keyup', function (event) {
                if (event.code === 13) {
                    self.$submit();
                }
            });

            this.$Elm.getElement(
                'button.quiqqer-coupons-couponcodeinput-btn'
            ).addEvent('click', function (event) {
                event.stop();
                self.$submit();
            });

            if (this.isInOrder()) {
                var OrderProcess = this.getOrderProcess();

                new Promise(function (resolve) {
                    if (!OrderProcess.isLoaded()) {
                        return OrderProcess.addEvent('onLoad', resolve);
                    }

                    resolve();
                }).then(function () {
                    if (OrderProcess.getAttribute('basketEditable') === false) {
                        // remove coupon codes button
                        new Element('button', {
                            'class': 'quiqqer-coupons-remove',
                            'html' : '<span class="fa fa-close"></span>',
                            title  : QUILocale.get(lg, 'remove.coupons.button'),
                            events : {
                                click: function (e) {
                                    e.stop();
                                    self.removeCouponsFromOrder().catch(function (e) {
                                        console.error(e);
                                    });
                                }
                            }
                        }).inject(self.$Elm.getElement('.quiqqer-coupons-couponcodeinput'));
                    }
                });
            }
        },

        /**
         * Submit a CouponCode
         */
        $submit: function () {
            if (this.$running) {
                return;
            }

            var self = this;
            var code = this.$Input.value.trim();

            if (code === '') {
                this.$Input.focus();
                return;
            }

            this.$running = true;
            this.Loader.show();

            // get order process
            if (!this.isInOrder()) {
                QUIAjax.get('package_quiqqer_order_ajax_frontend_basket_getLastOrder', function (order) {
                    CouponCodes.addCouponCodeToBasket(code, order.hash).then(function (redeemed) {
                        if (!redeemed) {
                            self.$running = false;
                            self.Loader.hide();
                            return;
                        }

                        QUIAjax.get('package_quiqqer_order_ajax_frontend_basket_getOrderProcessUrl', function (url) {
                            window.location = url + '?coupon=' + code;
                        }, {
                            'package': 'quiqqer/order'
                        });
                    });
                }, {
                    'package': 'quiqqer/order'
                });

                return;
            }

            var OrderProcess = this.getOrderProcess();

            OrderProcess.Loader.show();

            OrderProcess.getOrder().then(function (orderHash) {
                return CouponCodes.addCouponCodeToBasket(code, orderHash);
            }).then(function (redeemed) {
                self.$running = false;

                if (redeemed === false) {
                    OrderProcess.Loader.hide();
                    self.Loader.hide();
                    return;
                }

                OrderProcess.reload();
            });
        },

        /**
         * Is the coupon in the order process?
         * @return {boolean}
         */
        isInOrder: function () {
            var OrderProcessNode = this.getElm().getParent(
                '[data-qui="package/quiqqer/order/bin/frontend/controls/OrderProcess"]'
            );

            return !!OrderProcessNode;
        },

        /**
         * Return the order process
         *
         * @return {Object}
         */
        getOrderProcess: function () {
            var OrderProcessNode = this.getElm().getParent(
                '[data-qui="package/quiqqer/order/bin/frontend/controls/OrderProcess"]'
            );

            return window.QUI.Controls.getById(OrderProcessNode.get('data-quiid'));
        },

        /**
         * Remove all coupons from the order
         *
         * @return {Promise}
         */
        removeCouponsFromOrder: function () {
            if (!this.isInOrder()) {
                return Promise.resolve();
            }

            var self = this;

            return new Promise(function (resolve) {
                var OrderProcess = self.getOrderProcess();

                OrderProcess.Loader.show();
                OrderProcess.getOrder().then(function (orderHash) {
                    QUIAjax.get('package_quiqqer_coupons_ajax_frontend_removeCoupons', function () {
                        resolve();
                        OrderProcess.reload();
                    }, {
                        'package': 'quiqqer/coupon',
                        orderHash: orderHash
                    });
                });
            });
        }
    });
});