/**
* jQuery Selective v0.3.5
* https://github.com/amazingSurge/jquery-selective
*
* Copyright (c) amazingSurge
* Released under the LGPL-3.0 license
*/
(
function(global, factory) {
if (typeof define === "function" && define.amd) {
define(['jquery'], factory);
} else if (typeof exports !== "undefined") {
factory(require('jquery'));
} else {
var mod = {
exports: {}
};
factory(global.jQuery);
global.jquerySelectiveEs = mod.exports;
}
}
)(this,
function(_jquery) {
'use strict';
var _jquery2 = _interopRequireDefault(_jquery);
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
};
}
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ?
function(obj) {
return typeof obj;
}
:
function(obj) {
return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
};
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
var _createClass = function() {
function defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor)
descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
return function(Constructor, protoProps, staticProps) {
if (protoProps)
defineProperties(Constructor.prototype, protoProps);
if (staticProps)
defineProperties(Constructor, staticProps);
return Constructor;
};
}();
/*eslint no-empty-function: "off"*/
var DEFAULTS = {
namespace: 'selective',
buildFromHtml: true,
closeOnSelect: false,
local: null,
selected: null,
withSearch: false,
searchType: null, //'change' or 'keyup'
ajax: {
work: false,
url: null,
quietMills: null,
loadMore: false,
pageSize: null
},
query: function query() {}, //function(api, search_text, page) {},
tpl: {
frame: function frame() {
return '
' + this.options.tpl.triggerButton.call(this) + '
' + this.options.tpl.list.call(this) + '
' + this.options.tpl.items.call(this) + '
';
},
search: function search() {
return '';
},
select: function select() {
return '';
},
optionValue: function optionValue(data) {
if ('name' in data) {
return data.name;
}
return data;
},
option: function option(content) {
return '';
},
items: function items() {
return '';
},
item: function item(content) {
return '' + content + this.options.tpl.itemRemove.call(this) + '';
},
itemRemove: function itemRemove() {
return 'x';
},
triggerButton: function triggerButton() {
return 'Add
';
},
list: function list() {
return '';
},
listItem: function listItem(content) {
return '' + content + '';
}
},
onBeforeShow: null,
onAfterShow: null,
onBeforeHide: null,
onAfterHide: null,
onBeforeSearch: null,
onAfterSearch: null,
onBeforeSelected: null,
onAfterSelected: null,
onBeforeUnselect: null,
onAfterUnselect: null,
onBeforeItemRemove: null,
onAfterItemRemove: null,
onBeforeItemAdd: null,
onAfterItemAdd: null
};
var Options = function() {
function Options(instance) {
_classCallCheck(this, Options);
this.instance = instance;
}
_createClass(Options, [{
key: 'getOptions',
value: function getOptions() {
this.instance.$options = this.instance.$select.find('option');
return this.instance.$options;
}
}, {
key: 'select',
value: function select(opt) {
$(opt).prop('selected', true);
return this.instance;
}
}, {
key: 'unselect',
value: function unselect(opt) {
$(opt).prop('selected', false);
return this.instance;
}
}, {
key: 'add',
value: function add(data) {
/*eslint consistent-return: "off"*/
if (this.instance.options.buildFromHtml === false && this.instance.getItem('option', this.instance.$select, this.instance.options.tpl.optionValue(data)) === undefined) {
var $option = $(this.instance.options.tpl.option.call(this.instance, data));
this.instance.setIndex($option, data);
this.instance.$select.append($option);
return $option;
}
}
}, {
key: 'remove',
value: function remove(opt) {
$(opt).remove();
return this.instance;
}
}]);
return Options;
}();
var List = function() {
function List(instance) {
_classCallCheck(this, List);
this.instance = instance;
}
_createClass(List, [{
key: 'build',
value: function build(data) {
var _this = this;
var $list = $('');
var $options = this.instance._options.getOptions();
if (this.instance.options.buildFromHtml === true) {
if ($options.length !== 0) {
$.each($options,
function(i, n) {
var $li = $(_this.instance.options.tpl.listItem.call(_this.instance, n.text));
var $n = $(n);
_this.instance.setIndex($li, $n);
if ($n.attr('selected') !== undefined) {
_this.instance.select($li);
}
$list.append($li);
}
);
}
} else if (data !== null) {
$.each(data,
function(i) {
var $li = $(_this.instance.options.tpl.listItem.call(_this.instance, data[i]));
_this.instance.setIndex($li, data[i]);
$list.append($li);
}
);
if ($options.length !== 0) {
$.each($options,
function(i, n) {
var $n = $(n);
var li = _this.instance.getItem('li', $list, _this.instance.options.tpl.optionValue($n.data('selective_index')));
if (li !== undefined) {
_this.instance._list.select(li);
}
}
);
}
}
this.instance.$list.append($list.children('li'));
return this.instance;
}
}, {
key: 'buildSearch',
value: function buildSearch() {
if (this.instance.options.withSearch === true) {
this.instance.$triggerDropdown.prepend(this.instance.options.tpl.search.call(this.instance));
this.instance.$search = this.instance.$triggerDropdown.find('.' + this.instance.namespace + '-search');
}
return this.instance;
}
}, {
key: 'select',
value: function select(obj) {
this.instance._trigger("beforeSelected");
$(obj).addClass(this.instance.namespace + '-selected');
this.instance._trigger("afterSelected");
return this.instance;
}
}, {
key: 'unselect',
value: function unselect(obj) {
this.instance._trigger("beforeUnselected");
$(obj).removeClass(this.instance.namespace + '-selected');
this.instance._trigger("afterUnselected");
return this.instance;
}
}, {
key: 'click',
value: function click() {
var that = this;
this.instance.$list.on('click', 'li',
function() {
var $this = $(this);
if (!$this.hasClass(that.instance.namespace + '-selected')) {
that.instance.select($this);
}
}
);
}
}, {
key: 'filter',
value: function filter(val) {
$.expr[':'].Contains = function(a, i, m) {
return jQuery(a).text().toUpperCase().includes(m[3].toUpperCase());
}
;
if (val) {
this.instance.$list.find('li:not(:Contains(' + val + '))').slideUp();
this.instance.$list.find('li:Contains(' + val + ')').slideDown();
} else {
this.instance.$list.children('li').slideDown();
}
return this.instance;
}
}, {
key: 'loadMore',
value: function loadMore() {
var _this2 = this;
var pageMax = this.instance.options.ajax.pageSize || 9999;
this.instance.$listWrap.on('scroll.selective',
function() {
if (pageMax > _this2.instance.page) {
var listHeight = _this2.instance.$list.outerHeight(true);
var wrapHeight = _this2.instance.$listWrap.outerHeight();
var wrapScrollTop = _this2.instance.$listWrap.scrollTop();
var below = listHeight - wrapHeight - wrapScrollTop;
if (below === 0) {
_this2.instance.options.query(_this2.instance, _this2.instance.$search.val(), ++_this2.instance.page);
}
}
}
);
return this.instance;
}
}, {
key: 'loadMoreRemove',
value: function loadMoreRemove() {
this.instance.$listWrap.off('scroll.selective');
return this.instance;
}
}]);
return List;
}();
var Search = function() {
function Search(instance) {
_classCallCheck(this, Search);
this.instance = instance;
}
_createClass(Search, [{
key: 'change',
value: function change() {
var _this3 = this;
this.instance.$search.change(
function() {
_this3.instance._trigger("beforeSearch");
if (_this3.instance.options.buildFromHtml === true) {
_this3.instance._list.filter(_this3.instance.$search.val());
} else if (_this3.instance.$search.val() !== '') {
_this3.instance.page = 1;
_this3.instance.options.query(_this3.instance, _this3.instance.$search.val(), _this3.instance.page);
} else {
_this3.instance.update(_this3.instance.options.local);
}
_this3.instance._trigger("afterSearch");
}
);
}
}, {
key: 'keyup',
value: function keyup() {
var _this4 = this;
var quietMills = this.instance.options.ajax.quietMills || 1000;
var oldValue = '';
var currentValue = '';
var timeout = void 0;
this.instance.$search.on('keyup',
function(e) {
_this4.instance._trigger("beforeSearch");
currentValue = _this4.instance.$search.val();
if (_this4.instance.options.buildFromHtml === true) {
if (currentValue !== oldValue) {
_this4.instance._list.filter(currentValue);
}
} else if (currentValue !== oldValue || e.keyCode === 13) {
window.clearTimeout(timeout);
timeout = window.setTimeout(
function() {
if (currentValue !== '') {
_this4.instance.page = 1;
_this4.instance.options.query(_this4.instance, currentValue, _this4.instance.page);
} else {
_this4.instance.update(_this4.instance.options.local);
}
}
, quietMills);
}
oldValue = currentValue;
_this4.instance._trigger("afterSearch");
}
);
}
}, {
key: 'bind',
value: function bind(type) {
if (type === 'change') {
this.change();
} else if (type === 'keyup') {
this.keyup();
}
}
}]);
return Search;
}();
var Items = function() {
function Items(instance) {
_classCallCheck(this, Items);
this.instance = instance;
}
_createClass(Items, [{
key: 'withDefaults',
value: function withDefaults(data) {
var _this5 = this;
if (data !== null) {
$.each(data,
function(i) {
_this5.instance._options.add(data[i]);
_this5.instance._options.select(_this5.instance.getItem('option', _this5.instance.$select, _this5.instance.options.tpl.optionValue(data[i])));
_this5.instance._items.add(data[i]);
}
);
}
}
}, {
key: 'add',
value: function add(data, content) {
var $item = void 0;
var fill = void 0;
if (this.instance.options.buildFromHtml === true) {
fill = content;
} else {
fill = data;
}
$item = $(this.instance.options.tpl.item.call(this.instance, fill));
this.instance.setIndex($item, data);
this.instance.$items.append($item);
}
}, {
key: 'remove',
value: function remove(obj) {
obj = $(obj);
var $li = void 0;
var $option = void 0;
if (this.instance.options.buildFromHtml === true) {
this.instance._list.unselect(obj.data('selective_index'));
this.instance._options.unselect(obj.data('selective_index').data('selective_index'));
} else {
$li = this.instance.getItem('li', this.instance.$list, this.instance.options.tpl.optionValue(obj.data('selective_index')));
if ($li !== undefined) {
this.instance._list.unselect($li);
}
$option = this.instance.getItem('option', this.instance.$select, this.instance.options.tpl.optionValue(obj.data('selective_index')));
this.instance._options.unselect($option)._options.remove($option);
}
obj.remove();
return this.instance;
}
}, {
key: 'click',
value: function click() {
var that = this;
this.instance.$items.on('click', '.' + this.instance.namespace + '-remove',
function() {
var $this = $(this);
var $item = $this.parents('li');
that.instance.itemRemove($item);
}
);
}
}]);
return Items;
}();
var NAMESPACE$1 = 'selective';
/**
* Plugin constructor
**/
var Selective = function() {
function Selective(element) {
var _this6 = this;
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
_classCallCheck(this, Selective);
this.element = element;
this.$element = (0, _jquery2.default)(element).hide() || (0, _jquery2.default)('');
this.options = _jquery2.default.extend(true, {}, DEFAULTS, options);
this.namespace = this.options.namespace;
var $frame = (0, _jquery2.default)(this.options.tpl.frame.call(this));
//get the select
var _build = function _build() {
_this6.$element.html(_this6.options.tpl.select.call(_this6));
return _this6.$element.children('select');
};
this.$select = this.$element.is('select') === true ? this.$element : _build();
this.$element.after($frame);
this.init();
this.opened = false;
}
_createClass(Selective, [{
key: 'init',
value: function init() {
var _this7 = this;
this.$selective = this.$element.next('.' + this.namespace);
this.$items = this.$selective.find('.' + this.namespace + '-items');
this.$trigger = this.$selective.find('.' + this.namespace + '-trigger');
this.$triggerButton = this.$selective.find('.' + this.namespace + '-trigger-button');
this.$triggerDropdown = this.$selective.find('.' + this.namespace + '-trigger-dropdown');
this.$listWrap = this.$selective.find('.' + this.namespace + '-list-wrap');
this.$list = this.$selective.find('.' + this.namespace + '-list');
this._list = new List(this);
this._options = new Options(this);
this._search = new Search(this);
this._items = new Items(this);
this._items.withDefaults(this.options.selected);
this.update(this.options.local)._list.buildSearch();
this.$triggerButton.on('click',
function() {
if (_this7.opened === false) {
_this7.show();
} else {
_this7.hide();
}
}
);
this._list.click(this);
this._items.click(this);
if (this.options.withSearch === true) {
this._search.bind(this.options.searchType);
}
this._trigger('ready');
}
}, {
key: '_trigger',
value: function _trigger(eventType) {
for (var _len = arguments.length, params = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
params[_key - 1] = arguments[_key];
}
var data = [this].concat(params);
// event
this.$element.trigger(NAMESPACE$1 + '::' + eventType, data);
// callback
eventType = eventType.replace(/\b\w+\b/g,
function(word) {
return word.substring(0, 1).toUpperCase() + word.substring(1);
}
);
var onFunction = 'on' + eventType;
if (typeof this.options[onFunction] === 'function') {
this.options[onFunction].apply(this, params);
}
}
}, {
key: '_show',
value: function _show() {
var _this8 = this;
(0, _jquery2.default)(document).on('click.selective',
function(e) {
if (_this8.options.closeOnSelect === true) {
if ((0, _jquery2.default)(e.target).closest(_this8.$triggerButton).length === 0 && (0, _jquery2.default)(e.target).closest(_this8.$search).length === 0) {
_this8._hide();
}
} else if ((0, _jquery2.default)(e.target).closest(_this8.$trigger).length === 0) {
_this8._hide();
}
}
);
this.$trigger.addClass(this.namespace + '-active');
this.opened = true;
if (this.options.ajax.loadMore === true) {
this._list.loadMore();
}
return this;
}
}, {
key: '_hide',
value: function _hide() {
(0, _jquery2.default)(document).off('click.selective');
this.$trigger.removeClass(this.namespace + '-active');
this.opened = false;
if (this.options.ajax.loadMore === true) {
this._list.loadMoreRemove();
}
return this;
}
}, {
key: 'show',
value: function show() {
this._trigger("beforeShow");
this._show();
this._trigger("afterShow");
return this;
}
}, {
key: 'hide',
value: function hide() {
this._trigger("beforeHide");
this._hide();
this._trigger("afterHide");
return this;
}
}, {
key: 'select',
value: function select($li) {
this._list.select($li);
var data = $li.data('selective_index');
if (this.options.buildFromHtml === true) {
this._options.select(data);
this.itemAdd($li, data.text());
} else {
this._options.add(data);
this._options.select(this.getItem('option', this.$select, this.options.tpl.optionValue(data)));
this.itemAdd(data);
}
return this;
}
}, {
key: 'unselect',
value: function unselect($li) {
this._list.unselect($li);
return this;
}
}, {
key: 'setIndex',
value: function setIndex(obj, index) {
obj.data('selective_index', index);
return this;
}
}, {
key: 'getItem',
value: function getItem(type, $list, index) {
var $items = $list.children(type);
var position = '';
for (var i = 0; i < $items.length; i++) {
if (this.options.tpl.optionValue($items.eq(i).data('selective_index')) === index) {
position = i;
}
}
return position === '' ? undefined : $items.eq(position);
}
}, {
key: 'itemAdd',
value: function itemAdd(data, content) {
this._trigger("beforeItemAdd");
this._items.add(data, content);
this._trigger("afterItemAdd");
return this;
}
}, {
key: 'itemRemove',
value: function itemRemove($li) {
this._trigger("beforeItemRemove");
this._items.remove($li);
this._trigger("afterItemRemove");
return this;
}
}, {
key: 'optionAdd',
value: function optionAdd(data) {
this._options.add(data);
return this;
}
}, {
key: 'optionRemove',
value: function optionRemove(opt) {
this._options.remove(opt);
return this;
}
}, {
key: 'update',
value: function update(data) {
this.$list.empty();
this.page = 1;
if (data !== null) {
this._list.build(data);
} else {
this._list.build();
}
return this;
}
}, {
key: 'destroy',
value: function destroy() {
this.$selective.remove();
this.$element.show();
(0, _jquery2.default)(document).off('click.selective');
this._trigger('destroy');
}
}], [{
key: 'setDefaults',
value: function setDefaults(options) {
_jquery2.default.extend(true, DEFAULTS, _jquery2.default.isPlainObject(options) && options);
}
}]);
return Selective;
}();
var info = {
version: '0.3.5'
};
var NAMESPACE = 'selective';
var OtherSelective = _jquery2.default.fn.selective;
var jQuerySelective = function jQuerySelective(options) {
var _this9 = this;
for (var _len2 = arguments.length, args = Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
args[_key2 - 1] = arguments[_key2];
}
if (typeof options === 'string') {
var _ret = function() {
var method = options;
if (/^_/.test(method)) {
return {
v: false
};
} else if (/^(get)/.test(method)) {
var instance = _this9.first().data(NAMESPACE);
if (instance && typeof instance[method] === 'function') {
return {
v: instance[method].apply(instance, args)
};
}
} else {
return {
v: _this9.each(
function() {
var instance = _jquery2.default.data(this, NAMESPACE);
if (instance && typeof instance[method] === 'function') {
instance[method].apply(instance, args);
}
}
)
};
}
}();
if ((typeof _ret === 'undefined' ? 'undefined' : _typeof(_ret)) === "object")
return _ret.v;
}
return this.each(
function() {
if (!(0, _jquery2.default)(this).data(NAMESPACE)) {
(0, _jquery2.default)(this).data(NAMESPACE, new Selective(this, options));
}
}
);
};
_jquery2.default.fn.selective = jQuerySelective;
_jquery2.default.selective = _jquery2.default.extend({
setDefaults: Selective.setDefaults,
noConflict: function noConflict() {
_jquery2.default.fn.selective = OtherSelective;
return jQuerySelective;
}
}, info);
}
);