$(function()
{
	$("ul.tabs").tabs("div.panes > div",
            {
            	effect: 'default',
            	onBeforeClick: function(event, i)
            	{
            		// get the pane to be opened
            		var pane = this.getPanes().eq(i).find('div.axero-user-tab-pane');
            		var targetDiv = pane;
            		var pageLength = 20;
            		var jsonInputParamString = '{}';
            		var templateHTML = null;


            		if (targetDiv.is(":empty"))
            		{
            			var dataPath = null;
            			var templatePath = null;
            			var initializeTemplate = function() { };

            			//Set loading status
            			targetDiv.html('<div class="axero-spinner-image"><img src="' + Communifire.virtualDirectory + '/assets/images/spinner.gif" /> <span>Loading ...</span></div>');

            			//Set data + template paths
            			switch (i)
            			{
            				case 1:
            					//dataPath = baseDataPath + 'GetLatestBlogsListAjaxify';
            					templatePath = Communifire.buildAjaxTemplatesUrl('ProfilePageUserInfo.aspx?username=' + username);
            					break;
            				case 2:
            					dataPath = Communifire.buildCommonWSUrl('GetUserRecentActivityListAjaxify');
            					templatePath = Communifire.buildAjaxTemplatesUrl('ProfilePageRecentActivityList.aspx');
            					jsonInputParamString = '{"username":"' + username + '","pageLength":' + pageLength + '}';
            					break;
            				case 3:
            					//dataPath = baseDataPath + 'GetLatestBlogsListAjaxify';
            					templatePath = Communifire.buildAjaxTemplatesUrl('ProfilePageUserContent.aspx');
            					break;
            				case 4:
            					dataPath = Communifire.buildCommonWSUrl('GetUserSpacesListAjaxify');
            					templatePath = Communifire.buildAjaxTemplatesUrl('ProfilePageUserSpacesList.aspx');
            					jsonInputParamString = '{"username":"' + username + '"}';
            					break;

            			} //end switch

            			if (i == 1)
            			{
            				//Load template
            				$.get(templatePath, function(data)
            				{
            					targetDiv.html(data);
            				});
            			}
            			else if (i == 3)
            			{
            				//Load template
            				$.get(templatePath, function(data)
            				{
            					targetDiv.html(data);
            				});
            			}
            			else
            			{
            				//Make an ajax call
            				$.ajax({
            					type: 'POST',
            					url: dataPath,
            					data: jsonInputParamString,
            					dataType: 'json',
            					contentType: 'application/json; charset=utf-8',
            					success: function(response)
            					{
            						if (response != null && response.d != null && response.d)
            						{
            							var output = response.d;

            							//Load template
            							$.get(templatePath, function(data)
            							{
            								templateHTML = data;

            								//Apply template
            								switch (i)
            								{
            									case 2:
            										initializeTemplate = parseTemplate(templateHTML, { moreRecActivityPath: moreRecActivityPath, uDisplayName: userDisplayName, recentActivityList: output });
            										break;
            									case 4:
            										initializeTemplate = parseTemplate(templateHTML, { uDisplayName: userDisplayName, spacesList: output });
            										break;

            								} //end switch
            								var s = initializeTemplate;
            								targetDiv.html(s);
            							}); //end ajax
            						}
            						else
            						{
            							targetDiv.html('');
            						}
            					}
            				});
            			}
            		}
            	}

            });
});