window.addEvent('domready', function() {
	$$('.delete_friend_row').addEvents({
		click : function() {
			var nr = $('filter_table').getElements('tr').length;
			//if (nr > 1) {
				var row = this.getParent().getParent();
				row.remove();
			//}
		}
	});
});

function addRestriction() {
	//hoeveelte rij berekenen
	var nr = $('filter_table').getElements('tr').length;
	//een bandmember rij:
	var filterRow = new Element('tr');
	//eerste kolom:
	var filterColumn = new Element('td').injectInside($(filterRow));

	filterColumn.style.width = '660px';
	filterColumn.style.borderBottom = '1px #B4B4B4 solid';
	filterColumn.style.padding = '2px 0px';
	filterColumn.style.marginBottom = '4px';
	filterColumn.innerHTML = '<p style="width: 170px; float: left;">Add a website restriction:</p>';

	// Eerste inputveld
	var filterType = new Element('select', {
		name: 'restrictions['+ nr + '][type]',
		id: 'type_'+ nr,
		events: {
			change : function() {
				createRestrictionValueInput(this.value, nr);
			}
		}
	});
	filterType.style.width = '150px';
	filterType.style.cssFloat = 'left';
	filterType.style.styleFloat = 'left';

	var mainOptgroup = new Element('optgroup', {
		label: 'Select a restriction:'
	});
	filterType.appendChild(mainOptgroup);

	var movieOptgroup = new Element('optgroup', {
		label: 'M::Movie filters'
	});
	filterType.appendChild(movieOptgroup);
	filterType.options[filterType.length] = new Option('M::Country', '1');
	filterType.options[filterType.length] = new Option('M::Release-year', '2');

	var posterOptgroup = new Element('optgroup', {
		label: 'P::Poster filters'
	});
	filterType.appendChild(posterOptgroup);
	filterType.options[filterType.length] = new Option('P::Category', '3');
	filterType.options[filterType.length] = new Option('P::Resolution', '8');
	filterType.options[filterType.length] = new Option('P::Country', '4');
	filterType.className = 'inviteFriend';
	filterType.injectInside($(filterColumn));

	value = new Element('div', {
		id: 'value_' + nr
	});
	value.style.width = '300px';
	value.style.cssFloat = 'left';
	value.style.styleFloat = 'left';
	value.style.display = 'inline';
	value.style.margin = '0px 0px 0px 20px';
	value.innerHTML = 'Country-codes: <input size="20" name="restrictions[' + nr + '][country_codes]" />';
	value.injectInside($(filterColumn));

	//delete:
	var removeEmail = new Element('img', {
		src: pathweb + '/images/icons/delete.png',
		title: 'Remove',
		alt: 'Remove',
		'class': 'hand delete_bandmember_row',
		events: {
			click : function() {
				var nr = $('filter_table').getElements('tr').length;
				//if (nr > 1) {
					var row = this.getParent().getParent();
					row.remove();
				//}
			}
		}
	});
	removeEmail.style.cssFloat = 'left';
	removeEmail.style.styleFloat = 'left';
	removeEmail.style.margin = '2px 0px 0px 4px';
	removeEmail.injectInside($(filterColumn));

	if (nr < 5) {
		filterRow.injectInside($('filter_table'));
		$('filter').style.position = 'absolute';
	}
}

function createRestrictionValueInput(type, row) {
	switch(type){
		case '1':
			$('value_' + row).innerHTML = 'Country-codes: <input size="20" name="restrictions[' + row + '][country_codes]" />';
			break;

		case '2':
			$('value_' + row).innerHTML = 'Released between <input size="4" name="restrictions[' + row + '][start_year]" /> and <input size="4" name="restrictions[' + row + '][end_year]" />';
			break;

		case '3':
			// Eerste inputveld
			$('value_' + row).innerHTML = 'Category: ';
			var category = new Element('select', {
				name: 'restrictions[' + row + '][category_id]',
				style: 'width: 150px;'
			});
			category.options[category.length] = new Option('Select a category', '0');
			category.options[category.length - 1].disabled = 'disabled';
			category.options[category.length] = new Option('Unset', '0');
			category.options[category.length] = new Option('Poster', '1');
			category.options[category.length] = new Option('Cover', '2');
			category.options[category.length] = new Option('Textless', '3');
			category.options[category.length] = new Option('Logo', '4');
			category.options[category.length] = new Option('Other', '5');
			category.options[category.length] = new Option('Custom', '6');
			category.injectInside($('value_' + row));
			break;

		case '4':
			$('value_' + row).innerHTML = 'Country-codes: <input size="20" name="restrictions[' + row + '][country_codes]" />';
			break;

		case '8':
			$('value_' + row).innerHTML = 'Width between <input size="4" name="restrictions[' + row + '][min_width]" /> and <input size="4" name="restrictions[' + row + '][max_width]" /> pixels';
			break;
	}
}