Active filter for backbone.js collections

Question

I have a little problem with my backbone collection. I just want to display 6 models, and always the latest 6. I use CollectionBinder (Backbone.ModelBinder) to render and display my collections and I use RailsFayeSubscriber to sync them with the server.

The problem is that I don't know how to always keep the collection 6 models big. I have tried adding a this.on("add") and there using .first(6) to keep the 6 models I want to have, but the problem is that I think either CollectionBinder or RailsFayeSubscriber also has add-trigger and throws me errors about missing models in the collection.

The best thing would be to have something like comparator, that always sorts the model, but in this case some sort of active filter that always keeps it 6 models big.

Any ideas?

allow `GET` to `url` like `/post/latest` etc which a `new collection` binds to. That url should return latest 6 of what ever you want. Poll every minute to load the latest. Nothing more needed — Deeptechtons, Jul 20 '12 at 05:07

score 1 · Answer 1 · answered Jul 20 '12 at 01:05

One (kinda hacky) solution would be to interrupt the flow. So currently you have:

collections gets added to
your handler goes off, "messing up" the collection
one of your library's handlers goes off, and gets upset

What you want is:

collections gets added to
one of your library's handlers goes off, and doesn't wig out
your code goes off

There's likely some way to play with Backbone's event system to make the above happen, but you can also cheat:

collections gets added to
your handler goes off, and sets a timeout to "mess up" the collection in 1ms (window.setTimeout(_.bind(this.limitTo6, this), 1))
one of your library's handlers goes off, and doesn't wig out
your timeout (1ms after the normal code flow is done) goes off, and messes up the collection without cheesing off our library

Thanks! It works, but I still would prefer a more "elegant" solution. — jonepatr, Jul 20 '12 at 01:27
I understand, but since your basic problem is someone else's code, there's going to be limits to the elegance of any possible solution (since the truly elegant solution would be to modify their code to play nicer with your's). One option you might want to look in to is re-arranging the order of bound events, and beyond that ... well, good luck :-) — machineghost, Jul 20 '12 at 01:50

score 0 · Answer 2 · edited May 23 '17 at 10:09

I have used the event aggregator approach in this post

The twist is that instead of adding the aggregator to the views, add it to the collections. Create a second collection that will act as your "view model" that has your 6 items. That second collection can be bound to the add/reset events on the full collection. The event handler can then populate the bound collection and fire the reset event so your view code looks just the same as it always does.

This seems to maintain the idiomatic backbone focus on data manipulation and thinner views.

Active filter for backbone.js collections

2 Answers2