Tinysort sort by multiple attributes (more than 1)

I'm trying to use tinysort as part of a mobile application that I'm building with jquery mobile. My app finds places near a users location and I want to be able to sort results quickly on the fly without having to spend the time re-querying the db.

So, what I want to do is be able to use tinysort to re-sort results based on if a user has a favorite place in the area and then by distance, additionally I want to be able to sort by an attribute "beenthere" if the user has marked they've been to a place.

This is what I want to do: Sort by favorite:

$("ul#places>li").tsort('',({order:"desc",attr:"myfav"},{order:"asc",attr:"dist"}));

Sort by Been There:

$("ul#places>li").tsort('',({order:"desc",attr:"beenthere"},{order:"asc",attr:"dist"}));

Sort by default: // This is easy and works no problem:

$("ul#places>li").tsort('',{order:"desc",attr:"dist"});

With a default list order like:

<ul id="places">
  <li myfav="0" beenthere="0" dist=".02">Hot Dog Stand</li>
  <li myfav="1" beenthere="0" dist="开发者_运维技巧.08">Joe's Shack</li>
  <li myfav="0" beenthere="1" dist=".10">Frick frack</li>
  <li myfav="1" beenthere="1" dist=".15">Mama's</li>
</ul>

Sort by fav should return:

1. Joe's Shack
2. Mama's
3. Hot Dog Stand
4. Frick frack

Sort by been there should return:

1. Frick frack
2. Mama's
3. Hot Dog Stand
4. Joe's Shack

And then back to sorting by distance:

1. Hot Dog Stand
2. Joe's Shack
3. Frick frack
4. Mama's

My calls to tsort above just aren't working with the multiple attribute selectors and either my syntax is wrong or you can't sort on more than one criteria.

Any ideas of how I can accomplish this with tsort or other solution is appreciated!

---

I understood that Mottie's solution worked, but it seems a little bit complex... Calling the tsort twice worked for me:

listOfItems.tsort({data:sorter, order:direction})
            .tsort({data: sorterAlt, order:direction})

In your case, it'd be (if '' are just referring to selected items, you can remove them):

$("ul#places>li").tsort({order:"desc",attr:"myfav"})
                  .tsort({order:"asc",attr:"dist"})
$("ul#places>li").tsort({order:"desc",attr:"beenthere"})
                  .tsort({order:"asc",attr:"dist"})

Also use the data-attrname style for HTML5, as Mottie suggested. You can always use data: attrname inside the tsort.

Hope it may still help you or others!

---

The results you have above are actually sorted by "asc" and not "desc" as you indicated. Either way, I don't think TinySort has multiple attribute sorting built in, so the next best thing would be to just combine the attributes you want to sort.

Since the distance is the default sort, I thought it would be best to combine it with a number value from the other attribute. For example, the myfav attribute is set to "1" to indicate that it is true (I'm assuming this, but it seems like your intent). If I stick this one in front of the distance, it's value ends up being higher than the false value of zero - this is opposite of the sort direction you wanted, so I assigned a true value to be "0" instead of "1" and a false value to be "9" instead of "0". I know it sounds confusing, but check this out:

Sort by Fav:

Location         fav been dist  combined
1. Joe's Shack    1    0   .08    0.08
2. Mama's         1    1   .15    0.15
3. Hot Dog Stand  0    0   .02    9.02
4. Frick frack    0    1   .10    9.10

Sort by Been There:

Location         fav been dist  combined
1. Frick frack    0    1   .10    0.10
2. Mama's         1    1   .15    0.15
3. Hot Dog Stand  0    0   .02    9.02
4. Joe's Shack    1    0   .08    9.08

I hope that makes it clear... anyway, here is a demo, where I made the sort order toggle, and the code I used:

var list = $("ul#places>li"),
    sortit = function(el, att){
        $(el).toggleClass('desc');
        var combo,
            order = $(el).is('.desc') ? 'desc' : 'asc';
        // make combo attribute
        if (att !== 'dist') {
            list.each(function(){
                // attr value = 1 means true, so assign it as a zero
                // attr value = 0 means false, so assign it as a nine
                // these numbers + distance, makes sure the lower
                // values are sorted first
                combo = $(this).attr(att) === '1' ? '0' : '9';
                $(this).attr('combo', combo + $(this).attr('dist'));

            });
            att = 'combo';
        }
        list.tsort('',({order:order,attr:att}));
    };

// Sort by favorite:
$('button:contains(Fav)').click(function(){ sortit(this, 'myfav'); });

// Sort by favorite:
$('button:contains(Been)').click(function(){ sortit(this, 'beenthere'); });

// Sort by default
$('button:contains(Dist)').click(function(){sortit(this, 'dist'); });