gistfile1.js

SearchSession.prototype = {
  initialize: function(options) {
    this.options = options;
    this.render();
  },
  
  render: function() {
    // Run through the criterias:
    $.each(this.options.data, function(key, data) {
      this.addCriteria(key, data).render();
    });
  },
  
  addCriteria: function(key, data) {
    if(!this.hasCriteria(key)) {
      var criteria = new this.criterias[key](data);
      criteria.bind('change', change);
      return this.activeCriterias[key] = criteria;
    }
  },
  
  hasCriteria: function(key) {
    return typeof this.activeCriterias[key] != 'undefined'
  }
  
  change: function() {
    // Loop through criterias and get their data:
    data = {};
    
    $.each(this.activeCriterias, function(key, criteria) {
      data[key] = criteria.serialize();
    });
    
    options.change(data);
  }
}

SearchCriterias = {};

SearchCriterias.base.prototype = {
  initialize: function(options) {
    this.options = options;
    this.setup();
  },
  
  render: function() {
    // Metode renderer selve elementet via en template af en art
  },
  
  change: function() {
    this.label = this.summarize();
    trigger('change');
  }
}

SearchCriterias.range.prototype = SearchCriterias.base.extend({
  serialize: function() {
    return {
      from: from(),
      to: to()
    };
  },
  
  summarize: function() {
    return this.title() + ': ' + from() + ' - ' + to();
  },
  
  setup: function() {
    // Setup listeners
    this.from.keyup(this.change);
    this.to.keyup(this.change);
  },
  
  from: function(value) {
    return this.from.val(value);
  },
  
  to: function(value) {
    return this.to.val(value);
  }
});

SearchCriterias.select.prototype = $.extend(SearchCriterias.base.prototype, {
  
});

SearchCriterias.multiple.prototype = $.extend(SearchCriterias.select.prototype, {
  serialize: function() {
    // ...
  },
  
  setup: function() {
    this.el.on('click', change);
  },
  
  ...
});

SearchCriterias.single.prototype = $.extend(SearchCriterias.select.prototype, {
  ...
});

SearchSession.prototype.criterias = {
  'age': $(SearchCriterias.range).extend({title: 'Age', max: 99, min: 100}),
  'education': $(SearchCriterias.multiple).extend({title: 'Uddannelse', collection: {0: 'Universitet', 1: 'Håndværker'}}), 
};