<div>
	<div style="float: right">
		Search: <input type="text" id="searchfield" size="20" value="" class="textfield" style="width: 200px;" onkeyup="page=0; showList();"><br>
		Sort by: 
		<select name="sort" id="sort" onchange="showList();" class="select">
			<option value="name">Name</option>
			<option value="year">Year</option>
			<option value="rating">Rating</option>
			<option value="format">Format</option>
			<option value="seen">Seen</option>
			<option value="own">Own</option>
			<option value="added">Added</option>
		</select>
		<input type="checkbox" id="desc" value="1" onclick="showList();"><label for="desc">Reverse sort</label><br>
		Movies per page:
		<select name="amount" id="amount" onchange="page=0; showList();" class="select">
			<option value="-1">all</option>
			<option value="10">10</option>
			<option value="20">20</option>
			<option value="30">30</option>
			<option value="40">40</option>
			<option value="50">50</option>
		</select>
	</div>
	
	<h2>My DVD collection</h2>
	
	<div id="list" style="display: none;"></div>
	<div id="loading"><img src="{$template_dir}images/design/loading.gif" alt="" title=""><br>Loading movie list...</div>
</div>

<script type="text/javascript">
	/* When there is a cookie set, set the search term */
	var cookiesearch = getCookie('searchwords');
	if(cookiesearch)
		setSearch(cookiesearch);
	var sort = getCookie('sort');
	if(sort)
		setSort(sort);
	var amount = getCookie('amount');
	if(amount)
		setAmount(amount);
	var p = getCookie('page');
	if(p)
		page = p;
		
	/* Focus on the search input */
	document.getElementById('searchfield').focus();
	document.getElementById('searchfield').value += '';
	
	/* Get movie list */
	showList();
</script>