var Planner = new Class({
	Implements: [Options, Events],
	options: {
		container: false,
	},
	
	initialize: function(options) {
		this.setOptions(options);

		this.draw();

	},
	
	getData: function() {

		var strData = Cookie.read('riff-planner');
		
		var obj = JSON.decode(strData);
		
		return obj;
	},
	
	writeData: function(data) {
		var dataStr = JSON.encode(data);
		
		Cookie.write('riff-planner', dataStr, {path: '/', duration: 20});

	},
	
	addItem: function(id, name, date, cinema) {
		var dataList = this.getData();
		
		var listStatus = ((dataList == null) || (dataList.length == 0));
		
		if (dataList == null) {
			dataList = [];
		}
		
		if (dataList.length == 0) {
			dataList.push({i: id, n: name, d: date, c: cinema});
			this.writeData(dataList);
			
			this.draw();
		}
		else {
			dataList.push({i: id, n: name, d: date, c: cinema});
			this.drawItem({i: id, n: name, d: date, c: cinema}, dataList.length-1);
			this.writeData(dataList);
		}

		
	},
	
	removeItem: function(index) {
		console.log(index);
		var dataList = this.getData();
		
		for (var i = dataList.length-1; i >= 0; i--) {
			if (i == index) {
				dataList.splice(i, 1);
			}
		}

		this.writeData(dataList);
		
		if (dataList.length == 0) {
			this.draw();
		}
		
		
		this.updateCount();
	},
	
	clear: function() {
		Cookie.write('riff-planner', '');
		
		this.draw(true);
	},
	
	getItemByID: function(id) {
		var dataList = this.getData();
		var ret;
		
		for (var i = dataList.length-1; i >= 0; i--) {
			if (dataList[i].i == id) {
				ret = dataList[i];
			}
		}
		
		return ret;
	},
	
	drawItem: function(dataItem, index) {
		var cont = this.options.container;
		var list = cont.getElement('.items');

		href_is = '/Myndir2011/Ummyndina//'+dataItem.i;
		href_en = '/Films2011/Aboutfilm/'+dataItem.i;
		
		var wrapper = new Element('div', {'class': 'item-wrapper'});
		
		var item = new Element('div', {'class': 'item'});
		
		var name = new Element('div', {'class': 'name', 'html': '<a class="is" href="'+href_is+'">'+dataItem.n+'</a><a class="en" href="'+href_en+'">'+dataItem.n+'</a>'}).inject(item);
//		var name = new Element('a', {'class': 'name', 'href': href_en, text: dataItem.n}).inject(item);
		var date = new Element('span', {'class': 'date', text: dataItem.d}).inject(item);
		var cinema = new Element('span', {'class': 'cinema', text: dataItem.c}).inject(item);
		item.grab(new Element('div', {'class': 'clearfix'}));
		wrapper.grab(item);
		
		
		var clearItem = new Element('a', {'class': 'remove', html: '<span class="is" rel="'+index+'">x</span><span class="en" rel="'+index+'">x</span>', href: '', rel: index}).inject(item).addEvent('click', function(evt) {
			
			evt.stop();
			wrapper.dispose();
			this.removeItem(evt.target.get('rel'));
			
		}.bindWithEvent(this));

		
		list.grab(wrapper);
		wrapper.inject(list);

		
	},
	
	updateCount: function() {
		var counter = 1;
		var cont = this.options.container;
		
		var dataList = this.getData();
		var newdataList = [];
		
		cont.getElements('.items .item-wrapper .item').each(function(el) {
			
			var id = el.getElement('.counter').get('text').toInt()-1;
			
			newdataList.push(dataList[id]);
			
			el.getParent().getElement('.info .remove').set('rel', (counter-1));
			el.getElement('.counter').set('text', (counter));
			counter++;
		});
		
		return newdataList;
	},
	
	draw: function(clear) {
		var dataList = this.getData();
		
		var cont = this.options.container;
		
		if ((cont != null)) {
			
			cont.set('html', '');
			
			if ((dataList != null) && (dataList.length > 0)) {
				cont.grab(new Element('div', {'class': 'data-planner-head', 'html': '<h3 class="is">Mínar RIFF myndir</h3><h3 class="en">My RIFF films</h3>'}));

								
				var list = new Element('div', {'class': 'items'});
				cont.grab(list);
				
				
				for (var i = 0; i < dataList.length; i++) {
					this.drawItem(dataList[i], i);
				}
				
/*
				cont.getElements('.items .item-wrapper').each(function(el) {
					el.getElement('.info').slide('hide');
					el.getElement('a.name').addEvent('click', function() {
						el.getElement('.info').slide('toggle');
					});
				});
*/				
				this.drawUI();
			}
			
		}
		
	},
	
	drawUI: function() {
		var cont = this.options.container;
		
		if (cont != null) {
			var controls = new Element('div', {'class': 'controls'});
			
			if (cont != null) {
				var clearLink = new Element('a', {html: '<span class="is">Hreinsa lista</span><span class="en">Clear list</span>'});
				controls.grab(clearLink);
				clearLink.addEvent('click', function() {
					this.clear();
				}.bindWithEvent(this));
				
			}
			
			controls.grab(new Element('div', {'class': 'clearfix'}));
			
			cont.grab(controls);
		}
	}
});

window.addEvent('domready', function(){
	planner = new Planner({container: $$('.riff-planner')[0]});
		

	$$('.add-to-datalist').each(function(el) {
		el.addEvent('click', function(evt) {
			evt.stop();
			var itemId = el.getElement('.id').get('text');
			var itemName = el.getElement('.name').get('text');
			var itemDate = el.getElement('.date').get('text');
			var itemCinema = el.getElement('.cinema').get('text');
			
			planner.addItem(itemId, itemName, itemDate, itemCinema);
		});
	});
});