--- a/src/main/webapp/pages/topicPage.jsp	Fri Dec 18 11:50:24 2015 +0100
+++ b/src/main/webapp/pages/topicPage.jsp	Wed Dec 23 16:03:32 2015 +0100
@@ -3,6 +3,7 @@
 <%@page import="de.mpiwg.gazetteer.bo.LGBranch"%>
 <%@page import="org.apache.commons.lang.StringUtils"%>
 <%@page import="de.mpiwg.gazetteer.db.DBSection"%>
+<%@page import="de.mpiwg.gazetteer.db.DBBook"%>
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
 <jsp:useBean id="sessionBean" class="de.mpiwg.web.jsp.SessionBean" scope="session" />
 
@@ -12,9 +13,19 @@
 	<jsp:include page="../componentes/headContent.jsp"/>	
 	
 	<script>
+	
 		  $(function() {
-			  
-			    $( "#dialogDataverse" ).dialog({
+			  $("#showPendingButton").click(function() {  
+				  if($('#pendingBooks').css('display') == 'none'){ 
+					   $('#pendingBooks').show(); 
+					   $("#showPendingButton").text('Hide Missing Books');
+					} else { 
+					   $('#pendingBooks').hide();
+					   $("#showPendingButton").text('Show Missing Books');
+					}
+			  });
+			 
+			  	$( "#dialogDataverse" ).dialog({
 			        autoOpen: false,
 			        modal: true,
 			        width: 600,
@@ -70,10 +81,7 @@
 				sessionBean.getTopicPage().loadTopic(request.getParameter("topicId"));
 			} %>
 			
-			<% if(sessionBean.getTopicPage().getCompleteSectionList().isEmpty()) { %>
-				<label>Task not found!</label>
-				
-			<% } else { %>
+			
 			
 				<div id="dialogAddContributors" title="Select a new Contributors:">
 					<form name="contributorsForm" id="contributorsForm"
@@ -94,7 +102,13 @@
 				
 				<!-- Topic Detail -->
 				<div>
-					<label class="subTitel">Topic "<%=sessionBean.getTopicPage().getTopic().getNameEn() %> (<%=sessionBean.getTopicPage().getTopic().getNameCh()%>)" Details </label>
+					<label class="subTitel">Topic "<%=sessionBean.getTopicPage().getTopic().getNameEn() %> (<%=sessionBean.getTopicPage().getTopic().getNameCh()%>)"</label>
+					<form name="topicForm"
+						action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
+						method="post">
+						<input name="bean" type="hidden" value="topicBean" />
+						<input name="topicId" type="hidden" value="<%=sessionBean.getTopicPage().getTopicId()%>" />
+									
 					
 					<table class="tableComponent">
 						<tr>
@@ -116,17 +130,21 @@
 						<tr>
 							<td><label>Description</label></td>
 							<td>
-								<form name="topicForm"
-									action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
-									method="post">
-									<input name="bean" type="hidden" value="topicBean" />
-									<input name="topicId" type="hidden" value="<%=sessionBean.getTopicPage().getTopicId()%>" />
-									<input type="text" name="description" size="60" maxlength="250" value="<%=sessionBean.getTopicPage().getTopic().getDescription() %>" />
-									<input type="image" alt="edit description" onclick="setAction('updateDescription', 'topicForm');" 
-										src="<%=sessionBean.getApplicationBean().getSaveImage()%>" width="15" height="15"/>	
-								
-								</form>
+								<input type="text" name="description" size="60" maxlength="250" value="<%=sessionBean.getTopicPage().getTopic().getDescription() %>" />
+								<input type="image" alt="edit description" onclick="setAction('updateDescription', 'topicForm');" 
+									src="<%=sessionBean.getApplicationBean().getSaveImage()%>" width="15" height="15"/>	
+						
 							</td>
+						</tr>
+						<tr>
+							<td><label>Searching Keywords(separated by ",")</label></td>
+							<td>
+								<input type="text" name="keywords" size="60" maxlength="250" value="<%=sessionBean.getTopicPage().getTopic().getKeywords() %>" />
+								<input type="image" alt="edit keywords" onclick="setAction('updateKeywords', 'topicForm');" 
+									src="<%=sessionBean.getApplicationBean().getSaveImage()%>" width="15" height="15"/>	
+						
+							</td>
+						</tr>
 						<tr>
 							<td><label>Created</label></td>
 							<td><label><%=sessionBean.getTopicPage().getTopic().getFomattedCreation() %></label></td>
@@ -149,8 +167,6 @@
 												action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
 												method="post">
 												<input name="bean" type="hidden" value="topicBean" />
-												<input name="topicId" type="hidden" value="<%=sessionBean.getTopicPage().getTopicId()%>" />
-						
 												<table style="width: 300px;" class="pageTable">
 													<% for(VDCUser contr : sessionBean.getTopicPage().getContributors()) { %>
 														<tr>
@@ -173,26 +189,79 @@
 							</td>
 						</tr>
 					</table>
+					</form>
 				</div>
 				
 				
+						
+				<div>		
+					<button id="showPendingButton" type="button" class="lgButton" >Show Missing Books</button>
 				
-				<!-- Sections in Topic -->
-				
-				<div>
 					<form name="topicSectionRelationForm"
 						action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
 						method="post">
 						<input name="bean" type="hidden" value="topicBean" />
 						<input name="topicId" type="hidden" value="<%=sessionBean.getTopicPage().getTopicId()%>" />
 						
+						<div id="pendingBooks" style="display:none">
+							<label class="subTitel"><%=sessionBean.getTopicPage().getPendingBookList().size()%> book(s) not in the topic.</label>
+					
+							<div class="tableDiv double-scroll" >
+								<table class="pageTable">
+									<tr>
+										<th><label class="tableTitle">Book Id</label></th>
+										<th><label class="tableTitle">Book Name</label></th>
+										<th><label class="tableTitle">Level 1</label></th>
+										<th><label class="tableTitle">Level 2</label></th>
+										<th><label class="tableTitle">Dynasty</label></th>
+										<th><label class="tableTitle">Period</label></th>
+										<th><label class="tableTitle">Admin Type</label></th>
+										<th><label class="tableTitle">Section Name</label></th>
+										<th><label class="tableTitle">Section Pages</label></th>
+										<th><label class="tableTitle">View Text</label></th>
+										<th><label class="tableTitle">Existing Tasks</label></th>
+										<th><label class="tableTitle">Remove</label></th>
+									</tr>	
+									
+									<!-- TODO pending book list -->
+									<% for(DBBook book : sessionBean.getTopicPage().getPendingBookList() ) { %>
+									<tr>
+										<td>
+											<a href="<%=sessionBean.getApplicationBean().getTocInterfaceUrl()%>/check_sections_details.php?book_id=<%=book.getId() %>&amp;count=100&amp;sessionId=<%= session.getId()%>" target="blank">
+												<%=book.getId() %>
+											</a>	
+										</td>
+										<td><label><%= book.getName() %></label></td>
+										<td class="removedContent"><label><%= book.getLevel1() %></label></td>
+										<td class="removedContent"><label><%= book.getLevel2() %></label></td>
+										<td class="removedContent"><label><%= book.getDynasty() %></label></td>
+										<td class="removedContent"><label><%= book.getPeriod() %></label></td>
+										<td class="removedContent"><label><%= book.getAdmin_type() %></label></td>
+										<td class="removedContent"><label>-</label></td>
+										<td class="removedContent"><label>-</label></td>
+										<td class="removedContent"><label>-</label></td>
+										<td class="removedContent"><label>-</label></td>
+										<td class="removedContent"><label>-</label></td>
+									</tr>
+									
+									<% } %>
+								</table>
+							</div>
+						</div>	
 						
-						<label class="subTitel">Sections in Topic
+						<label class="subTitel"> <%=sessionBean.getTopicPage().getCompleteSectionList().size()%> section(s) in the topic
 							<input type="image"
-								onclick="setAction0('forceLoadTopicSectionRelation', 'topicSectionRelationForm');"
+								onclick="setAction('forceLoadTopicSectionRelation', 'topicSectionRelationForm');"
 								src="<%=sessionBean.getApplicationBean().getRefreshImage()%>" width="20" height="20"/>
 						</label>
-									
+						
+						<!-- Sections in Topic -->
+						<% if(sessionBean.getTopicPage().getCompleteSectionList().isEmpty()) { %>
+							<label>(No section in the topic...)</label>
+						
+						<% } else { %>
+					
+					
 						<div class="tableDiv double-scroll">
 							<table class="pageTable">
 								<tr>
@@ -475,7 +544,7 @@
 									<th><label class="tableTitle">Remove</label></th>
 								</tr>	
 								
-								<% for(DBSection section : sessionBean.getTopicPage().getDisplaySectionList() ) { %>
+								<% for(DBSection section : sessionBean.getTopicPage().getCompleteSectionList() ) { %>
 								<tr>
 									<td>
 										<a href="<%=sessionBean.getApplicationBean().getTocInterfaceUrl()%>/check_sections_details.php?book_id=<%=section.getBook().getId() %>&amp;count=100&amp;sessionId=<%= session.getId()%>" target="blank">
@@ -533,14 +602,18 @@
 											src="<%=sessionBean.getApplicationBean().getDeleteImage()%>"/>
 									</td>
 								</tr>
-								<% } %>				
+								<% } %>	
+													
 							</table>
 						</div>
+								
+						
+														
+						<% } %>
 					</form>
 				</div>
 			
-											
-			<% } %>
+			
 
 		<% } %>