Mercurial > kallithea
changeset 5961:304e83e9bcde
js: update select2 to 3.5.4
(4.x seems like a more major upgrade - we stick to the 3 series for now.)
Note that select2-bootstrap.css *not* is upgraded. It is a separate thing (see
LICENSE.md) and currently unused. (Select2 now has similar functionality built
in - that should perhaps be used with Bootstrap instead.)
author | Mads Kiilerich <madski@unity3d.com> |
---|---|
date | Fri, 10 Jun 2016 01:19:58 +0200 |
parents | 5262c498b3a0 |
children | 2ffd56ea2629 |
files | kallithea/public/js/select2/select2.css kallithea/public/js/select2/select2.js |
diffstat | 2 files changed, 368 insertions(+), 128 deletions(-) [+] |
line wrap: on
line diff
--- a/kallithea/public/js/select2/select2.css Fri Jun 10 01:19:58 2016 +0200 +++ b/kallithea/public/js/select2/select2.css Fri Jun 10 01:19:58 2016 +0200 @@ -1,13 +1,10 @@ /* -Version: 3.5.0 Timestamp: Mon Jun 16 19:29:44 EDT 2014 +Version: 3.5.4 Timestamp: Sun Aug 30 13:30:32 EDT 2015 */ .select2-container { margin: 0; position: relative; display: inline-block; - /* inline-block for ie7 */ - zoom: 1; - *display: inline; vertical-align: middle; } @@ -180,10 +177,6 @@ width: auto; } -.select2-drop-auto-width .select2-search { - padding-top: 4px; -} - .select2-container .select2-choice .select2-arrow { display: inline-block; width: 18px; @@ -230,8 +223,7 @@ width: 100%; min-height: 26px; margin: 0; - padding-left: 4px; - padding-right: 4px; + padding: 4px 4px 0 4px; position: relative; z-index: 10000; @@ -273,10 +265,6 @@ background: url('select2.png') no-repeat -37px -22px, linear-gradient(to bottom, #fff 85%, #eee 99%) 0 0; } -.select2-drop.select2-drop-above .select2-search input { - margin-top: 4px; -} - .select2-search input.select2-active { background: #fff url('select2-spinner.gif') no-repeat 100%; background: url('select2-spinner.gif') no-repeat 100%, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, #fff), color-stop(0.99, #eee)); @@ -422,9 +410,9 @@ color: #000; } - .select2-results .select2-no-results, .select2-results .select2-searching, +.select2-results .select2-ajax-error, .select2-results .select2-selection-limit { background: #f4f4f4; display: list-item; @@ -454,6 +442,10 @@ background: #f4f4f4 url('select2-spinner.gif') no-repeat 100%; } +.select2-results .select2-ajax-error { + background: rgba(255, 50, 50, .2); +} + .select2-more-results { background: #f4f4f4; display: list-item; @@ -582,7 +574,7 @@ background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eee)); background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%); background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%); - background-image: linear-gradient(to top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%); + background-image: linear-gradient(to bottom, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%); } html[dir="rtl"] .select2-container-multi .select2-choices .select2-search-choice {
--- a/kallithea/public/js/select2/select2.js Fri Jun 10 01:19:58 2016 +0200 +++ b/kallithea/public/js/select2/select2.js Fri Jun 10 01:19:58 2016 +0200 @@ -1,7 +1,7 @@ /* Copyright 2012 Igor Vaynberg -Version: 3.5.0 Timestamp: Mon Jun 16 19:29:44 EDT 2014 +Version: 3.5.4 Timestamp: Sun Aug 30 13:30:32 EDT 2015 This software is licensed under the Apache License, Version 2.0 (the "Apache License") or the GNU General Public License version 2 (the "GPL License"). You may choose either license to govern your @@ -46,7 +46,7 @@ return; } - var KEY, AbstractSelect2, SingleSelect2, MultiSelect2, nextUid, sizer, + var AbstractSelect2, SingleSelect2, MultiSelect2, nextUid, sizer, lastMousePosition={x:0,y:0}, $document, scrollBarDimensions, KEY = { @@ -132,7 +132,7 @@ function measureScrollbar () { var $template = $( MEASURE_SCROLLBAR_TEMPLATE ); - $template.appendTo('body'); + $template.appendTo(document.body); var dim = { width: $template.width() - $template[0].clientWidth, @@ -160,16 +160,16 @@ } /** - * Splits the string into an array of values, trimming each value. An empty array is returned for nulls or empty + * Splits the string into an array of values, transforming each value. An empty array is returned for nulls or empty * strings * @param string * @param separator */ - function splitVal(string, separator) { + function splitVal(string, separator, transform) { var val, i, l; if (string === null || string.length < 1) return []; val = string.split(separator); - for (i = 0, l = val.length; i < l; i = i + 1) val[i] = $.trim(val[i]); + for (i = 0, l = val.length; i < l; i = i + 1) val[i] = transform(val[i]); return val; } @@ -311,7 +311,7 @@ whiteSpace: "nowrap" }); sizer.attr("class","select2-sizer"); - $("body").append(sizer); + $(document.body).append(sizer); } sizer.text(e.val()); return sizer.width(); @@ -444,6 +444,16 @@ // added query as third paramter to keep backwards compatibility var results = options.results(data, query.page, query); query.callback(results); + }, + error: function(jqXHR, textStatus, errorThrown){ + var results = { + hasError: true, + jqXHR: jqXHR, + textStatus: textStatus, + errorThrown: errorThrown + }; + + query.callback(results); } }); handler = transport.call(self, params); @@ -689,12 +699,15 @@ this.container = this.createContainer(); - this.liveRegion = $("<span>", { - role: "status", - "aria-live": "polite" - }) - .addClass("select2-hidden-accessible") - .appendTo(document.body); + this.liveRegion = $('.select2-hidden-accessible'); + if (this.liveRegion.length == 0) { + this.liveRegion = $("<span>", { + role: "status", + "aria-live": "polite" + }) + .addClass("select2-hidden-accessible") + .appendTo(document.body); + } this.containerId="s2id_"+(opts.element.attr("id") || "autogen"+nextUid()); this.containerEventName= this.containerId @@ -704,7 +717,7 @@ this.container.attr("title", opts.element.attr("title")); - this.body = $("body"); + this.body = $(document.body); syncCssClasses(this.container, this.opts.element, this.opts.adaptContainerCssClass); @@ -801,7 +814,7 @@ // focusin can cause focus wars between modals and select2 since the dropdown is outside the modal. this.dropdown.on("click mouseup mousedown touchstart touchend focusin", function (e) { e.stopPropagation(); }); - this.nextSearchTerm = undefined; + this.lastSearchTerm = undefined; if ($.isFunction(this.opts.initSelection)) { // initialize selection based on the current value of the source element @@ -836,13 +849,15 @@ // abstract destroy: function () { - var element=this.opts.element, select2 = element.data("select2"); + var element=this.opts.element, select2 = element.data("select2"), self = this; this.close(); - if (element.length && element[0].detachEvent) { + if (element.length && element[0].detachEvent && self._sync) { element.each(function () { - this.detachEvent("onpropertychange", this._sync); + if (self._sync) { + this.detachEvent("onpropertychange", self._sync); + } }); } if (this.propertyObserver) { @@ -855,17 +870,21 @@ select2.container.remove(); select2.liveRegion.remove(); select2.dropdown.remove(); - element - .removeClass("select2-offscreen") - .removeData("select2") - .off(".select2") - .prop("autofocus", this.autofocus || false); - if (this.elementTabIndex) { - element.attr({tabindex: this.elementTabIndex}); + element.removeData("select2") + .off(".select2"); + if (!element.is("input[type='hidden']")) { + element + .show() + .prop("autofocus", this.autofocus || false); + if (this.elementTabIndex) { + element.attr({tabindex: this.elementTabIndex}); + } else { + element.removeAttr("tabindex"); + } + element.show(); } else { - element.removeAttr("tabindex"); + element.css("display", ""); } - element.show(); } cleanupJQueryElements.call(this, @@ -917,6 +936,155 @@ }); } + opts.debug = opts.debug || $.fn.select2.defaults.debug; + + // Warnings for options renamed/removed in Select2 4.0.0 + // Only when it's enabled through debug mode + if (opts.debug && console && console.warn) { + // id was removed + if (opts.id != null) { + console.warn( + 'Select2: The `id` option has been removed in Select2 4.0.0, ' + + 'consider renaming your `id` property or mapping the property before your data makes it to Select2. ' + + 'You can read more at https://select2.github.io/announcements-4.0.html#changed-id' + ); + } + + // text was removed + if (opts.text != null) { + console.warn( + 'Select2: The `text` option has been removed in Select2 4.0.0, ' + + 'consider renaming your `text` property or mapping the property before your data makes it to Select2. ' + + 'You can read more at https://select2.github.io/announcements-4.0.html#changed-id' + ); + } + + // sortResults was renamed to results + if (opts.sortResults != null) { + console.warn( + 'Select2: the `sortResults` option has been renamed to `sorter` in Select2 4.0.0. ' + ); + } + + // selectOnBlur was renamed to selectOnClose + if (opts.selectOnBlur != null) { + console.warn( + 'Select2: The `selectOnBlur` option has been renamed to `selectOnClose` in Select2 4.0.0.' + ); + } + + // ajax.results was renamed to ajax.processResults + if (opts.ajax != null && opts.ajax.results != null) { + console.warn( + 'Select2: The `ajax.results` option has been renamed to `ajax.processResults` in Select2 4.0.0.' + ); + } + + // format* options were renamed to language.* + if (opts.formatNoResults != null) { + console.warn( + 'Select2: The `formatNoResults` option has been renamed to `language.noResults` in Select2 4.0.0.' + ); + } + if (opts.formatSearching != null) { + console.warn( + 'Select2: The `formatSearching` option has been renamed to `language.searching` in Select2 4.0.0.' + ); + } + if (opts.formatInputTooShort != null) { + console.warn( + 'Select2: The `formatInputTooShort` option has been renamed to `language.inputTooShort` in Select2 4.0.0.' + ); + } + if (opts.formatInputTooLong != null) { + console.warn( + 'Select2: The `formatInputTooLong` option has been renamed to `language.inputTooLong` in Select2 4.0.0.' + ); + } + if (opts.formatLoading != null) { + console.warn( + 'Select2: The `formatLoading` option has been renamed to `language.loadingMore` in Select2 4.0.0.' + ); + } + if (opts.formatSelectionTooBig != null) { + console.warn( + 'Select2: The `formatSelectionTooBig` option has been renamed to `language.maximumSelected` in Select2 4.0.0.' + ); + } + + if (opts.element.data('select2Tags')) { + console.warn( + 'Select2: The `data-select2-tags` attribute has been renamed to `data-tags` in Select2 4.0.0.' + ); + } + } + + // Aliasing options renamed in Select2 4.0.0 + + // data-select2-tags -> data-tags + if (opts.element.data('tags') != null) { + var elemTags = opts.element.data('tags'); + + // data-tags should actually be a boolean + if (!$.isArray(elemTags)) { + elemTags = []; + } + + opts.element.data('select2Tags', elemTags); + } + + // sortResults -> sorter + if (opts.sorter != null) { + opts.sortResults = opts.sorter; + } + + // selectOnBlur -> selectOnClose + if (opts.selectOnClose != null) { + opts.selectOnBlur = opts.selectOnClose; + } + + // ajax.results -> ajax.processResults + if (opts.ajax != null) { + if ($.isFunction(opts.ajax.processResults)) { + opts.ajax.results = opts.ajax.processResults; + } + } + + // Formatters/language options + if (opts.language != null) { + var lang = opts.language; + + // formatNoMatches -> language.noMatches + if ($.isFunction(lang.noMatches)) { + opts.formatNoMatches = lang.noMatches; + } + + // formatSearching -> language.searching + if ($.isFunction(lang.searching)) { + opts.formatSearching = lang.searching; + } + + // formatInputTooShort -> language.inputTooShort + if ($.isFunction(lang.inputTooShort)) { + opts.formatInputTooShort = lang.inputTooShort; + } + + // formatInputTooLong -> language.inputTooLong + if ($.isFunction(lang.inputTooLong)) { + opts.formatInputTooLong = lang.inputTooLong; + } + + // formatLoading -> language.loadingMore + if ($.isFunction(lang.loadingMore)) { + opts.formatLoading = lang.loadingMore; + } + + // formatSelectionTooBig -> language.maximumSelected + if ($.isFunction(lang.maximumSelected)) { + opts.formatSelectionTooBig = lang.maximumSelected; + } + } + opts = $.extend({}, { populateResults: function(container, results, query) { var populate, id=this.opts.id, liveRegion=this.liveRegion; @@ -960,7 +1128,6 @@ if (compound) { - innerContainer=$("<ul></ul>"); innerContainer.addClass("select2-result-sub"); populate(result.children, innerContainer, depth+1); @@ -1027,11 +1194,10 @@ query.callback(data); }); - // this is needed because inside val() we construct choices from options and there id is hardcoded + // this is needed because inside val() we construct choices from options and their id is hardcoded opts.id=function(e) { return e.id; }; } else { if (!("query" in opts)) { - if ("ajax" in opts) { ajaxUrl = opts.element.data("ajax-url"); if (ajaxUrl && ajaxUrl.length > 0) { @@ -1048,7 +1214,7 @@ if (opts.initSelection === undefined) { opts.initSelection = function (element, callback) { var data = []; - $(splitVal(element.val(), opts.separator)).each(function () { + $(splitVal(element.val(), opts.separator, opts.transformVal)).each(function () { var obj = { id: this, text: this }, tags = opts.tags; if ($.isFunction(tags)) tags=tags(); @@ -1103,11 +1269,15 @@ if (readonly === undefined) readonly = false; this.readonly(readonly); - syncCssClasses(this.container, this.opts.element, this.opts.adaptContainerCssClass); - this.container.addClass(evaluate(this.opts.containerCssClass, this.opts.element)); - - syncCssClasses(this.dropdown, this.opts.element, this.opts.adaptDropdownCssClass); - this.dropdown.addClass(evaluate(this.opts.dropdownCssClass, this.opts.element)); + if (this.container) { + syncCssClasses(this.container, this.opts.element, this.opts.adaptContainerCssClass); + this.container.addClass(evaluate(this.opts.containerCssClass, this.opts.element)); + } + + if (this.dropdown) { + syncCssClasses(this.dropdown, this.opts.element, this.opts.adaptDropdownCssClass); + this.dropdown.addClass(evaluate(this.opts.dropdownCssClass, this.opts.element)); + } }); @@ -1212,9 +1382,10 @@ // abstract positionDropdown: function() { var $dropdown = this.dropdown, - offset = this.container.offset(), - height = this.container.outerHeight(false), - width = this.container.outerWidth(false), + container = this.container, + offset = container.offset(), + height = container.outerHeight(false), + width = container.outerWidth(false), dropHeight = $dropdown.outerHeight(false), $window = $(window), windowWidth = $window.width(), @@ -1226,7 +1397,12 @@ enoughRoomBelow = dropTop + dropHeight <= viewportBottom, enoughRoomAbove = (offset.top - dropHeight) >= $window.scrollTop(), dropWidth = $dropdown.outerWidth(false), - enoughRoomOnRight = dropLeft + dropWidth <= viewPortRight, + enoughRoomOnRight = function() { + return dropLeft + dropWidth <= viewPortRight; + }, + enoughRoomOnLeft = function() { + return offset.left + viewPortRight + container.outerWidth(false) > dropWidth; + }, aboveNow = $dropdown.hasClass("select2-drop-above"), bodyOffset, above, @@ -1261,7 +1437,6 @@ dropTop = offset.top + height; dropLeft = offset.left; dropWidth = $dropdown.outerWidth(false); - enoughRoomOnRight = dropLeft + dropWidth <= viewPortRight; $dropdown.show(); // fix so the cursor does not move to the left within the search-textbox in IE @@ -1276,7 +1451,6 @@ dropWidth = $dropdown.outerWidth(false) + (resultsListNode.scrollHeight === resultsListNode.clientHeight ? 0 : scrollBarDimensions.width); dropWidth > width ? width = dropWidth : dropWidth = width; dropHeight = $dropdown.outerHeight(false); - enoughRoomOnRight = dropLeft + dropWidth <= viewPortRight; } else { this.container.removeClass('select2-drop-auto-width'); @@ -1292,7 +1466,7 @@ dropLeft -= bodyOffset.left; } - if (!enoughRoomOnRight) { + if (!enoughRoomOnRight() && enoughRoomOnLeft()) { dropLeft = offset.left + this.container.outerWidth(false) - dropWidth; } @@ -1302,10 +1476,11 @@ }; if (above) { + this.container.addClass("select2-drop-above"); + $dropdown.addClass("select2-drop-above"); + dropHeight = $dropdown.outerHeight(false); css.top = offset.top - dropHeight; css.bottom = 'auto'; - this.container.addClass("select2-drop-above"); - $dropdown.addClass("select2-drop-above"); } else { css.top = dropTop; @@ -1381,7 +1556,7 @@ // create the dropdown mask if doesn't already exist mask = $("#select2-drop-mask"); - if (mask.length == 0) { + if (mask.length === 0) { mask = $(document.createElement("div")); mask.attr("id","select2-drop-mask").attr("class","select2-drop-mask"); mask.hide(); @@ -1458,6 +1633,9 @@ this.clearSearch(); this.search.removeClass("select2-active"); + + // Remove the aria active descendant for highlighted element + this.search.removeAttr("aria-activedescendant"); this.opts.element.trigger($.Event("select2-close")); }, @@ -1476,6 +1654,27 @@ }, + /** + * @return {Boolean} Whether or not search value was changed. + * @private + */ + prefillNextSearchTerm: function () { + // initializes search's value with nextSearchTerm (if defined by user) + // ignore nextSearchTerm if the dropdown is opened by the user pressing a letter + if(this.search.val() !== "") { + return false; + } + + var nextSearchTerm = this.opts.nextSearchTerm(this.data(), this.lastSearchTerm); + if(nextSearchTerm !== undefined){ + this.search.val(nextSearchTerm); + this.search.select(); + return true; + } + + return false; + }, + //abstract getMaximumSelectionSize: function() { return evaluate(this.opts.maximumSelectionSize, this.opts.element); @@ -1515,7 +1714,7 @@ } } - rb = results.offset().top + results.outerHeight(true); + rb = results.offset().top + results.outerHeight(false); if (hb > rb) { results.scrollTop(results.scrollTop() + (hb - rb)); } @@ -1638,7 +1837,7 @@ self.postprocessResults(data, false, false); if (data.more===true) { - more.detach().appendTo(results).text(evaluate(self.opts.formatLoadMore, self.opts.element, page+1)); + more.detach().appendTo(results).html(self.opts.escapeMarkup(evaluate(self.opts.formatLoadMore, self.opts.element, page+1))); window.setTimeout(function() { self.loadMoreIfNeeded(); }, 10); } else { more.remove(); @@ -1691,7 +1890,7 @@ self.liveRegion.text(results.text()); } else { - self.liveRegion.text(self.opts.formatMatches(results.find('.select2-result-selectable').length)); + self.liveRegion.text(self.opts.formatMatches(results.find('.select2-result-selectable:not(".select2-selected")').length)); } } @@ -1766,6 +1965,12 @@ return; } + // handle ajax error + if(data.hasError !== undefined && checkFormatter(opts.formatAjaxError, "formatAjaxError")) { + render("<li class='select2-ajax-error'>" + evaluate(opts.formatAjaxError, opts.element, data.jqXHR, data.textStatus, data.errorThrown) + "</li>"); + return; + } + // save context, if any this.context = (data.context===undefined) ? null : data.context; // create a default choice and prepend it to the list @@ -1783,6 +1988,9 @@ if (data.results.length === 0 && checkFormatter(opts.formatNoMatches, "formatNoMatches")) { render("<li class='select2-no-results'>" + evaluate(opts.formatNoMatches, opts.element, search.val()) + "</li>"); + if(this.showSearch){ + this.showSearch(search.val()); + } return; } @@ -1887,7 +2095,7 @@ } else if (this.opts.width === "copy" || this.opts.width === "resolve") { // check if there is inline style on the element that contains width style = this.opts.element.attr('style'); - if (style !== undefined) { + if (typeof(style) === "string") { attrs = style.split(';'); for (i = 0, l = attrs.length; i < l; i = i + 1) { attr = attrs[i].replace(/\s/g, ''); @@ -1986,14 +2194,7 @@ } } - // initializes search's value with nextSearchTerm (if defined by user) - // ignore nextSearchTerm if the dropdown is opened by the user pressing a letter - if(this.search.val() === "") { - if(this.nextSearchTerm != undefined){ - this.search.val(this.nextSearchTerm); - this.search.select(); - } - } + this.prefillNextSearchTerm(); this.focusser.prop("disabled", true).val(""); this.updateResults(true); @@ -2080,6 +2281,7 @@ this.focusser.attr("id", "s2id_autogen"+idSuffix); elementLabel = $("label[for='" + this.opts.element.attr("id") + "']"); + this.opts.element.on('focus.select2', this.bind(function () { this.focus(); })); this.focusser.prev() .text(elementLabel.text()) @@ -2101,6 +2303,9 @@ this.search.on("keydown", this.bind(function (e) { if (!this.isInterfaceEnabled()) return; + // filter 229 keyCodes (input method editor is processing key input) + if (229 == e.keyCode) return; + if (e.which === KEY.PAGE_UP || e.which === KEY.PAGE_DOWN) { // prevent the page from scrolling killEvent(e); @@ -2132,7 +2337,7 @@ // without this the search field loses focus which is annoying if (document.activeElement === this.body.get(0)) { window.setTimeout(this.bind(function() { - if (this.opened()) { + if (this.opened() && this.results && this.results.length > 1) { this.search.focus(); } }), 0); @@ -2181,11 +2386,17 @@ })); selection.on("mousedown touchstart", "abbr", this.bind(function (e) { - if (!this.isInterfaceEnabled()) return; + if (!this.isInterfaceEnabled()) { + return; + } + this.clear(); killEventImmediately(e); this.close(); - this.selection.focus(); + + if (this.selection) { + this.selection.focus(); + } })); selection.on("mousedown touchstart", this.bind(function (e) { @@ -2234,7 +2445,7 @@ })); this.initContainerWidth(); - this.opts.element.addClass("select2-offscreen"); + this.opts.element.hide(); this.setPlaceholder(); }, @@ -2278,7 +2489,7 @@ self.updateSelection(selected); self.close(); self.setPlaceholder(); - self.nextSearchTerm = self.opts.nextSearchTerm(selected, self.search.val()); + self.lastSearchTerm = self.search.val(); } }); } @@ -2415,7 +2626,7 @@ this.opts.element.trigger({ type: "select2-selected", val: this.id(data), choice: data }); - this.nextSearchTerm = this.opts.nextSearchTerm(data, this.search.val()); + this.lastSearchTerm = this.search.val(); this.close(); if ((!options || !options.noFocus) && this.opts.shouldFocusInput(this)) { @@ -2469,9 +2680,23 @@ if (arguments.length > 1) { triggerChange = arguments[1]; + + if (this.opts.debug && console && console.warn) { + console.warn( + 'Select2: The second option to `select2("val")` is not supported in Select2 4.0.0. ' + + 'The `change` event will always be triggered in 4.0.0.' + ); + } } if (this.select) { + if (this.opts.debug && console && console.warn) { + console.warn( + 'Select2: Setting the value on a <select> using `select2("val")` is no longer supported in 4.0.0. ' + + 'You can use the `.val(newValue).trigger("change")` method provided by jQuery instead.' + ); + } + this.select .val(val) .find("option").filter(function() { return this.selected }).each2(function (i, elm) { @@ -2520,6 +2745,13 @@ if (data == undefined) data = null; return data; } else { + if (this.opts.debug && console && console.warn) { + console.warn( + 'Select2: The `select2("data")` method can no longer set selected values in 4.0.0, ' + + 'consider using the `.val()` method instead.' + ); + } + if (arguments.length > 1) { triggerChange = arguments[1]; } @@ -2563,7 +2795,6 @@ self=this; // TODO validate placeholder is a string if specified - if (opts.element.get(0).tagName.toLowerCase() === "select") { // install the selection initializer opts.initSelection = function (element, callback) { @@ -2578,7 +2809,7 @@ } else if ("data" in opts) { // install default initSelection when applied to hidden input and data is local opts.initSelection = opts.initSelection || function (element, callback) { - var ids = splitVal(element.val(), opts.separator); + var ids = splitVal(element.val(), opts.separator, opts.transformVal); //search in data by array of ids, storing matching items in a list var matches = []; opts.query({ @@ -2655,8 +2886,7 @@ this.selection = selection = this.container.find(selector); var _this = this; - this.selection.on("click", ".select2-search-choice:not(.select2-locked)", function (e) { - //killEvent(e); + this.selection.on("click", ".select2-container:not(.select2-container-disabled) .select2-search-choice:not(.select2-locked)", function (e) { _this.search[0].focus(); _this.selectChoice($(this)); }); @@ -2667,6 +2897,7 @@ this.search.prev() .text($("label[for='" + this.opts.element.attr("id") + "']").text()) .attr('for', this.search.attr('id')); + this.opts.element.on('focus.select2', this.bind(function () { this.focus(); })); this.search.on("input paste", this.bind(function() { if (this.search.attr('placeholder') && this.search.val().length == 0) return; @@ -2818,7 +3049,7 @@ })); this.initContainerWidth(); - this.opts.element.addClass("select2-offscreen"); + this.opts.element.hide(); // set the placeholder if necessary this.clearSearch(); @@ -2884,16 +3115,9 @@ this.focusSearch(); - // initializes search's value with nextSearchTerm (if defined by user) - // ignore nextSearchTerm if the dropdown is opened by the user pressing a letter - if(this.search.val() === "") { - if(this.nextSearchTerm != undefined){ - this.search.val(this.nextSearchTerm); - this.search.select(); - } - } - + this.prefillNextSearchTerm(); this.updateResults(true); + if (this.opts.shouldFocusInput(this)) { this.search.focus(); } @@ -2919,21 +3143,18 @@ // multi updateSelection: function (data) { - var ids = [], filtered = [], self = this; + var ids = {}, filtered = [], self = this; // filter out duplicates $(data).each(function () { - if (indexOf(self.id(this), ids) < 0) { - ids.push(self.id(this)); + if (!(self.id(this) in ids)) { + ids[self.id(this)] = 0; filtered.push(this); } }); - data = filtered; this.selection.find(".select2-search-choice").remove(); - $(data).each(function () { - self.addSelectedChoice(this); - }); + this.addSelectedChoice(filtered); self.postprocessResults(); }, @@ -2953,14 +3174,14 @@ // multi onSelect: function (data, options) { - if (!this.triggerSelect(data)) { return; } + if (!this.triggerSelect(data) || data.text === "") { return; } this.addSelectedChoice(data); this.opts.element.trigger({ type: "selected", val: this.id(data), choice: data }); // keep track of the search's value before it gets cleared - this.nextSearchTerm = this.opts.nextSearchTerm(data, this.search.val()); + this.lastSearchTerm = this.search.val(); this.clearSearch(); this.updateResults(); @@ -2980,10 +3201,8 @@ this.updateResults(true); } else { // initializes search's value with nextSearchTerm and update search result - if(this.nextSearchTerm != undefined){ - this.search.val(this.nextSearchTerm); + if (this.prefillNextSearchTerm()) { this.updateResults(); - this.search.select(); } } this.positionDropdown(); @@ -3009,6 +3228,14 @@ }, addSelectedChoice: function (data) { + var val = this.getVal(), self = this; + $(data).each(function () { + val.push(self.createChoice(this)); + }); + this.setVal(val); + }, + + createChoice: function (data) { var enableChoice = !data.locked, enabledItem = $( "<li class='select2-search-choice'>" + @@ -3021,13 +3248,12 @@ "</li>"); var choice = enableChoice ? enabledItem : disabledItem, id = this.id(data), - val = this.getVal(), formatted, cssClass; formatted=this.opts.formatSelection(data, choice.find("div"), this.opts.escapeMarkup); if (formatted != undefined) { - choice.find("div").replaceWith("<div>"+formatted+"</div>"); + choice.find("div").replaceWith($("<div></div>").html(formatted)); } cssClass=this.opts.formatSelectionCssClass(data, choice.find("div")); if (cssClass != undefined) { @@ -3055,8 +3281,7 @@ choice.data("select2-data", data); choice.insertBefore(this.searchContainer); - val.push(id); - this.setVal(val); + return id; }, // multi @@ -3125,7 +3350,7 @@ } }); - if (this.highlight() == -1 && noHighlightUpdate !== false){ + if (this.highlight() == -1 && noHighlightUpdate !== false && this.opts.closeOnSelect === true){ self.highlight(0); } @@ -3182,20 +3407,22 @@ return val === null ? [] : val; } else { val = this.opts.element.val(); - return splitVal(val, this.opts.separator); + return splitVal(val, this.opts.separator, this.opts.transformVal); } }, // multi setVal: function (val) { - var unique; if (this.select) { this.select.val(val); } else { - unique = []; + var unique = [], valMap = {}; // filter out duplicates $(val).each(function () { - if (indexOf(this, unique) < 0) unique.push(this); + if (!(this in valMap)) { + unique.push(this); + valMap[this] = 0; + } }); this.opts.element.val(unique.length === 0 ? "" : unique.join(this.opts.separator)); } @@ -3211,11 +3438,9 @@ for (var j = 0; j < old.length; j++) { if (equal(this.opts.id(current[i]), this.opts.id(old[j]))) { current.splice(i, 1); - if(i>0){ - i--; - } + i--; old.splice(j, 1); - j--; + break; } } } @@ -3385,6 +3610,7 @@ // plugin defaults, accessible to users $.fn.select2.defaults = { + debug: false, width: "copy", loadMorePadding: 0, closeOnSelect: true, @@ -3395,29 +3621,36 @@ dropdownCssClass: "", formatResult: function(result, container, query, escapeMarkup) { var markup=[]; - markMatch(result.text, query.term, markup, escapeMarkup); + markMatch(this.text(result), query.term, markup, escapeMarkup); return markup.join(""); }, + transformVal: function(val) { + return $.trim(val); + }, formatSelection: function (data, container, escapeMarkup) { - return data ? escapeMarkup(data.text) : undefined; + return data ? escapeMarkup(this.text(data)) : undefined; }, sortResults: function (results, container, query) { return results; }, formatResultCssClass: function(data) {return data.css;}, formatSelectionCssClass: function(data, container) {return undefined;}, - formatMatches: function (matches) { if (matches === 1) { return "One result is available, press enter to select it."; } return matches + " results are available, use up and down arrow keys to navigate."; }, - formatNoMatches: function () { return "No matches found"; }, - formatInputTooShort: function (input, min) { var n = min - input.length; return "Please enter " + n + " or more character" + (n == 1? "" : "s"); }, - formatInputTooLong: function (input, max) { var n = input.length - max; return "Please delete " + n + " character" + (n == 1? "" : "s"); }, - formatSelectionTooBig: function (limit) { return "You can only select " + limit + " item" + (limit == 1 ? "" : "s"); }, - formatLoadMore: function (pageNumber) { return "Loading more results…"; }, - formatSearching: function () { return "Searching…"; }, minimumResultsForSearch: 0, minimumInputLength: 0, maximumInputLength: null, maximumSelectionSize: 0, id: function (e) { return e == undefined ? null : e.id; }, + text: function (e) { + if (e && this.data && this.data.text) { + if ($.isFunction(this.data.text)) { + return this.data.text(e); + } else { + return e[this.data.text]; + } + } else { + return e.text; + } + }, matcher: function(term, text) { return stripDiacritics(''+text).toUpperCase().indexOf(stripDiacritics(''+term).toUpperCase()) >= 0; }, @@ -3451,6 +3684,21 @@ } }; + $.fn.select2.locales = []; + + $.fn.select2.locales['en'] = { + formatMatches: function (matches) { if (matches === 1) { return "One result is available, press enter to select it."; } return matches + " results are available, use up and down arrow keys to navigate."; }, + formatNoMatches: function () { return "No matches found"; }, + formatAjaxError: function (jqXHR, textStatus, errorThrown) { return "Loading failed"; }, + formatInputTooShort: function (input, min) { var n = min - input.length; return "Please enter " + n + " or more character" + (n == 1 ? "" : "s"); }, + formatInputTooLong: function (input, max) { var n = input.length - max; return "Please delete " + n + " character" + (n == 1 ? "" : "s"); }, + formatSelectionTooBig: function (limit) { return "You can only select " + limit + " item" + (limit == 1 ? "" : "s"); }, + formatLoadMore: function (pageNumber) { return "Loading more results…"; }, + formatSearching: function () { return "Searching…"; } + }; + + $.extend($.fn.select2.defaults, $.fn.select2.locales['en']); + $.fn.select2.ajaxDefaults = { transport: $.ajax, params: {