$(document).ready(function(){
  $("#soccerfield").soccerfield(data,options);
});

var options =  {
  //options for soccer field
  field: {
    //soccer field width; default: 960px
    width: "960px",
    //soccer field height; default: 600px
    height: "600px",
    //img for soccer field default: 'img/soccerfield_green.png'
    img: 'img/soccerfield_green.png',
    //load page with hidden field; default:false
    startHidden: true,
    //animate field appearance with fade; default: false
    animate: true,
    //time for fadeIn 
    fadeTime: 1000,
    //reveal field automatically on load (default:true), if set to false needs extra $selector.data("soccerfield").revealField() call
    autoReveal:true,
    //callback on soccer field reveal
    onReveal: function () {
            } 
    },
  //options for players
  players: {
    //font size for player names in pixels (default 16)
    font_size: 16,
    //reveal players or load with players not hidden; default: true
    reveal: true,
    //reveal simultaneously (default: true); if false  - players reveal one by one after selected timeout
    sim: false,
    //timeout between players reveal in sim:false mode
    timeout: 1000,
    //time for fadeIn players animation
    fadeTime: 2000,
    //player img, no img if false (default: false)
    img: 'img/soccer-player.png',
    //callback after all players revealed
    onReveal: function () {
            alert("players revealed!");
            }
  }
};

var data = [
  {name: 'Gianluigi Buffon', position: 'C_GK'},
  {name: 'Leonardo Bonucci', position: 'LC_B'},
  {name: 'Giorgio Chiellini', position: 'C_B'},
  {name: 'Andrea Barzagli', position: 'RC_B'},
  {name: 'Daniele De Rossi', position: 'C_DM'},
  {name: 'Alessandro Florenzi', position: 'L_M'},                
  {name: 'Emanuele Giaccherini', position: 'LC_M'},
  {name: 'Marco Parolo', position: 'RC_M'},
  {name: 'Antonio Candreva', position: 'R_M'},
  {name: 'Éder', position: 'LC_F'},
  {name: 'Lionel Messi', position: 'RC_F', img: 'img/argentina_flag.png'},
];