workarea-one_theme 1.3.0

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

@@ -0,0 +1,56 @@
+/**
+ * @namespace WORKAREA.quantityControl
+ */
+WORKAREA.registerModule('quantityControl', (function () {
+    'use strict';
+
+    var handleQtyEvent = function (event) {
+            var $button = $(event.currentTarget),
+                eventData = $button.data('quantityControl'),
+                $qtyInput = $button.closest('form').find('.quantity-control__input'),
+                currentQty = parseInt($qtyInput.val()),
+                changeDirection = eventData.direction,
+                autoSubmit = eventData.autosubmit || false;
+
+            event.preventDefault();
+
+            updateQty($qtyInput, calculateQty(currentQty, changeDirection));
+
+            if(autoSubmit) {
+                _.delay(submitForm, WORKAREA.config.oneTheme.quantityConrol.autoSubmitDelay, $qtyInput);
+            }
+        },
+
+        calculateQty = function(currentQty, changeDirection) {
+            if (changeDirection === 'inc') {
+                return currentQty + 1;
+            } else {
+                return currentQty > 0 ? currentQty - 1 : currentQty;
+            }
+        },
+
+        updateQty = function ($qtyInput, newQty) {
+            $qtyInput.val(newQty);
+        },
+
+        submitForm = function($qtyInput) {
+            var $form = $qtyInput.closest('form');
+
+            if($form.valid()) {
+                $form.submit();
+            }
+        },
+
+        /**
+         * @method
+         * @name init
+         * @memberof WORKAREA.quantityControl
+         */
+        init = function ($scope) {
+            $('[data-quantity-control]', $scope).on('click', handleQtyEvent);
+        };
+
+    return {
+        init: init
+    };
+}()));

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

@@ -0,0 +1,43 @@
+/**
+ * @namespace WORKAREA.utilityNavDropdown
+ */
+WORKAREA.registerModule('utilityNavDropdown', (function () {
+    'use strict';
+
+    var openUtilityNav = function($utilityNav) {
+            $utilityNav.addClass('utility-nav--is-open');
+        },
+
+        closeUtilityNav = function($utilityNav) {
+            $utilityNav.removeClass('utility-nav--is-open');
+        },
+
+        utilityNavIsOpen = function($utilityNav) {
+            return $utilityNav.hasClass('utility-nav--is-open');
+        },
+
+        handleClickEvent = function(event) {
+            var $button = $(event.currentTarget),
+                $pageHeader = $button.closest('.page-header'),
+                $utilityNav = $pageHeader.find('.utility-nav');
+
+            if (utilityNavIsOpen($utilityNav)) {
+                closeUtilityNav($utilityNav);
+            } else {
+                openUtilityNav($utilityNav);
+            }
+        },
+
+        /**
+         * @method
+         * @name init
+         * @memberof WORKAREA.utilityNavDropdown
+         */
+        init = function ($scope) {
+            $('[data-utility-nav-dropdown]', $scope).on('click', handleClickEvent);
+        };
+
+    return {
+        init: init
+    };
+}()));

data/app/assets/javascripts/workarea/storefront/one_theme/config.js

@@ -0,0 +1,20 @@
+(function () {
+    'use strict';
+
+    /**
+     * Config Variables
+     */
+
+    WORKAREA.config.oneTheme = {
+        quantityConrol: {
+            autoSubmitDelay: 500
+        }
+    };
+
+    if (!_.isEmpty($.validator)) {
+        // Add `CVV` method to jQuery Validate
+        $.validator.addMethod('cvv', function (value, element) {
+            return WORKAREA.checkoutPrimaryPayments.checkCvvCode(element);
+        });
+    }
+})();

data/app/assets/javascripts/workarea/storefront/product_quickview/templates/quickview_button.jst.ejs

@@ -0,0 +1,3 @@
+<div class="quickview-button">
+    <a class="button" rel="nofollow" data-analytics='<%= analytics_data %>' href="<%= url %>"><%= I18n.t('workarea.storefront.products.quick_view') %></a>
+</div>

data/app/assets/javascripts/workarea/storefront/reviews/modules/product_reviews_sort_menus.js

@@ -0,0 +1,82 @@
+/**
+ * @namespace WORKAREA.productReviewsSortMenus
+ */
+WORKAREA.registerModule('productReviewsSortMenus', (function () {
+    'use strict';
+
+    var insertSortSelectBox = function (index, section) {
+            $('.reviews__header', section).append(
+                JST['workarea/storefront/reviews/templates/sort_by_property']()
+            );
+        },
+
+        sortNewToOld = function ($reviews) {
+            return _.sortBy($reviews, function (review) {
+                return -($(review).data('productReviewSectionEntry').createdAt);
+            });
+        },
+
+        sortOldToNew = function ($reviews) {
+            return _.sortBy($reviews, function (review) {
+                return $(review).data('productReviewSectionEntry').createdAt;
+            });
+        },
+
+
+        sortHighToLow = function ($reviews) {
+            return _.sortBy($reviews, function (review) {
+                return -($(review).data('productReviewSectionEntry').rating);
+            });
+        },
+
+        sortLowToHigh = function ($reviews) {
+            return _.sortBy($reviews, function (review) {
+                return $(review).data('productReviewSectionEntry').rating;
+            });
+        },
+
+        handleSortSelectChange = function (event) {
+            var $reviews = $(
+                    '[data-product-review-section-entry]', event.delegateTarget
+                ),
+
+                action = $(event.currentTarget).val(),
+
+                actions = {
+                    oldest: function () {
+                        return sortOldToNew($reviews);
+                    },
+                    newest: function () {
+                        return sortNewToOld($reviews);
+                    },
+                    lowest: function () {
+                        return sortLowToHigh($reviews);
+                    },
+                    highest: function () {
+                        return sortHighToLow($reviews);
+                    }
+                };
+
+            $('.reviews__review-group', event.delegateTarget)
+            .html(actions[action]());
+        },
+
+        /**
+         * @method
+         * @name init
+         * @memberof WORKAREA.productReviewsSortMenus
+         */
+        init = function ($scope) {
+            $('.reviews', $scope)
+            .each(insertSortSelectBox)
+            .on(
+                'change',
+                '[data-product-reviews-sort-menu]',
+                handleSortSelectChange
+            );
+        };
+
+    return {
+        init: init
+    };
+}()));

data/app/assets/javascripts/workarea/storefront/reviews/templates/sort_by_property.jst.ejs

@@ -0,0 +1,19 @@
+<div class="grid__cell grid__cell--50-at-medium">
+    <div class="grid grid--right grid--auto">
+        <div class="grid__cell">
+            <div class="property">
+                <label class="property__name"><span class="property__text">Sort By</span></label>
+                <div class="value">
+                    <div class="select-menu">
+                        <select data-product-reviews-sort-menu="">
+                            <option value="newest" selected>Most Recent</option>
+                            <option value="oldest">Oldest First</option>
+                            <option value="highest">Rating: High to Low</option>
+                            <option value="lowest">Rating: Low to High</option>
+                        </select>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

data/app/assets/javascripts/workarea/storefront/templates/log_out_link.jst.ejs

@@ -0,0 +1 @@
+<a href="<%= WORKAREA.routes.storefront.logoutPath() %>" data-analytics="{'event':'logout', 'domEvent':'click'}" data-method="delete" class="page-header__logout-link"><%= I18n.t('workarea.storefront.users.logout') %></a>

data/app/assets/javascripts/workarea/storefront/templates/saved_addresses_property.jst.ejs

@@ -0,0 +1,23 @@
+<div class="property property--wide-row-at-medium">
+    <label for="saved_addresses_<%= counter %>" class="property__name">
+        <span><%= I18n.t('workarea.storefront.checkouts.saved_addresses') %></span>
+    </label>
+    <div class="value">
+        <div class="select-menu">
+            <select id="saved_addresses_<%= counter %>" name="saved_addresses_<%= counter %>">
+                <option value="" selected><%= I18n.t('workarea.storefront.checkouts.select_an_address') %></option>
+                <% _.forEach(addresses, function(address) { %>
+                    <option value="<%= address._id %>">
+                        <%= address.first_name %>
+                        <%= address.last_name %>
+                        <%= address.street %>
+                        <%= address.street_2 %>
+                        <%= address.city %>
+                        <%= address.region %>
+                        <%= address.postal_code %>
+                    </option>
+                <% }); %>
+            </select>
+        </div>
+    </div>
+</div>

data/app/assets/stylesheets/jquery_ui/storefront/_ui_autocomplete.scss

@@ -0,0 +1,17 @@
+/*------------------------------------*\
+    #UI-AUTOCOMPLETE
+\*------------------------------------*/
+
+$ui-autocomplete-bg-color:  $background-color-component !default;
+
+$ui-autocomplete-width:     190px !default;
+
+
+.ui-autocomplete {
+    @extend %list-reset;
+    position: absolute;
+    z-index: index($components, ui-autocomplete);
+    padding: $spacing-unit;
+    width: $ui-autocomplete-width;
+    background: $ui-autocomplete-bg-color;
+}

data/app/assets/stylesheets/jquery_ui/storefront/_ui_dialog.scss

@@ -0,0 +1,150 @@
+/*------------------------------------*\
+    #UI-DIALOG
+\*------------------------------------*/
+
+$ui-dialog-bg-color:           $background-color !default;
+
+$ui-dialog-shadow:             0 0 0 2px $overlay-shadow-color !default;
+
+
+.ui-dialog {
+    position: absolute;
+    z-index: index($components, ui-dialog);
+    background: $ui-dialog-bg-color;
+    box-shadow: $ui-dialog-shadow;
+    outline: 0;
+
+    &:focus {
+        outline: none;
+    }
+
+    .ui-draggable-handle {
+        cursor: move;
+        touch-action: none;
+    }
+
+    .ui-resizable-handle {
+        display: block;
+        position: absolute;
+        font-size: 0.1px;
+        touch-action: none;
+    }
+
+    .ui-resizable-n {
+        top: -5px;
+        left: 0;
+        width: 100%;
+        height: 7px;
+        cursor: n-resize;
+    }
+
+    .ui-resizable-s {
+        bottom: -5px;
+        left:    0;
+        width: 100%;
+        height: 7px;
+        cursor: s-resize;
+    }
+
+    .ui-resizable-e {
+        top:    0;
+        right: -5px;
+        width: 7px;
+        height: 100%;
+        cursor: e-resize;
+    }
+
+    .ui-resizable-w {
+        top:   0;
+        left: -5px;
+        width: 7px;
+        height: 100%;
+        cursor: w-resize;
+    }
+
+    .ui-resizable-se {
+        right:  -5px;
+        bottom: -5px;
+        width:  12px;
+        height: 12px;
+        cursor: se-resize;
+    }
+
+    .ui-resizable-sw {
+        bottom: -5px;
+        left:   -5px;
+        width:  9px;
+        height: 9px;
+        cursor: sw-resize;
+    }
+
+    .ui-resizable-nw {
+        top:  -5px;
+        left: -5px;
+        width:  9px;
+        height: 9px;
+        cursor: nw-resize;
+    }
+
+    .ui-resizable-ne {
+        top:   -5px;
+        right: -5px;
+        width:  9px;
+        height: 9px;
+        cursor: ne-resize;
+    }
+}
+
+    .ui-dialog-titlebar {
+        line-height: 1;
+        text-align: right;
+        background: $ui-dialog-titlebar-bg-color;
+
+        .ui-dialog-image & {
+            position: absolute;
+            top:   0;
+            right: 0;
+        }
+
+        .ui-dialog-loading & {
+            display: none;
+        }
+    }
+
+        .ui-dialog-title {
+            display: none;
+        }
+
+        .ui-dialog-titlebar-close {
+            padding: 0;
+            font-size: 0;
+            line-height: 1;
+            background: none;
+            border: 0;
+            cursor: pointer;
+
+            .ui-button-icon {
+                @include svg('dialog_close.svg', 32px);
+                padding: $spacing-unit;
+            }
+        }
+
+    .ui-dialog-content {
+        padding: $spacing-unit;
+        overflow: auto;
+
+        .ui-dialog-image & {
+            padding: 0;
+        }
+
+        .ui-dialog-loading & {
+            padding: 50px 0;
+        }
+    }
+
+
+.ui-dialog-image img {
+    display: block;
+}
+
+.ui-dialog-loading {}

data/app/assets/stylesheets/jquery_ui/storefront/_ui_menu.scss

@@ -0,0 +1,42 @@
+/*------------------------------------*\
+    #UI-MENU
+\*------------------------------------*/
+
+$ui-menu-item-selected-color: $highlight-color !default;
+$ui-menu-heading-border-color: $border-color !default;
+
+
+/**
+ * 1. default menu item state
+ * 2. hovered menu item state
+ * 3. the displayed result image
+ * 4. menu headings
+ */
+
+.ui-menu {
+    .ui-menu-item { /* [1] */
+        @extend %clearfix;
+        padding: $spacing-unit;
+        font-weight: bold;
+        cursor: pointer;
+
+        &:hover { /* [2] */
+            background: $ui-menu-item-selected-color;
+        }
+
+        img { /* [3] */
+            margin: 0 0 $spacing-unit;
+            float: left;
+        }
+    }
+
+    .ui-menu-heading { /* [4] */
+        padding:  $spacing-unit;
+        font-weight: bold;
+        border-top: 1px solid $ui-menu-heading-border-color;
+
+        &:first-of-type {
+            border-top: 0;
+        }
+    }
+}