add files
This commit is contained in:
Andrey Kuvshinov
190
assets/js/vendor/nice-select/jquery.nice-select.js
vendored
Normal file
190
assets/js/vendor/nice-select/jquery.nice-select.js
vendored
Normal file
@@ -0,0 +1,190 @@
|
||||
/* jQuery Nice Select - v1.1.0
|
||||
https://github.com/hernansartorio/jquery-nice-select
|
||||
Made by Hernán Sartorio */
|
||||
|
||||
(function($) {
|
||||
|
||||
$.fn.niceSelect = function(method) {
|
||||
|
||||
// Methods
|
||||
if (typeof method == 'string') {
|
||||
if (method == 'update') {
|
||||
this.each(function() {
|
||||
var $select = $(this);
|
||||
var $dropdown = $(this).next('.nice-select');
|
||||
var open = $dropdown.hasClass('open');
|
||||
|
||||
if ($dropdown.length) {
|
||||
$dropdown.remove();
|
||||
create_nice_select($select);
|
||||
|
||||
if (open) {
|
||||
$select.next().trigger('click');
|
||||
}
|
||||
}
|
||||
});
|
||||
} else if (method == 'destroy') {
|
||||
this.each(function() {
|
||||
var $select = $(this);
|
||||
var $dropdown = $(this).next('.nice-select');
|
||||
|
||||
if ($dropdown.length) {
|
||||
$dropdown.remove();
|
||||
$select.css('display', '');
|
||||
}
|
||||
});
|
||||
if ($('.nice-select').length == 0) {
|
||||
$(document).off('.nice_select');
|
||||
}
|
||||
} else {
|
||||
console.log('Method "' + method + '" does not exist.')
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
||||
// Hide native select
|
||||
this.hide();
|
||||
|
||||
// Create custom markup
|
||||
this.each(function() {
|
||||
var $select = $(this);
|
||||
|
||||
if (!$select.next().hasClass('nice-select')) {
|
||||
create_nice_select($select);
|
||||
}
|
||||
});
|
||||
|
||||
function create_nice_select($select) {
|
||||
$select.after($('<div></div>')
|
||||
.addClass('nice-select')
|
||||
.addClass($select.attr('class') || '')
|
||||
.addClass($select.attr('disabled') ? 'disabled' : '')
|
||||
.attr('tabindex', $select.attr('disabled') ? null : '0')
|
||||
.html('<span class="current"></span><ul class="list"></ul>')
|
||||
);
|
||||
|
||||
var $dropdown = $select.next();
|
||||
var $options = $select.find('option');
|
||||
var $selected = $select.find('option:selected');
|
||||
|
||||
$dropdown.find('.current').html($selected.data('display') || $selected.text());
|
||||
|
||||
$options.each(function(i) {
|
||||
var $option = $(this);
|
||||
var display = $option.data('display');
|
||||
|
||||
$dropdown.find('ul').append($('<li></li>')
|
||||
.attr('data-value', $option.val())
|
||||
.attr('data-display', (display || null))
|
||||
.addClass('option' +
|
||||
($option.is(':selected') ? ' selected' : '') +
|
||||
($option.is(':disabled') ? ' disabled' : ''))
|
||||
.html($option.text())
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
/* Event listeners */
|
||||
|
||||
// Unbind existing events in case that the plugin has been initialized before
|
||||
$(document).off('.nice_select');
|
||||
|
||||
// Open/close
|
||||
$(document).on('click.nice_select', '.nice-select', function(event) {
|
||||
var $dropdown = $(this);
|
||||
|
||||
$('.nice-select').not($dropdown).removeClass('open');
|
||||
$dropdown.toggleClass('open');
|
||||
|
||||
if ($dropdown.hasClass('open')) {
|
||||
$dropdown.find('.option');
|
||||
$dropdown.find('.focus').removeClass('focus');
|
||||
$dropdown.find('.selected').addClass('focus');
|
||||
} else {
|
||||
$dropdown.focus();
|
||||
}
|
||||
});
|
||||
|
||||
// Close when clicking outside
|
||||
$(document).on('click.nice_select', function(event) {
|
||||
if ($(event.target).closest('.nice-select').length === 0) {
|
||||
$('.nice-select').removeClass('open').find('.option');
|
||||
}
|
||||
});
|
||||
|
||||
// Option click
|
||||
$(document).on('click.nice_select', '.nice-select .option:not(.disabled)', function(event) {
|
||||
var $option = $(this);
|
||||
var $dropdown = $option.closest('.nice-select');
|
||||
|
||||
$dropdown.find('.selected').removeClass('selected');
|
||||
$option.addClass('selected');
|
||||
|
||||
var text = $option.data('display') || $option.text();
|
||||
$dropdown.find('.current').text(text);
|
||||
|
||||
$dropdown.prev('select').val($option.data('value')).trigger('change');
|
||||
});
|
||||
|
||||
// Keyboard events
|
||||
$(document).on('keydown.nice_select', '.nice-select', function(event) {
|
||||
var $dropdown = $(this);
|
||||
var $focused_option = $($dropdown.find('.focus') || $dropdown.find('.list .option.selected'));
|
||||
|
||||
// Space or Enter
|
||||
if (event.keyCode == 32 || event.keyCode == 13) {
|
||||
if ($dropdown.hasClass('open')) {
|
||||
$focused_option.trigger('click');
|
||||
} else {
|
||||
$dropdown.trigger('click');
|
||||
}
|
||||
return false;
|
||||
// Down
|
||||
} else if (event.keyCode == 40) {
|
||||
if (!$dropdown.hasClass('open')) {
|
||||
$dropdown.trigger('click');
|
||||
} else {
|
||||
var $next = $focused_option.nextAll('.option:not(.disabled)').first();
|
||||
if ($next.length > 0) {
|
||||
$dropdown.find('.focus').removeClass('focus');
|
||||
$next.addClass('focus');
|
||||
}
|
||||
}
|
||||
return false;
|
||||
// Up
|
||||
} else if (event.keyCode == 38) {
|
||||
if (!$dropdown.hasClass('open')) {
|
||||
$dropdown.trigger('click');
|
||||
} else {
|
||||
var $prev = $focused_option.prevAll('.option:not(.disabled)').first();
|
||||
if ($prev.length > 0) {
|
||||
$dropdown.find('.focus').removeClass('focus');
|
||||
$prev.addClass('focus');
|
||||
}
|
||||
}
|
||||
return false;
|
||||
// Esc
|
||||
} else if (event.keyCode == 27) {
|
||||
if ($dropdown.hasClass('open')) {
|
||||
$dropdown.trigger('click');
|
||||
}
|
||||
// Tab
|
||||
} else if (event.keyCode == 9) {
|
||||
if ($dropdown.hasClass('open')) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Detect CSS pointer-events support, for IE <= 10. From Modernizr.
|
||||
var style = document.createElement('a').style;
|
||||
style.cssText = 'pointer-events:auto';
|
||||
if (style.pointerEvents !== 'auto') {
|
||||
$('html').addClass('no-csspointerevents');
|
||||
}
|
||||
|
||||
return this;
|
||||
|
||||
};
|
||||
|
||||
}(jQuery));
|
||||
171
assets/js/vendor/nice-select/nice-select.scss
vendored
Normal file
171
assets/js/vendor/nice-select/nice-select.scss
vendored
Normal file
@@ -0,0 +1,171 @@
|
||||
// Default variables
|
||||
$font_size: 14px !default;
|
||||
$font_size_small: 12px !default;
|
||||
|
||||
$input_border_radius: 5px !default;
|
||||
$input_height: 42px !default;
|
||||
$input_height_small: 36px !default;
|
||||
$dropdown_padding: 18px !default;
|
||||
|
||||
$gray_dark: #444 !default;
|
||||
$gray: #999 !default;
|
||||
$gray_light: #e8e8e8 !default;
|
||||
$gray_lighter: #f6f6f6 !default;
|
||||
$primary_light: $gray !default;
|
||||
$arrow_color: $gray !default;
|
||||
|
||||
// Style the dropdown
|
||||
.nice-select {
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
background-color: #fff;
|
||||
border-radius: $input_border_radius;
|
||||
border: solid 1px $gray_light;
|
||||
box-sizing: border-box;
|
||||
clear: both;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
float: left;
|
||||
font-family: inherit;
|
||||
font-size: $font_size;
|
||||
font-weight: normal;
|
||||
height: $input_height;
|
||||
line-height: $input_height - 2;
|
||||
outline: none;
|
||||
padding-left: $dropdown_padding;
|
||||
padding-right: $dropdown_padding + 12;
|
||||
position: relative;
|
||||
text-align: left !important;
|
||||
transition: all 0.2s ease-in-out;
|
||||
user-select: none;
|
||||
white-space: nowrap;
|
||||
width: auto;
|
||||
&:hover {
|
||||
border-color: darken($gray_light, 5%);
|
||||
}
|
||||
&:active, &:focus {
|
||||
border-color: $primary_light;
|
||||
}
|
||||
// Arrow
|
||||
&:after {
|
||||
border-bottom: 2px solid $arrow_color;
|
||||
border-right: 2px solid $arrow_color;
|
||||
content: '';
|
||||
display: block;
|
||||
height: 5px;
|
||||
margin-top: -4px;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
right: 12px;
|
||||
top: 50%;
|
||||
transform-origin: 66% 66%;
|
||||
transform: rotate(45deg);
|
||||
transition: all 0.15s ease-in-out;
|
||||
width: 5px;
|
||||
}
|
||||
|
||||
&.open {
|
||||
@extend :active;
|
||||
&:after {
|
||||
transform: rotate(-135deg);
|
||||
}
|
||||
.list {
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
transform: scale(1) translateY(0);
|
||||
}
|
||||
}
|
||||
&.disabled {
|
||||
border-color: lighten($gray_light, 2%);
|
||||
color: $gray;
|
||||
pointer-events: none;
|
||||
&:after {
|
||||
border-color: lighten($arrow_color, 20%);
|
||||
}
|
||||
}
|
||||
|
||||
// Modifiers
|
||||
&.wide {
|
||||
width: 100%;
|
||||
.list {
|
||||
left: 0 !important;
|
||||
right: 0 !important;
|
||||
}
|
||||
}
|
||||
&.right {
|
||||
float: right;
|
||||
.list {
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
&.small {
|
||||
font-size: $font_size_small;
|
||||
height: $input_height_small;
|
||||
line-height: $input_height_small - 2;
|
||||
&:after {
|
||||
height: 4px;
|
||||
width: 4px;
|
||||
}
|
||||
.option {
|
||||
line-height: $input_height_small - 2;
|
||||
min-height: $input_height_small - 2;
|
||||
}
|
||||
}
|
||||
|
||||
// List and options
|
||||
.list {
|
||||
background-color: #fff;
|
||||
border-radius: $input_border_radius;
|
||||
box-shadow: 0 0 0 1px rgba($gray_dark, .11);
|
||||
box-sizing: border-box;
|
||||
margin-top: 4px;
|
||||
opacity: 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
top: 100%; left: 0;
|
||||
transform-origin: 50% 0;
|
||||
transform: scale(.75) translateY(- $input_height / 2);
|
||||
transition: all .2s cubic-bezier(0.5, 0, 0, 1.25), opacity .15s ease-out;
|
||||
z-index: 9;
|
||||
&:hover .option:not(:hover) {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
.option {
|
||||
cursor: pointer;
|
||||
font-weight: 400;
|
||||
line-height: $input_height - 2;
|
||||
list-style: none;
|
||||
min-height: $input_height - 2;
|
||||
outline: none;
|
||||
padding-left: $dropdown_padding;
|
||||
padding-right: $dropdown_padding + 11;
|
||||
text-align: left;
|
||||
transition: all 0.2s;
|
||||
&:hover, &.focus, &.selected.focus {
|
||||
background-color: $gray_lighter;
|
||||
}
|
||||
&.selected {
|
||||
font-weight: bold;
|
||||
}
|
||||
&.disabled {
|
||||
background-color: transparent;
|
||||
color: $gray;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Use display instead of opacity for IE <= 10
|
||||
.no-csspointerevents .nice-select {
|
||||
.list {
|
||||
display: none;
|
||||
}
|
||||
&.open {
|
||||
.list {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user