goog.provide('oneup.Achievement');

goog.require('goog.dom');

oneup.Achievement = function(json) {
	this.id = json.id;
	this.group = json.group;
	this.name = json.name;
	this.icon = json.icon;
};

oneup.Achievement.prototype.render = function() {
	var cssclass = 'achievement';
	cssclass += this.achieved() ? ' achieved' : '';
	var groupCss = 'achievement_icon group_';
	var groupClean = this.group.replace(/ /g, '').toLowerCase();
	groupClean = groupClean.replace(/,/g, '');
	groupClean = groupClean.replace(/&/g, '');
	groupCss += groupClean;

	var icon = this.icon || 'man';

	var holder = goog.dom.createDom('div', {'class': 'achievementHolder'});
	var component = goog.dom.createDom('div', {'class': cssclass});
	var text = goog.dom.createDom('span', {}, 'I have ' + this.name);
	var icon_img = goog.dom.createDom('div', {'class': groupCss, 'style': "background-image:url('/images/icons/" + icon + ".png');"});
	var icon_img_mask = goog.dom.createDom('div', {'class': 'icon_mask'});
	icon_img.appendChild(icon_img_mask);
	component.appendChild(text);
	holder.appendChild(component);
	holder.appendChild(icon_img)
	var that = this;
	holder.onclick = function() {
		if (that.achieved()) {
			oneup.app.dataAccess.deleteUserAchievement(that.id, function(response) {
				oneup.app.userData.setAchieved(that.id, false);
				goog.dom.classes.remove(component, 'achieved');
			});
		} else {
			oneup.app.dataAccess.saveUserAchievement(that.id, function(response) {
				oneup.app.userData.setAchieved(that.id, true);
				goog.dom.classes.add(component, 'achieved');
			});
		}
	};
	return holder;
}

oneup.Achievement.prototype.achieved = function() {
	return oneup.app.userData.hasAchievement(this.id);
}