QuirkeyBlogEst. 2005

Thanks to the support and help of an awesome community, Sammy.js hit 0.2.0 on Monday. You can see the full release notes here and the API doc has been updated to reflect the changes.

My favorite feature from this update might be the simplest.

Rendering partials now uses a special swap() method on Sammy.Application. By default it just uses jQuery's html() method to swap out the old content of $element with the new content. The power though, is you easily override this to provide a cool transition when a new partial is rendered.

var app = $.sammy(function() {
  
  this.swap = function(content) {
    var width = $(window).width();
    this.$element()
      .wrapInner('<div class="inner"></div>')
      .children('.inner')
        .animate({queue: false, left: "-" + width}, 400)
        .remove()
        .end()
      .html(content)
      .css({left: width})
      .animate({left: '0px', width: width}, 400);
  };
  
  this.get('#/user/:name', function() {
    this.partial('name.erb', {name: this.params['name']});
  });
  
  //...
});

Now, when you go to '#/user/aq' or similar, it will use the swap method to do a nifty transition, instead of ye old html().

Theres more examples and Sammy on the way. Come join the mailing list or hang out in irc to learn or contribute.

Posted June 12th, 2009 in Development, JavaScript, jQuery, Sammy
Both comments and pings are currently closed.