$(function() {
  var noDataRow = '<tr><td style="text-align: center; line-height: 40px; color: #999999">No data on this match type for this player</td></tr>';

  var playerListUrl = serviceUrl + 'GetPlayerList&Params=%3FclientId=82%26localeId=en%26teamId=';
  var playerStatsUrl = serviceUrl + 'GetPlayerStats&Params=%3FclientId=82%26localeId=en%26teamPlayedForId=0%26teamPlayedAgainstId=0%26playerId=';

  var country1 = $('#country1');
  var country2 = $('#country2');
  var player1 = $('#player1');
  var player2 = $('#player2');

  // Variables to hold query string parameters.
  var team1Id, team2Id, player1Id, player2Id;

  // Catch query string if there is any.
  if (location.search) {

    var queryStrings = location.search.substring(1).split('&')
    for (var i = 0; i < queryStrings.length; i++) {
      var queryString = queryStrings[i].split('=');
      if (queryString[0].toLowerCase() == 'player1id') player1Id = queryString[1];
      else if (queryString[0].toLowerCase() == 'player2id') player2Id = queryString[1];
      else if (queryString[0].toLowerCase() == 'team1id') team1Id = queryString[1];
      else if (queryString[0].toLowerCase() == 'team2id') team2Id = queryString[1];
    }
  }

  // Load module for player 1.
  country1.loadCountries().change(function() {

    var teamId = $(this).selectedItem().attr('value');

    player1.loadPlayers($(this).selectedItem().attr('value'), player1Id).change(function() {
      var playerId = $(this).selectedItem().attr('value');

      $('#player1Profile').css('display', 'block');

      var personal = $('#player1Personal');
      var test = $('#player1TEST');
      var odi = $('#player1ODI');
      var t20int = $('#player1T20Int');

      personal.empty().append('<tr><td><span class="cricket_loadingText"><img alt="Loading" src="../img/cricket/v2/tables-loader.gif" width="16px" height="16px" />Loading personal profile...</span></td></tr>');
      test.empty().append('<tr><td><span class="cricket_loadingText"><img alt="Loading" src="../img/cricket/v2/tables-loader.gif" width="16px" height="16px" />Loading TEST profile...</span></td></tr>');
      odi.empty().append('<tr><td><span class="cricket_loadingText"><img alt="Loading" src="../img/cricket/v2/tables-loader.gif" width="16px" height="16px" />Loading ODI profile...</span></td></tr>');
      t20int.empty().append('<tr><td><span class="cricket_loadingText"><img alt="Loading" src="../img/cricket/v2/tables-loader.gif" width="16px" height="16px" />Loading Twenty20 profile...</span></td></tr>');

      $.getJSON(playerListUrl + teamId, null, function(data) {
        try {
          var player = generatePersonal(data.Sportsflash.Players.Player, playerId, personal);
          $('#player1Country').empty().append(country1.selectedItem().text());
        }
        catch (ex) {
          personal.empty().append('<tr><td style="text-align: center; line-height: 40px; color: #999999">Personal data of this player is not available at the moment</td></tr>');
        }
        setHeight();
      });

      $.getJSON(playerStatsUrl + playerId, null, function(data) {
        try {
          $('#player1Name').empty().append(data.SportsFlash.Header.FirstName + ' ' + data.SportsFlash.Header.LastName);

          // Load player 1 image.
          var img1 = new Image();
          img1.onload = function() { $('#player1Photo').attr('src', img1.src); };
          img1.onerror = function() { $('#player1Photo').attr('src', '../img/cricket/v2/blank_head.gif'); };
          img1.src = '../img/cricket/v2/players/' + data.SportsFlash.Header.FirstName + '-' + data.SportsFlash.Header.LastName + '.jpg';

          loadPlayerStats(data, test, odi, t20int, noDataRow);
        }
        catch (ex) {
          test.empty().append(noDataRow);
          odi.empty().append(noDataRow);
          t20int.empty().append(noDataRow);
        }
        setHeight();
      });
    });
  });

  // Select country 1 if an id is passed in.
  if (team1Id) country1.find('option[value="' + team1Id + '"]').attr('selected', 'selected').end().change();

  // Load module for player 2.
  country2.loadCountries().change(function() {

    var teamId = $(this).selectedItem().attr('value');

    player2.loadPlayers($(this).selectedItem().attr('value'), player2Id).change(function() {
      var playerId = $(this).selectedItem().attr('value');

      $('#player2Profile').css('display', 'block');

      var personal = $('#player2Personal');
      var test = $('#player2TEST');
      var odi = $('#player2ODI');
      var t20int = $('#player2T20Int');

      personal.empty().append('<tr><td><span class="cricket_loadingText"><img alt="Loading" src="../img/cricket/v2/tables-loader.gif" width="16px" height="16px" />Loading personal profile...</span></td></tr>');
      test.empty().append('<tr><td><span class="cricket_loadingText"><img alt="Loading" src="../img/cricket/v2/tables-loader.gif" width="16px" height="16px" />Loading TEST profile...</span></td></tr>');
      odi.empty().append('<tr><td><span class="cricket_loadingText"><img alt="Loading" src="../img/cricket/v2/tables-loader.gif" width="16px" height="16px" />Loading ODI profile...</span></td></tr>');
      t20int.empty().append('<tr><td><span class="cricket_loadingText"><img alt="Loading" src="../img/cricket/v2/tables-loader.gif" width="16px" height="16px" />Loading Twenty20 profile...</span></td></tr>');

      $.getJSON(playerListUrl + teamId, null, function(data) {
        try {
          var player = generatePersonal(data.Sportsflash.Players.Player, playerId, personal);
          $('#player2Country').empty().append(country2.selectedItem().text());
        }
        catch (ex) {
          personal.empty().append('<tr><td style="text-align: center; line-height: 40px; color: #999999">Personal data of this player is not available at the moment</td></tr>');
        }
        setHeight();
      });

      $.getJSON(playerStatsUrl + playerId, null, function(data) {
        try {
          $('#player2Name').empty().append(data.SportsFlash.Header.FirstName + ' ' + data.SportsFlash.Header.LastName);

          // Load player 2 image.
          var img2 = new Image();
          img2.onload = function() { $('#player2Photo').attr('src', img2.src); };
          img2.onerror = function() { $('#player2Photo').attr('src', '../img/cricket/v2/blank_head.gif'); };
          img2.src = '../img/cricket/v2/players/' + data.SportsFlash.Header.FirstName + '-' + data.SportsFlash.Header.LastName + '.jpg';

          loadPlayerStats(data, test, odi, t20int, noDataRow);
        }
        catch (ex) {
          test.empty().append(noDataRow);
          odi.empty().append(noDataRow);
          t20int.empty().append(noDataRow);
        }
        setHeight();
      });
    });
  });

  // Select country 2 if country2Id is passed in.
  if (team2Id) country2.find('option[value="' + team2Id + '"]').attr('selected', 'selected').end().change();
});