select2-rails 0.0.6 → 0.0.7

data/lib/select2-rails/version.rb

@@ -1,5 +1,5 @@
 module Select2
   module Rails
-    VERSION = "0.0.6"
+    VERSION = "0.0.7"
   end
 end

data/vendor/assets/javascripts/select2.js

@@ -29,7 +29,7 @@
 				return this;
 			}
  		});
- 	} 
+ 	}
 })(jQuery);
 
 (function ($, undefined) {
@@ -79,6 +79,9 @@
             case KEY.ALT:
                 return true;
             }
+
+            if (k.metaKey) return true;
+
             return false;
         },
         isFunctionKey: function (k) {
@@ -163,7 +166,7 @@
      *
      * filters out mouse events that occur when mouse is stationary but
      * the elements under the pointer are scrolled.
-     */    
+     */
     function installFilteredMouseMove(element) {
 	    element.bind("mousemove", function (e) {
             var lastpos = $(document).data("select2-lastpos");
@@ -201,7 +204,7 @@
         event.stopPropagation();
     }
 
-    function measureTextWidth(e) {        
+    function measureTextWidth(e) {
         if (!sizer){
         	var style = e[0].currentStyle || window.getComputedStyle(e[0], null);
         	sizer = $("<div></div>").css({
@@ -216,10 +219,10 @@
 	            letterSpacing: style.letterSpacing,
 	            textTransform: style.textTransform,
 	            whiteSpace: "nowrap"
-	        });        
+	        });
         	$("body").append(sizer);
         }
-        sizer.text(e.val());        
+        sizer.text(e.val());
         return sizer.width();
     }
 
@@ -268,11 +271,11 @@
                     data = options.data, // ajax data function
                     transport = options.transport || $.ajax,
                     type = options.type || 'GET'; // set type of request (GET or POST)
-                
+
                 data = data.call(this, query.term, query.page, query.context);
 
                 if( null !== handler) { handler.abort(); }
-                
+
                 handler = transport.call(null, {
                     url: options.url,
                     dataType: options.dataType,
@@ -473,11 +476,11 @@
 
             installKeyUpChangeEvent(search);
             search.bind("keyup-change", this.bind(this.updateResults));
-            search.bind("focus", function () { search.addClass("select2-focused");});
+            search.bind("focus", function () { search.addClass("select2-focused"); if (search.val() === " ") search.val(""); });
             search.bind("blur", function () { search.removeClass("select2-focused");});
 
             this.dropdown.delegate(resultsSelector, "click", this.bind(function (e) {
-                if ($(e.target).closest(".select2-result:not(.select2-disabled)").length > 0) {
+                if ($(e.target).closest(".select2-result-selectable:not(.select2-disabled)").length > 0) {
                     this.highlightUnderEvent(e);
                     this.selectHighlighted(e);
                 } else {
@@ -507,14 +510,14 @@
                 select2.opts.element
                     .removeData("select2")
                     .unbind(".select2")
-                    .show();                
+                    .show();
             }
         },
 
         // abstract
         prepareOpts: function (opts) {
             var element, select, idKey;
-            
+
             element = opts.element;
 
             if (element.get(0).tagName.toLowerCase() === "select") {
@@ -536,7 +539,7 @@
                 containerCssClass: "",
                 dropdownCssClass: "",
                 populateResults: function(container, results, query) {
-                    var uidToData={}, populate, markup=[], uid, data, result, children, formatted;
+                    var uidToData={}, populate, markup=[], uid, data, result, children, formatted, id=this.opts.id;
 
                     populate=function(results, depth) {
 
@@ -544,20 +547,19 @@
                         for (i = 0, l = results.length; i < l; i = i + 1) {
 
                             result=results[i];
-                            selectable=("id" in result); // TODO switch to id() function
+                            selectable=id(result) !== undefined;
                             compound=("children" in result) && result.children.length > 0;
 
-                            markup.push("<li class='select2-result-depth-"+depth);
-                            if (!selectable) { markup.push(" select2-result-unselectable"); } else { markup.push(" select2-result");}
+                            markup.push("<li class='select2-result-depth-" + depth);
+                            markup.push(" select2-result");
+                            markup.push(selectable ? " select2-result-selectable" : " select2-result-unselectable");
                             if (compound) { markup.push(" select2-result-with-children"); }
 
                             markup.push("'");
 
-                            if (selectable) {
-                                uid=nextUid();
-                                markup.push(" id='select2-result-"+uid+"'");
-                                uidToData[uid]=result;
-                            }
+                            uid=nextUid();
+                            markup.push(" id='select2-result-"+uid+"'");
+                            uidToData[uid]=result;
 
                             markup.push("><div class='select2-result-label'>");
                             formatted=opts.formatResult(result, query, markup);
@@ -579,12 +581,7 @@
 
                     populate(results, 0);
 
-                    children=container.children();
-                    if (children.length===0) {
-                        container.html(markup.join(""));
-                    } else {
-                        $(children[children.length-1]).append(markup.join(""));
-                    }
+                    container.append(markup.join(""));
 
                     for (uid in uidToData) {
                         $("#select2-result-"+uid, container).data("select2-data", uidToData[uid]);
@@ -623,10 +620,10 @@
                         var group;
                         if (element.is("option")) {
                             if (query.matcher(term, element.text())) {
-                                collection.push({id:element.attr("value"), text:element.text()});
+                                collection.push({id:element.attr("value"), text:element.text(), element: element.get()});
                             }
                         } else if (element.is("optgroup")) {
-                            group={text:element.attr("label"), children:[]};
+                            group={text:element.attr("label"), children:[], element: element.get()};
                             element.children().each2(function(i, elm) { process(elm, group.children); });
                             if (group.children.length>0) {
                                 collection.push(group);
@@ -659,12 +656,13 @@
                     } else if ("tags" in opts) {
                         opts.query = tags(opts.tags);
                         opts.createSearchChoice = function (term) { return {id: term, text: term}; };
-                        opts.initSelection = function (element) {
+                        opts.initSelection = function (element, callback) {
                             var data = [];
                             $(splitVal(element.val(), ",")).each(function () {
                                 data.push({id: this, text: this});
                             });
-                            return data;
+
+                            callback(data);
                         };
                     }
                 }
@@ -739,16 +737,36 @@
             this.dropdown.css(css);
         },
 
+        // abstract
+        shouldOpen: function() {
+            var event;
+
+            if (this.opened()) return false;
+
+            event = jQuery.Event("open");
+            this.opts.element.trigger(event);
+            return !event.isDefaultPrevented();
+        },
+
+        /**
+         * Opens the dropdown
+         *
+         * @return {Boolean} whether or not dropdown was opened. This method will return false if, for example,
+         * the dropdown is already open, or if the 'open' event listener on the element called preventDefault().
+         */
         // abstract
         open: function () {
-            if (this.opened()) return;
+
+            if (!this.shouldOpen()) return false;
+
+            if (this.search.val() === " ") { this.search.val(""); }
 
             this.container.addClass("select2-dropdown-open").addClass("select2-container-active");
-            if(this.dropdown[0] !== this.body.children().last()[0]) { 
+            if(this.dropdown[0] !== this.body.children().last()[0]) {
 				// ensure the dropdown is the last child of body, so the z-index is always respected correctly
                 this.dropdown.detach().appendTo(this.body);
             }
-	
+
             this.dropdown.addClass("select2-drop-active");
 
             this.positionDropdown();
@@ -757,6 +775,8 @@
             this.dropdown.show();
             this.ensureHighlightVisible();
             this.focusSearch();
+
+            return true;
         },
 
         // abstract
@@ -777,12 +797,22 @@
         // abstract
         ensureHighlightVisible: function () {
             var results = this.results, children, index, child, hb, rb, y, more;
-            
+
             index = this.highlight();
 
             if (index < 0) return;
-            
-            children = results.find(".select2-result");
+
+            if (index == 0) {
+
+                // if the first element is highlighted scroll all the way to the top,
+                // that way any unselectable headers above it will also be scrolled
+                // into view
+
+                results.scrollTop(0);
+                return;
+            }
+
+            children = results.find(".select2-result-selectable");
 
             child = $(children[index]);
 
@@ -810,12 +840,13 @@
 
         // abstract
         moveHighlight: function (delta) {
-            var choices = this.results.find(".select2-result"),
+            var choices = this.results.find(".select2-result-selectable"),
                 index = this.highlight();
 
             while (index > -1 && index < choices.length) {
                 index += delta;
-                if (!$(choices[index]).hasClass("select2-disabled")) {
+                var choice = $(choices[index]);
+                if (choice.hasClass("select2-result-selectable") && !choice.hasClass("select2-disabled")) {
                     this.highlight(index);
                     break;
                 }
@@ -824,7 +855,7 @@
 
         // abstract
         highlight: function (index) {
-            var choices = this.results.find(".select2-result .select2-result-label");
+            var choices = this.results.find(".select2-result-selectable");
 
             if (arguments.length === 0) {
                 return indexOf(choices.filter(".select2-highlighted")[0], choices.get());
@@ -833,10 +864,6 @@
             if (index >= choices.length) index = choices.length - 1;
             if (index < 0) index = 0;
 
-            if ($(choices[index]).parent().is('.select2-result-unselectable')) {
-                return;
-            }
-
             choices.removeClass("select2-highlighted");
 
             $(choices[index]).addClass("select2-highlighted");
@@ -847,10 +874,13 @@
 
         // abstract
         highlightUnderEvent: function (event) {
-            var el = $(event.target).closest(".select2-result");            
+            var el = $(event.target).closest(".select2-result-selectable");
             if (el.length > 0 && !el.is(".select2-highlighted")) {
-        		var choices = this.results.find('.select2-result');
+        		var choices = this.results.find('.select2-result-selectable');
                 this.highlight(choices.index(el));
+            } else if (el.length == 0) {
+                // if we are over an unselectable item remove al highlights
+                this.results.find(".select2-highlighted").removeClass("select2-highlighted");
             }
         },
 
@@ -877,12 +907,11 @@
                         matcher: this.opts.matcher,
                         callback: this.bind(function (data) {
 
-                    self.opts.populateResults(results, data.results, {term: term, page: page, context:context});
+                    self.opts.populateResults.call(this, results, data.results, {term: term, page: page, context:context});
 
                     if (data.more===true) {
-                        more.detach();
-                        results.children().filter(":last").append(more);
-                        more.removeClass("select2-active");
+                        more.detach().appendTo(results.children(":last")).text(self.opts.formatLoadMore(page+1));
+                        window.setTimeout(function() { self.loadMoreIfNeeded(); }, 10);
                     } else {
                         more.remove();
                     }
@@ -951,11 +980,12 @@
                 }
 
                 results.empty();
-                self.opts.populateResults(results, data.results, {term: search.val(), page: this.resultsPage, context:null});
+                self.opts.populateResults.call(this, results, data.results, {term: search.val(), page: this.resultsPage, context:null});
                 postRender();
 
                 if (data.more === true) {
                     results.children().filter(":last").append("<li class='select2-more-results'>" + opts.formatLoadMore(this.resultsPage) + "</li>");
+                    window.setTimeout(function() { self.loadMoreIfNeeded(); }, 10);
                 }
 
                 this.postprocessResults(data, initial);
@@ -972,7 +1002,8 @@
             this.close();
             this.container.removeClass("select2-container-active");
             this.dropdown.removeClass("select2-drop-active");
-            if (this.search.is(":focus")) { this.search.blur(); }
+            // synonymous to .is(':focus'), which is available in jquery >= 1.6
+            if (this.search[0] === document.activeElement) { this.search.blur(); }
             this.clearSearch();
             this.selection.find(".select2-search-choice-focus").removeClass("select2-search-choice-focus");
         },
@@ -988,7 +1019,7 @@
 
         // abstract
         selectHighlighted: function () {
-            var data = this.results.find(".select2-highlighted").not(".select2-disabled").closest('.select2-result').not('.select2-result-unselectable').data("select2-data");
+            var data = this.results.find(".select2-highlighted").not(".select2-disabled").closest('.select2-result-selectable').data("select2-data");
             if (data) {
                 this.onSelect(data);
             }
@@ -996,7 +1027,10 @@
 
         // abstract
         getPlaceholder: function () {
-            return this.opts.element.attr("placeholder") || this.opts.element.data("placeholder") || this.opts.placeholder;
+            return this.opts.element.attr("placeholder") ||
+                this.opts.element.attr("data-placeholder") || // jquery 1.4 compat
+                this.opts.element.data("placeholder") ||
+                this.opts.placeholder;
         },
 
         /**
@@ -1023,7 +1057,7 @@
                         return matches[1];
                 }
             }
-            return this.opts.element.width() + 'px';
+            return (this.opts.element.width() === 0 ? 'auto' : this.opts.element.width() + 'px');
         }
     });
 
@@ -1048,15 +1082,6 @@
                 "</div>"].join(""));
         },
 
-        // single
-        open: function () {
-
-            if (this.opened()) return;
-
-            this.parent.open.apply(this, arguments);
-
-        },
-
         // single
         close: function () {
             if (!this.opened()) return;
@@ -1071,7 +1096,7 @@
 
         // single
         isFocused: function () {
-            return this.selection.is(":focus");
+            return this.selection[0] === document.activeElement;
         },
 
         // single
@@ -1148,7 +1173,7 @@
 
             selection.delegate("abbr", "click", this.bind(function (e) {
                 if (!this.enabled) return;
-                this.val("");
+                this.clear();
                 killEvent(e);
                 this.close();
                 this.triggerChange();
@@ -1166,6 +1191,13 @@
             this.opts.element.bind("open", function() { focusser.hide(); });
         },
 
+        clear: function() {
+            this.opts.element.val("");
+            this.selection.find("span").empty();
+            this.selection.removeData("select2-data");
+            this.setPlaceholder();
+        },
+
         /**
          * Sets selection based on source element's value
          */
@@ -1174,15 +1206,18 @@
             var selected;
             if (this.opts.element.val() === "") {
                 this.updateSelection({id: "", text: ""});
+                this.close();
+                this.setPlaceholder();
             } else {
-                selected = this.opts.initSelection.call(null, this.opts.element);
-                if (selected !== undefined && selected !== null) {
-                    this.updateSelection(selected);
-                }
+                var self = this;
+                this.opts.initSelection.call(null, this.opts.element, function(selected){
+                    if (selected !== undefined && selected !== null) {
+                        self.updateSelection(selected);
+                        self.close();
+                        self.setPlaceholder();
+                    }
+                });
             }
-
-            this.close();
-            this.setPlaceholder();
         },
 
         // single
@@ -1190,11 +1225,12 @@
             var opts = this.parent.prepareOpts.apply(this, arguments);
 
             if (opts.element.get(0).tagName.toLowerCase() === "select") {
-                // install sthe selection initializer
-                opts.initSelection = function (element) {
+                // install the selection initializer
+                opts.initSelection = function (element, callback) {
                     var selected = element.find(":selected");
                     // a single select box always has a value, no need to null check 'selected'
-                    return {id: selected.attr("value"), text: selected.text()};
+                    if ($.isFunction(callback))
+                        callback({id: selected.attr("value"), text: selected.text()});
                 };
             }
 
@@ -1227,7 +1263,7 @@
 
             // find the selected element in the result list
 
-            this.results.find(".select2-result").each2(function (i, elm) {
+            this.results.find(".select2-result-selectable").each2(function (i, elm) {
                 if (equal(self.id(elm.data("select2-data")), self.opts.element.val())) {
                     selected = i;
                     return false;
@@ -1266,6 +1302,9 @@
 
         // single
         updateSelection: function (data) {
+
+            this.selection.data("select2-data", data);
+
             this.selection
                 .find("span")
                 .html(this.opts.formatSelection(data));
@@ -1308,6 +1347,20 @@
         // single
         clearSearch: function () {
             this.search.val("");
+        },
+
+        // single
+        data: function(value) {
+            if (arguments.length === 0) {
+                return this.selection.data("select2-data");
+            } else {
+                if (!value || value === "") {
+                    this.clear();
+                } else {
+                    this.opts.element.val(!value ? "" : this.id(value));
+                    this.updateSelection(value);
+                }
+            }
         }
     });
 
@@ -1342,13 +1395,16 @@
             // TODO validate placeholder is a string if specified
 
             if (opts.element.get(0).tagName.toLowerCase() === "select") {
-                // install the selection initializer
-                opts.initSelection = function (element) {
+                // install sthe selection initializer
+                opts.initSelection = function (element,callback) {
+
                     var data = [];
                     element.find(":selected").each2(function (i, elm) {
                         data.push({id: elm.attr("value"), text: elm.text()});
                     });
-                    return data;
+
+                    if ($.isFunction(callback))
+                        callback(data);
                 };
             }
 
@@ -1460,18 +1516,21 @@
             var data;
             if (this.opts.element.val() === "") {
                 this.updateSelection([]);
+                this.close();
+                // set the placeholder if necessary
+                this.clearSearch();
             }
             if (this.select || this.opts.element.val() !== "") {
-                data = this.opts.initSelection.call(null, this.opts.element);
-                if (data !== undefined && data !== null) {
-                    this.updateSelection(data);
-                }
+                var self = this;
+                this.opts.initSelection.call(null, this.opts.element, function(data){
+                    if (data !== undefined && data !== null) {
+                        self.updateSelection(data);
+                        self.close();
+                        // set the placeholder if necessary
+                        self.clearSearch();
+                    }
+                });
             }
-
-            this.close();
-
-            // set the placeholder if necessary
-            this.clearSearch();
         },
 
         // multi
@@ -1483,7 +1542,9 @@
                 // stretch the search box to full width of the container so as much of the placeholder is visible as possible
                 this.search.width(this.getContainerWidth());
             } else {
-                this.search.val("").width(10);
+                // we set this to " " instead of "" and later clear it on focus() because there is a firefox bug
+                // that does not properly render the caret when the field starts out blank
+                this.search.val(" ").width(10);
             }
         },
 
@@ -1496,11 +1557,11 @@
 
         // multi
         open: function () {
-            if (this.opened()) return;
-            this.parent.open.apply(this, arguments);
+            if (this.parent.open.apply(this, arguments) === false) return false;
 			this.clearPlaceholder();
 			this.resizeSearch();
             this.focusSearch();
+            return true;
         },
 
         // multi
@@ -1630,7 +1691,7 @@
         // multi
         postprocessResults: function () {
             var val = this.getVal(),
-                choices = this.results.find(".select2-result"),
+                choices = this.results.find(".select2-result-selectable"),
                 self = this;
 
             choices.each2(function (i, choice) {
@@ -1722,7 +1783,6 @@
                 this.updateSelection(data);
             } else {
                 val = (val === null) ? [] : val;
-                this.setVal(val);
                 // val is a list of objects
                 $(val).each(function () { data.push(self.id(this)); });
                 this.setVal(data);
@@ -1753,7 +1813,7 @@
             this.searchContainer.show();
             // make sure the search container is the last item in the list
             this.searchContainer.appendTo(this.searchContainer.parent());
-            // since we collapsed the width in dragStarteed, we resize it here
+            // since we collapsed the width in dragStarted, we resize it here
             this.resizeSearch();
 
             // update selection
@@ -1763,6 +1823,22 @@
             });
             this.setVal(val);
             this.triggerChange();
+        },
+
+        // multi
+        data: function(values) {
+            var self=this, ids;
+            if (arguments.length === 0) {
+                 return this.selection
+                     .find(".select2-search-choice")
+                     .map(function() { return $(this).data("select2-data"); })
+                     .get();
+            } else {
+                ids = $.map(values, function(e) { return self.opts.id(e)});
+                this.setVal(ids);
+                this.updateSelection(values);
+                this.clearSearch();
+            }
         }
     });
 
@@ -1771,7 +1847,7 @@
         var args = Array.prototype.slice.call(arguments, 0),
             opts,
             select2,
-            value, multiple, allowedMethods = ["val", "destroy", "open", "close", "focus", "isFocused", "container", "onSortStart", "onSortEnd", "enable", "disable", "positionDropdown"];
+            value, multiple, allowedMethods = ["val", "destroy", "open", "close", "focus", "isFocused", "container", "onSortStart", "onSortEnd", "enable", "disable", "positionDropdown", "data"];
 
         this.each(function () {
             if (args.length === 0 || typeof(args[0]) === "object") {

data/vendor/assets/stylesheets/select2.css.sass

@@ -456,9 +456,15 @@
 
 /* end multiselect
 
-.select2-match
+.select2-result-selectable .select2-match
   text-decoration: underline
 
+.select2-result-unselectable
+  .select2-result-selectable .select2-match
+    text-decoration: underline
+  .select2-match
+    text-decoration: none
+
 .select2-offscreen
   position: absolute
   left: -1000px

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: select2-rails
 version: !ruby/object:Gem::Version
-  version: 0.0.6
+  version: 0.0.7
   prerelease: 
 platform: ruby
 authors:
@@ -9,11 +9,11 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2012-06-28 00:00:00.000000000 Z
+date: 2012-07-06 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: thor
-  requirement: &83485240 !ruby/object:Gem::Requirement
+  requirement: &78770620 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -21,10 +21,10 @@ dependencies:
         version: '0.14'
   type: :runtime
   prerelease: false
-  version_requirements: *83485240
+  version_requirements: *78770620
 - !ruby/object:Gem::Dependency
   name: bundler
-  requirement: &83484990 !ruby/object:Gem::Requirement
+  requirement: &78770270 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -32,10 +32,10 @@ dependencies:
         version: '1.0'
   type: :development
   prerelease: false
-  version_requirements: *83484990
+  version_requirements: *78770270
 - !ruby/object:Gem::Dependency
   name: rails
-  requirement: &83484760 !ruby/object:Gem::Requirement
+  requirement: &78769910 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -43,10 +43,10 @@ dependencies:
         version: '3.0'
   type: :development
   prerelease: false
-  version_requirements: *83484760
+  version_requirements: *78769910
 - !ruby/object:Gem::Dependency
   name: sass
-  requirement: &83484530 !ruby/object:Gem::Requirement
+  requirement: &78769590 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -54,7 +54,7 @@ dependencies:
         version: '3.1'
   type: :development
   prerelease: false
-  version_requirements: *83484530
+  version_requirements: *78769590
 description: Select2 is a jQuery based replacement for select boxes. It supports searching,
   remote data sets, and infinite scrolling of results. This gem integrates Select2
   with Rails asset pipeline for easy of use.