Sorting after comment numbers, fivestar rating and posting date

Sorting doesn't require any changes to the View output, but on my test site I had to add the getSortData to the views_isotope.js. I changed this...

var $container = $('#isotope-container');

  $container.isotope({
    itemSelector: '.isotope-element',
    //filter: '.nothing'
  });

To include the classes of the fields I added...

var $container = $('#isotope-container');

  $container.isotope({
    itemSelector: '.isotope-element',
    //filter: '.nothing'
    getSortData : {
    isotopetitle : function ( $elem ) {
      return $elem.find('.isotopetitle').text();
    },
    isotopenid : function ( $elem ) {
      return $elem.find('.isotopenid').text();
    }
    }
  });

The Isotope sort is simply targeting the class of fields within the isotope item after they've been loaded to the screen, so add the fields and customize the style so that the field is wrapped in a div with a unique class you can traget. I've added a sort to http://isotope.alittlehelphosting.com/isotope-example that sorts by the nid using Isotope by targeting isotopenid. This creates HTML output that looks like this...

<div data-category="opinion tc" class="isotope-element isotope-element-4 opinion tc isotope-item">
  <div><div class="isotopetitle">Exclusive: Startup Launch Ruined By Careless Blogger</div> </div>  
  <div><div class="isotopenid">627</div></div>  
</div>

Then I added the sort as a View Header...

<strong>Sort by Field:</strong>
<ul class="isotope-sort-by option-set clearfix" data-option-key="sortBy">
      <li><a href="#sortBy=original-order" data-option-value="original-order">original-order</a></li>
      <li><a href="#sortBy=isotopetitle" data-option-value="isotopetitle">title</a></li>
      <li><a href="#sortBy=isotopenid" data-option-value="isotopenid">nid</a></li>
      <li><a href="#sortBy=random" data-option-value="random">random</a></li>
    </ul>

    <strong>Sort Direction:</strong>

    <ul class="isotope-sort-by option-set clearfix" data-option-key="sortAscending">
      <li><a href="#sortAscending=true" data-option-value="true" class="selected">sort ascending</a></li>
      <li><a href="#sortAscending=false" data-option-value="false">sort descending</a></li>
    </ul>

Finally, I used http://drupal.org/project/js_injector to add this javascript to only the isotope-example path

jQuery(document).ready(function($) {
   var $optionSets = $('.isotope-sort-by'),
          $optionLinks = $optionSets.find('a');

      $optionLinks.click(function(){
        var $this = $(this);
        // don't proceed if already selected
        if ( $this.hasClass('selected') ) {
          return false;
        }
        var $optionSet = $this.parents('.option-set');
        $optionSet.find('.selected').removeClass('selected');
        $this.addClass('selected');
  
        var options = {},
            key = $optionSet.attr('data-option-key'),
            value = $this.attr('data-option-value');
        // parse 'false' as false boolean
        value = value === 'false' ? false : value;
        options[ key ] = value;
        if ( key === 'layoutMode' && typeof changeLayoutMode === 'function' ) {
          // changes in layout modes need extra logic
          changeLayoutMode( $this, options )
        } else {
          // otherwise, apply new options
           $('#isotope-container').isotope( options );
        }
        return false;
      });
});

I'm sure this can be cleaned up to make it easier for the module to support, but I was able to add a sort.