Move list.js extensions to plugins
This commit is contained in:
parent
26e207aeb1
commit
3a948e9b73
8 changed files with 102 additions and 848 deletions
|
|
@ -10,7 +10,8 @@
|
|||
//= require jquery.observe_field
|
||||
//= require list
|
||||
//= require list.unlist
|
||||
//= require list.customized
|
||||
//= require list.delay
|
||||
//= require list.reset
|
||||
//= require rails.validations
|
||||
//= require_self
|
||||
//= require ordering
|
||||
|
|
|
|||
|
|
@ -1,69 +0,0 @@
|
|||
(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);
|
||||
this.onload(options);
|
||||
},
|
||||
defaults: function(options) {
|
||||
options.delayedSearchClass = options.delayedSearchClass || 'delayed-search';
|
||||
options.delayedSearchTime = options.delayedSearchTime || 500;
|
||||
options.highlightClass = options.highlightClass || 'btn-primary';
|
||||
options.resetSearchClass = options.resetSearchClass || 'reset-search';
|
||||
},
|
||||
list: function(id, options, values) {
|
||||
self.list = new window.List(id, options, values);
|
||||
},
|
||||
callbacks: function(options) {
|
||||
var resetSearchButton = h.getByClass(options.resetSearchClass, self.list.listContainer);
|
||||
$(resetSearchButton).click(self.resetSearch);
|
||||
self.list.on('updated', self.highlightResetButton);
|
||||
|
||||
var delayedSearchInput = h.getByClass(options.delayedSearchClass, self.list.listContainer);
|
||||
$(delayedSearchInput).keyup(self.searchDelayStart);
|
||||
},
|
||||
onload: function(options) {
|
||||
var initialSearchTerm = $('.' + options.delayedSearchClass + ', .' + options.searchClass, self.list.listContainer).val();
|
||||
if('' != initialSearchTerm) {
|
||||
self.list.search(initialSearchTerm);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
this.searchDelayStart = function(searchString, columns) {
|
||||
// TODO: if keycode corresponds to 'ENTER' ? skip delay
|
||||
clearTimeout(self.searchTimeout);
|
||||
self.searchTimeout = window.setTimeout(function() {self.searchDelayEnd(searchString, columns)}, options.delayedSearchTime);
|
||||
|
||||
var resetSearchButton = h.getByClass(options.resetSearchClass, self.list.listContainer);
|
||||
$(resetSearchButton).removeClass(options.highlightClass);
|
||||
};
|
||||
|
||||
this.searchDelayEnd = function(searchString, columns) {
|
||||
self.list.search(searchString, columns);
|
||||
};
|
||||
|
||||
this.highlightResetButton = function() {
|
||||
var resetSearchButton = h.getByClass(options.resetSearchClass, self.list.listContainer);
|
||||
$(resetSearchButton).toggleClass(options.highlightClass, self.list.searched);
|
||||
};
|
||||
|
||||
this.resetSearch = function() {
|
||||
$('.' + options.delayedSearchClass + ', .' + options.searchClass, self.list.listContainer).val('');
|
||||
self.list.search('');
|
||||
};
|
||||
|
||||
init.start(id, options, values);
|
||||
}
|
||||
|
||||
window.CustomizedList = CustomizedList;
|
||||
|
||||
})(window);
|
||||
50
app/assets/javascripts/list.delay.js
Normal file
50
app/assets/javascripts/list.delay.js
Normal file
|
|
@ -0,0 +1,50 @@
|
|||
// for use with listjs 0.2.0
|
||||
// https://github.com/javve/list.js
|
||||
|
||||
(function(window, undefined) {
|
||||
|
||||
window.List.prototype.plugins.delay = function(locals, options) {
|
||||
var list = this;
|
||||
|
||||
this.searchTimeout = undefined;
|
||||
|
||||
var init = {
|
||||
start: function(options) {
|
||||
this.defaults(options);
|
||||
this.callbacks(options);
|
||||
this.onload(options);
|
||||
},
|
||||
defaults: function(options) {
|
||||
options.delayedSearchClass = options.delayedSearchClass || 'delayed-search';
|
||||
options.delayedSearchTime = options.delayedSearchTime || 500;
|
||||
},
|
||||
callbacks: function(options) {
|
||||
$('.' + options.delayedSearchClass, list.listContainer).keyup(list.searchDelayStart);
|
||||
},
|
||||
onload: function(options) {
|
||||
var initialSearchTerm = $('.' + options.delayedSearchClass, list.listContainer).val();
|
||||
if('' != initialSearchTerm) {
|
||||
list.search(initialSearchTerm);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
this.searchDelayStart = function(searchString, columns) {
|
||||
// TODO: if keycode corresponds to 'ENTER' ? skip delay
|
||||
clearTimeout(list.searchTimeout);
|
||||
list.searchTimeout = window.setTimeout(
|
||||
function() {list.searchDelayEnd(searchString, columns)},
|
||||
options.delayedSearchTime
|
||||
);
|
||||
|
||||
$(list.listContainer).trigger('updateComing');
|
||||
};
|
||||
|
||||
this.searchDelayEnd = function(searchString, columns) {
|
||||
list.search(searchString, columns);
|
||||
};
|
||||
|
||||
init.start(options);
|
||||
}
|
||||
|
||||
})(window);
|
||||
42
app/assets/javascripts/list.reset.js
Normal file
42
app/assets/javascripts/list.reset.js
Normal file
|
|
@ -0,0 +1,42 @@
|
|||
// for use with listjs 0.2.0
|
||||
// https://github.com/javve/list.js
|
||||
|
||||
(function(window, undefined) {
|
||||
|
||||
window.List.prototype.plugins.reset = function(locals, options) {
|
||||
var list = this;
|
||||
|
||||
var init = {
|
||||
start: function(options) {
|
||||
this.defaults(options);
|
||||
this.callbacks(options);
|
||||
},
|
||||
defaults: function(options) {
|
||||
options.highlightClass = options.highlightClass || 'btn-primary';
|
||||
options.resetSearchClass = options.resetSearchClass || 'reset-search';
|
||||
options.resettableClass = options.resettableClass || 'resettable';
|
||||
},
|
||||
callbacks: function(options) {
|
||||
$('.' + options.resetSearchClass, list.listContainer).click(list.resetSearch);
|
||||
list.on('updated', list.highlightResetButton);
|
||||
|
||||
$(list.listContainer).on('updateComing', function() {
|
||||
list.highlightResetButton(false);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
this.highlightResetButton = function(highlightEnabled) {
|
||||
highlightEnabled = (undefined === highlightEnabled) ? (list.searched) : (highlightEnabled);
|
||||
$('.' + options.resetSearchClass, list.listContainer).toggleClass(options.highlightClass, highlightEnabled);
|
||||
};
|
||||
|
||||
this.resetSearch = function() {
|
||||
$('.' + options.resettableClass, list.listContainer).val('');
|
||||
list.search('');
|
||||
};
|
||||
|
||||
init.start(options);
|
||||
}
|
||||
|
||||
})(window);
|
||||
Loading…
Add table
Add a link
Reference in a new issue