:javascript 
  $(function(){
    function main_size() {
      return $(window).height() - $('header').height();
    }

    deployment_grid = {
      data : {},
      load_data: function(load_callback){
        this.data = load_callback(); return this;
      },
      refresh_branches: function() {
        var html = '';
        $.each(this.data, function(k, v){
          html += '<li ' + (v['deployed'] ? 'onclick="deployment_grid.select_branch(this)"' : '') + 'id="branch_' + k + '">' + k + ' (' + (v['deployed'] ? 'deployed' : 'not deployed') + ')' + '</li>';
        });
        $('#branches').html(html);
        return this;
      },
      current_branch: function(){
        return this.data[$('#branches li.selected').attr('id').split('_')[1]]['checkouts']
      },
      current_checkout: function(){
        return this.current_branch()[$('#checkouts li.selected').attr('id').split('_')[1]]
      },
      refresh_checkouts: function() {
        var html = '';
        $.each(this.current_branch(), function(k, v){
          html += '<li onclick="deployment_grid.select_checkout(this)" id="checkout_' + k + '"><code>' + v['sha1'] + '<br/><time datetime="' + v['timestamp'] + '">Deploy timestamp: ' + v['timestamp'] + '</time></code></li>';
        });
        $('#checkouts').html(html);
        return this;
      },
      select_checkout: function(checkout) {
        $('#checkouts li').removeClass('selected');
        $(checkout).addClass('selected');
        $('#output').html(this.current_checkout()['output']);
        return this;
      },
      select_first_checkout: function() {
        this.select_checkout($('#checkouts li:first-child'))
        return this;
      },
      select_branch: function(branch) {
        $('#branches li').removeClass('selected');
        $(branch).addClass('selected');
        this.refresh_checkouts().select_first_checkout();
        return this;
      },
      select_first_branch: function() {
        this.select_branch($('#branches li:first-child'))
        return this;
      },
      resize: function() {
        $('#checkouts_column').css('height', (main_size() * 0.3).toString() + 'px' )
        $('#branches_column').css('height', (main_size() * 0.3).toString() + 'px' )
        $('#pre_output').css('height', (main_size() * 0.7).toString() + 'px' )
        return this;
      }
    };
    $.getJSON('##REQUEST_ADDRESS##', function(data) {
      deployment_grid.load_data(function(){
        return data;
      }).refresh_branches().select_first_branch().resize();
    });

    $(window).resize(function(data) {
      deployment_grid.resize();
    })
  });
  var deployment_grid = null;