workarea-storefront 3.4.12

data/app/assets/javascripts/workarea/storefront/modules/dialog_forms.js

@@ -0,0 +1,47 @@
+/**
+ * @namespace WORKAREA.dialogForms
+ */
+WORKAREA.registerModule('dialogForms', (function () {
+    'use strict';
+
+    var failsJQueryValidation = function ($form) {
+            return ('valid' in $form) && (!$form.valid());
+        },
+
+        createDialog = function (event, options) {
+            var $form = $(event.currentTarget),
+                data = $form.data('dialogForm') || {};
+
+            if (failsJQueryValidation($form)) { return; }
+
+            event.preventDefault();
+
+            options = options || data.dialogOptions || {};
+            options.originatingElement = $form.get(0);
+
+            WORKAREA.dialog.createFromForm($form, options);
+        },
+
+        /**
+         * @method
+         * @name initDialogForm
+         * @memberof WORKAREA.dialogForms
+         */
+        initDialogForm = function (index, element, options) {
+            $(element).on('submit', _.partialRight(createDialog, options));
+        },
+
+        /**
+         * @method
+         * @name init
+         * @memberof WORKAREA.dialogForms
+         */
+        init = function ($scope) {
+            $('[data-dialog-form]', $scope).each(initDialogForm);
+        };
+
+    return {
+        init: init,
+        initDialogForm: initDialogForm
+    };
+}()));

data/app/assets/javascripts/workarea/storefront/modules/forms.js

@@ -0,0 +1,94 @@
+/**
+ * @namespace WORKAREA.forms
+ */
+WORKAREA.registerModule('forms', (function () {
+    'use strict';
+
+    var invalidateProperty = function (index, error) {
+            $(error).closest('.property').addClass('property--invalid');
+        },
+
+        displayError = function ($error, $element) {
+            $error.addClass(WORKAREA.config.forms.errorLabelClasses);
+            $element.closest('.value').append($error);
+        },
+
+        validateTextBox = function (element) {
+            var $textBox = $(element);
+
+            $textBox.removeClass('text-box--valid text-box--invalid');
+
+            if ($textBox.valid()) {
+                if ($textBox.val()) {
+                    $textBox.addClass('text-box--valid');
+                }
+            } else {
+                $textBox.addClass('text-box--invalid');
+            }
+        },
+
+        validateElement = function (element) {
+            var $input = $(element),
+                $property = $input.closest('.property');
+
+            if ($input.valid()) {
+                $property.removeClass('property--invalid');
+                $property.find('.value__error').remove();
+            } else {
+                $property.addClass('property--invalid');
+            }
+
+            if ($(element).is('.text-box')) {
+                validateTextBox(element);
+            }
+        },
+
+        checkAllControls = function (event) {
+            var $form = $(event.delegateTarget);
+
+            if ($form.valid()) { return; }
+
+            $(':input', $form).each(_.rearg(validateElement, [1, 0]));
+        },
+
+        /**
+         * This is being debounced because jQuery validation fires twice when the
+         * form is submitted.
+         */
+        fireAnalytics = _.debounce(
+            function () {
+                WORKAREA.analytics.fireCallback('validationError', {});
+            },
+            WORKAREA.config.validationErrorAnalyticsThrottle || 1000
+        ),
+
+        validateForm = function (index, form) {
+            $(form).validate({
+                onfocusout: validateElement,
+                errorPlacement: displayError,
+                invalidHandler: function () {
+                    if (WORKAREA.analytics) {
+                        fireAnalytics();
+                    }
+                }
+            });
+
+            $(form).on('submit', checkAllControls);
+        },
+
+        /**
+         * @method
+         * @name init
+         * @memberof WORKAREA.forms
+         */
+        init = function ($scope) {
+            $('form', $scope)
+            .each(validateForm)
+                .find('.value__error')
+                .each(invalidateProperty);
+        };
+
+    return {
+        init: init
+    };
+}()));

data/app/assets/javascripts/workarea/storefront/modules/loading.js

@@ -0,0 +1,81 @@
+/**
+ * @namespace WORKAREA.loading
+ */
+WORKAREA.registerModule('loading', (function () {
+    'use strict';
+
+    var isPending = function (promise) {
+            return promise.state() === 'pending';
+        },
+
+        removeLoadingIndicator = function () {
+            $('.loading').remove();
+        },
+
+        closeLoadingDialog = function () {
+            var $loadingDialog = $('.ui-dialog-loading .ui-dialog-content');
+
+            if (_.isEmpty($loadingDialog)) { return; }
+
+            $loadingDialog.dialog('close');
+        },
+
+        /**
+         * @method
+         * @name createLoadingIndicator
+         * @memberof WORKAREA.loading
+         */
+        createLoadingIndicator = function (promise, options) {
+            var template = JST[WORKAREA.config.loading.loadingIndicatorTemplate],
+                $indicator;
+
+            options = _.assign(
+                {},
+                WORKAREA.config.loading.loadingIndicatorOptions,
+                options
+            );
+
+            _.delay(function () {
+                if (isPending(promise)) {
+                    $indicator = $(template(options));
+                    $indicator[options.insertionMethod](options.container);
+                }
+            }, options.delay);
+
+            promise.always(removeLoadingIndicator);
+
+            return promise;
+        },
+
+        /**
+         * @method
+         * @name createLoadingDialog
+         * @memberof WORKAREA.loading
+         */
+        createLoadingDialog = function (promise, options) {
+            options = _.assign(
+                {},
+                WORKAREA.config.loading.loadingDialogOptions,
+                WORKAREA.config.loading.loadingIndicatorOptions,
+                options
+            );
+
+            _.delay(function () {
+                if (isPending(promise)) {
+                    WORKAREA.dialog.createFromTemplate(
+                        WORKAREA.config.loading.loadingDialogTemplate,
+                        options
+                    );
+                }
+            }, options.delay);
+
+            promise.always(closeLoadingDialog);
+
+            return promise;
+        };
+
+    return {
+        createLoadingIndicator: createLoadingIndicator,
+        createLoadingDialog: createLoadingDialog
+    };
+}()));

data/app/assets/javascripts/workarea/storefront/modules/log_out_link_placeholders.js

@@ -0,0 +1,36 @@
+/**
+ * @namespace WORKAREA.logOutLinkPlaceholders
+ */
+WORKAREA.registerModule('logOutLinkPlaceholders', (function () {
+    'use strict';
+
+    var logOutLinkTemplate = JST['workarea/storefront/templates/log_out_link'],
+
+        injectLogOutLink = function (index, element) {
+            $(element).replaceWith(logOutLinkTemplate());
+        },
+
+        testPlaceholders = function ($scope) {
+            $('[data-log-out-link-placeholder]', $scope).each(injectLogOutLink);
+        },
+
+        testCurrentUser = function ($scope, currentUser) {
+            if (!currentUser.logged_in) { return; }
+
+            testPlaceholders($scope);
+        },
+
+        /**
+         * @method
+         * @name init
+         * @memberof WORKAREA.logOutLinkPlaceholders
+         */
+        init = function ($scope) {
+            WORKAREA.currentUser.gettingUserData
+            .done(_.partial(testCurrentUser, $scope));
+        };
+
+    return {
+        init: init
+    };
+}()));

data/app/assets/javascripts/workarea/storefront/modules/messages.js

@@ -0,0 +1,179 @@
+/**
+ * @namespace WORKAREA.messages
+ */
+WORKAREA.registerModule('messages', (function () {
+    'use strict';
+
+    var createMessage = JST['workarea/storefront/templates/message'],
+
+        getPageMessageContainer = function () {
+            return $('.page-messages').first();
+        },
+
+        /**
+         * Stores all flash messages that have been rendered in the DOM
+         */
+        renderedMessages = {},
+
+        inRenderedMessagesList = function(text, type) {
+            return _.includes(renderedMessages[type], text);
+        },
+
+        inServerRenderedMessages = function(text, type) {
+            var messageSelector = '.page-messages .message--'+type,
+                $query = $(messageSelector+':contains("'+text+'")');
+
+            return !_.isEmpty($query);
+        },
+
+        /**
+         * Test if a flash message has been rendered to the screen
+         * already.
+         *
+         * @param {String} type - Message type (either "success" or "error")
+         * @param {String} text - Pre-escaped text that was entered into
+                                  the `renderedMessages` collection.
+         * @return {Boolean} whether the flash message has already been
+         *                   rendered.
+         */
+        didRenderMessage = function(text, type) {
+            return inRenderedMessagesList(text, type) && inServerRenderedMessages(text, type);
+        },
+
+        /**
+         * Add a message into the `renderedMessages` collection.
+         *
+         *
+         * @param {String} type - Message type (either "success" or "error")
+         * @param {String} text - Pre-escaped text that was entered into
+                                  the `renderedMessages` collection.
+         */
+        logMessage = function(type, text) {
+            renderedMessages[type] = renderedMessages[type] || [];
+            renderedMessages[type].push(text);
+        },
+
+        /**
+         * Inserts a message into the DOM. If the `$parent` argument is omitted
+         * the message is shown as a flash message to the top of the window.
+         *
+         * @param  {String} messageText - the main text/html of the message
+         * @param  {String} messageType - the type of message
+         * @param  {jQuery} $parent - the target for injection (optional)
+         */
+        insertMessage = function (messageText, messageType, $parent) {
+            var $message = $(createMessage({
+                messageText: messageText,
+                messageType: WORKAREA.string.titleize(messageType),
+                messageModifier: messageType.toLowerCase()
+            }));
+
+            logMessage(messageType, messageText);
+
+            if ( ! ($parent instanceof jQuery) || _.isEmpty($parent)) {
+                getPageMessageContainer().prepend($message);
+            } else {
+                $parent.append($message);
+            }
+
+            WORKAREA.initModules($message);
+
+            return $message;
+        },
+
+        insertPageMessages = function (event, xhr) {
+            var messagesHeader = xhr.getResponseHeader('X-Flash-Messages'),
+                messages = JSON.parse(messagesHeader);
+
+            _.forEach(messages, function(text, type) {
+                if (!didRenderMessage(text, type)) {
+                    insertMessage(text, type);
+                }
+            });
+        },
+
+        removeMessage = function ($message) {
+            $message.remove();
+        },
+
+        dismissMessage = function ($message) {
+            $message.addClass('message--removing');
+
+            if ( ! feature.cssTransition) {
+                removeMessage($message);
+            } else {
+                $message.on(WORKAREA.transitionEvents.detect(), function(event) {
+                    removeMessage($(event.currentTarget));
+                });
+            }
+        },
+
+        dismissMessageAfterDelay = function ($message) {
+            _.delay(
+                _.partial(dismissMessage, $message),
+                WORKAREA.config.messages.delay
+            );
+        },
+
+        dismissClosestMessage = function (event) {
+            var $closestMessage = $(event.currentTarget).closest('.message');
+
+            dismissMessage($closestMessage);
+        },
+
+        createDismissAction = JST[
+            'workarea/storefront/templates/message_dismiss_action'
+        ],
+
+        insertDismissAction = function ($message) {
+            var $dismissAction = $(createDismissAction());
+
+            $dismissAction.on('click', dismissClosestMessage);
+            $message.append($dismissAction);
+        },
+
+        isPageMessage = function ($message) {
+            return $message.parent().is(getPageMessageContainer());
+        },
+
+        isNotError = function ($message) {
+            return ! $message.is('.message--error');
+        },
+
+        shouldDismissMessage = function ($message) {
+            return isNotError($message) && isPageMessage($message);
+        },
+
+        initMessage = function (index, message) {
+            var $message = $(message),
+                type = $message.hasClass('message--error') ? 'error' : 'success',
+                text = _.trim($message.find('.message__text').text());
+
+            logMessage(type, text);
+
+            if ($message.data('messageShowDismiss') !== false) { // true if not specified
+                insertDismissAction($message);
+            }
+
+            if (shouldDismissMessage($message)) {
+                dismissMessageAfterDelay($message);
+            }
+        },
+
+        /**
+         * @method
+         * @name init
+         * @memberof WORKAREA.messages
+         */
+        init = function ($scope) {
+            $scope.find('.message').addBack('.message').each(initMessage);
+        };
+
+    $(document).on('ajaxComplete', insertPageMessages);
+
+    return {
+        init: init,
+        insertMessage: insertMessage,
+        insertPageMessages: insertPageMessages
+    };
+}()));

data/app/assets/javascripts/workarea/storefront/modules/mobile_filter_buttons.js

@@ -0,0 +1,87 @@
+/**
+ * @namespace WORKAREA.mobileFilterButtons
+ *
+ * A clone of WORKAREA.mobileNavButton
+ */
+WORKAREA.registerModule('mobileFilterButtons', (function () {
+    'use strict';
+
+    var closeButton = JST['workarea/storefront/templates/mobile_filters_nav_close_button'],
+
+        deactivate = function ($nav) {
+            $nav.removeClass('mobile-filters-nav--active');
+        },
+
+        activate = function ($nav) {
+            $nav.addClass('mobile-filters-nav--active');
+        },
+
+        close = function ($nav, event) {
+            event.preventDefault();
+            deactivate($nav);
+        },
+
+        addCloseButton = function ($nav) {
+            var $button = $(closeButton({
+                content: I18n.t('workarea.storefront.products.filter_nav_close_button')
+            }));
+
+            $button.on('click', _.partial(close, $nav));
+
+            $nav.prepend($button);
+        },
+
+        inject = function () {
+            var $nav = $('<div class="mobile-filters-nav" id="mobile_filters_nav" />'),
+                $content = $('#aside-content').clone(true);
+
+            $nav.append($content);
+
+            activate($nav);
+            addCloseButton($nav);
+
+            WORKAREA.initModules($nav);
+
+            $('body').append($nav);
+        },
+
+        openMobileFilters = function (event) {
+            event.preventDefault();
+
+            if (_.isEmpty($('#mobile_filters_nav'))) {
+                inject(event.target);
+            } else {
+                activate($('#mobile_filters_nav'));
+            }
+        },
+
+        testBodyClick = function (event) {
+            var $target = $(event.target),
+                $nav = $('#mobile_filters_nav'),
+                $navButton = $('[data-mobile-filter-button]'),
+
+                navIsActive = $nav.hasClass('mobile-filters-nav--active'),
+                clickIsOutsideNav = _.isEmpty($target.closest($nav).addBack($nav)),
+                clickIsNavButton = ! _.isEmpty($target.closest($navButton).addBack($navButton));
+
+            if (navIsActive && clickIsOutsideNav && ( ! clickIsNavButton)) {
+                close($nav, event);
+            }
+        },
+
+        /**
+         * @method
+         * @name init
+         * @memberof WORKAREA.mobileFilterButtons
+         */
+        init = function ($scope) {
+            $('[data-mobile-filter-button]', $scope)
+            .on('click', openMobileFilters);
+        };
+
+    $('body').on('click.mobileFilterButtons', testBodyClick);
+
+    return {
+        init: init
+    };
+}()));