Add delay to list.js search

app/assets/javascripts/application.js

@@ -10,6 +10,7 @@
 //= require jquery.observe_field
 //= require list
 //= require list.unlist
+//= require list.customized
 //= require rails.validations
 //= require_self
 //= require ordering

app/assets/javascripts/list.customized.js

@@ -0,0 +1,43 @@
+(function(window, undefined) {
+
+var CustomizedList = function(id, options, values) {
+  var self = this;
+  var h = window.ListJsHelpers;
+  
+  this.searchTimeout = undefined;
+  
+  var init = {
+    start: function(id, options, values) {
+      this.defaults(options);
+      this.list(id, options, values);
+      this.callbacks(options);
+    },
+    defaults: function(options) {
+      options.delayedSearchClass = options.delayedSearchClass || 'delayed-search';
+      options.delayedSearchTime = options.delayedSearchTime || 500;
+    },
+    list: function(id, options, values) {
+      self.list = new window.List(id, options, values);
+    },
+    callbacks: function(options) {
+      h.addEvent(h.getByClass(options.delayedSearchClass, self.list.listContainer), 'keyup', self.searchDelayStart);
+    }
+  };
+  
+  this.searchDelayStart = function(searchString, columns) {
+    // TODO: if keycode corresponds to 'ENTER' ? skip delay
+    // TODO: if search is about to be cleared (empty searchString) ? skip delay
+    clearTimeout(self.searchTimeout);
+    self.searchTimeout = window.setTimeout(function() {self.searchDelayEnd(searchString, columns)}, options.delayedSearchTime);
+  }
+  
+  this.searchDelayEnd = function(searchString, columns) {
+    self.list.search(searchString, columns);
+  }
+  
+  init.start(id, options, values);
+}
+
+window.CustomizedList = CustomizedList;
+
+})(window);

app/views/group_orders/_form.html.haml

@@ -8,7 +8,7 @@
       setToleranceBehaviour(#{FoodsoftConfig[:tolerance_is_costly]});
       setStockit(#{@order.stockit?});
       // create List for search-feature (using list.js, http://listjs.com)
-      new List(document.body, { valueNames: ['name'], engine: 'unlist' }); 
+      new CustomizedList(document.body, { valueNames: ['name'], engine: 'unlist' });
     });
 
 - title t('.title'), false
@@ -41,7 +41,7 @@
 
 .row-fluid
   .well.clear
-    = text_field_tag :article, params[:article], placeholder: t('.search_article'), class: 'search-query input-large search'
+    = text_field_tag :article, params[:article], placeholder: t('.search_article'), class: 'search-query input-large delayed-search'
 
 = form_for @group_order do |f|
   = f.hidden_field :lock_version