$(function () {

  /* jQueryKnob */
  $(".knob").knob();


  /* Morris.js Charts */
  // Games Played Chart
  var gamesplayed = new Morris.Line({
    element: 'games-played-chart',
    resize: true,
    data: most_played_data,
    xkey: 'y',
    ykeys: ['gp'],
    labels: ['Games Played'],
    xLabels: 'week',
    lineColors: ['#efefef'],
    smooth: false,
    lineWidth: 3,
    hideHover: 'auto',
    gridTextColor: "#fff",
    gridStrokeWidth: 0.4,
    pointSize: 4,
    pointStrokeColors: ["#efefef"],
    gridLineColor: "#efefef",
    gridTextFamily: "Open Sans",
    gridTextSize: 10
  });

  var average = new Morris.Bar({
    element: 'average-play-time-chart',
    resize: true,
    data: average_play_time_data,
    barColors: ['#efefef'],
    xkey: 'y',
    ykeys: ['pt'],
    labels: ['Average Play Time'],
    hideHover: 'auto',
    gridTextColor: "#fff",
    gridStrokeWidth: 0.4,
    pointSize: 4,
    pointStrokeColors: ["#efefef"],
    gridLineColor: "#efefef",
    gridTextFamily: "Open Sans",
    gridTextSize: 10
  });

var scores = new Morris.Bar({
    element: 'scores-chart',
    resize: true,
    data: scores_data,
    barColors: ['#efefef'],
    xkey: 'y',
    ykeys: ['sc'],
    labels: ['Score'],
    hideHover: 'auto',
    hoverCallback: function(index, options, content){
        return(content + "\n" + scores_names_data[index]);
    },
    gridTextColor: "#fff",
    gridStrokeWidth: 0.4,
    pointSize: 4,
    pointStrokeColors: ["#efefef"],
    gridLineColor: "#efefef",
    gridTextFamily: "Open Sans",
    gridTextSize: 10
  });

});