add a search input in top bar

panikweb_templates/static/css/specifics.css

@@ -228,9 +228,24 @@ body{
 #metaNav ul li.active span.iconLabel {
 }
 
+#metaNav li#nav-search a {
+	display: inline;
+}
+
+#metaNav form {
+	display: inline;
+}
+
+#metaNav input {
+	border: 1px solid #ececec;
+}
+
 @media screen and (max-width:600px){
 	#metaNav .iconLabel {display:none;}
 	#metaNav ul li a span.nav-icon { display: inline-block; }
+	#metaNav form {
+		display: none;
+	}
 }
 
 /****************************************************/
@@ -300,6 +315,13 @@ body{
 		padding-top: 40px;
 	}
 
+	#metaNav {
+		padding-top: 2px;
+	}
+	#metaNav .nav-icon {
+		display: none !important;
+	}
+
 	#Player #CurrentlyPlaying {
 		margin-top: 50px;
 	}

panikweb_templates/static/js/specifics.js

@@ -391,6 +391,27 @@ $(function() {
 		});
 		ticker_interval = setInterval(function(){tick();  }, 20000);/**/
 
+		function navsearch_click(event) {
+			event.preventDefault();
+			var query = $('#nav-search input').val();
+			var form = $('#nav-search form');
+			var href = '';
+			if (query == '') {
+				href = $(form).attr('action');
+			} else {
+				href = $(form).attr('action') + '?' + $(form).serialize();
+			}
+			if (event.which == 2) {
+				window.open(href, '_blank');
+			} else {
+				$(this).addClass('loading');
+				loadPage(href);
+			}
+			return false;
+		}
+		$('#nav-search a').unbind('click').on('click', navsearch_click);
+		$('#nav-search a').unbind('submit').on('submit', navsearch_click);
+
 	}
 	init();
 });

panikweb_templates/templates/includes/metaNav.html

@@ -24,7 +24,9 @@
 			<li id="nav-search" class="{% if sectionName = "Search" %}active{% endif %}"><a href="{% url 'search' %}">
 				<span class="nav-icon icon-search resymbol" ></span>
 				<span class="iconLabel">{% trans 'Search' %}</span>
-			</a></li>
+			</a>
+			<form action="{% url 'search' %}"><input name="q" type="search"></input></form>
+			</li>
     
 		</ul>
 </nav>