goog.provide('oneup.ui.FriendPage');

goog.require('goog.dom');
goog.require('oneup.ui.ColumnPage');
goog.require('oneup.Achievement');

oneup.ui.FriendPage = function() {
	oneup.ui.ColumnPage.call(this, [1]);
};
goog.inherits(oneup.ui.FriendPage, oneup.ui.ColumnPage);

oneup.ui.FriendPage.prototype.render = function() {
	var column = this.columns[0];
	var that = this;
	var friendId = oneup.app.uiManager.getPageArgs()["id"];
	
	oneup.app.dataAccess.getFriendDetails(friendId, function(response) {
		var json = response.target.getResponseJson();
		if (json.value) {
			column.appendChild(that.createErrorBox_(json.value));
			return this.holder;
		}
		var name = json.user[0].name;
		var title = goog.dom.createDom('div', {'class':'friendPageTitle'});
		title.appendChild(goog.dom.createDom('img', {'src': 'http://graph.facebook.com/' + friendId + '/picture'}));
		var nameHolder = goog.dom.createDom('div', {'id':'friendNameHolder'});
		nameHolder.appendChild(goog.dom.createDom('div', {'id':'friendName'}, name));
		nameHolder.appendChild(goog.dom.createDom('div', {'id':'friendNameAchievement'}, 'Achievements'));
		title.appendChild(nameHolder);
		title.appendChild(goog.dom.createDom('div', {'class':'clear'}));
		var achievementIcons = goog.dom.createDom('div', {'class':'friendPageContent'});
		column.appendChild(title);
		column.appendChild(achievementIcons);
		var achievements = json.achievements[0];
		
		var groups = {};
		
		for (var i = 0; i < achievements.length; i++) {
			var achId = achievements[i].achievement;
			var achievement = oneup.app.getAchievements([achId])[0];
			var group = groups[achievement.group] || that.createGroupHeader_(achievement.group);
			groups[achievement.group] = group;
			group.appendChild(new oneup.ui.AchievementIcon(achId, true).render());
		}
		var groupArray = objectToArray(groups, true);

		for (var i = 0; i < groupArray.length; i++) {
			achievementIcons.appendChild(groupArray[i]);
			achievementIcons.appendChild(goog.dom.createDom('div', {'class' : 'clear'}));
		}		
	});
	
	return this.holder;
};
	
oneup.ui.FriendPage.prototype.createErrorBox_ = function(error) {
	return goog.dom.createDom('div', {'class':'bigError error'}, error);
}

oneup.ui.FriendPage.prototype.createGroupHeader_ = function(name) {
	var holder = goog.dom.createDom('div', {'class': 'achievementGroup'}, null);
	var header = goog.dom.createDom('div', {'class': 'achievementGroupHeader'}, name);
	holder.appendChild(header);
	return holder;
}