jquery.dual-list-box/dist/js/jquery.dual-list-box.min.js

A jquery dual list box to manage <option>`s between two <select>`s

(()=>{var t;t=function(){let t={leftSelect:void 0,rightSelect:void 0};return{init:function(l){l=$.extend({},t,l||{}),$(this).each((function(t,i){let e,n,o=$(i);if(n=void 0!==l.leftSelect&&void 0!==l.rightSelect?(e=$(l.leftSelect),$(l.rightSelect)):(e=$(o.find("select[multiple]")[0]),$(o.find("select[multiple]")[1])),n.is(e))throw new Error("You must select 2 different select lists; lists must be multiple");e.hide(),n.hide();let s={block:$('<div class="dual-list-box"><div class="dual-list-box__comment-line"><div class="dual-list-box__comment"></div><div class="dual-list-box__show-all-btn">show all</div></div><div class="dual-list-box__filter"><input type="text" placeholder="Filter" class="dual-list-box__filter-input"></div><div class="dual-list-box__list-wrapper"><div class="dual-list-box__move-all"></div><div class="dual-list-box__list-container"></div></div></div>')},a={block:s.block.clone()},d=$(document),c={first:void 0,last:void 0,selection:void 0},r=function(){let t,l=[],i=this.filterInput.val(),e=0;try{t=new RegExp("^"+i,"i")}catch(i){return}this.optionsNative=this.selectNative.find("option");for(let i=0;i<this.optionsNative.length;i++){let n=function(t){let l=$('<div class="dual-list-box__option"></div>');return l.attr("value",t.value).text(t.innerHTML),l}(this.optionsNative[i]);null!==n.text().match(t)&&l.push(n),e++}l=l.sort(((t,l)=>{var i=t.text(),e=l.text();for(let t=0;t<i.length&&t<e.length;t++){if(i[t]>e[t])return 1;if(e[t]>i[t])return-1}return i.length>e.length?1:i.length<e.length?-1:0})),this.options=l,this.container.empty().append(l),u.call(this,e,l.length)},u=function(t,l){let i=l<t?"Filtered":"Showing all",e=$('<span class="dual-list-box__inner-comment'+(null!==i.match(/filtered/i)?" dual-list-box__inner-comment_filtered":"")+'">'+i+'</span><span class="dual-list-box__comment-info">'+l+(l!==t?" of "+t:"")+"</span>");this.comment.html(e),null!==i.match(/filtered/i)?this.showAllBtn.show():this.showAllBtn.hide()},f=function(){if(void 0!==c.first){let t;t=void 0===c.last||c.first.index()<c.last.index()?c.first.nextUntil(c.last).add(c.first).add(c.last):c.first.index()===c.last.index()?c.first.nextUntil(c.first.next()).add(c.first):(first=c.last,last=c.first,c.last.nextUntil(c.first).add(c.last).add(c.first)),s.container.add(a.container).children(".dual-list-box__option").removeClass("dual-list-box__option_selected"),t.addClass("dual-list-box__option_selected"),c.selection=t}},v=function(t){let l=$(t.target);l.is(".dual-list-box__option")&&(c.first=c.last=l),f()},h=function(t){let l=$(t.target);l.is(".dual-list-box__option")&&(c.last=l),f()},_=function(t){c.last=c.first=void 0,p.call(this),c.selection=void 0},p=function(){if(void 0!==c.selection){let t=[s,a].filter((t=>t!==this))[0],l=c.selection;x.call(t,l),m.call(this,l),l.removeClass("dual-list-box__option_selected"),r.call(this),r.call(t)}},x=function(t){let l=[];for(let i=0;i<t.length;i++)l.push(function(t){let l=$("<option></option>"),i=(void 0!==t.length?t:$(t)).attr("value"),e=void 0!==t.length?t.text():t.innerHTML;return l.attr({selected:"",value:i}).text(e),l}(t[i]));this.selectNative.append(l)},m=function(t){for(let i=0;i<t.length;i++){var l=(void 0!==t[i].length?t[i]:$(t[i])).attr("value");this.selectNative.find('option[value="'+l+'"]').remove()}};for(let t=0;t<2;t++){let l=[s,a][t];l.selectNative=[e,n][t],l.comment=l.block.find(".dual-list-box__comment"),l.showAllBtn=l.block.find(".dual-list-box__show-all-btn"),l.filterInput=l.block.find(".dual-list-box__filter input"),l.moveAllBtn=l.block.find(".dual-list-box__move-all"),l.moveAllBtn.append('<i class="fa '+["fa-caret-right","fa-caret-left"][t]+'"></i><i class="fa '+["fa-caret-right","fa-caret-left"][t]+'"></i>'),l.container=l.block.find(".dual-list-box__list-container"),l.block.insertAfter(l.selectNative),r.call(l),l.container.on("mousedown",(t=>{v.call(l,t),d.on("mousemove.dualListBoxDrag",(t=>h.call(l,t))),d.on("mouseup.dualListBoxDrag",(i=>{d.off("mousemove.dualListBoxDrag mouseup.dualListBoxDrag"),_.call(l,t)}))}));let i=function(t){c.selection=l.container.find(".dual-list-box__option"),p.call(l),c.selection=void 0};l.moveAllBtn.on("click",i),l.filterInput.on("keyup",(t=>{13===t.which?i():r.call(l)})),l.showAllBtn.on("click",(t=>{l.filterInput.val(""),r.call(l)})).hide()}}))},addOptions:function(t){}}}(),$.fn.extend({dualListBox:t.init,addListOptions:t.addOptions})})();