Commit a15c5e5f authored by Matija Obreza's avatar Matija Obreza

UI updates

parent 3beff0cc
...@@ -56,6 +56,7 @@ public class DatasetController extends BaseController { ...@@ -56,6 +56,7 @@ public class DatasetController extends BaseController {
if (metadata == null) { if (metadata == null) {
throw new ResourceNotFoundException(); throw new ResourceNotFoundException();
} }
model.addAttribute("page", page);
model.addAttribute("metadata", metadata); model.addAttribute("metadata", metadata);
model.addAttribute("methods", genesysService.listMethods(metadata)); model.addAttribute("methods", genesysService.listMethods(metadata));
......
...@@ -71,6 +71,8 @@ sample.message.invite.to.network = Invite to Network ...@@ -71,6 +71,8 @@ sample.message.invite.to.network = Invite to Network
data.error.404=The data you requested was not found in the system. data.error.404=The data you requested was not found in the system.
page.rendertime=Processing this page took {0}ms. page.rendertime=Processing this page took {0}ms.
footer.copyright-statement=©2013 Global Crop Diversity Trust
user.pulldown.logout=Logout user.pulldown.logout=Logout
user.pulldown.profile=View profile user.pulldown.profile=View profile
......
<%@include file="/WEB-INF/jsp/init.jsp"%> <%@include file="/WEB-INF/jsp/init.jsp"%>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %> <%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags"%>
<html> <html>
<head> <head>
<title><sitemesh:write property="title" /></title> <title><sitemesh:write property="title" /></title>
<%@include file="/WEB-INF/jsp/head-init.jsp"%> <%@include file="/WEB-INF/jsp/head-init.jsp"%>
<meta charset="utf-8"> <meta charset="utf-8">
<%--Locked Compatible Mode for IE--%> <%--Locked Compatible Mode for IE--%>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="description" content=""> <meta name="description" content="">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<link type="text/css" href="/html/css/bootstrap.css" rel="stylesheet" /> <link type="text/css" href="/html/css/bootstrap.css" rel="stylesheet" />
<link type="text/css" href="/html/css/custom.css" rel="stylesheet" /> <link type="text/css" href="/html/css/custom.css" rel="stylesheet" />
<script type="text/javascript" src="/html/js/jquery.min.js"></script> <script type="text/javascript" src="/html/js/jquery.min.js"></script>
<script type="text/javascript" src="/html/js/modernizr-2.6.2.min.js"></script> <script type="text/javascript" src="/html/js/modernizr-2.6.2.min.js"></script>
<script type="text/javascript" src="/html/js/plugins.js"></script> <script type="text/javascript" src="/html/js/plugins.js"></script>
<script type="text/javascript" src="/html/js/jquery.validate.js"></script> <script type="text/javascript" src="/html/js/jquery.validate.js"></script>
<script type="text/javascript" src="/html/js/custom.js"></script> <script type="text/javascript" src="/html/js/custom.js"></script>
<link type="text/css" href="/html/css/jquery-ui.css" rel="stylesheet"/> <link type="text/css" href="/html/css/jquery-ui.css" rel="stylesheet" />
<link type="text/css" href="/html/css/jquery.dataTables.css" rel="stylesheet"/> <link type="text/css" href="/html/css/jquery.dataTables.css" rel="stylesheet" />
<%--Fallback for older browsers--%> <%--Fallback for older browsers--%>
<script type="text/javascript" src="/html/js/json2.js"></script> <script type="text/javascript" src="/html/js/json2.js"></script>
<script type="text/javascript" src="/html/js/globalize.js"></script> <script type="text/javascript" src="/html/js/globalize.js"></script>
<script type="text/javascript" src="/html/js/jquery-ui.min.js"></script> <script type="text/javascript" src="/html/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="/html/js/jquery.dataTables.js"></script> <script type="text/javascript" src="/html/js/jquery.dataTables.js"></script>
<script type="text/javascript" src="/html/js/handlebars.js"></script> <script type="text/javascript" src="/html/js/handlebars.js"></script>
<script type="text/javascript" src="/html/js/bootstrap.min.js"></script> <script type="text/javascript" src="/html/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/html/js/main.js"></script> <script type="text/javascript" src="/html/js/main.js"></script>
<sitemesh:write property="head" /> <sitemesh:write property="head" />
</head> </head>
<body> <body>
<sec:authentication var="user" property="principal" /> <sec:authentication var="user" property="principal" />
<div class="container"> <div class="container">
<div id="header"> <div id="header">
<div class="page-header clearfix"> <div class="clearfix">
<div class="pull-left"><a href="<c:url value="/" />"><img src="<c:url value="/html/images/logo.png" />" /></a></div> <div class="pull-left">
<!-- <h4 class="pull-left"><spring:message code="sample.message.welcome"/></h4> --> <a href="<c:url value="/" />"><img style="" src="<c:url value="/html/images/logo2.png" />" /></a>
</div>
<div class="navbar pull-right"> <!-- <h4 class="pull-left"><spring:message code="sample.message.welcome"/></h4> -->
<div class="nav-collapse">
<ul class="nav">
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" title="<spring:message code="sample.message.change.locale"/>">
<spring:message code="sample.message.current.locale"/>
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="?lang=en"><spring:message code="sample.message.locale.en"/></a></li>
<li><a href="?lang=ru"><spring:message code="sample.message.locale.ru"/></a></li>
</ul>
</li>
</ul>
</div>
</div>
<sec:authorize access="isAuthenticated()">
<div class="navbar pull-right"> <div class="navbar pull-right">
<ul class="nav"> <div class="nav-collapse">
<li class="dropdown"> <ul class="nav">
<a class="dropdown-toggle" data-toggle="dropdown" title="<spring:message code="sample.message.change.locale"/>"> <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" title="<spring:message code="sample.message.change.locale"/>"> <spring:message code="sample.message.current.locale" /> <b class="caret"></b>
You are <b>${user.username}</b> </a>
<b class="caret"></b> <ul class="dropdown-menu">
</a> <li><a href="?lang=en"><spring:message code="sample.message.locale.en" /></a></li>
<ul class="dropdown-menu"> <li><a href="?lang=ru"><spring:message code="sample.message.locale.ru" /></a></li>
<li><a href="<c:url value="/profile" />"><spring:message code="user.pulldown.profile"/></a></li> </ul></li>
<li><a href="<c:url value="/logout" />"><spring:message code="user.pulldown.logout"/></a></li> </ul>
</ul> </div>
</li>
</ul>
</div> </div>
</sec:authorize>
</div>
</div>
<div id="content"> <sec:authorize access="isAuthenticated()">
<div class="page-header"> <div class="navbar pull-right">
<a href="<c:url value="/" />">Home</a> <ul class="nav">
<a href="<c:url value="/data/" />">Datasets</a> <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" title="<spring:message code="sample.message.change.locale"/>"> You are <b>${user.username}</b> <b class="caret"></b>
<a href="<c:url value="/geo/" />">Countries</a> </a>
<a href="<c:url value="/wiews/active" />">Institutes</a> <ul class="dropdown-menu">
</div> <li><a href="<c:url value="/profile" />"><spring:message code="user.pulldown.profile" /></a></li>
<li><a href="<c:url value="/logout" />"><spring:message code="user.pulldown.logout" /></a></li>
</ul></li>
</ul>
</div>
</sec:authorize>
</div>
</div>
<div id="dialog"></div> <div id="nav-main" class="clearfix">
<ul>
<li><a href="<c:url value="/" />">Home</a></li>
<li><a href="<c:url value="/data/" />">Datasets</a></li>
<li><a href="<c:url value="/geo/" />">Countries</a></li>
<li><a href="<c:url value="/wiews/active" />">Institutes</a></li>
</ul>
</div>
<div id="content" class="clearfix">
<sitemesh:write property="body" /> <div id="dialog"></div>
<!-- Processing time: <div class="content-block clearfix">
<sitemesh:write property="body" />
</div>
<!-- Processing time:
<div class="footer clearfix" style="font-size: 80%"><spring:message code="page.rendertime" arguments="${springExecuteTime}" /></div> <div class="footer clearfix" style="font-size: 80%"><spring:message code="page.rendertime" arguments="${springExecuteTime}" /></div>
--> -->
</div>
<div id="footer" class="clearfix">
<div id="nav-foot" class="clearfix">
<div class="pull-left">
<ul>
<li><a href="<c:url value="/" />">About</a></li>
<li><a href="<c:url value="/" />">Contact</a></li>
<li><a href="<c:url value="/" />">Disclaimer</a></li>
<li><a href="<c:url value="/" />">Feedback</a></li>
<li><a href="<c:url value="/" />">Help</a></li>
</ul>
</div>
<div class="pull-right">
<ul>
<li><a href="<c:url value="/" />">Terms and Conditions of Use</a></li>
<li><a href="<c:url value="/" />">Copyright Policy</a></li>
<li><a href="<c:url value="/" />">Privacy Policy</a></li>
</ul>
</div>
</div>
<div class="clearfix" id="copyright">
<div class="pull-left">
<a href="<c:url value="/" />"><img style="height: 2em; vertical-align: middle; position: relative; top: -0.3em" src="<c:url value="/html/images/logo2small.png" />" /></a>
<spring:message code="footer.copyright-statement" />
</div>
</div>
</div>
</div> </div>
</div>
</body> </body>
</html> </html>
...@@ -83,6 +83,7 @@ ...@@ -83,6 +83,7 @@
<div> <div>
<c:out value="${method.decode(val.value)}" /> <c:out value="${method.decode(val.value)}" />
<span class="uom"><c:out value="${method.unit}" /></span> <span class="uom"><c:out value="${method.unit}" /></span>
<sup><a href="#metadata-${val.experimentId}"><c:out value="${val.experimentId}" /></a></sup>
</div> </div>
</c:forEach></td> </c:forEach></td>
<td><c:out value="${method.method}" /></td> <td><c:out value="${method.method}" /></td>
...@@ -93,11 +94,12 @@ ...@@ -93,11 +94,12 @@
</c:if> </c:if>
<c:if test="${metadatas.size() gt 0}"> <c:if test="${metadatas.size() gt 0}">
<h2> <h3>
<spring:message code="accession.metadatas" /> <spring:message code="accession.metadatas" />
</h2> </h3>
<c:forEach items="${metadatas}" var="metadata" varStatus="status"> <c:forEach items="${metadatas}" var="metadata" varStatus="status">
<div> <div class="targeted" id="metadata-${metadata.id}">
<sup><c:out value="${metadata.id}" /></sup>
<a href="<c:url value="/data/view/${metadata.id}" />"><c:out value="${metadata.title}" /></a> <a href="<c:url value="/data/view/${metadata.id}" />"><c:out value="${metadata.title}" /></a>
<c:out value="${metadata.institute}" /> <c:out value="${metadata.institute}" />
</div> </div>
......
...@@ -32,6 +32,7 @@ ...@@ -32,6 +32,7 @@
<table> <table>
<thead> <thead>
<tr> <tr>
<td class="idx-col"></td>
<td><spring:message code="accession.accessionName" /></td> <td><spring:message code="accession.accessionName" /></td>
<td><spring:message code="accession.origin" /></td> <td><spring:message code="accession.origin" /></td>
<td><spring:message code="accession.taxonomy" /></td> <td><spring:message code="accession.taxonomy" /></td>
...@@ -41,7 +42,8 @@ ...@@ -41,7 +42,8 @@
</thead> </thead>
<tbody> <tbody>
<c:forEach items="${accessions.content}" var="accession" varStatus="status"> <c:forEach items="${accessions.content}" var="accession" varStatus="status">
<tr> <tr class="${status.count % 2 == 0 ? 'even' : 'odd'}">
<td class="idx-col">${status.count + accessions.size * accessions.number}</td>
<td><a href="<c:url value="/acn/id/${accession.id}" />"><b><c:out value="${accession.accessionName}" /></b></a></td> <td><a href="<c:url value="/acn/id/${accession.id}" />"><b><c:out value="${accession.accessionName}" /></b></a></td>
<td><c:out value="${country.name}" /></td> <td><c:out value="${country.name}" /></td>
<td><c:out value="${accession.taxonomy.taxonName}" /></td> <td><c:out value="${accession.taxonomy.taxonName}" /></td>
......
...@@ -7,15 +7,34 @@ ...@@ -7,15 +7,34 @@
<title><spring:message code="country.page.list.title" /></title> <title><spring:message code="country.page.list.title" /></title>
</head> </head>
<body> <body>
<h1><spring:message code="country.page.list.title" /></h1> <h1>
<spring:message code="country.page.list.title" />
</h1>
<div id="letter-top" class="page-header">
<c:set value="" var="hoofdleter" />
<c:forEach items="${countries}" var="country" varStatus="status">
<c:if test="${hoofdleter ne country.name.substring(0, 1)}">
<c:set var="hoofdleter" value="${country.name.substring(0, 1)}" />
<a class="letter-pointer" href="#letter-${hoofdleter}"><c:out value="${hoofdleter}" /></a>
</c:if>
</c:forEach>
</div>
<c:set value="" var="hoofdleter" />
<ul> <ul>
<c:forEach items="${countries}" var="country" varStatus="status"> <c:forEach items="${countries}" var="country" varStatus="status">
<li><a href="<c:url value="/geo/${country.code3.toLowerCase()}" />"><c:out value="${country.name}" /></a> <c:if test="${hoofdleter ne country.name.substring(0, 1)}">
<c:if test="${not country.current}">(Historic entry)</c:if> <c:set var="hoofdleter" value="${country.name.substring(0, 1)}" />
</li> <li id="letter-${hoofdleter}" class="hoofdleter"><c:out value="${hoofdleter}" />
<small><a href="#letter-top">Back to top</a></small>
</li>
</c:if>
<li><a href="<c:url value="/geo/${country.code3.toLowerCase()}" />"><c:out value="${country.name}" /></a> <c:if test="${not country.current}">(Historic entry)</c:if></li>
</c:forEach> </c:forEach>
</ul> </ul>
<c:remove var="hoofdleter" />
</body> </body>
</html> </html>
\ No newline at end of file
...@@ -8,19 +8,20 @@ ...@@ -8,19 +8,20 @@
</head> </head>
<body> <body>
<c:if test="${cropList ne null and cropList.size() gt 0}">
<div class="pull-left" style="width: 20%; margin-right: 5%;"> <div class="pull-left" style="width: 20%; margin-right: 5%;">
<p>Hello</p>
<c:if test="${cropList ne null and cropList.size() gt 0}">
<h3><spring:message code="crop.croplist"/></h3> <h3><spring:message code="crop.croplist"/></h3>
<ul> <ul>
<c:forEach items="${cropList}" var="crop" varStatus="status"> <c:forEach items="${cropList}" var="crop" varStatus="status">
<li><a href="/c/${crop.shortName}"><c:out value="${crop.name}" /></a></li> <li><a href="/c/${crop.shortName}"><c:out value="${crop.name}" /></a></li>
</c:forEach> </c:forEach>
</ul> </ul>
</div>
</c:if> </c:if>
</div>
<c:if test="${lastNews ne null}"> <c:if test="${lastNews ne null}">
<div class="pull-left" style="width: 70%; margin-left: 5%"> <div class="pull-left" style="width: 65%; margin-left: 5%">
<h3><spring:message code="activity.recent-activity"/></h3> <h3><spring:message code="activity.recent-activity"/></h3>
<c:forEach items="${lastNews}" var="activityPost" varStatus="status"> <c:forEach items="${lastNews}" var="activityPost" varStatus="status">
<div class="activity-post"> <div class="activity-post">
......
...@@ -8,9 +8,10 @@ ...@@ -8,9 +8,10 @@
</head> </head>
<body> <body>
<h3> <h3>
<a href="/data/view/${metadata.id}"><c:out value="${metadata.title}" /></a> <c:out value="${metadata.title}" />
</h3> </h3>
<c:if test="${page eq 1}">
<table> <table>
<tbody> <tbody>
<c:forEach items="${methods}" var="method"> <c:forEach items="${methods}" var="method">
...@@ -41,16 +42,22 @@ ...@@ -41,16 +42,22 @@
</div> </div>
<h3>Accessions</h3> <h3>Observations</h3>
</c:if>
<div class="nav-header"> <div class="nav-header">
<spring:message code="paged.totalElements" arguments="${accessions.totalElements}" />
<br />
<spring:message code="paged.pageOfPages" arguments="${accessions.number+1},${accessions.totalPages}" /> <spring:message code="paged.pageOfPages" arguments="${accessions.number+1},${accessions.totalPages}" />
<a href="?page=${accessions.number}">⇇ Previous</a> <a href="?page=${accessions.number + 2}">Next ⇉</a> <a href="?page=${accessions.number}">⇇ Previous</a>
<a href="?page=${accessions.number + 2}">Next ⇉</a>
</div> </div>
<table> <table>
<thead> <thead>
<tr> <tr>
<td class="idx-col"></td>
<td><spring:message code="accession.accessionName" /></td> <td><spring:message code="accession.accessionName" /></td>
<%-- <td><spring:message code="accession.origin" /></td> <%-- <td><spring:message code="accession.origin" /></td>
--%> <td><spring:message code="accession.taxonomy" /></td> --%> <td><spring:message code="accession.taxonomy" /></td>
...@@ -70,7 +77,8 @@ ...@@ -70,7 +77,8 @@
</thead> </thead>
<tbody> <tbody>
<c:forEach items="${accessions.content}" var="accession" varStatus="status"> <c:forEach items="${accessions.content}" var="accession" varStatus="status">
<tr> <tr class="${status.count % 2 == 0 ? 'even' : 'odd'}">
<td class="idx-col">${status.count + accessions.size * accessions.number}</td>
<td><a href="<c:url value="/acn/id/${accession.id}" />"><b><c:out value="${accession.accessionName}" /></b></a></td> <td><a href="<c:url value="/acn/id/${accession.id}" />"><b><c:out value="${accession.accessionName}" /></b></a></td>
<%-- <td><a href="<c:url value="/geo/${accession.origin.toLowerCase()}" />"><c:out value="${accession.countryOfOrigin.name}" /></a></td> <%-- <td><a href="<c:url value="/geo/${accession.origin.toLowerCase()}" />"><c:out value="${accession.countryOfOrigin.name}" /></a></td>
--%> <td><c:out value="${accession.taxonomy.taxonName}" /></td> --%> <td><c:out value="${accession.taxonomy.taxonName}" /></td>
......
...@@ -10,14 +10,14 @@ ...@@ -10,14 +10,14 @@
<h1> <h1>
<spring:message code="faoInstitute.accessions.at" arguments="${faoInstitute.fullName}" argumentSeparator="||," /> <spring:message code="faoInstitute.accessions.at" arguments="${faoInstitute.fullName}" argumentSeparator="||," />
</h1> </h1>
<div>
<spring:message code="accessions.number" arguments="${accessions.totalElements}" /> <%-- <div>
</div>
<div>
<a href="<c:url value="/geo/${faoInstitute.country.code3.toLowerCase()}" />"><c:out value="${faoInstitute.country.name}" /></a> <a href="<c:url value="/geo/${faoInstitute.country.code3.toLowerCase()}" />"><c:out value="${faoInstitute.country.name}" /></a>
</div> </div> --%>
<div class="nav-header"> <div class="nav-header">
<spring:message code="accessions.number" arguments="${accessions.totalElements}" />
<br />
<spring:message code="paged.pageOfPages" arguments="${accessions.number+1},${accessions.totalPages}" /> <spring:message code="paged.pageOfPages" arguments="${accessions.number+1},${accessions.totalPages}" />
<a href="?page=${accessions.number}">⇇ Previous</a> <a href="?page=${accessions.number}">⇇ Previous</a>
<a href="?page=${accessions.number + 2}">Next ⇉</a> <a href="?page=${accessions.number + 2}">Next ⇉</a>
...@@ -26,6 +26,7 @@ ...@@ -26,6 +26,7 @@
<table> <table>
<thead> <thead>
<tr> <tr>
<td class="idx-col"></td>
<td><spring:message code="accession.accessionName" /></td> <td><spring:message code="accession.accessionName" /></td>
<td><spring:message code="accession.origin" /></td> <td><spring:message code="accession.origin" /></td>
<td><spring:message code="accession.taxonomy" /></td> <td><spring:message code="accession.taxonomy" /></td>
...@@ -35,7 +36,8 @@ ...@@ -35,7 +36,8 @@
</thead> </thead>
<tbody> <tbody>
<c:forEach items="${accessions.content}" var="accession" varStatus="status"> <c:forEach items="${accessions.content}" var="accession" varStatus="status">
<tr> <tr class="${status.count % 2 == 0 ? 'even' : 'odd'}">
<td class="idx-col">${status.count + accessions.size * accessions.number}</td>
<td><a href="<c:url value="/acn/id/${accession.id}" />"><b><c:out value="${accession.accessionName}" /></b></a></td> <td><a href="<c:url value="/acn/id/${accession.id}" />"><b><c:out value="${accession.accessionName}" /></b></a></td>
<td><a href="<c:url value="/geo/${accession.origin.toLowerCase()}" />"><c:out value="${accession.countryOfOrigin.name}" /></a></td> <td><a href="<c:url value="/geo/${accession.origin.toLowerCase()}" />"><c:out value="${accession.countryOfOrigin.name}" /></a></td>
<td><c:out value="${accession.taxonomy.taxonName}" /></td> <td><c:out value="${accession.taxonomy.taxonName}" /></td>
......
...@@ -18,7 +18,13 @@ ...@@ -18,7 +18,13 @@
<div><a href="<c:url value="/wiews/active" />"><spring:message code="faoInstitutes.viewActiveOnly" /></a></div> <div><a href="<c:url value="/wiews/active" />"><spring:message code="faoInstitutes.viewActiveOnly" /></a></div>
</c:if> </c:if>
<div class="nav-header"><a href="?page=${faoInstitutes.number}">⇇ Previous</a> <a href="?page=${faoInstitutes.number + 2}">Next ⇉</a></div> <div class="nav-header">
<spring:message code="paged.totalElements" arguments="${faoInstitutes.totalElements}" />
<br />
<spring:message code="paged.pageOfPages" arguments="${faoInstitutes.number+1},${faoInstitutes.totalPages}" />
<a href="?page=${faoInstitutes.number}">⇇ Previous</a>
<a href="?page=${faoInstitutes.number + 2}">Next ⇉</a>
</div>
<ul> <ul>
<c:forEach items="${faoInstitutes.content}" var="faoInstitute" varStatus="status"> <c:forEach items="${faoInstitutes.content}" var="faoInstitute" varStatus="status">
......
.genesys-bg {
background-color: #88ba41;
}
.alert.alert-info.inline { .alert.alert-info.inline {
display: inline-block; display: inline-block;
padding: 4px 8px 4px 2px; padding: 4px 8px 4px 2px;
...@@ -12,6 +16,10 @@ ...@@ -12,6 +16,10 @@
font-size: 15px; font-size: 15px;
} }
.nav-header {
padding: 1em 0;
}
#invite-list .btn{ #invite-list .btn{
padding: 2px 5px; padding: 2px 5px;
} }
...@@ -25,6 +33,7 @@ table { ...@@ -25,6 +33,7 @@ table {
font-size: 12px; font-size: 12px;
} }
table thead td { table thead td {
font-size: 15px; font-size: 15px;
font-weight: normal; font-weight: normal;
...@@ -34,11 +43,30 @@ table thead td { ...@@ -34,11 +43,30 @@ table thead td {
h1, h2, h3, h4 { h1, h2, h3, h4 {
} }
h1 {
font-size: 30px;
}
td { td {
vertical-align: top; vertical-align: top;
padding: 0.2em 0.5em; padding: 0.2em 0.5em;
}