How to integrate jquery-kason with ember.js?

I did a very crude integration for the prototype. The code below is a good starting point, but it will take more work depending on how users interact with the content.

It is assumed that you already have an ember work page with an ArrayController ready for rendering.

Here is a view that uses masonry:

App.HomeView = Ember.View.extend({

  onDidInsertElement: function() {
    this.reMason();
  }.on('didInsertElement'),

  onWillDestroy: function() {
    this.$('.masonry').masonry('destroy');
  }.on('willDestroy'),

  reMason: function() {
    this.$('.masonry').masonry({
      // masonry init options here
    });
    this.$('.masonry').imagesLoaded( function() {
      this.$('.masonry').masonry();
    }.bind(this));
  }

});

Here is a template in which we create stone html

<script type="text/x-handlebars" data-template-name="homeView">
  ...
    <div class="masonry">
      {{#each}}
        // render each masonry item here.
      {{/each}}
    </div>
  ...
</script>