ListNavigator = Class.create(Abstract, {
	initialize: function (wrapper, data, options) {
		this.wrapper = $(wrapper);

		this.currentPage = 1;

		this.options = Object.extend({pageItems: 10, containerID: 'ideaList'}, options || {});

		this.data = data;

		this.workingData = this.data;

		this.createContainer();

		this.jumpToPage(this.currentPage);
		},

	createContainer: function () {
		this.wrapper.insert({bottom:( new Template('<ul id="#{id}"></ul>')).evaluate({id: this.options.containerID})});
		this.wrapper.insert({after: '<div class="pagination" id="pagination' + this.options.containerID + '"><ul></ul><div class="clear">&nbsp;</div></div>'});

		this.container = $(this.options.containerID);
		this.paginare = this.wrapper.next('.pagination').down('ul');

		var template = '<li class="feedback-inner idea:#{id}">';
		template += '<div class="thumbs">';
		template += '<a href="#" title="Sunt de acord" class="thumb-up#{disabledUpgrade}" rel="#{id}">up</a>';
		template += '<a href="#" title="Nu sunt de acord" class="thumb-down#{disabledDowngrade}" rel="#{id}">down</a>';
		template += '</div>';
		template += '<h4>#{name}</h4>';
		template += '<p>#{content}</p>';
		template += '<p class="response">#{response}</p>';
		template += '<span class="#{scoreType}">#{score}</span><span>#{scoreLabel}</span>';
		template += '</li>';

		this.itemTemplate = new Template(template);
		},

	populateContainer: function () {
		this.container.descendants().invoke('remove');
		if (this.container.next('ul')) {
			this.container.next('ul').remove();
		}

		if (this.workingData.size()) {
			this.workingData.each((function (item) {

				var container = this.itemTemplate.evaluate({
						id:					item.id,
						name:				item.name,
						content:			item.content,
						response:			item.response,
						score:				(item.score != 0 ? Math.abs(item.score) : ''),
						scoreType:			(item.score > 0 ? 'green' : (item.score == 0 ? 'normal' : 'red')),
						scoreLabel:			(item.score > 0 ? (item.score == 1 ? ' vot favorabil' : ' voturi favorabile') : (item.score == 0 ? ' nici un vot' : (item.score == -1 ? ' vot negativ' : ' voturi negative'))),
						disabledUpgrade:	item.mode == 'u' || item.mode == 'a' ? ' disabled' : '',
						disabledDowngrade:	item.mode == 'd' || item.mode == 'a' ? ' disabled' : ''
					});

				this.container.insert({bottom: container});

				if (item.mode == 'a') {
					this.container.select('li').last().addClassName('own-idea').down('.thumbs').remove();
				}
			}).bind(this));
			this.container.immediateDescendants().each(function (elm) {
				elm.observe('mouseover', function (event) {
					elm.addClassName('hover');
				}).observe('mouseout', function (event) {
					elm.removeClassName('hover');
				});
			}).first().addClassName('first');

			this.container.select('div.thumbs a').invoke('observe', 'click', this.updateIdea.bind(this));
		}
	},

	buildNavigation: function () {
		this.paginare.hide().descendants().invoke('remove');

		var total = Math.ceil(this.data.size() / this.options.pageItems);

		interval = {
			min: 1,
			max: total
			}

		if (total > 7) {
			if (this.currentPage <= 6) {
				interval.min = 1;
				interval.max = 7;
				} else if (total - this.currentPage <= 5) {
					interval.min = total - 6;
					interval.max = total;
					} else {
						interval.min = this.currentPage - 3;
						interval.max = this.currentPage + 3;
						}
			}

		var pageTemplate = new Template('<li#{classname}><a href="##{page}" rel="#{page}" title="#{title}"><span>#{text}</span></a></li>');

		if (this.data.size()) {
			this.paginare.show();
			this.paginare.insert({bottom: (this.currentPage > 1 ? pageTemplate.evaluate({page: this.currentPage - 1, title: 'Pagina anterioara', text: 'Inapoi</a>', classname: ' class="prev"'}) : '<li class="prev"><div><span>Inapoi</span></div></li>')});
			}

		if (total > 7 && this.currentPage > 2) {
			if (this.currentPage >= 7) {
				if (interval.min > 1) {
					this.paginare.insert({bottom: pageTemplate.evaluate({page: 1, title: ('Pagina 1 / ' + total), text: '1'})});
					}
				if (interval.min > 2) {
					this.paginare.insert({bottom: pageTemplate.evaluate({page: 2, title: ('Pagina 2 / ' + total), text: '2'})});
					}
				}
			if (interval.min > 3) {
				this.paginare.insert({bottom: '<li class="blank">...</li>'});
				}
			}

		$R(interval.min, interval.max).each((function (elm) {
			this.paginare.insert({bottom: pageTemplate.evaluate({page: elm, title: ('Pagina ' + elm + ' / ' + total), text: elm})});
			if (elm == this.currentPage) {
				this.paginare.descendants().last().up('a').addClassName('selected');
				}
			}).bind(this));

		if (total > 7 && this.currentPage < total - 1) {
			if (total - interval.max >= 3) {
				this.paginare.insert({bottom: '<li class="blank">...</li>'});
				}
			if (interval.max < total - 1) {
				this.paginare.insert({bottom: pageTemplate.evaluate({page: total-1, title: ('Pagina ' + (total - 1) + ' / ' + total), text: (total - 1)})});
				}
			if (interval.max < total) {
				this.paginare.insert({bottom: pageTemplate.evaluate({page: total, title: ('Pagina ' + total + ' / ' + total), text: total})});
				}
			}

		if (this.data.size()) {
			this.paginare.insert({bottom: (this.currentPage < total ? pageTemplate.evaluate({page: this.currentPage + 1, title: 'Pagina urmatoare', text: 'Inainte</a>', classname: ' class="next"'}) : '<li class="next"><div><span>Inainte</span></div></li>')});
			}

		this.paginare.getElementsBySelector('a').each((function (elm) {
			elm.observe('click', (function (event) {
				event.stop();
				this.jumpToPage(parseInt(elm.rel));

				Effect.ScrollTo.delay(0.2, $('ideas-title'), {duration: 0.3});
				}).bind(this));
			}).bind(this));
		},

	jumpToPage: function (page) {
		this.currentPage = page;
		interval = {
			start: (this.currentPage - 1) * this.options.pageItems,
			end: this.currentPage * this.options.pageItems
		}

		this.workingData = this.data.slice(interval.start, interval.end);

		this.populateContainer();

		if (this.data.size() > this.options.pageItems) {
			this.buildNavigation();			
		} else {
			this.paginare.hide();
		}
	},

	updateIdea: function (event) {
		event.stop();
		var element = event.findElement('a');
		if (!element.hasClassName('disabled')) {
			var parameters = {
				id:		element.rel,
				mode:	(element.hasClassName('thumb-up') ? 'upgrade' : 'downgrade')
			};

			new Ajax.Request(PATH_.root + 'vote', {
				parameters: parameters,
				onSuccess:	(function (transport) {
					var response = transport.responseText.evalJSON();
					switch (response.type) {
						case 'success':
							var idea	= response.idea;

							var containers = $$(".ideas ul li[class*='idea:"+ idea.id +"']");

							if (containers) {
								containers.each(function (container) {
									var score	= container.down('p').next('span').removeClassName('red').removeClassName('green');

									score.addClassName(idea.score > 0 ? 'green' : (idea.score == 0 ? 'normal' : 'red')).update(idea.score != 0 ? Math.abs(idea.score) : '');

									var scoreLabel = score.next('span');
									scoreLabel.update(idea.score > 0 ? (idea.score == 1 ? '&nbsp;vot favorabil' : '&nbsp;voturi favorabile') : (idea.score == 0 ? 'nici un vot' : (idea.score == -1 ? '&nbsp;vot negativ' : '&nbsp;voturi negative')));

									var thumbs = container.down('.thumbs');

									thumbs.select('a').invoke('removeClassName', 'disabled');

									var positive = thumbs.down('a.thumb-up');
									var negative = thumbs.down('a.thumb-down');

									if (element.hasClassName('thumb-up')) {
										positive.addClassName('disabled');
									} else {
										negative.addClassName('disabled');
									}
								});
							}
							break;
						case 'error':
							break;
					}
				}).bind(this)
			});
		}
	},

	addNew: function (item) {
		item.mode = 'a';
		this.data.unshift(item);
		this.jumpToPage(1);
	}
});