Skip to content

Instantly share code, notes, and snippets.

@federicofazzeri
Created February 24, 2017 18:38
Show Gist options
  • Save federicofazzeri/7ac188962da0c5cff9b2eb3e8915b5d7 to your computer and use it in GitHub Desktop.
Save federicofazzeri/7ac188962da0c5cff9b2eb3e8915b5d7 to your computer and use it in GitHub Desktop.
Simple list filter without "bothering" angular $scope
(function(window, angular) {
'use strict';
/**
* Simple list filter without "bothering" angular $scope
* I used OLOO as a OO Js style (instead of the classic prototypal inheritance)
*/
var listFilter = angular.module('listFilter', []);
var jqLite = angular.element;
var exceptions = {};
var dom = Object.create(exceptions);
var inits = Object.create(dom);
var listFilterSrv = Object.create(inits);
listFilter.factory('ListFilterSrv', ListFilterSrv);
exceptions.checkNodeList = function(nodeList){
if(!nodeList || !nodeList.length || nodeList.length <= 0){
throw 'supply an array of Htmlelements or a nodelist';
}
};
exceptions.checkButton = function(button){
if(!button || (!button.nodeName && !button[0])){
throw 'supply a valid element as button';
}
};
dom.hideAll = function(){
this.list.map(function(ele){
if(ele.css('display') !== 'none'){
//ele.addClass('hg-hide');
}
});
};
dom.showHide = function(){
var i = this.shown,
action = this.expanded ? 'removeClass' : 'addClass';
while(i<this.list.length){
this.list[i][action](this.hideListEleClass);
i++;
}
};
dom.updateMessage = function(){
var showing = this.list.reduce(function(tot, curr){
if(!curr.hasClass(this.hideListEleClass)){
tot++;
}
return tot;
}.bind(this), 0);
if(this.message){
this.msgShownEle.textContent = showing;
this.msgTotEle.textContent = this.list.length;
}
};
inits.initList = function(nodeList){
var list;
this.checkNodeList(nodeList);
if(Array.isArray(nodeList)){
list = nodeList.map(function(ele){
if(ele.nodeName){
return angular.element(ele);
}
});
}else{
list = Array.prototype.map.call(nodeList, function(ele){
if(ele.nodeName){
return angular.element(ele);
}
});
}
this.list = list;
};
inits.initShown = function(shown){
var n = Number(shown);
this.shown = n || 4;
};
inits.initButton = function(button){
this.checkButton(button);
this.button = (button[0] && button.hasClass) ? button : angular.element(button);
};
inits.initButtonExpandedClass = function(buttonClass){
this.buttonExpandedClass = buttonClass || 'expanded';
};
inits.initMessage = function(ele){
if(!ele){
return;
}
this.message = (ele[0] && ele[0].nodeName) ? ele : angular.element(ele);
};
inits.initMessageNumbersToUpdateEles = function(shownClass, totClass){
shownClass = shownClass || 'shown';
totClass = totClass || 'tot';
this.msgShownEle = this.message[0].getElementsByClassName(shownClass)[0];
this.msgTotEle = this.message[0].getElementsByClassName(totClass)[0];
};
inits.initHideListEleClass = function (className) {
this.hideListEleClass = className || 'ng-hide';
};
listFilterSrv.init = function(nodeList, button, message, shown, buttonClass, hideClass){
this.initList(nodeList);
this.initButton(button);
this.initMessage(message);
this.initShown(shown);
this.initButtonExpandedClass(buttonClass);
this.initHideListEleClass(hideClass);
this.initMessageNumbersToUpdateEles();
this.showHide();
this.updateMessage();
};
listFilterSrv.toggleState = function(){
this.expanded = !this.expanded;
};
listFilterSrv.runFilter = function(){
this.toggleState();
this.showHide();
this.updateMessage();
};
function ListFilterSrv(){
return {
newInstance: function(){
return Object.create(listFilterSrv);
}
};
}
})(window, window.angular);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment