Crops menu, autocomplete genus, fixed typo in method.jsp

src/main/resources/content/language.properties

@@ -457,3 +457,5 @@ oauth-client.redirect.uri=Client redirect URI
 team.user.enter.email=Enter user email
 user.not.found=User not found
 team.profile.update.title=Update team information
+
+autocomplete.genus=Find Genus...
\ No newline at end of file

src/main/webapp/WEB-INF/jsp/descr/method.jsp

@@ -52,6 +52,6 @@
 	</ul>
 	<style>
 		span.method-code { font-weight: bold; font-size: 110%; margin-left: 2em; float: right; } 
-	</stlye>
+	</style>
 </body>
 </html>
\ No newline at end of file

src/main/webapp/WEB-INF/jsp/index.jsp

@@ -19,21 +19,16 @@
 				</form>
 			</sec:authorize>
 			<div class="dropdown">
-              <button class="btn dropdown-toggle" type="button" data-toggle="dropdown">
-                Search Genus
-                <span class="caret"></span>
-              </button>
-              <ul class="dropdown-menu">
-				
-			 </ul>
+				<input class="form-control autocomplete-genus" placeholder="<spring:message code="autocomplete.genus" />" x-source="<c:url value="/explore/ac/genus" />" />
             </div> 
           </div>
           
 	<c:if test="${cropList ne null and cropList.size() gt 0}">
           <div class="content-block" id="crop-list">
             <ul class="nav">
-            	<li><a class="show" href="<c:url value="/explore/" />"><spring:message code="crop.all-crops" /></a></li>
-            <c:forEach items="${cropList}" var="crop" varStatus="status">
+            	<li class="all-crops"><a class="show" href="<c:url value="/explore/" />"><spring:message code="crop.all-crops" /></a></li>
+            	
+            	<c:forEach items="${cropList}" var="crop" varStatus="status">
 					<li><a class="show" href="/explore/c/${crop.shortName}"><c:out value="${crop.getName(pageContext.response.locale)}" /></a></li>
 				</c:forEach>
 			</ul>
@@ -93,12 +88,20 @@
 	</div>
 </div>
 <content tag="javascript">
+<script type="text/javascript" src="<c:url value="/html/js/jquery-ui.min.js" />"></script>
 <script type="text/javascript">
   $( document ).ready(function() {
     $('#news a').click(function (e) {
       e.preventDefault();
       $(this).tab('show');
     });
+    
+    $(".autocomplete-genus").each(function() {
+		var t=$(this); 
+		t.autocomplete({ delay: 200, minLength: 3, source: t.attr('x-source'),  
+			messages: { noResults: '', results: function() {} },
+			select: function(event, ui) { document.location.pathname='/acn/t/'+ui.item.value; } });
+	});
   });
 </script>
 </content>

src/main/webapp/html/css/custom.css

@@ -1828,3 +1828,8 @@ html[dir="rtl"] ul.statistics .stats-number {
 .ui-autocomplete.ui-widget {
 	font-size: 12px;
 }
+
+#crop-list li.all-crops {
+	font-weight: bold;
+	margin-bottom: 1px;
+}
\ No newline at end of file