$(function () {
  renderUniversityBreakdownPieChart();
});

function renderUniversityBreakdownPieChart () {
  elPilotsByUni = document.createElement('div');
  elHeader = document.createElement('h3');

  $(elHeader).text('University Breakdown');
  $(elPilotsByUni).attr('id', 'pilotsbyuni');

  $('div#stats').append(elHeader).append(elPilotsByUni);

  var pbu = Raphael("pilotsbyuni", 400, 230);
  pbu.g.txtattr.font = "12px Verdana, Arial, sans-serif";

  var pie = pbu.g.piechart(115,
                           115,
                           100,
                           [
                            11,
                            6,
                            11,
                            1,
                            14,
                            14,
                            5,
                            5,
                            1,
                            5,
                            4,
                            9
                           ],
                           {legend: [
                                     'Bath (11)',
                                     'Cambridge (6)',
                                     'Edinburgh (11)',
                                     'Leeds (1)',
                                     'Loughborough (14)',
                                     'Nottingham (14)',
                                     'Oxford (5)',
                                     'Queen\'s (5)',
                                     'Salford (1)',
                                     'Southampton (5)',
                                     'Surrey (4)',
                                     'UCL (9)'
                                    ],
                            legendpos: "east"});

  pie.hover(function () {
    this.sector.stop();
    this.sector.scale(1.1, 1.1, this.cx, this.cy);
    if (this.label) {
        this.label[0].stop();
        this.label[0].scale(1.5);
        this.label[1].attr({"font-weight": 800});
    }
  }, function () {
    this.sector.animate({scale: [1, 1, this.cx, this.cy]}, 500, "bounce");
    if (this.label) {
        this.label[0].animate({scale: 1}, 500, "bounce");
        this.label[1].attr({"font-weight": 400});
    }
    });
}//function