Code examples

filter__control-text.scss

@import 'merge';

.filter__control-text {
    font-family: inherit;
    font-size: 14px;
    color: $color--text--gray;
    text-decoration: none;
    cursor: pointer;

    @at-root button#{&} {
        padding: 0;

        border: 0;
        background-color: transparent;

        appearance: none;
        }

    &--right {
        float: right;
        }
    }

form__select.js

app.Modules.create({
    body: function(app, $) {
        return {
            constructor: function() {
                this.init();
            },

            init: function() {
                $('.form__range').each(this.initByOne.bind(this));
            },

            initByOne: function(index, item) {
                var $range = $(item);
                var $parent = $range.parent();
                var $form = $range.closest('form');

                var $from = $($range.attr('data-node-from')).hide();
                var $to = $($range.attr('data-node-to')).hide();

                var defaultMinMaxValues = [200, 6000];

                $range.ionRangeSlider({
                    type: 'double',
                    min: defaultMinMaxValues[0],
                    max: defaultMinMaxValues[1],
                    from: $from.val(),
                    to: $to.val(),
                    hide_min_max: true,
                    hide_from_to: false,
                    grid: false,
                    prefix: '$',
                    onChange: function(data) {
                        this.updateField($from, data.from);
                        this.updateField($to, data.to);
                    }.bind(this),
                    onFinish: function(data) {
                        $form.trigger('change');
                    }.bind(this)
                });

                var rangeSlider = $range.data('ionRangeSlider');

                // Add form reset supporting
                // @TODO Need to optimize events firing
                $form.on('reset', function() {
                    this.trackInput($range, $parent);
                    rangeSlider.reset();
                    this.dontTrackInput($range, $form);
                }.bind(this));

                this.dontTrackInput($range, $form);
            },

            // Fix for triggering form#onchange, fire onchange manually
            // instead of it
            dontTrackInput: function($range, $form) {
                return $range.insertAfter($form).hide();
            },

            trackInput: function($range, $parent) {
                return $range.insertAfter($parent.children().last()).show();
            },

            updateField: function($field, value) {
                if ($field.val() !== value) {
                    $field.val(value);
                }
            }
        };
    },

    onDocumentReady: true
});

header__menu__item.scss

@import 'merge';

.header__menu__item {
    margin-right: -10px;
    margin-left: 15px;
    display: inline-block;

    line-height: $height--header;
    font-size: 16px;
    color: $color--blue-light;

    @include respond_to('large') {
        line-height: $height--header--large;
        font-size: 14px;
        text-transform: uppercase;

        &:not(&--active) {
            // To overwrite default styles, because media-query not increase
            // selector's specificity
            // scss-lint:disable ImportantRule
            display: inline-block !important;
            // scss-lint:enable ImportantRule
            }
        }

    &--active {
        color: $color--white;
        }

    &:not(&--active) {
        display: none;
        }
    }

modalwin--shown.js

app.Modules.create({
    body: function(app, $) {
        return {
            constructor: function() {
                var module = this;

                $.document.on(window.eventName.click, '.js-modalwin-close', function(event) {
                    event.preventDefault();

                    module.hide();
                });
            },

            open: function() {
                app.utils.status.set('modalwin--shown');
                $.window.on('keydown.module-modalwin', this.hideByKeyword.bind(this));
            },

            hide: function() {
                app.utils.status.drop('modalwin--shown');
                $.window.off('.module-modalwin');
            },

            hideByKeyword: function(event) {
                if (event.keyCode === app.utils.key.Esc) {
                    this.hide();
                }
            }
        };
    },

    export: {
        open_modal_window: 'open',
        hide_modal_windows: 'hide'
    }
});