Ajaxify accession selection

src/main/java/org/crophub/rest/servlet/controller/CountryController.java

@@ -23,6 +23,7 @@ import org.crophub.rest.common.service.GeoService;
 import org.crophub.rest.common.service.InstituteService;
 import org.crophub.spring.ResourceNotFoundException;
 import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.context.annotation.Scope;
 import org.springframework.data.domain.PageRequest;
 import org.springframework.data.domain.Sort;
 import org.springframework.stereotype.Controller;
@@ -32,9 +33,13 @@ import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RequestParam;
 
 @Controller
+@Scope("request")
 @RequestMapping("/geo")
 public class CountryController extends BaseController {
 
+	@Autowired
+	private SelectionBean selectionBean;
+	
 	@Autowired
 	private GeoService geoService;
 	
@@ -82,6 +87,8 @@ public class CountryController extends BaseController {
 		model.addAttribute("country", country);
 		model.addAttribute("accessions", genesysService.listAccessionsByOrigin(country, new PageRequest(page - 1, 50, new Sort("accessionName"))));
 
+		model.addAttribute("selection", selectionBean);
+		
 		return "/country/data";
 	}
 }

src/main/java/org/crophub/rest/servlet/controller/CropController.java

@@ -25,6 +25,7 @@ import org.crophub.rest.common.service.CropService;
 import org.crophub.rest.common.service.GenesysService;
 import org.crophub.spring.ResourceNotFoundException;
 import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.context.annotation.Scope;
 import org.springframework.data.domain.Page;
 import org.springframework.data.domain.PageRequest;
 import org.springframework.data.domain.Sort;
@@ -36,9 +37,13 @@ import org.springframework.web.bind.annotation.RequestMethod;
 import org.springframework.web.bind.annotation.RequestParam;
 
 @Controller
+@Scope("request")
 @RequestMapping("/c")
 public class CropController extends BaseController {
 
+	@Autowired
+	private SelectionBean selectionBean;
+	
 	@Autowired
 	private CropService cropService;
 
@@ -83,6 +88,8 @@ public class CropController extends BaseController {
 		_logger.info("Got: " + accessions);
 		model.addAttribute("accessions", accessions);
 
+		model.addAttribute("selection", selectionBean);
+		
 		return "/accession/data";
 	}
 }

src/main/java/org/crophub/rest/servlet/controller/DatasetController.java

@@ -21,6 +21,7 @@ import org.crophub.rest.common.model.genesys.Metadata;
 import org.crophub.rest.common.service.GenesysService;
 import org.crophub.spring.ResourceNotFoundException;
 import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.context.annotation.Scope;
 import org.springframework.data.domain.Page;
 import org.springframework.data.domain.PageRequest;
 import org.springframework.stereotype.Controller;
@@ -34,9 +35,13 @@ import org.springframework.web.bind.annotation.RequestParam;
  * Controller which simply handles *.html requests
  */
 @Controller
+@Scope("request")
 @RequestMapping("/data")
 public class DatasetController extends BaseController {
 
+	@Autowired
+	private SelectionBean selectionBean;
+	
 	@Autowired
 	private GenesysService genesysService;
 
@@ -66,6 +71,8 @@ public class DatasetController extends BaseController {
 		// Map[accession.id][method.id]
 		model.addAttribute("accessionMethods", genesysService.getMetadataTraitValues(metadata, accessions.getContent()));
 
+		model.addAttribute("selection", selectionBean);
+		
 		return "/metadata/view";
 	}
 

src/main/java/org/crophub/rest/servlet/controller/SelectionController.java

@@ -48,6 +48,8 @@ public class SelectionController extends BaseController {
 
 		model.addAttribute("accessions", genesysService.listAccessions(selectionBean.copy(), new PageRequest(page - 1, 50, new Sort("accessionName"))));
 
+		model.addAttribute("selection", selectionBean);
+
 		return "/selection/index";
 	}
 
@@ -88,26 +90,26 @@ public class SelectionController extends BaseController {
 
 	@RequestMapping(value = "json", method = RequestMethod.POST, consumes = { MediaType.APPLICATION_JSON_VALUE })
 	@ResponseBody
-	public SelectionJsonResponse jsonOp(@RequestBody SelectionJsonAction action) {
+	public JsonResponse jsonOp(@RequestBody JsonAction action) {
 		_logger.info("Selection action " + action.action + ": " + action.id);
-		SelectionJsonResponse resp=new SelectionJsonResponse();
+		JsonResponse resp = new JsonResponse();
 		if ("add".equals(action.action)) {
 			selectionBean.add(action.id);
-			resp.included=true;
+			resp.included = true;
 		} else {
 			selectionBean.remove(action.id);
-			resp.included=false;
+			resp.included = false;
 		}
-		resp.count=selectionBean.size();
+		resp.count = selectionBean.size();
 		return resp;
 	}
 
-	public static class SelectionJsonAction {
+	public static class JsonAction {
 		public long id;
 		public String action;
 	}
 
-	public static class SelectionJsonResponse {
+	public static class JsonResponse {
 		public int count;
 		public boolean included;
 	}

src/main/java/org/crophub/rest/servlet/controller/WiewsController.java

@@ -27,6 +27,7 @@ import org.crophub.rest.common.service.InstituteService;
 import org.crophub.rest.common.service.TaxonomyService;
 import org.crophub.spring.ResourceNotFoundException;
 import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.context.annotation.Scope;
 import org.springframework.data.domain.Page;
 import org.springframework.data.domain.PageRequest;
 import org.springframework.data.domain.Sort;
@@ -37,9 +38,13 @@ import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RequestParam;
 
 @Controller
+@Scope("request")
 @RequestMapping("/wiews")
 public class WiewsController extends BaseController {
 
+	@Autowired
+	private SelectionBean selectionBean;
+	
 	@Autowired
 	private InstituteService instituteService;
 
@@ -93,6 +98,8 @@ public class WiewsController extends BaseController {
 		_logger.info("Got: " + accessions);
 		model.addAttribute("accessions", accessions);
 
+		model.addAttribute("selection", selectionBean);
+		
 		return "/wiews/data";
 	}
 
@@ -120,6 +127,8 @@ public class WiewsController extends BaseController {
 		_logger.info("Got: " + accessions);
 		model.addAttribute("accessions", accessions);
 
+		model.addAttribute("selection", selectionBean);
+		
 		return "/wiews/data";
 	}
 

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

@@ -99,7 +99,7 @@
 				<li><a href="<c:url value="/data/" />"><spring:message code="menu.datasets" /></a></li>
 				<li><a href="<c:url value="/geo/" />"><spring:message code="menu.countries" /></a></li>
 				<li><a href="<c:url value="/wiews/active" />"><spring:message code="menu.institutes" /></a></li>
-				<li><a href="<c:url value="/sel/" />"><spring:message code="menu.my-list" /><div id="selcounter" /></a></li>
+				<li><a href="<c:url value="/sel/" />"><spring:message code="menu.my-list" /><div id="selcounter">${selection.size() gt 0 ? selection.size() : ''}</div></a></li>
 			</ul>
 		</div>
 

src/main/webapp/WEB-INF/jsp/accession/data.jsp

@@ -58,7 +58,7 @@
 				<tr class="acn ${status.count % 2 == 0 ? 'even' : 'odd'}">
 					<td class="idx-col">${status.count + accessions.size * accessions.number}</td>
 					<c:if test="${selection ne null}">
-					<td><div class="sel ${selection.containsId(accession.id) ? 'picked' : ''}" x-aid="${accession.id}"></div></td>
+					<td class="sel ${selection.containsId(accession.id) ? 'picked' : ''}" x-aid="${accession.id}"></td>
 					</c:if>
 					<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>

src/main/webapp/WEB-INF/jsp/accession/details.jsp

@@ -12,8 +12,11 @@
 		<small><c:out value="${accession.instituteCode}" /></small>
 	</h1>
 
-	<div class="page-header">
-		<a href="<c:url value="/sel/add/${accession.id}" />"><spring:message code="selection.add" arguments="${accession.accessionName}" /></a>
+	<div class="page-header acn">
+		<div class="sel ${selection.containsId(accession.id) ? 'picked' : ''}" x-aid="${accession.id}">
+			<a class="add" href="<c:url value="/sel/add/${accession.id}" />"><spring:message code="selection.add" arguments="${accession.accessionName}" /></a>
+			<a class="remove" href="<c:url value="/sel/remove/${accession.id}" />"><spring:message code="selection.remove" arguments="${accession.accessionName}" /></a>
+		</div>
 	</div>
 
 	<c:if test="${accession.inTrust eq true}">

src/main/webapp/WEB-INF/jsp/country/data.jsp

@@ -29,10 +29,13 @@
 		<a href="?page=${accessions.number + 2}">Next ⇉</a>
 	</div>
 
-	<table>
+	<table class="accessions">
 		<thead>
 			<tr>
 				<td class="idx-col"></td>
+				<c:if test="${selection ne null}">
+				<td />
+				</c:if>
 				<td><spring:message code="accession.accessionName" /></td>
 				<td><spring:message code="accession.origin" /></td>
 				<td><spring:message code="accession.taxonomy" /></td>
@@ -42,8 +45,11 @@
 		</thead>
 		<tbody>
 			<c:forEach items="${accessions.content}" var="accession" varStatus="status">
-				<tr class="${status.count % 2 == 0 ? 'even' : 'odd'}">
+				<tr class="acn ${status.count % 2 == 0 ? 'even' : 'odd'}">
 					<td class="idx-col">${status.count + accessions.size * accessions.number}</td>
+					<c:if test="${selection ne null}">
+					<td class="sel ${selection.containsId(accession.id) ? 'picked' : ''}" x-aid="${accession.id}"></td>
+					</c:if>
 					<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="${accession.taxonomy.taxonName}" /></td>

src/main/webapp/WEB-INF/jsp/metadata/view.jsp

@@ -54,10 +54,13 @@
 	</div>
 
 
-	<table>
+	<table class="accessions">
 		<thead>
 			<tr>
 				<td class="idx-col"></td>
+				<c:if test="${selection ne null}">
+				<td />
+				</c:if>
 				<td><spring:message code="accession.accessionName" /></td>
 		<%-- 		<td><spring:message code="accession.origin" /></td>
 		 --%>		<td><spring:message code="accession.taxonomy" /></td>
@@ -77,8 +80,11 @@
 		</thead>
 		<tbody>
 			<c:forEach items="${accessions.content}" var="accession" varStatus="status">
-				<tr class="${status.count % 2 == 0 ? 'even' : 'odd'}">
+				<tr class="acn ${status.count % 2 == 0 ? 'even' : 'odd'}">
 					<td class="idx-col">${status.count + accessions.size * accessions.number}</td>
+					<c:if test="${selection ne null}">
+					<td class="sel ${selection.containsId(accession.id) ? 'picked' : ''}" x-aid="${accession.id}"></td>
+					</c:if>
 					<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><c:out value="${accession.taxonomy.taxonName}" /></td>

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

@@ -29,10 +29,13 @@
 			<a href="?page=${accessions.number}">⇇ Previous</a> <a href="?page=${accessions.number + 2}">Next ⇉</a>
 		</div>
 
-		<table>
+		<table class="accessions">
 			<thead>
 				<tr>
 					<td class="idx-col"></td>
+					<c:if test="${selection ne null}">
+					<td />
+					</c:if>
 					<td><spring:message code="accession.accessionName" /></td>
 					<td><spring:message code="accession.origin" /></td>
 					<td><spring:message code="accession.taxonomy" /></td>
@@ -43,8 +46,11 @@
 			</thead>
 			<tbody>
 				<c:forEach items="${accessions.content}" var="accession" varStatus="status">
-					<tr id="a${accession.id}" class="targeted ${status.count % 2 == 0 ? 'even' : 'odd'}">
+					<tr id="a${accession.id}" class="acn targeted ${status.count % 2 == 0 ? 'even' : 'odd'}">
 						<td class="idx-col">${status.count + accessions.size * accessions.number}</td>
+						<c:if test="${selection ne null}">
+						<td class="sel ${selection.containsId(accession.id) ? 'picked' : ''}" x-aid="${accession.id}"></td>
+						</c:if>
 						<td><a href="<c:url value="/acn/id/${accession.id}" />"><b><c:out value="${accession.accessionName}" /></b></a></td>
 						<td><c:out value="${accession.countryOfOrigin.name}" /></td>
 						<td><c:out value="${accession.taxonomy.taxonName}" /></td>

src/main/webapp/WEB-INF/jsp/wiews/data.jsp

@@ -30,10 +30,13 @@
 		<a href="?page=${accessions.number + 2}">Next ⇉</a>
 	</div>
 
-	<table>
+	<table class="accessions">
 		<thead>
 			<tr>
 				<td class="idx-col"></td>
+				<c:if test="${selection ne null}">
+				<td />
+				</c:if>
 				<td><spring:message code="accession.accessionName" /></td>
 				<td><spring:message code="accession.origin" /></td>
 				<td><spring:message code="accession.taxonomy" /></td>
@@ -43,8 +46,11 @@
 		</thead>
 		<tbody>
 			<c:forEach items="${accessions.content}" var="accession" varStatus="status">
-				<tr class="${status.count % 2 == 0 ? 'even' : 'odd'}">
+				<tr class="acn ${status.count % 2 == 0 ? 'even' : 'odd'}">
 					<td class="idx-col">${status.count + accessions.size * accessions.number}</td>
+					<c:if test="${selection ne null}">
+					<td class="sel ${selection.containsId(accession.id) ? 'picked' : ''}" x-aid="${accession.id}"></td>
+					</c:if>
 					<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><c:out value="${accession.taxonomy.taxonName}" /></td>

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

@@ -143,7 +143,7 @@ body {
 	background-color: White;
 }
 
-.content-block *:FIRST-CHILD {
+.content-block > *:FIRST-CHILD {
  	margin-top: 0;
 	padding-top: 0;
 }
@@ -228,17 +228,28 @@ ul.statistics .stats-number {
 }
 
 
-.acn .sel {
+tr.acn .sel {
 	background-image: url("../images/sel-add2.png");
 	background-repeat: no-repeat;
-	background-position: 0 2px;
-	width: 14px;
-	height: 14px;
+	background-position: left center;
+	width: 1em;
 }
-.acn .sel.picked {
+
+tr.acn .sel.picked {
 	background-image: url("../images/sel-remove2.png");
 }
 
+.acn .sel a.remove {
+	display: none;
+}
+
+.acn .sel.picked a.remove {
+	display: inline;
+}
+.acn .sel.picked a.add {
+	display: none;
+}
+
 #selcounter {
 	float: right;
 	font-size: 70%;

src/main/webapp/html/js/crophub.js

 jQuery(document).ready(function() {
 
-	$("body").on("click", ".accessions .sel[x-aid]", function() {
+	$("body").on("click", ".acn .sel[x-aid]", function(event) {
+		event.preventDefault();
 		var foo = $(this);
 		var aid = foo.attr('x-aid');
 		var action=foo.hasClass('picked') ? 'remove' : 'add';
-
+		
 		$.ajax({
 			url : "/sel/json",
 			type : "POST",
@@ -14,13 +15,15 @@ jQuery(document).ready(function() {
 				"action" : action,
 				"id" : aid
 			}),
-			success : function(data) {
-				console.log(data);
-				if (data.included) {
+			beforeSend: function() {
+				if (action=='add') {
 					foo.addClass('picked');
 				} else {
 					foo.removeClass('picked');
 				}
+			},
+			success : function(data) {
+				console.log(data);
 				var sc=$("#selcounter");
 				if (data.count==0) {
 					sc.hide();
@@ -30,6 +33,11 @@ jQuery(document).ready(function() {
 				}
 			},
 			error : function(error) {
+				if (action=='add') {
+					foo.removeClass('picked');
+				} else {
+					foo.addClass('picked');
+				}
 				console.log("Error:");
 				console.log(error);
 			}