Search bar for filtering on teams easier

[mliu7]

At the moment it is nearly impossible to find the team you are looking for. One solution to this is for us to write some stuff to filter down the entire app by season from the settings panel. While this helps, certain seasons such as USA Ultimate have over 400 teams in a single season and it would still be unruly.

A high impact way to fix this problem is to omit the filtering by season stuff for now and simply add a search bar to filter by team name.

[cboulay]

I noticed that once again we ran into the problem with late returning fetches overwriting new views. I haven't looked at the code for this feature yet, but I know that the view is (and should be) oblivious to when the fetch requests went out and merely renders the team list after it was "reset". I guess this means that the module's collection is being overwritten by the ajax response that comes back most recently. There are a few ways to handle this.

1. Use different collections (and different views) for normal results and search results. Once searching the normal view will be hidden. (Search results will always be empty initially so we don't need to hide it.
2. Somehow cancel the previous request (I don't know how to do this)
3. Typing in the search bar ADDS to the collection (by passing option {add: true} to fetch command) while simultaneously FILTERING what is being displayed. _.filter should work here.

I think the 3rd option is the best.

Note that "adding" is not the same as "resetting" a collection, so we would have to bind "add" to the view in addition to "reset". We would also have to make sure our collection only contains unique entries otherwise multiple search results will add the same teams multiple times. _.uniq might work.

[mliu7]

Yes, you are right that the view merely re-renders the team list after it is "reset".

In response to your options, (1) seems like it would still run into problems if someone is searching and the request for a previous search comes in after the latest search. i.e. if they are searching "test", and the "tes" results come in after "test", we'll stil have the problem of overwriting.

For (2), I don't know how to do this either.

For (3), this sounds like an excellent solution. I'll look into this. Thanks for the useful info.

[cboulay]

My connection to github seems to be down.

I pushed a branch that starts to address this. I know it won't work, there are some problems. I am highlighting those problems in the source and pushing again.

I also took the opportunity to make some changes to prepend new variables with 'var'. I wrote the team module a while ago (in javascript-knowledge time) and I wasn't too careful about where to put my variables. Also, I removed the references to app.teams and assumed that we will always get a fresh list of teams or team. I started to do this in the other modules as well.

Finally, I removed the default season from the creation of the initial collection. I still want some default filter in there but since we are merely 'adding' to our collection, I would have to remove the season attribute from the collection when searching. This is not impossible but I'm tired.

-Chad

On 3/17/12 3:00 AM, Mark Liu wrote:

Yes, you are right that the view merely re-renders the team list after it is "reset".

In response to your options, (1) seems like it would still run into problems if someone is searching and the request for a previous search comes in after the latest search. i.e. if they are searching "test", and the "tes" results come in after "test", we'll stil have the problem of overwriting.

For (2), I don't know how to do this either.

For (3), this sounds like an excellent solution. I'll look into this. Thanks for the useful info.

---

Reply to this email directly or view it on GitHub: https://github.com/leaguevine/leaguevine-ultistats/issues/16#issuecomment-4544910

[cboulay]

It works now! It took me a while to get it to work. Let's see if I can explain how it works:

1. typing is detected
2. a new Team.Collection is created adding attribute.name=search_bar_contents
3. the new collection is fetched. On return, jump to 5
4. Before the new collection is returned, the original collection is reset so it will trigger a filtered re-render of the list of teams already present.
5. When the new collection fetch is returned, the result is cleaned to remove any models that are already present (otherwise error).
6. The cleaned result is added to the old collection, and then the combined collection is reset to trigger a re-render as above.

The original list (on page load) will use the app's season_id in the API request. The new requests that are triggered by typing do not use that filter. This is really nice, but it also means we will have teams from different seasons in the list if the user backspaces out the search bar. Oh well.