var SelectionListSystem = {};
SelectionListSystem.Templates = {};

SelectionListSystem.List = Class.create({
	initialize: function(settings, preLoad) {
		this.Settings = Object.extend({
			MinimumSelect: 1,
			MaximumSelect: 1,
			IsSingleSelect: (settings.MinimumSelect == settings.MaximumSelect),
			AjaxURL: '',
			AjaxParams: null,
			Output: null,
			ContainerPadding: '0px 5px 5px 5px',
			Width: 173,
			NoItemsText: 'No elements in the list were found',
			NoIDText: 'No user ID was defined',
			ListErrorText: 'An error occurred in the list, please try again later'
		}, settings);
		this.Element = new Element('div').setStyle({ overflow: 'auto', height: this.Settings.Height + 'px', padding: this.Settings.ContainerPadding });
		this.Items = new Array();
		this.SelectedItem = null;
		this.SelectedMultiItem = new Array();
		this.CurrentSelect = 0;

		if (typeof preLoad != 'undefined') {
			this.EvaluateList(preLoad);
		} else {
			this.LoadItems();
		}
	},

	LoadItems: function() {
		this.Element.update();
		this.Element.insert(new Element('div').update('Loading...').setStyle({ padding: '10px' }));

		if (this.Settings.AjaxURL) {
			var options = {
				method: 'get',
				onComplete: this.LoadItems_Complete.bind(this)
			}
			if (this.Settings.AjaxParams) {
				options.parameters = this.Settings.AjaxParams;
			}
			new Ajax.Request(this.Settings.AjaxURL, options);
		}
	},

	LoadItems_Complete: function(r) {
		this.EvaluateList(r.responseText);
	},

	EvaluateList: function(list) {
		if (list) {
			if (list != "NoID") {
				if (list != "NoItems") {
					var items = new Array();
					items = eval(list);
					if (items.length > 0) {
						for (var i = 0; i < items.length; i++) {
							this.Items[i] = new SelectionListSystem.Item(items[i].ID, items[i].OnClick, items[i].ClientID, items[i].Template, this);
						}
						this.SetElements();
					} else {
						this.Element.update();
						this.Element.insert(new Element('div').update(this.Settings.ListErrorText).setStyle({ padding: '10px' }));
					}
				} else {
					this.Element.update();
					this.Element.insert(new Element('div').update(this.Settings.NoItemsText).setStyle({ padding: '10px' }));
				}
			} else {
				this.Element.update();
				this.Element.insert(new Element('div').update(this.Settings.NoIDText).setStyle({ padding: '10px' }));
			}
		} else {
			this.Element.update();
			this.Element.insert(new Element('div').update('An unexpected error occurred').setStyle({ padding: '10px' }));
		}
	},

	SetElements: function() {
		this.Element.update();
		for (var i = 0; i < this.Items.length; i++) {
			if (Prototype.Browser.IE) {
				this.Element.insert(this.Items[i].GetElement().setStyle({ width: this.Settings.Width }));
			} else {
				this.Element.insert(this.Items[i].GetElement());
			}
		}
	},

	toElement: function() {
		return this.Element;
	},

	Click: function(parent, item, element, click) {
		if (parent.Settings.IsSingleSelect) {
			if (parent.SelectedItem == item) {
				parent.mouseOverStyle(element);
				parent.SelectedItem = null;
			} else {
				parent.selectedStyle(element);
				parent.SelectedItem = item;

				var i = parent.Items.length;
				while (i--) {
					if (parent.Items[i].ID != item) {
						parent.mouseOutStyle(parent.Items[i].Element);
					}
				}

				eval(click);
			}
		} else {
			if (parent.SelectedMultiItem.contains(item)) {
				parent.mouseOverStyle(element);
				parent.RemoveSelectedItem(item);
			} else {
				if (parent.CurrentSelect <= parent.Settings.MinimumSelect && parent.CurrentSelect <= parent.Settings.MaximumSelect) {
					parent.selectedStyle(element);
					parent.SelectedMultiItem[parent.SelectedMultiItem.length] = item;
					parent.CurrentSelect++;
				}
			}
		}

		parent.SetSelectedValues();
	},

	MouseOver: function(parent, item, element) {
		if (parent.Settings.IsSingleSelect) {
			if (parent.SelectedItem == item) {
				parent.selectedMouseOverStyle(element);
			} else {
				parent.mouseOverStyle(element);
			}
		} else {
			if (parent.SelectedMultiItem.contains(item)) {
				parent.selectedMouseOverStyle(element);
			} else {
				parent.mouseOverStyle(element);
			}
		}
	},

	MouseOut: function(parent, item, element) {
		if (parent.Settings.IsSingleSelect) {
			if (parent.SelectedItem == item) {
				parent.selectedStyle(element);
			} else {
				parent.mouseOutStyle(element);
			}
		} else {
			if (parent.SelectedMultiItem.contains(item)) {
				parent.selectedStyle(element);
			} else {
				parent.mouseOutStyle(element);
			}
		}
	},

	GetItem: function(id) {
		for (var i = 0; i < this.Items.length; i++) {
			if (this.Items[i].ID == id) {
				return this.Items[i];
			}
		}
	},

	GetElement: function(id) {
		return this.GetItem(id).Element;
	},

	GetElements: function() {
		this.ClearElements();
		for (var i = 0; i < this.Items.length; i++) {
			this.Element.insert(this.Items[i]);
		}
	},

	ClearElements: function() {
		while (this.Element.firstChild) {
			this.Element.removeChild(this.Element.firstChild);
		}
	},

	RemoveSelectedItem: function(id) {
		var i = this.SelectedMultiItem.length;
		while (i--) {
			if (this.SelectedMultiItem[i] === id) {
				this.SelectedMultiItem.remove2(i);
				this.CurrentSelect--;
				break;
			}
		}
	},

	selectedStyle: function(element) {
		element.className = 'cursorHand CLMainClass';
	},
	selectedMouseOverStyle: function(element) {
		element.className = 'cursorHand CLMainClass tdSpeciel4';
	},
	mouseOverStyle: function(element) {
		element.className = 'cursorHand inputKnap tdSpeciel4';
	},
	mouseOutStyle: function(element) {
		element.className = 'cursorHand inputKnap';
	},

	SetSelectedValues: function() {
		var result = "";
		if (this.Settings.IsSingleSelect) {
			result = this.SelectedItem;
		} else {
			for (var i = 0; i < this.SelectedMultiItem.length; i++) {
				result += this.SelectedMultiItem[i] + ",";
			}
			if (result.length > 0) {
				result = result.substr(0, result.length - 1);
			}
		}
		if (this.Settings.Output) {
			if (typeof this.Settings.Output.value != 'undefined') {
				this.Settings.Output.value = result;
			} else {
				this.Settings.Output.update(result);
			}
		}
	},

	ClearSelections: function() {
		this.SelectedItem = null;
		this.SelectedMultiItem.clear();
		this.CurrentSelect = 0;
		this.Items.each(function(e) {
			this.mouseOutStyle(e.Element);
		} .bind(this));
	}
});

SelectionListSystem.Item = Class.create({
	initialize: function(id, onclick, clientID, template, parent) {
		this.ID = id;
		this.Element = eval(template).GetElement();
		this.OnClick = onclick;
		this.ClientID = clientID;
		this.Parent = parent;

		if (this.Element) {
			this.Element.id = clientID + "row" + id;
			this.Element.className = 'inputKnap';
			this.Element.observe('click', this.Parent.Click.bind(this, this.Parent, this.ID, this.Element, this.OnClick));
			this.Element.observe('mouseover', this.Parent.MouseOver.bind(this, this.Parent, this.ID, this.Element));
			this.Element.observe('mouseout', this.Parent.MouseOut.bind(this, this.Parent, this.ID, this.Element));
		}
	},

	GetElement: function() {
		return this.Element;
	}
});

SelectionListSystem.Template = Class.create({
	initialize: function(template, values) {
		this.Template = template,
		this.Values = values;
	},

	GetElement: function() {
		switch (this.Template) {
			case "GameFriendsOnline":
				return new SelectionListSystem.Templates.FriendsOnline(this.Values).GetElement();

			case "BattleList":
				return new SelectionListSystem.Templates.BattleList(this.Values).GetElement();
		}
		return new Element('div');
	}
});

SelectionListSystem.Templates.FriendsOnline = Class.create({
	initialize: function(values) {
		this.Values = Object.extend({
			ImageURL: null,
			Username: null,
			Fullname: null,
			Extra: null
		}, values);
	},

	GetElement: function() {
		var element = new Element('table'); //, { 'class': 'inputKnap' }
		element.insert(
			new Element('tbody').insert(
				new Element('tr').insert(
					new Element('td').insert(
						new Element('img', { src: this.Values.ImageURL, alt: '' }).setStyle({ maxWidth: '29px' })
					).setStyle({ width: '29px' })
				).insert(
					new Element('td').insert(
						new Element('textNode').update(this.Values.Username)
					).insert(
						new Element('br')
					).insert(
						new Element('textNode').update(this.Values.Fullname)
					).insert(
						new Element('br')
					).insert(
						new Element('textNode').update(this.Values.Extra)
					).setStyle({ paddingLeft: '5px' })
				)
			)
		).setStyle({ margin: '5px 0px 0px 0px', width: '100%' });
		return element;
	}
});

SelectionListSystem.Templates.BattleList = Class.create({
	initialize: function(values) {
		this.Values = Object.extend({
			Images: new Array(),
			Created: null,
			Type: null,
			Category: null,
			Players: null
		}, values);
	},

	GetElement: function() {
		var element = new Element('div').setStyle({ margin: '5px 0px 0px 0px' });
		element.insert(
			new Element('div').insert(
				this.GetImages()
			).setStyle({ margin: '5px 5px 0px 5px' })
		).insert(
			new Element('div').insert(
				new Element('textNode').update('Created: ' + this.Values.Created + ' | Type: ' + this.Values.Type + ' | Category: ' + this.Values.Category + ' | Participants: ' + this.Values.Players + '')
			).setStyle({ margin: '0px 5px 5px 5px' })
		);
		return element;
	},

	GetImages: function() {
		var Table = new Element('table');
		var Tbody = new Element('table');
		var Tr = new Element('table');

		var i = this.Values.Images.length;
		while (i--) {
			Tr.insert(
				new Element('td').insert(
					new Element('img', { src: this.Values.Images[i], alt: '' }).setStyle({ maxWidth: '80px' })
				)
			);
		}

		Table.insert(Tbody.insert(Tr));

		return Table;
	}
});
try {
RegTr("17644");
RegTr("17645");
RegTr("17646");
RegTr("17647");
RegTr("17648");
RegTr("17649");
} catch (e) {}