$(function(){
  
  
  var $container = $('#container');

   // sorting
  $('#sort a').click(function(){
    // get href attribute, minus the #
    var $this = $(this),
        sortName = $this.attr('href').slice(1),
        asc = $this.parents('.sorting').hasClass('asc');
    $container.isotope({ 
      sortBy : sortName,
      sortAscending : asc
    });
    return false;
  });

  
  // switches selected class on buttons
  $('#sortoptions').find('.option-set a').click(function(){
    var $this = $(this);

    // don't proceed if already selected
    if ( !$this.hasClass('selected') ) {
      $this.parents('.option-set').find('.selected').removeClass('selected');
      $this.addClass('selected');
    }

  });

  
  $container.isotope({
    itemSelector : '.element',
    getSortData : {
      symbol : function( $elem ) {
        return $elem.attr('data-symbol');
      },
      category : function( $elem ) {
        return $elem.attr('data-category');
      },
      number : function( $elem ) {
        return parseInt( $elem.find('.number').text(), 10 );
      },
      weight : function( $elem ) {
        return parseFloat( $elem.find('.weight').text().replace( /[\(\)]/g, '') );
      },
      name : function ( $elem ) {
        return $elem.find('.name').text();
      }
    }
  });
  
  // filter buttons
  $('#filters a').click(function(){
    var selector = $(this).attr('data-filter');
    $container.isotope({ filter: selector });
    return false;
  });

  
  // switches selected class on buttons
  $('#options').find('.option-set a').click(function(){
    var $this = $(this);

    // don't proceed if already selected
    if ( !$this.hasClass('selected') ) {
      $this.parents('.option-set').find('.selected').removeClass('selected');
      $this.addClass('selected');
    }

  });
  

  $($container).imagesLoaded( function(){
  $(this).isotope({
    itemSelector : '.element',
    masonry : {
      columnWidth : 240
    }
    
  });
    
   
  });
});