Autocomplete, error pages, anchors, lots morrrr

public/demo/404.html

@@ -0,0 +1,4 @@
+<div id="error_page">
+	<h1>404</h1>
+	<span>Failed while searching?<br/>Wait for autocomplete, it might help.<br/>How about <a href="" onclick="loadSearchPage();return(false);">one more try</a>?</span>
+</div>

public/demo/index.html

@@ -9,6 +9,7 @@
 		<link rel="stylesheet" type="text/css" media="screen" href="/stylesheets/albums.css" />
 		<script type="text/javascript" charset="utf-8" src="/javascripts/jquery.min.js"></script>
 		<script type="text/javascript" charset="utf-8" src="/javascripts/jquery.scroll.js"></script>
+		<script type="text/javascript" charset="utf-8" src="/javascripts/jquery.autocomplete.js"></script>
 		<script type="text/javascript" charset="utf-8" src="/javascripts/layout.js"></script>
 		<script type="text/javascript" charset="utf-8" src="/javascripts/ajax.js"></script>
 		<script type="text/javascript" charset="utf-8" src="/javascripts/pages.js"></script>
@@ -45,18 +46,17 @@
 		<!-- START HEADER -->
 		<div id="header-container">
 			<ul id="navigation">
-				<li class="logo">BeatHaven</li>
-				<li>News</li>
-				<li>Settings</li>
-				<li>Logout</li>
+				<li class="logo search">BeatHaven</li>
+				<li class="search">Search</li>
+				<li><a href="https://twitter.com/#!/beat_haven" target="_blank">News</a></li>
+				<li id="vk_login">Login</li>
+				<li id="vk_logout">Logout</li>
 			</ul>
 		</div>
 		<!-- END HEADER -->
 		
 		<!-- START DATA -->
-		<div id="data-container" class="css-scrollbar">
-			<a class="data artist">Foo Fighters</a>			
-		</div>
+		<div id="data-container" class="css-scrollbar"></div>
 		<!-- END DATA -->
 		
 		<div id="vk_api_transport"></div>

public/demo/search.html

@@ -0,0 +1,18 @@
+<script type="text/javascript">
+$('#search_field').autocomplete({
+	serviceUrl: '/artist/autocomplete', // Страница для обработки запросов автозаполнения
+	minChars: 2, // Минимальная длина запроса для срабатывания автозаполнения
+	delimiter: /(,|;)\s*/, // Разделитель для нескольких запросов, символ или регулярное выражение
+	maxHeight: 400, // Максимальная высота списка подсказок, в пикселях
+	width: 415, // Ширина списка
+	zIndex: 9999, // z-index списка
+	deferRequestBy: 150, // Задержка запроса (мсек)
+	onSelect: loadArtistData
+});
+</script>
+<div id="search-container">
+	<form action="" method="post" id="search_form">
+		<input type="text" id="search_field"/>
+		<input type="submit" value="Search" id="search_button"/>
+	</form>
+</div>

public/demo/whee.html

@@ -0,0 +1,4 @@
+<div id="error_page">
+	<h1>WHEE!</h1>
+	<span>We never known anything about this artist<br/>but now we found something interesting.<br/>Please come back in a minute.</span>
+</div>