Sammy.js hits a new milestone (0.2.0)

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.

Comments are closed.

About

QuirkeyBlog is Aaron Quint's perspective on the ongoing adventure of Code, Life, Work and the Web.

twitter/@aq.

instagram/@quirkey.

github/quirkey.

QuirkeyBlog is proudly powered by WordPress

Categories