changeset 41:ba9515f22897

new: topic management and adding sections from searching result into topic
author Zoe Hong <zhong@mpiwg-berlin.mpg.de>
date Thu, 17 Dec 2015 13:44:08 +0100
parents 35ed4e650a53
children 815cd86bb9ec
files src/main/java/de/mpiwg/gazetteer/bo/LGTopic.java src/main/java/de/mpiwg/gazetteer/bo/LGTopicSectionRelation.java src/main/java/de/mpiwg/gazetteer/utils/AbstractDataProvider.java src/main/java/de/mpiwg/gazetteer/utils/DBService.java src/main/java/de/mpiwg/gazetteer/utils/DataProvider.java src/main/java/de/mpiwg/web/jsp/ApplicationBean.java src/main/java/de/mpiwg/web/jsp/JSPProxy.java src/main/java/de/mpiwg/web/jsp/SearchPage.java src/main/java/de/mpiwg/web/jsp/SessionBean.java src/main/java/de/mpiwg/web/jsp/TopicListPage.java src/main/java/de/mpiwg/web/jsp/TopicPage.java src/main/java/de/mpiwg/web/search/SortSectionByLevel2.java src/main/resources/hibernate.cfg.xml src/main/webapp/componentes/template.jsp src/main/webapp/methods/addSectionToTopic.jsp src/main/webapp/pages/books.jsp src/main/webapp/pages/branchPage.jsp src/main/webapp/pages/fullTextSearch.jsp src/main/webapp/pages/home.jsp src/main/webapp/pages/search.jsp src/main/webapp/pages/topicList.jsp src/main/webapp/pages/topicPage.jsp src/main/webapp/resources/.DS_Store src/main/webapp/resources/css/style.css src/main/webapp/resources/images/plus.png src/main/webapp/resources/js/proxyMethods.js
diffstat 26 files changed, 3090 insertions(+), 392 deletions(-) [+]
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/main/java/de/mpiwg/gazetteer/bo/LGTopic.java	Thu Dec 17 13:44:08 2015 +0100
@@ -0,0 +1,227 @@
+package de.mpiwg.gazetteer.bo;
+
+import java.io.Serializable;
+import java.sql.SQLException;
+import java.util.ArrayList;
+import java.util.List;
+
+import javax.persistence.Column;
+import javax.persistence.Entity;
+import javax.persistence.Inheritance;
+import javax.persistence.InheritanceType;
+import javax.persistence.Table;
+import javax.persistence.Transient;
+
+import org.json.JSONArray;
+
+import cl.maps.duplex.DuplexKey;
+import de.mpiwg.gazetteer.dataverse.DataverseUtils;
+import de.mpiwg.gazetteer.db.DBBook;
+import de.mpiwg.gazetteer.db.DBSection;
+import de.mpiwg.gazetteer.utils.DBService;
+import de.mpiwg.gazetteer.utils.DataProvider;
+
+
+@Entity
+@Table(name="Topic")
+@Inheritance(strategy=InheritanceType.TABLE_PER_CLASS)
+public class LGTopic extends DBEntry implements Cloneable, Serializable {
+	private static final long serialVersionUID = 7805209462045170778L;
+
+	@Column(name="userId")
+	private Long userId;
+	
+	@Column(name="contributors")
+	private String contributors = "[]";
+	
+	@Column(name="nameEn")
+	private String nameEn;
+	
+	@Column(name="nameCh")
+	private String nameCh;
+	
+	@Column(name="namePinyin")
+	private String namePinyin;
+	
+	@Column(name="description")
+	private String description;
+
+	
+	@Transient
+	private List<Long> contributorsList;
+	
+
+	@Transient
+	private boolean transientDataLoaded = false;
+	
+	
+	
+	public boolean isEmpty() {
+		if (nameEn.equals("") || nameCh.equals("") || namePinyin.equals("") ) {
+			return true;
+		} else {
+			return false;
+		}
+	}
+
+	
+	
+	
+	public boolean isTransientDataLoaded() {
+		return transientDataLoaded;
+	}
+
+
+
+	public Object clone() throws CloneNotSupportedException {
+		 LGTopic clone = (LGTopic)super.clone();
+		 clone.setContributorsList(new ArrayList<Long>(clone.getContributorsList()));
+		 
+		 return clone;
+	}
+	 
+	 
+	
+	public boolean hasContributor(Long userId){
+		for(Long id : getContributorsList()){
+			if(id.equals(userId)){
+				return true;
+			}
+		}
+		return false;
+	}
+	
+	public List<Long> getContributorsList(){
+		if(contributorsList == null){
+			reloadContributorsList();
+		}
+		return contributorsList;
+	}
+	
+	public List<String> getContributorsNameList(){
+		List<String> list = new ArrayList<String>();
+		for(Long userId : getContributorsList()){
+			list.add(DataverseUtils.getUsername(userId));
+		}
+		return list;
+	}
+	
+	public String getUsername(){
+		if(this.userId != null){
+			return DataverseUtils.getUsername(this.userId);
+		}
+		return null;
+	}
+	
+	private void reloadContributorsList(){
+		this.contributorsList = new ArrayList<Long>();
+		try {
+			JSONArray array = new JSONArray(this.contributors);
+			for(int i=0; i<array.length(); i++){
+				this.contributorsList.add(array.getLong(i));
+			}
+		} catch (Exception e) {
+			e.printStackTrace();
+		}
+	}
+	
+	public void addContributor(Long userId){
+		if(!getContributorsList().contains(userId)){
+			getContributorsList().add(userId);
+		}
+		upgradeContributors();
+	}
+	
+	public void removeContributor(Long userId){
+		if(getContributorsList().contains(userId)){
+			getContributorsList().remove(userId);
+			this.upgradeContributors();
+		}
+	}
+	
+	public void upgradeContributors(){
+		JSONArray array = new JSONArray(getContributorsList());
+		this.contributors = array.toString();
+	}
+	
+	
+	public Long getUserId() {
+		return userId;
+	}
+
+	public void setUserId(Long userId) {
+		this.userId = userId;
+	}
+
+	public String getContributors() {
+		return contributors;
+	}
+
+	public void setContributors(String contributors) {
+		this.contributors = contributors;
+	}
+
+	
+	public String getNameEn() {
+		return nameEn;
+	}
+
+
+	public void setNameEn(String nameEn) {
+		this.nameEn = nameEn;
+	}
+
+
+	public String getNameCh() {
+		return nameCh;
+	}
+
+
+	public void setNameCh(String nameCh) {
+		this.nameCh = nameCh;
+	}
+
+
+	public String getNamePinyin() {
+		return namePinyin;
+	}
+
+
+	public void setNamePinyin(String namePinyin) {
+		this.namePinyin = namePinyin;
+	}
+
+
+	public String getDescription() {
+		return description;
+	}
+
+
+
+	public void setDescription(String description) {
+		this.description = description;
+	}
+
+
+
+	public void setContributorsList(List<Long> contributorsList) {
+		this.contributorsList = contributorsList;
+	}
+
+
+	public void setTransientDataLoaded(boolean transientDataLoaded) {
+		this.transientDataLoaded = transientDataLoaded;
+	}
+	
+	public DuplexKey<Long, Long> getKey(){
+		return new DuplexKey<Long, Long>(this.userId, this.id);
+	}
+	
+
+	@Override
+	public String toString(){
+		return "LGTopic[nameEn=" + nameEn + ", nameCh=" + nameCh + ", namePinyin=" + namePinyin + "]";
+	}
+
+	
+}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/main/java/de/mpiwg/gazetteer/bo/LGTopicSectionRelation.java	Thu Dec 17 13:44:08 2015 +0100
@@ -0,0 +1,105 @@
+package de.mpiwg.gazetteer.bo;
+
+import java.io.Serializable;
+import java.sql.SQLException;
+import java.util.ArrayList;
+import java.util.List;
+
+import javax.persistence.Column;
+import javax.persistence.Entity;
+import javax.persistence.Inheritance;
+import javax.persistence.InheritanceType;
+import javax.persistence.Table;
+import javax.persistence.Transient;
+
+import org.json.JSONArray;
+
+import cl.maps.duplex.DuplexKey;
+import de.mpiwg.gazetteer.dataverse.DataverseUtils;
+import de.mpiwg.gazetteer.db.DBBook;
+import de.mpiwg.gazetteer.db.DBSection;
+import de.mpiwg.gazetteer.utils.DBService;
+import de.mpiwg.gazetteer.utils.DataProvider;
+
+
+@Entity
+@Table(name="TopicSectionRelation")
+@Inheritance(strategy=InheritanceType.TABLE_PER_CLASS)
+public class LGTopicSectionRelation extends DBEntry implements Cloneable, Serializable {
+	private static final long serialVersionUID = 7805209462045170778L;
+
+	@Column(name="topicId")
+	private Long topicId;
+	
+	@Column(name="sectionId")
+	private Long sectionId;
+	
+	
+	@Column(name="bookId")
+	private String bookId;
+
+	@Transient
+	private boolean transientDataLoaded = false;
+	
+	
+	
+	
+	public boolean isEmpty() {
+		if (topicId != null && sectionId != null) {
+			return true;
+		} else {
+			return false;
+		}
+	}
+
+	
+	public Long getTopicId() {
+		return topicId;
+	}
+
+
+	public void setTopicId(Long topicId) {
+		this.topicId = topicId;
+	}
+
+	public Long getSectionId() {
+		return sectionId;
+	}
+
+
+	public void setSectionId(Long sectionId) {
+		this.sectionId = sectionId;
+	}
+
+
+	public String getBookId() {
+		return bookId;
+	}
+
+
+	public void setBookId(String bookId) {
+		this.bookId = bookId;
+	}
+
+
+	public boolean isTransientDataLoaded() {
+		return transientDataLoaded;
+	}
+
+
+	public void setTransientDataLoaded(boolean transientDataLoaded) {
+		this.transientDataLoaded = transientDataLoaded;
+	}
+
+
+	public DuplexKey<Long, Long> getKey(){
+		return new DuplexKey<Long, Long>(this.topicId, this.sectionId);
+	}
+	
+	@Override
+	public String toString(){
+		return "LGTopicSectionRelation[topicId=" + topicId.toString() + ", sectionId=" + sectionId.toString() + "]";
+	}
+
+	
+}
--- a/src/main/java/de/mpiwg/gazetteer/utils/AbstractDataProvider.java	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/java/de/mpiwg/gazetteer/utils/AbstractDataProvider.java	Thu Dec 17 13:44:08 2015 +0100
@@ -6,6 +6,8 @@
 import de.mpiwg.gazetteer.bo.LGBranch;
 import de.mpiwg.gazetteer.bo.LGFile;
 import de.mpiwg.gazetteer.bo.LGFullTextSearchFile;
+import de.mpiwg.gazetteer.bo.LGTopic;
+import de.mpiwg.gazetteer.bo.LGTopicSectionRelation;
 
 public class AbstractDataProvider {
 
@@ -73,4 +75,48 @@
 	}
 	
 	
+	
+	private DuplexMap<LGTopic, Long, Long> topicMap = null;
+	
+	public void setTopicMap(DuplexMap<LGTopic, Long, Long> topicMap) {
+		this.topicMap = topicMap;
+	}
+
+	protected DuplexMap<LGTopic, Long, Long> getTopicMap(){
+		if(topicMap == null){
+			loadTopics();
+		}
+		return topicMap;
+	}
+	
+	public void loadTopics(){
+		List<LGTopic> list = DBService.getAllLGTopicFromDB();
+		this.topicMap = new DuplexMap<LGTopic, Long, Long>();
+		for(LGTopic item : list){
+			this.topicMap.put(item.getKey(), item);
+		}
+	}
+	
+
+	private DuplexMap<LGTopicSectionRelation, Long, Long> topicSectionRelationMap = null;
+	
+	public void setTopicSectionRelationMap(DuplexMap<LGTopicSectionRelation, Long, Long> topicSectionRelationMap) {
+		this.topicSectionRelationMap = topicSectionRelationMap;
+	}
+
+	protected DuplexMap<LGTopicSectionRelation, Long, Long> getTopicSectionRelationMap(){
+		if(topicSectionRelationMap == null){
+			loadTopicSectionRelations();
+		}
+		return topicSectionRelationMap;
+	}
+	
+	public void loadTopicSectionRelations(){
+		List<LGTopicSectionRelation> list = DBService.getAllLGTopicSectionRelationFromDB();
+		this.topicSectionRelationMap = new DuplexMap<LGTopicSectionRelation, Long, Long>();
+		for(LGTopicSectionRelation item : list){
+			this.topicSectionRelationMap.put(item.getKey(), item);
+		}
+	}
+	
 }
--- a/src/main/java/de/mpiwg/gazetteer/utils/DBService.java	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/java/de/mpiwg/gazetteer/utils/DBService.java	Thu Dec 17 13:44:08 2015 +0100
@@ -20,6 +20,8 @@
 import de.mpiwg.gazetteer.bo.LGBranch;
 import de.mpiwg.gazetteer.bo.LGFile;
 import de.mpiwg.gazetteer.bo.LGFullTextSearchFile;
+import de.mpiwg.gazetteer.bo.LGTopic;
+import de.mpiwg.gazetteer.bo.LGTopicSectionRelation;
 import de.mpiwg.gazetteer.db.DBBook;
 import de.mpiwg.gazetteer.db.DBContents;
 import de.mpiwg.gazetteer.db.DBCoordinatesBook;
@@ -88,7 +90,7 @@
 		try {
 			this.loadBookMap();
 		} catch (SQLException e) {
-			// TODO Auto-generated catch block
+			
 			e.printStackTrace();
 		}
 		
@@ -789,7 +791,9 @@
 		return list;
 	}
 	
-	protected static  List<LGBranch> getAllLGBranchFromDB(){
+	
+	
+	protected static List<LGBranch> getAllLGBranchFromDB(){
 		List<LGBranch> list = null;
 		
 		Session session = HibernateUtil.getSessionFactory().getCurrentSession();
@@ -932,4 +936,80 @@
 				
 	}
 	 */
+	
+	
+	
+
+	/* --- topic --- */
+	protected static List<LGTopic> getAllLGTopicFromDB(){
+		List<LGTopic> list = null;
+		
+		Session session = HibernateUtil.getSessionFactory().getCurrentSession();
+		session.getTransaction().begin();
+		Query query = session.createQuery("from LGTopic");
+		list = query.list();
+		session.getTransaction().commit();
+
+		return list;
+	}
+	
+	protected static int deleteTopicFromDB(Long topicId){
+		logger.info("Deleting topic by topicId=" + topicId);
+		
+		int modifiedTopic;
+		Session session = HibernateUtil.getSessionFactory().getCurrentSession();
+		session.getTransaction().begin();
+		
+		Query query = session.createQuery("delete LGTopic where id = :id");
+		query.setLong("id", topicId);
+		modifiedTopic = query.executeUpdate();
+		
+		
+		// delete records in TopicSectionRelation table
+		Query query0 = session.createQuery("delete LGTopicSectionRelation where topicId = :topicId");
+		query0.setLong("topicId", topicId);
+		modifiedTopic += query0.executeUpdate();
+		
+		session.getTransaction().commit();
+		
+		return modifiedTopic;
+	}
+	
+	
+	protected static List<LGTopicSectionRelation> getAllLGTopicSectionRelationFromDB(){
+		List<LGTopicSectionRelation> list = null;
+		
+		Session session = HibernateUtil.getSessionFactory().getCurrentSession();
+		session.getTransaction().begin();
+		Query query = session.createQuery("from LGTopicSectionRelation");
+		list = query.list();
+		session.getTransaction().commit();
+
+		return list;
+	}
+	
+	protected static int deleteTopicSectionRelationFromDB(Long relationId){
+		
+		int modifiedRelation;
+		Session session = HibernateUtil.getSessionFactory().getCurrentSession();
+		session.getTransaction().begin();
+		
+		
+		Query query0 = session.createQuery("delete LGTopicSectionRelation where id = :relationId");
+		query0.setLong("relationId", relationId);
+		modifiedRelation = query0.executeUpdate();
+		
+		session.getTransaction().commit();
+		
+		return modifiedRelation;
+		
+	}
+
+	
+	
+	
+	/* --- end topic --- */
+
+	
+	
 }
--- a/src/main/java/de/mpiwg/gazetteer/utils/DataProvider.java	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/java/de/mpiwg/gazetteer/utils/DataProvider.java	Thu Dec 17 13:44:08 2015 +0100
@@ -1,5 +1,6 @@
 package de.mpiwg.gazetteer.utils;
 
+import java.sql.SQLException;
 import java.util.ArrayList;
 import java.util.Collections;
 import java.util.Date;
@@ -12,7 +13,10 @@
 import de.mpiwg.gazetteer.bo.LGBranch;
 import de.mpiwg.gazetteer.bo.LGFile;
 import de.mpiwg.gazetteer.bo.LGFullTextSearchFile;
+import de.mpiwg.gazetteer.bo.LGTopic;
+import de.mpiwg.gazetteer.bo.LGTopicSectionRelation;
 import de.mpiwg.gazetteer.db.DBContents;
+import de.mpiwg.gazetteer.db.DBSection;
 import de.mpiwg.gazetteer.utils.exceptions.NoAuthorizedException;
 import de.mpiwg.gazetteer.utils.exceptions.VersioningException;
 
@@ -34,6 +38,11 @@
 	public DataProvider(){
 		logger.info("##### Starting DataProvider #####");
 	}
+	
+	
+
+	/* --- branch --- */
+	
 	public LGFile getFile(Long fileId){
 		return getFileMap().getValuesByOwnKey(fileId);
 	}
@@ -259,6 +268,11 @@
 		
 	}
 
+	/* --- end branch --- */
+	
+	
+	
+	/* --- full text search --- */
 	
 	public List<LGFullTextSearchFile> getSearchFileList4User(Long userId) {
 	
@@ -303,7 +317,179 @@
 		return file;
 	}
 
+	/* --- end full text search --- */
+
+	/* --- topic --- */
 	
+	public List<LGTopic> getTopics(Long userId){
+		List<LGTopic> list = new ArrayList<LGTopic>();
+		for(LGTopic topic : getTopicMap().values()){
+			if(topic.hasContributor(userId)){
+				list.add(topic);
+			}
+		}
+		return list;
+	}
+	
+	public LGTopic getTopic(Long topicId){
+		return getTopicMap().getValuesByOwnKey(topicId);
+	}
+	
+	
+	public void deleteTopic(LGTopic topic){
+			
+		int modifiedRelation = DBService.deleteTopicFromDB(topic.getId());
+		getTopicMap().remove(topic.getKey());
+		
+		logger.info("removing " + modifiedRelation + " records in topicSectionRelation of topic " + topic.toString());
+		
+		this.setTopicSectionRelationMap(null);	// clear topicSectionRelationMap cache
+		
+
+	}
+
+	public void createTopic(String nameEn, String nameCh,String namePinyin, String description, Long userId) {
+		Date date = new Date();
+		
+		LGTopic topic = new LGTopic();
+		topic.setNameEn(nameEn);
+		topic.setNameCh(nameCh);
+		topic.setNamePinyin(namePinyin);
+		topic.setDescription(description);
+		topic.setUserId(userId);
+		topic.setContributors("[" + userId.toString() + "]");
+		
+		//Saving into DB
+		//##################################
+		// For Topic table
+		Session session = HibernateUtil.getSessionFactory().getCurrentSession();
+		session.getTransaction().begin();
+		
+		DBService.saveDBEntry0(session, topic, date);
+			
+		session.getTransaction().commit();
+		//##################################
+		
+	}
+
+	public void updateTopic(LGTopic topic) throws Exception {
+		if(!topic.isPersistent()){
+			throw new Exception("Trying to update a topic that it is not persistent!");
+		}
+		
+		Date date = new Date();
+		DBService.saveDBEntry(topic, date);
+		this.getTopicMap().put(topic.getKey(), topic);
+		
+	}
+	
+	
+	
+	public List<DBSection> getAllSectionsInTopic(Long topicId) throws SQLException{
+		
+		List<LGTopicSectionRelation> topicSectionRelationList = getTopicSectionRelationMap().getValuesByAKey(topicId);
+
+		// get sections from topicSecionRelation list
+		List<DBSection> list = new ArrayList<DBSection>();
+		for (LGTopicSectionRelation aRelation : topicSectionRelationList) {
+			logger.debug(aRelation.getInfo() );
+			
+			DBSection section = DBService.getSectionWithContent(aRelation.getSectionId());
+			list.add(section);
+			
+		}
+		
+		
+		Collections.sort(list);
+		Collections.reverse(list);
+		return list;
+	}
+
+
+
+
+	public void deleteTopicSectionRelation(Long topicId, String bookId) throws Exception{
+		// delete record with topicId, bookId in topicSectionRelation
+		// this means the sectionId = 0, there is no corresponding section in the book for this topic
+		
+		// TODO
+		
+	}
+
+	public void deleteTopicSectionRelation(Long topicId, Long sectionId) throws Exception{
+		if (sectionId == 0) {
+			throw new Exception("sectionId cannot be 0");
+		}
+		
+		DuplexKey<Long, Long> key = new DuplexKey<Long, Long>(topicId, sectionId);
+		LGTopicSectionRelation topicSectionRelation = this.getTopicSectionRelationMap().get(key);
+
+		LGTopic topic = getTopic(topicId);
+		
+		if(topic == null){
+			throw new Exception("There is no topic of " + topicSectionRelation);
+		}
+		
+		//deleting topicSectionRelation from DB and cache
+		int modifiedRelation = DBService.deleteTopicSectionRelationFromDB(topicSectionRelation.getId());
+		getTopicSectionRelationMap().remove(topicSectionRelation.getKey());
+		
+		logger.info(modifiedRelation + " items deleted by removing topicSectionRelation " + topicSectionRelation.toString());
+
+		
+	}
+
+	public String updateTopicSectionRelation(Long sectionId, Long topicId) throws Exception {
+		DuplexKey<Long, Long> key = new DuplexKey<Long, Long>(topicId, sectionId);
+		LGTopicSectionRelation topicSectionRelation = this.getTopicSectionRelationMap().get(key);
+
+		if (topicSectionRelation != null) {
+			// the relation already existed
+			// would this possibly need any modification to the existing record in the topicSectionRelation table?
+			
+			return "updated";
+			
+		} else {
+			createTopicSectionRelation(sectionId, topicId);
+
+			return "added";
+		}
+		
+	
+		
+	}
+	
+	
+	public void createTopicSectionRelation(Long sectionId, Long topicId) throws Exception {
+		
+		Date date = new Date();
+		
+		LGTopicSectionRelation topicSectionRelation = new LGTopicSectionRelation();
+		topicSectionRelation.setTopicId(topicId);
+		topicSectionRelation.setSectionId(sectionId);
+		
+		DBService.getInstance();
+		DBSection section = DBService.getSectionWithContent(sectionId);
+		topicSectionRelation.setBookId(section.getBookId());
+		
+		//Saving into DB
+		//##################################
+		// For Topic table
+		Session session = HibernateUtil.getSessionFactory().getCurrentSession();
+		session.getTransaction().begin();
+		
+		DBService.saveDBEntry0(session, topicSectionRelation, date);
+			
+		session.getTransaction().commit();
+		//##################################
+		
+		// update cache
+		this.loadTopicSectionRelations();
+	
+	}
 
 	
+	
+	/* --- end topic --- */
+	
 }
--- a/src/main/java/de/mpiwg/web/jsp/ApplicationBean.java	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/java/de/mpiwg/web/jsp/ApplicationBean.java	Thu Dec 17 13:44:08 2015 +0100
@@ -68,6 +68,10 @@
 		return value;	
 	}
 	
+	public String getPlusImage() {
+		return getRootServer() + "/resources/images/plus.png";
+	}
+	
 	public String getShowImage(){
 		return getRootServer() + "/resources/images/show_16.png";
 	}
--- a/src/main/java/de/mpiwg/web/jsp/JSPProxy.java	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/java/de/mpiwg/web/jsp/JSPProxy.java	Thu Dec 17 13:44:08 2015 +0100
@@ -27,6 +27,7 @@
 		logger.info("processRequest [bean= " + bean + ", action=" + action +"]");
 		
 		try{
+			
 			if(StringUtils.equals(bean, BranchPage.bean)){
 				
 				getSessionBean().getBranchPage().loadParameters(request, response);
@@ -49,7 +50,7 @@
 				return BranchPage.page;
 				
 				
-			}else if(StringUtils.equals(bean, CreateFilePage.bean)){
+			} else if(StringUtils.equals(bean, CreateFilePage.bean)){
 				
 				getSessionBean().getCreateFilePage().loadParameters(request, response);
 				
@@ -141,7 +142,8 @@
 					getSessionBean().logout();
 				}
 				
-				return "pages/home.jsp";
+				return TopicListPage.page;
+				//return "pages/home.jsp";
 				
 			}else if(StringUtils.equals(bean, SearchPage.bean)){
 				getSessionBean().getSearchPage().loadParameters(request, response);
@@ -150,6 +152,8 @@
 					getSessionBean().getSearchPage().search();
 				} else if(StringUtils.equals(action, "filter")){
 					getSessionBean().getSearchPage().filter();
+					
+				
 				//PAGINATOR
 				} else if(StringUtils.equals(action, "firstPage")){
 					getSessionBean().getSearchPage().firstPage();
@@ -285,6 +289,107 @@
 				
 				return FullTextSearchPage.page;
 				
+				
+			} else if(StringUtils.equals(bean, TopicListPage.bean)){
+				getSessionBean().getTopicListPage().loadParameters(request, response);
+							
+				if(StringUtils.equals(action, "forceLoadTopics")){
+					getSessionBean().getTopicListPage().forceLoadTopics();
+				
+				} else if(StringUtils.equals(action, "deleteTopic")){
+					getSessionBean().getTopicListPage().deleteTopic();
+				} else if(StringUtils.equals(action, "createTopic")){
+					Long userId = getSessionBean().getUser().getId();
+					getSessionBean().getTopicListPage().createTopic(userId);	
+				} 	
+		
+					
+				return TopicListPage.page;
+					
+			
+			} else if(StringUtils.equals(bean, TopicPage.bean)){
+				getSessionBean().getTopicPage().loadParameters(request, response);
+							
+				if(StringUtils.equals(action, "forceLoadTopicSectionRelation")){
+					getSessionBean().getTopicPage().forceLoadTopicSectionRelation();
+					
+				} else /* if(StringUtils.equals(action, "deleteTopic")){
+					getSessionBean().getTopicPage().deleteTopic();
+				} else if(StringUtils.equals(action, "createTopic")){
+					Long userId = getSessionBean().getUser().getId();
+					getSessionBean().getTopicPage().createTopic(userId);
+				
+				} else */ 
+				
+				if(StringUtils.equals(action, "addContributor")){
+					getSessionBean().getTopicPage().addContributor();
+				} else if(StringUtils.equals(action, "removeContributor")){
+					getSessionBean().getTopicPage().removeContributor();
+				} else if( StringUtils.equals(action ,"updateDescription")) {
+					getSessionBean().getTopicPage().updateDescription();	
+					
+				} else if( StringUtils.equals(action ,"deleteSection")) {					
+					getSessionBean().getTopicPage().deleteSection(getLongParameter("sectionId"));	
+				
+				} else if(StringUtils.equals(action, "filter")){
+					getSessionBean().getTopicPage().filter();
+			
+					
+				} else if(StringUtils.equals(action, "addSectionToTopic")) {
+					Long selectedSectionId = getLongParameter("selectedSectionId");
+					Long selectedTopicId = getLongParameter("selectedTopicId");
+					
+					getSessionBean().getTopicPage().addSectionToTopic(selectedSectionId, selectedTopicId);
+					return SearchPage.page;
+					
+					
+					
+				//SORTING
+				} else if(StringUtils.equals(action, "sortByBookIdUp")){
+					getSessionBean().getTopicPage().sortByBookIdUp();
+				} else if(StringUtils.equals(action, "sortByBookIdDown")){
+					getSessionBean().getTopicPage().sortByBookIdDown();
+				} else if(StringUtils.equals(action, "sortByBookNameUp")){
+					getSessionBean().getTopicPage().sortByBookNameUp();
+				} else if(StringUtils.equals(action, "sortByBookNameDown")){
+					getSessionBean().getTopicPage().sortByBookNameDown();
+				} else if(StringUtils.equals(action, "sortByDynastyUp")){
+					getSessionBean().getTopicPage().sortByDynastyUp();
+				} else if(StringUtils.equals(action, "sortByDynastyDown")){
+					getSessionBean().getTopicPage().sortByDynastyDown();
+				} else if(StringUtils.equals(action, "sortByPeriodUp")){
+					getSessionBean().getTopicPage().sortByPeriodUp();
+				} else if(StringUtils.equals(action, "sortByPeriodDown")){
+					getSessionBean().getTopicPage().sortByPeriodDown();
+				} else if(StringUtils.equals(action, "sortBySectionNameUp")){
+					getSessionBean().getTopicPage().sortBySectionNameUp();
+				} else if(StringUtils.equals(action, "sortBySectionNameDown")){
+					getSessionBean().getTopicPage().sortBySectionNameDown();
+				
+				} else if(StringUtils.equals(action, "sortByLevel1Up")){
+					getSessionBean().getTopicPage().sortByLevel1Up();
+				} else if(StringUtils.equals(action, "sortByLevel1Down")){
+					getSessionBean().getTopicPage().sortByLevel1Down();
+				} else if(StringUtils.equals(action, "sortByLevel2Up")){
+					getSessionBean().getTopicPage().sortByLevel2Up();
+				} else if(StringUtils.equals(action, "sortByLevel2Down")){
+					getSessionBean().getTopicPage().sortByLevel2Down();
+				
+			
+				} else if(StringUtils.equals(action, "sortByAdminTypeUp")){
+					getSessionBean().getTopicPage().sortByAdminTypeUp();
+				} else if(StringUtils.equals(action, "sortByAdminTypeDown")){
+					getSessionBean().getTopicPage().sortByAdminTypeDown();
+				
+				} else if(StringUtils.equals(action, "sortByStartPageUp")){
+					getSessionBean().getTopicPage().sortByStartPageUp();
+				} else if(StringUtils.equals(action, "sortByStartPageDown")){
+					getSessionBean().getTopicPage().sortByStartPageDown();
+				} 
+				
+				return TopicPage.page;
+					
+			
 			} else if(StringUtils.equals(bean, BooksPage.bean)){
 				getSessionBean().getBooksPage().loadParameters(request, response);
 				
@@ -385,13 +490,14 @@
 			e.printStackTrace();
 			addMsg("There is an internal error: " + e.getLocalizedMessage());
 			
-			return HomePage.page;
+			return TopicListPage.page;
+			//return HomePage.page;
 		}
 		
 	
 		//Default Page:
-		//return BooksPage.page;
-		return HomePage.page;
+		return TopicListPage.page;
+		//return HomePage.page;
 		//return "pages/search.jsp";
 	}
 
--- a/src/main/java/de/mpiwg/web/jsp/SearchPage.java	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/java/de/mpiwg/web/jsp/SearchPage.java	Thu Dec 17 13:44:08 2015 +0100
@@ -65,6 +65,7 @@
 	}
 	
 	public void loadParameters(HttpServletRequest request, HttpServletResponse response){
+		
 		this.request = request;
 		this.response = response;
 		
@@ -182,6 +183,10 @@
 		}
 	}
 	
+	
+
+	
+	
 	private List<String> splitTerms(){
 		List<String> rs = new ArrayList<String>();
 		String[] array = this.searchTerm.split(",");
@@ -356,8 +361,22 @@
 	public void setFilteringMessage(String filteringMessage) {
 		this.filteringMessage = filteringMessage;
 	}
-	
-	/////// Sorting
+
+	public String getAdminTypeFilter() {
+		return adminTypeFilter;
+	}
+
+	public void setAdminTypeFilter(String adminTypeFilter) {
+		this.adminTypeFilter = adminTypeFilter;
+	}
+
+	public String getLevel1Filter() {
+		return level1Filter;
+	}
+
+	public void setLevel1Filter(String level1Filter) {
+		this.level1Filter = level1Filter;
+	}
 	
 	public String getDynastyFilter() {
 		return dynastyFilter;
@@ -367,6 +386,9 @@
 		this.dynastyFilter = dynastyFilter;
 	}
 
+	
+	/////// Sorting
+	
 	public void sortByBookNameUp(){
 		Collections.sort(this.completeSectionList, new SortSectionByBookName());
 		filter();
@@ -500,21 +522,5 @@
 		filter();
 	}
 
-	public String getAdminTypeFilter() {
-		return adminTypeFilter;
-	}
-
-	public void setAdminTypeFilter(String adminTypeFilter) {
-		this.adminTypeFilter = adminTypeFilter;
-	}
-
-	public String getLevel1Filter() {
-		return level1Filter;
-	}
-
-	public void setLevel1Filter(String level1Filter) {
-		this.level1Filter = level1Filter;
-	}
-	
 	
 }
--- a/src/main/java/de/mpiwg/web/jsp/SessionBean.java	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/java/de/mpiwg/web/jsp/SessionBean.java	Thu Dec 17 13:44:08 2015 +0100
@@ -33,6 +33,9 @@
 	
 	private BooksPage booksPage = new BooksPage();
 	private FullTextSearchPage fullTextSearchPage = new FullTextSearchPage();
+
+	private TopicListPage topicListPage = new TopicListPage();
+	private TopicPage topicPage = new TopicPage();
 	
 	public SessionBean(){
 		logger.info("\n\n### SessionBean #####\n\n");
@@ -192,4 +195,24 @@
 	}
 
 
+	public TopicListPage getTopicListPage() {
+		return topicListPage;
+	}
+
+
+	public void setTopicListPage(TopicListPage topicListPage) {
+		this.topicListPage = topicListPage;
+	}
+
+
+	public TopicPage getTopicPage() {
+		return topicPage;
+	}
+
+
+	public void setTopicPage(TopicPage topicPage) {
+		this.topicPage = topicPage;
+	}
+
+
 }
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/main/java/de/mpiwg/web/jsp/TopicListPage.java	Thu Dec 17 13:44:08 2015 +0100
@@ -0,0 +1,273 @@
+package de.mpiwg.web.jsp;
+
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.List;
+
+import javax.servlet.http.HttpServletRequest;
+import javax.servlet.http.HttpServletResponse;
+
+import org.apache.commons.lang.StringUtils;
+import org.apache.log4j.Logger;
+
+import de.mpiwg.gazetteer.bo.LGTopic;
+import de.mpiwg.gazetteer.utils.DataProvider;
+public class TopicListPage extends AbstractJSPPage{
+	
+	private static Logger logger = Logger.getLogger(TopicListPage.class);
+	
+	public static String bean = "topicListBean";
+	public static String page = "pages/topicList.jsp";
+	
+
+	private List<LGTopic> completeTopicList;	// complete topic list
+	private List<LGTopic> filteredTopicList;
+	private List<LGTopic> displayTopicList;
+	
+	private Long topicId;
+	
+	private int topicNumber;
+	
+	private String filteringMessage;
+
+	private DataPaginator paginator = new DataPaginator();
+
+	
+	public void loadParameters(HttpServletRequest request, HttpServletResponse response){
+		this.request = request;
+		this.response = response;
+		
+		this.topicId = getLongParameter("topicId");
+	
+	}
+	
+	
+	public void reloadTopics(){
+		logger.debug("reloadTopics");
+		if (this.completeTopicList == null) {
+			this.forceLoadTopics();
+			this.filteringMessage = null;
+		}
+		return;
+	}
+	
+	
+	public void forceLoadTopics(){
+		logger.debug("forceLoadTopics");
+		DataProvider.getInstance().setTopicMap(null);
+		DataProvider.getInstance().setTopicSectionRelationMap(null); 
+		
+		this.completeTopicList = new ArrayList<LGTopic>();
+	
+		if(getSessionBean().getUser() != null){
+			for(LGTopic topic : DataProvider.getInstance().getTopics(getSessionBean().getUser().getId())){
+		
+				if (topic.isEmpty()) {
+					logger.debug("topic doesn't exist anymore.");
+				} else {
+					this.completeTopicList.add(topic);
+				}
+			}	
+		}
+		this.setTopicNumber(this.completeTopicList.size());
+		
+		sortByLastModifiedDown();	// default sorting by from lasted modified to oldest
+		
+		
+	}
+	
+	
+	
+	public void createTopic(Long userId){
+		logger.debug("createTopic");
+		String nameEn = getParameter("nameEn");
+		String nameCh = getParameter("nameCh");
+		String namePinyin = getParameter("namePinyin");
+		String description = getParameter("description");
+
+		logger.debug("nameEn: " + nameEn);
+		logger.debug("nameCh: " + nameCh);
+		logger.debug("namePinyin: " + namePinyin);
+		logger.debug("description: " + description);
+		
+		if (StringUtils.isEmpty(nameEn)) {
+			addMsg("Create Fails. Name(eng) cannot be empty.");
+		} else {
+			
+			DataProvider.getInstance().createTopic(nameEn, nameCh, namePinyin, description, userId);
+			
+			addMsg("New topic has been created.");			
+			this.forceLoadTopics();
+		}
+	}
+	
+
+	public void deleteTopic(){
+		logger.debug("deleteTopic " + topicId);
+		
+		if(topicId != null){
+			LGTopic topic = DataProvider.getInstance().getTopic(topicId);
+			if(topic != null){
+				DataProvider.getInstance().deleteTopic(topic);
+				this.forceLoadTopics();
+			}	
+		}
+	}
+	
+
+	
+	public void filter(){
+		
+		this.filteredTopicList = new ArrayList<LGTopic>();
+		for (LGTopic topic : this.completeTopicList) {
+			if(!this.filteredTopicList.contains(topic)){
+				/*
+				if( (StringUtils.isEmpty(bookNameFilter) || StringUtils.startsWith(branch.getBook().getName(), bookNameFilter)) &&
+					(StringUtils.isEmpty(level1Filter) || StringUtils.startsWith(branch.getBook().getLevel1(), level1Filter)) &&
+					(StringUtils.isEmpty(level2Filter) || StringUtils.startsWith(branch.getBook().getLevel2(), level2Filter)) &&
+					(StringUtils.isEmpty(dynastyFilter) || StringUtils.startsWith(branch.getBook().getDynasty(), dynastyFilter)) &&
+					(StringUtils.isEmpty(adminTypeFilter) || StringUtils.startsWith(branch.getBook().getAdmin_type(), adminTypeFilter)) &&
+					(StringUtils.isEmpty(bookIdFilter) || StringUtils.startsWith(branch.getBook().getId(), bookIdFilter)) &&
+					(StringUtils.isEmpty(periodFilter) || StringUtils.startsWith(branch.getBook().getPeriod(), periodFilter)) &&
+					(StringUtils.isEmpty(sectionNameFilter) || StringUtils.startsWith(branch.getSection().getName(), sectionNameFilter)) &&
+					(StringUtils.isEmpty(labelFilter) || StringUtils.startsWith(branch.getLabel(), labelFilter))
+					){
+			
+					this.filteredTopicList.add(branch);
+					
+				}
+				*/
+
+				this.filteredTopicList.add(topic);
+		
+			}
+		}
+		
+		if(completeTopicList.size() > 0){
+			this.filteringMessage = this.filteredTopicList.size() + " topics listed after filtering";
+			this.paginator.setCurrentPage(0);
+			this.paginator.resetNumberOfPages(filteredTopicList.size());
+			
+			
+		}else{
+			this.filteredTopicList = null;
+		}
+		
+		this.updateCurrentTopics();
+	}
+	
+	private void updateCurrentTopics() {
+		this.paginator.initCount();
+		int startRecord = this.paginator.getCurrentPage()
+				* this.paginator.getItemsPerPage();
+		if(this.paginator.getNumberOfPages() == 0){
+			this.displayTopicList = new ArrayList<LGTopic>();
+		}else if((this.paginator.getCurrentPage() + 1) == this.paginator.getNumberOfPages()){
+			int mod = this.filteredTopicList.size() % paginator.getItemsPerPage();
+			if(mod == 0){
+				this.displayTopicList = filteredTopicList.subList(startRecord, startRecord + this.paginator.getItemsPerPage());
+			}else{
+				this.displayTopicList = filteredTopicList.subList(startRecord, startRecord + mod);	
+			}
+			
+		}else{
+			this.displayTopicList = filteredTopicList.subList(startRecord, startRecord + this.paginator.getItemsPerPage());	
+		}
+		/*
+		for(LGTopic topic : this.displayTopicList){
+			topic.setTopic(this.topicMap.get(topic.getId()));
+		}
+		*/
+	}
+	
+	
+
+	
+	// sort
+
+	public void sortByLastModifiedDown() {
+		//Collections.sort(this.completeTopicList, new SortByLastModified());
+		//Collections.reverse(this.completeTopicList);
+		filter();
+	}
+	
+
+
+	public List<LGTopic> getCompleteTopicList() {
+		return completeTopicList;
+	}
+
+
+	public void setCompleteTopicList(List<LGTopic> completeTopicList) {
+		this.completeTopicList = completeTopicList;
+	}
+
+
+	public List<LGTopic> getFilteredTopicList() {
+		return filteredTopicList;
+	}
+
+
+	public void setFilteredTopicList(List<LGTopic> filteredTopicList) {
+		this.filteredTopicList = filteredTopicList;
+	}
+
+
+	public List<LGTopic> getDisplayTopicList() {
+		return displayTopicList;
+	}
+
+
+	public void setDisplayTopicList(List<LGTopic> displayTopicList) {
+		this.displayTopicList = displayTopicList;
+	}
+
+
+	public Long getTopicId() {
+		return topicId;
+	}
+
+
+	public void setTopicId(Long topicId) {
+		this.topicId = topicId;
+	}
+
+
+	public String getFilteringMessage() {
+		return filteringMessage;
+	}
+
+
+	public void setFilteringMessage(String filteringMessage) {
+		this.filteringMessage = filteringMessage;
+	}
+
+
+
+	public DataPaginator getPaginator() {
+		return paginator;
+	}
+
+
+	public void setPaginator(DataPaginator paginator) {
+		this.paginator = paginator;
+	}
+
+
+	public int getTopicNumber() {
+		return topicNumber;
+	}
+
+
+	public void setTopicNumber(int topicNumber) {
+		this.topicNumber = topicNumber;
+	}
+
+
+
+
+
+	
+	
+	
+}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/main/java/de/mpiwg/web/jsp/TopicPage.java	Thu Dec 17 13:44:08 2015 +0100
@@ -0,0 +1,672 @@
+package de.mpiwg.web.jsp;
+
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+import javax.servlet.http.HttpServletRequest;
+import javax.servlet.http.HttpServletResponse;
+
+import org.apache.commons.lang.StringUtils;
+import org.apache.log4j.Logger;
+
+import cl.maps.duplex.DuplexKey;
+import de.mpiwg.gazetteer.bo.LGBranch;
+import de.mpiwg.gazetteer.bo.LGTopic;
+import de.mpiwg.gazetteer.bo.LGTopicSectionRelation;
+import de.mpiwg.gazetteer.dataverse.DataverseUtils;
+import de.mpiwg.gazetteer.dataverse.bo.VDCUser;
+import de.mpiwg.gazetteer.db.DBSection;
+import de.mpiwg.gazetteer.utils.DBService;
+import de.mpiwg.gazetteer.utils.DataProvider;
+import de.mpiwg.web.search.SortSectionByAdminType;
+import de.mpiwg.web.search.SortSectionByBookId;
+import de.mpiwg.web.search.SortSectionByBookName;
+import de.mpiwg.web.search.SortSectionByDynasty;
+import de.mpiwg.web.search.SortSectionById;
+import de.mpiwg.web.search.SortSectionByLevel1;
+import de.mpiwg.web.search.SortSectionByLevel2;
+import de.mpiwg.web.search.SortSectionByPeriod;
+import de.mpiwg.web.search.SortSectionByStartPage;
+
+
+public class TopicPage extends AbstractJSPPage{
+
+	private static Logger logger = Logger.getLogger(TopicPage.class);
+	
+	public static String bean = "topicBean";
+	public static String page = "pages/topicPage.jsp";
+	
+	private LGTopic topic;
+	private Long topicId;
+	
+	private Long userId;
+
+	private List<VDCUser> suggestionUserList;
+	private List<VDCUser> contributors;
+	
+	private List<DBSection> completeSectionList;
+	private List<DBSection> filteredSectionList;
+	private List<DBSection> displaySectionList;
+	
+	
+	private String dynastyFilter = new String();
+	private String adminTypeFilter = new String();
+	private String level1Filter = new String();
+	private String level2Filter = new String();
+
+	private String bookNameFilter = new String();
+	private String bookIdFilter = new String();
+	private String periodFilter = new String();
+	private String sectionNameFilter = new String();
+	
+	private DataPaginator paginator = new DataPaginator();
+	private String filteringMessage;
+	
+	private Map<Long, List<LGBranch>> branchesMap;
+	
+	public void loadParameters(HttpServletRequest request, HttpServletResponse response){
+
+		this.request = request;
+		this.response = response;
+		this.userId = getLongParameter("userId");	
+		this.topicId = getLongParameter("topicId");
+
+		this.dynastyFilter = getParameter("dynastyFilter");
+		this.adminTypeFilter = getParameter("adminTypeFilter");
+		this.level1Filter = getParameter("level1Filter");
+		this.level2Filter = getParameter("level2Filter");
+		this.periodFilter = getParameter("periodFilter");
+		this.sectionNameFilter = getParameter("sectionNameFilter");
+		this.bookIdFilter = getParameter("bookIdFilter");
+		this.bookNameFilter = getParameter("bookNameFilter");
+
+	}
+	
+
+	
+	public void forceLoadTopicSectionRelation() {
+		
+		logger.debug("forceLoadTopicSectionRelation");
+		DataProvider.getInstance().setTopicSectionRelationMap(null);
+		
+		this.loadTopic(this.topic);
+	}
+
+	
+	
+	public void loadTopic(String topicId0){
+		try {
+			
+			this.topicId = Long.parseLong(topicId0);
+			
+			LGTopic topic = DataProvider.getInstance().getTopic(topicId);
+			if(topic != null){
+				this.loadTopic(topic);	
+			}else{
+				addMsg("topic [id=" + topicId + "] no found.");
+			}
+			
+			
+		} catch (Exception e) {
+			internalError(e);
+		}
+	
+	}
+	
+	public void addContributor(){
+		if(userId != null){
+			
+			VDCUser user = DataverseUtils.getUser(userId);
+			System.out.println("Adding user: " + user.getUserName());
+			
+			this.topic.addContributor(userId);
+			this.saveTopic0();
+		}
+	}
+	
+	
+	
+	public void removeContributor(){
+		if(userId != null){
+			
+			VDCUser user = DataverseUtils.getUser(userId);
+			System.out.println("Removing user: " + user.getUserName());
+			
+			this.topic.removeContributor(userId);
+			this.saveTopic0();
+		}
+	}
+	
+	private void saveTopic0(){
+		try {
+			DataProvider.getInstance().updateTopic(topic);
+			this.loadTopic(topic);
+			addMsg("The topic has been updated!");
+		} catch (Exception e) {
+			internalError(e);
+		}
+	}
+
+	
+	public void loadTopic(LGTopic topic){
+		logger.info("Loading topic: " + topic.toString());
+			
+		if(topic != null && topic.isPersistent()){
+			this.loadBranches();
+			try {
+				this.topic = (LGTopic)topic.clone();
+				this.contributors = new ArrayList<VDCUser>();
+				for(Long userId : this.topic.getContributorsList()){
+					VDCUser user = DataverseUtils.getUser(userId);
+					if(user != null){
+						this.contributors.add(user);
+					}
+					
+				}
+				
+				this.loadSuggestionUserList();
+			
+				// all sections in the topic
+				this.completeSectionList = DataProvider.getInstance().getAllSectionsInTopic(topic.getId());
+				
+			} catch (Exception e) {
+				internalError(e);
+			}
+			
+			logger.info("completeSectionList.size=" + completeSectionList.size());
+		}
+		this.filter();
+	}
+	
+	
+
+	public void updateDescription() {
+		String description = getParameter("description");
+		//logger.info("updateLabel: " + branchLabel + ", for branch id=" + this.getBranchId())
+		this.getTopic().setDescription(description);
+		
+		this.saveTopic0();
+		
+	}
+
+
+
+
+	public void deleteSection(Long sectionId) throws Exception {
+		// delete the record with sectionId, topicId in topicSectionRelation database table
+
+		logger.debug("delete sectionId=" + sectionId + " in topicId=" + topicId);
+		
+		DataProvider.getInstance().deleteTopicSectionRelation(topicId, sectionId);
+		
+		
+		// update completeSectionList
+		this.completeSectionList = DataProvider.getInstance().getAllSectionsInTopic(topic.getId());
+		
+
+	}
+
+
+	
+	private void loadSuggestionUserList() throws Exception{
+		this.suggestionUserList = new ArrayList<VDCUser>();
+		for(VDCUser user : DataverseUtils.getAllUsers()){
+			if(!topic.hasContributor(user.getId())){
+				this.suggestionUserList.add(user);
+			}
+		}
+	}
+	
+	public void reset(){
+		this.topic = null;
+		this.completeSectionList = null;
+	}
+	
+	public void filter(){	
+		this.filteredSectionList = new ArrayList<DBSection>();
+		for(DBSection section : this.completeSectionList){
+			if(!this.filteredSectionList.contains(section)){
+					
+				if( (StringUtils.isEmpty(dynastyFilter) || StringUtils.startsWith(section.getBook().getDynasty(), dynastyFilter)) &&
+						(StringUtils.isEmpty(level1Filter) || StringUtils.startsWith(section.getBook().getLevel1(), level1Filter)) &&
+						(StringUtils.isEmpty(level2Filter) || StringUtils.startsWith(section.getBook().getLevel2(), level2Filter)) &&
+						(StringUtils.isEmpty(bookIdFilter) || StringUtils.startsWith(section.getBookId(), bookIdFilter)) &&
+						(StringUtils.isEmpty(bookNameFilter) || StringUtils.startsWith(section.getBook().getName(), bookNameFilter)) &&
+						(StringUtils.isEmpty(periodFilter) || StringUtils.startsWith(section.getBook().getPeriod(), periodFilter)) &&
+						(StringUtils.isEmpty(sectionNameFilter) || StringUtils.startsWith(section.getName(), sectionNameFilter)) &&
+						(StringUtils.isEmpty(adminTypeFilter) || StringUtils.startsWith(section.getBook().getAdmin_type(), adminTypeFilter))
+								){
+					this.filteredSectionList.add(section);
+				}
+				
+			}
+		}
+			
+		if(completeSectionList.size() > 0){
+		
+			this.filteringMessage = this.filteredSectionList.size() + " section(s) listed after the filtering";
+
+			this.paginator.setCurrentPage(0);
+			this.paginator.resetNumberOfPages(filteredSectionList.size());
+			
+			this.updateCurrentSections();
+			
+		}else{
+			this.filteredSectionList = null;
+			this.filteringMessage = "";
+				
+			this.paginator.setCurrentPage(0);
+			this.paginator.resetNumberOfPages(0);
+		}
+		
+			
+	}
+	
+	
+	private void updateCurrentSections() {
+		/* developing... */
+		this.displaySectionList = this.filteredSectionList;
+		
+		/*
+		
+		this.paginator.initCount();
+		int startRecord = this.paginator.getCurrentPage()
+				* this.paginator.getItemsPerPage();
+		if(this.paginator.getNumberOfPages() == 0){
+			this.displaySectionList = new ArrayList<DBSection>();
+		}else if((this.paginator.getCurrentPage() + 1) == this.paginator.getNumberOfPages()){
+			int mod = this.filteredSectionList.size() % paginator.getItemsPerPage();
+			if(mod == 0){
+				this.displaySectionList = filteredSectionList.subList(startRecord, startRecord + this.paginator.getItemsPerPage());
+			}else{
+				this.displaySectionList = filteredSectionList.subList(startRecord, startRecord + mod);	
+			}
+			
+		}else{
+			this.displaySectionList = filteredSectionList.subList(startRecord, startRecord + this.paginator.getItemsPerPage());	
+		}
+		*/
+		
+		for(DBSection section : this.displaySectionList){
+			section.setBranches(this.branchesMap.get(section.getId()));
+		}
+		
+	
+	}
+	
+	
+
+	public void addSectionToTopic(Long _sectionId, Long _topicId) throws Exception {
+		logger.debug("selectedSectionId:" + _sectionId + ", selectedTopicId: " + _topicId);
+		
+		
+		// create a new record in TopicSectionRelation table 
+		String status = DataProvider.getInstance().updateTopicSectionRelation(_sectionId, _topicId);
+		
+		if (StringUtils.equals(status, "added") ) {
+			// TODO responding with names to user
+			addMsg("Added section [id=" + _sectionId + "] to the topic [id=" + _topicId + "]");
+		} else if (StringUtils.equals(status, "updated") ) {
+			addMsg("The section already in the topic");
+		} 
+	
+		this.reset();
+	}
+
+	
+	
+	
+	private void loadBranches(){
+		this.branchesMap = new HashMap<Long, List<LGBranch>>();
+		// List<LGBranch> list = DataProvider.getInstance().getBranches(getSessionBean().getUser().getId());
+		List<LGBranch> list = DataProvider.getInstance().getAllExistingBranches();
+		
+		for(LGBranch branch : list){
+			branch.loadTransientData();
+			if(this.branchesMap.get(branch.getSectionId()) == null){
+				this.branchesMap.put(branch.getSectionId(), new ArrayList<LGBranch>());
+			}
+			this.branchesMap.get(branch.getSectionId()).add(branch);
+		}
+	}
+	
+	public List<VDCUser> getContributors() {
+		return contributors;
+	}
+
+	public void setContributors(List<VDCUser> contributors) {
+		this.contributors = contributors;
+	}
+
+	public List<VDCUser> getSuggestionUserList() {
+		return suggestionUserList;
+	}
+	public void setSuggestionUserList(List<VDCUser> suggestionUserList) {
+		this.suggestionUserList = suggestionUserList;
+	}
+
+	public Long getUserId() {
+		return userId;
+	}
+
+	public void setUserId(Long userId) {
+		this.userId = userId;
+	}
+
+
+	public LGTopic getTopic() {
+		return topic;
+	}
+
+
+
+	public void setTopic(LGTopic topic) {
+		this.topic = topic;
+	}
+
+
+
+	public Long getTopicId() {
+		return topicId;
+	}
+
+
+
+	public void setTopicId(Long topicId) {
+		this.topicId = topicId;
+	}
+
+
+
+	public String getDynastyFilter() {
+		return dynastyFilter;
+	}
+
+
+
+	public void setDynastyFilter(String dynastyFilter) {
+		this.dynastyFilter = dynastyFilter;
+	}
+
+
+
+	public String getAdminTypeFilter() {
+		return adminTypeFilter;
+	}
+
+
+
+	public void setAdminTypeFilter(String adminTypeFilter) {
+		this.adminTypeFilter = adminTypeFilter;
+	}
+
+
+
+	public String getLevel1Filter() {
+		return level1Filter;
+	}
+
+
+
+	public void setLevel1Filter(String level1Filter) {
+		this.level1Filter = level1Filter;
+	}
+
+
+
+	public String getLevel2Filter() {
+		return level2Filter;
+	}
+
+
+
+	public void setLevel2Filter(String level2Filter) {
+		this.level2Filter = level2Filter;
+	}
+
+
+
+	public List<DBSection> getFilteredSectionList() {
+		return filteredSectionList;
+	}
+
+
+
+	public void setFilteredSectionList(List<DBSection> filteredSectionList) {
+		this.filteredSectionList = filteredSectionList;
+	}
+
+
+
+	public List<DBSection> getDisplaySectionList() {
+		return displaySectionList;
+	}
+
+
+
+	public void setDisplaySectionList(List<DBSection> displaySectionList) {
+		this.displaySectionList = displaySectionList;
+	}
+
+
+
+	public DataPaginator getPaginator() {
+		return paginator;
+	}
+
+
+
+	public void setPaginator(DataPaginator paginator) {
+		this.paginator = paginator;
+	}
+
+
+
+	public String getFilteringMessage() {
+		return filteringMessage;
+	}
+
+
+
+	public void setFilteringMessage(String filteringMessage) {
+		this.filteringMessage = filteringMessage;
+	}
+
+
+
+	public Map<Long, List<LGBranch>> getBranchesMap() {
+		return branchesMap;
+	}
+
+
+
+	public void setBranchesMap(Map<Long, List<LGBranch>> branchesMap) {
+		this.branchesMap = branchesMap;
+	}
+
+	public String getBookNameFilter() {
+		return bookNameFilter;
+	}
+
+
+	public void setBookNameFilter(String bookNameFilter) {
+		this.bookNameFilter = bookNameFilter;
+	}
+
+
+
+	public String getBookIdFilter() {
+		return bookIdFilter;
+	}
+
+
+
+	public void setBookIdFilter(String bookIdFilter) {
+		this.bookIdFilter = bookIdFilter;
+	}
+
+
+
+	public String getPeriodFilter() {
+		return periodFilter;
+	}
+
+
+
+	public void setPeriodFilter(String periodFilter) {
+		this.periodFilter = periodFilter;
+	}
+
+
+
+	public String getSectionNameFilter() {
+		return sectionNameFilter;
+	}
+
+
+
+	public void setSectionNameFilter(String sectionNameFilter) {
+		this.sectionNameFilter = sectionNameFilter;
+	}
+
+
+
+	public List<DBSection> getCompleteSectionList() {
+		return completeSectionList;
+	}
+
+
+
+	public void setCompleteSectionList(List<DBSection> completeSectionList) {
+		this.completeSectionList = completeSectionList;
+	}
+
+
+
+	/////// Sorting
+	
+
+	public void sortByBookNameUp(){
+		Collections.sort(this.completeSectionList, new SortSectionByBookName());
+		filter();
+	}
+	
+	public void sortByBookNameDown(){
+		Collections.sort(this.completeSectionList, new SortSectionByBookName());
+		Collections.reverse(this.completeSectionList);
+		filter();
+	}
+	
+	public void sortBySectionNameUp(){
+		Collections.sort(this.completeSectionList);
+		filter();
+	}
+	
+	public void sortBySectionNameDown(){
+		Collections.sort(this.completeSectionList);
+		Collections.reverse(this.completeSectionList);
+		filter();
+	}
+	
+
+	public void sortByPeriodUp(){
+		Collections.sort(this.completeSectionList, new SortSectionByPeriod());
+		filter();
+	}
+	
+	public void sortByPeriodDown(){
+		Collections.sort(this.completeSectionList, new SortSectionByPeriod());
+		Collections.reverse(this.completeSectionList);
+		filter();
+	}
+	
+	
+	
+	public void sortBySectionIdUp(){
+		Collections.sort(this.completeSectionList, new SortSectionById());
+		this.filter();
+	}
+	
+	public void sortBySectionIdDown(){
+		Collections.sort(this.completeSectionList, new SortSectionById());
+		Collections.reverse(completeSectionList);
+		this.filter();
+	}
+	
+
+	
+	public void sortByDynastyUp(){
+		Collections.sort(this.completeSectionList, new SortSectionByDynasty());
+		filter();
+	}
+	
+	public void sortByDynastyDown(){
+		Collections.sort(this.completeSectionList, new SortSectionByDynasty());
+		Collections.reverse(completeSectionList);
+		filter();
+	}
+	
+	public void sortByBookIdUp(){
+		Collections.sort(this.completeSectionList, new SortSectionByBookId());
+		filter();
+	}
+	
+	public void sortByBookIdDown(){
+		Collections.sort(this.completeSectionList, new SortSectionByBookId());
+		Collections.reverse(completeSectionList);
+		filter();
+	}
+	
+	public void sortByLevel1Up(){
+		Collections.sort(this.completeSectionList, new SortSectionByLevel1());
+		filter();
+	}
+	
+	public void sortByLevel1Down(){
+		Collections.sort(this.completeSectionList, new SortSectionByLevel1());
+		Collections.reverse(completeSectionList);
+		filter();
+	}
+	
+	public void sortByLevel2Up(){
+		Collections.sort(this.completeSectionList, new SortSectionByLevel2());
+		filter();
+	}
+	
+	public void sortByLevel2Down(){
+		Collections.sort(this.completeSectionList, new SortSectionByLevel2());
+		Collections.reverse(completeSectionList);
+		filter();
+	}
+	
+	public void sortByAdminTypeUp(){
+		Collections.sort(this.completeSectionList, new SortSectionByAdminType());
+		filter();
+	}
+	
+	public void sortByAdminTypeDown(){
+		Collections.sort(this.completeSectionList, new SortSectionByAdminType());
+		Collections.reverse(completeSectionList);
+		filter();
+	}
+	
+	public void sortByStartPageUp(){
+		Collections.sort(this.completeSectionList, new SortSectionByStartPage());
+		filter();
+	}
+	
+	public void sortByStartPageDown(){
+		Collections.sort(this.completeSectionList, new SortSectionByStartPage());
+		Collections.reverse(completeSectionList);
+		filter();
+	}
+
+	
+	
+
+	
+	
+}
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/main/java/de/mpiwg/web/search/SortSectionByLevel2.java	Thu Dec 17 13:44:08 2015 +0100
@@ -0,0 +1,15 @@
+package de.mpiwg.web.search;
+
+import java.util.Comparator;
+
+import de.mpiwg.gazetteer.db.DBSection;
+
+public class SortSectionByLevel2 implements Comparator<DBSection>{
+	
+	public int compare(DBSection o1, DBSection o2) {
+		if(o1.getBook() == null || o2.getBook() == null){
+			return o1.getName().compareTo(o2.getName());	
+		}
+		return o1.getBook().getLevel1().compareTo(o2.getBook().getLevel1());
+	}
+}
--- a/src/main/resources/hibernate.cfg.xml	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/resources/hibernate.cfg.xml	Thu Dec 17 13:44:08 2015 +0100
@@ -37,7 +37,10 @@
 	    <mapping class="de.mpiwg.gazetteer.bo.LGBranch"/>
 	    <mapping class="de.mpiwg.gazetteer.bo.LGFile"/>
 		<mapping class="de.mpiwg.gazetteer.bo.LGFullTextSearchFile"/>
-		<mapping class="de.mpiwg.gazetteer.bo.Sequence"/>	  	    
+		<mapping class="de.mpiwg.gazetteer.bo.Sequence"/>	  
+		<mapping class="de.mpiwg.gazetteer.bo.LGTopic"/>
+		<mapping class="de.mpiwg.gazetteer.bo.LGTopicSectionRelation"/>
+	    	    
 	</session-factory>
 
 </hibernate-configuration>
--- a/src/main/webapp/componentes/template.jsp	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/webapp/componentes/template.jsp	Thu Dec 17 13:44:08 2015 +0100
@@ -71,6 +71,7 @@
 	</div>
 	
 	<div class="menu">
+	    <a href="<%=sessionBean.getApplicationBean().getRootServer()%>/pages/topicList.jsp">Topics</a>
 	    <a href="<%=sessionBean.getApplicationBean().getRootServer()%>/pages/home.jsp">Tasks</a>
 	    <!-- 
 	    <a href="<%=sessionBean.getApplicationBean().getRootServer()%>/pages/createFile.jsp" class="current">Create File</a>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/main/webapp/methods/addSectionToTopic.jsp	Thu Dec 17 13:44:08 2015 +0100
@@ -0,0 +1,55 @@
+<%@page import="de.mpiwg.gazetteer.bo.LGTopic"%>
+<%@page import="de.mpiwg.gazetteer.db.DBSection"%>
+<%@page import="de.mpiwg.gazetteer.utils.DBService"%>
+<%@page import="de.mpiwg.gazetteer.utils.DataProvider"%>
+
+<jsp:useBean id="sessionBean" class="de.mpiwg.web.jsp.SessionBean" scope="session" />
+	
+<%
+	if(request.getParameter("sectionId") != null){
+		Long sectionId = Long.parseLong(request.getParameter("sectionId"));
+		
+		if(sectionId != 0){
+			
+			if (sessionBean.getTopicListPage().getCompleteTopicList() == null) {
+				sessionBean.getTopicListPage().loadParameters(request, response);
+				sessionBean.getTopicListPage().reloadTopics();
+			}
+			
+			
+%>
+	
+	<form name="addSectionToTopicForm" id="addSectionToTopicForm"
+		action="<%= sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
+		method="post">
+		<input name="bean" type="hidden" value="topicBean" /> 
+
+		<!-- TODO add section to selected topic -->
+		<input name="selectedSectionId" type="hidden" value="<%=request.getParameter("sectionId") %>" />
+				
+		<table class="dialogTable">
+			<tr>
+				<td><label style="font-weight: bold;">Topic Id</label></td>
+				<td><label style="font-weight: bold;">Name</label></td>
+			</tr>
+			
+			<% for (LGTopic topic : sessionBean.getTopicListPage().getCompleteTopicList() ) {%>
+			<tr>	
+				<td><%=topic.getId() %></td>
+				<td>
+					<%=topic.getNameEn() %>(<%=topic.getNameCh() %>)
+ 
+					<input type="image"
+							onclick="setAction0('addSectionToTopic', 'addSectionToTopicForm', 'selectedTopicId', '<%=topic.getId() %>');"
+							src="<%=sessionBean.getApplicationBean().getPlusImage() %>" width="20" height="20"/>
+				</td>						
+			</tr>
+			<% } %>
+		</table>
+	
+	</form>
+	
+<%
+		}
+	}
+%>
\ No newline at end of file
--- a/src/main/webapp/pages/books.jsp	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/webapp/pages/books.jsp	Thu Dec 17 13:44:08 2015 +0100
@@ -39,7 +39,7 @@
 		<input name="bean" type="hidden" value="booksBean" /> 
 					
 		<% if(sessionBean.getUser() == null) { %>
-			<label>You must login!</label>
+			<label class="subTitel">You must login!</label>
 		<% } else {
 			if (sessionBean.getBooksPage().getCompleteBookList() == null){ 
 				sessionBean.getBooksPage().loadParameters(request, response);
--- a/src/main/webapp/pages/branchPage.jsp	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/webapp/pages/branchPage.jsp	Thu Dec 17 13:44:08 2015 +0100
@@ -68,7 +68,7 @@
 	<div id="page">
 		
 		<% if(sessionBean.getUser() == null) { %>
-			<label>You must login!</label>
+			<label class="subTitel">You must login!</label>
 		<% } else { %>
 		
 			<% if(sessionBean.getBranchPage().getBranch() != null) { %>
@@ -99,14 +99,7 @@
 				</form>
 			</div>		
 			<% } %>
-			<!-- 
-			<form name="branchForm"
-				action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
-				method="post"
-				class="contentForm"
-				style="width: 70%; margin-left: auto;margin-right: auto;">
-				<input name="bean" type="hidden" value="branchBean" /> 
-				 -->
+		
 				<% if(sessionBean.getBranchPage().getBranch() == null) { %>
 					<label>Task not found!</label>
 				<% } else { %>
@@ -356,10 +349,7 @@
 				
 				<% } %>
 				
-					
-					
-				
-			<!-- </form> -->
+		
 		<% } %>
 	
 	</div>
--- a/src/main/webapp/pages/fullTextSearch.jsp	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/webapp/pages/fullTextSearch.jsp	Thu Dec 17 13:44:08 2015 +0100
@@ -1,6 +1,4 @@
-<%@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.DBContents"%>
 <%@page import="de.mpiwg.gazetteer.bo.LGFullTextSearchFile"%>
 
@@ -108,7 +106,7 @@
 	<div id="page">
 	
 		<% if(sessionBean.getUser() == null) { %>
-			<label>You must login!</label>
+			<label class="subTitel">You must login!</label>
 		<% } else { 
 			
 			if (sessionBean.getFullTextSearchPage().getFileList() == null){ 
--- a/src/main/webapp/pages/home.jsp	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/webapp/pages/home.jsp	Thu Dec 17 13:44:08 2015 +0100
@@ -19,7 +19,7 @@
 	<div id="page">
 		
 		<% if(sessionBean.getUser() == null) { %>
-			<label>You must login!</label>
+			<label class="subTitel">You must login!</label>
 		<% } else { 
 			
 			if (sessionBean.getHomePage().getCompleteBranchList() == null){ 
--- a/src/main/webapp/pages/search.jsp	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/webapp/pages/search.jsp	Thu Dec 17 13:44:08 2015 +0100
@@ -12,10 +12,37 @@
 
 	<jsp:include page="../componentes/headContent.jsp"/>	
 	
+	<script>
+	
+		$(function() {
+		
+			$( ".addSectionToTopic" ).click(function() {
+				var sectionId = $( this ).data('section-id');
+				
 
-	<script>
-		$(function() {
+				console.log("addSectionToTopic. sectionId = " + sectionId);
+						
+				var url0 = "<%=sessionBean.getApplicationBean().getRootServer()%>/methods/addSectionToTopic.jsp?sectionId=" + sectionId;
+				
+				
+				$.ajax( url0 )
+				.done(function(data) {
+					$( "#dialogAddSectionToTopicTable" ).replaceWith(data);
+					dialogAddSectionToTopic.dialog( "open" );
+				})
+			  	.fail(function() {
+			    	console.error("Error calling: " + query);
+			  	})
+					
+			});
 			
+			
+			var dialogAddSectionToTopic = $("#dialogAddSectionToTopic").dialog({
+				position: { my: "center", at: "top+400", of: window },	// TODO show dialog at cursor position?
+				autoOpen: false
+			});	  
+			
+		
 		    $( "#dialogMoreInfo" ).dialog({
 		        autoOpen: false,
 		        modal: true,
@@ -161,366 +188,382 @@
 	<jsp:include page="../componentes/template.jsp"/>
 
 	<div id="dialogMoreInfo" title="Section Details">
-	  <div id="dialogMoreInfoTable">XXXX</div>
+	  <div id="dialogMoreInfoTable"></div>
 	</div>
- 
+ 	
+	<div id="dialogAddSectionToTopic" title="Add Section into Topic:">
+		<div id="dialogAddSectionToTopicTable"></div>
+	</div>
 
 	<div id="page">
 	
-		<% if(sessionBean.getUser() == null) { %>
-			<label>You must login!</label>
-		<% } else { %>
-			
-		<label class="subTitel">Search for Sections</label>
-		
-		<form name="searchForm" id="searchForm"
-			action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
-			method="post"
-			class="contentForm">
-			<input name="bean" type="hidden" value="searchBean" /> 
-			
+		<% if (sessionBean.getUser() == null) { %>
+			<label class="subTitel">You must login!</label>
+		<%} else if (sessionBean.getSearchPage().getSearchIn() == null) { %>
+			<label class="subTitel">The searchPage().getSearchIn() is null.</label>
 			
-			<table style="width: 300px; margin-left: auto;margin-right: auto;">
-				<tr>
-					<td>
-						<input
-							id="searchTerm"
-							name="searchTerm"
-							type="text"
-							class="searchInput"
-							value="<%=sessionBean.getSearchPage().getSearchTerm()%>" />				
-					</td>
-					<td>
-						<input
-							type="image" 
-							onclick="setAction('search', 'searchForm');"
-							src="<%=sessionBean.getApplicationBean().getSearchImage()%>"/>
-					</td>
-				</tr>
-				<tr>
-					<td>
-						<label>Search in:</label>
-						<input type="radio" name="searchIn" value="0" <%= (sessionBean.getSearchPage().getSearchIn() == 0) ? "checked" : "" %>><label>Section Name</label>
-						<input type="radio" name="searchIn" value="1" <%= (sessionBean.getSearchPage().getSearchIn() == 1) ? "checked" : "" %>/><label>Book Name</label>
-					</td>
-				</tr>
-				<tr><td><label class="label"><%= (StringUtils.isNotEmpty(sessionBean.getSearchPage().getSearchMessage())) ? sessionBean.getSearchPage().getSearchMessage() : ""%></label></td></tr>
-				<tr><td><label class="label"><%= (StringUtils.isNotEmpty(sessionBean.getSearchPage().getFilteringMessage())) ? sessionBean.getSearchPage().getFilteringMessage() : ""%></label></td></tr>
-			</table>
-	
-	
-			<%
-				if (sessionBean.getSearchPage().getCompleteSectionList() != null) {
-			%>
-	
-	
-			<jsp:include page="../componentes/paginator.jsp">
-				<jsp:param name="formName" value="searchForm"/>
-			</jsp:include> 
+		<% } else { %>
+				
+			<label class="subTitel">Search for Sections</label>
+			
+			<form name="searchForm" id="searchForm"
+				action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
+				method="post"
+				class="contentForm">
+				<input name="bean" type="hidden" value="searchBean" /> 
+				
 				
-			<div class="tableDiv double-scroll">
-				<table class="pageTable">
-					<tbody>
-						<tr>
-							<th>
-								<table class="sortTable">
-									<tr>
-										<td><label class="tableTitle">Book Id</label></td>
-										<td>
-											<table>
-												<tr><td>
-													<input type="image" 
-														onclick="setAction('sortByBookIdUp', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
-												</td></tr>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByBookIdDown', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
-												</td></tr>
-											</table>
-										</td>
-									</tr>
-								</table>
-							</th>
-							<th>
-								<table class="sortTable">
-									<tr>
-										<td><label class="tableTitle">Book Name</label></td>
-										<td>
-											<table>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByBookNameUp', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
-												</td></tr>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByBookNameDown', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																	
-												</td></tr>
-											</table>
-										</td>
-									</tr>
-								</table>					
-							</th>
-							<th>
-								<table class="sortTable">
-									<tr>
-										<td><label class="tableTitle">Level 1</label></td>
-										<td>
-											<table>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByLevel1Up', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
-												</td></tr>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByLevel1Down', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
-												</td></tr>
-											</table>
-										</td>
-									</tr>
-									<tr>
-										<td>
-											<input type="text" class="filterInput" name="level1Filter" id="level1Filter" value="<%= sessionBean.getSearchPage().getLevel1Filter()%>"/>
-										</td>									
-										<td>
-											<input type="image"
-												onclick="setAction('filter', 'searchForm');"
-												src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
-										</td>							
-									</tr>								
-								</table>	
-							</th>
-							<th><label class="tableTitle">Level 2</label></th>
-							<th>
-								<table class="sortTable">
-									<tr>
-										<td><label class="tableTitle">Dynasty</label></td>
-										<td>
-											<table>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByDynastyUp', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
-												</td></tr>
-												<tr><td>
+				<table style="width: 300px; margin-left: auto;margin-right: auto;">
+					<tr>
+						<td>
+							<input
+								id="searchTerm"
+								name="searchTerm"
+								type="text"
+								class="searchInput"
+								value="<%=sessionBean.getSearchPage().getSearchTerm()%>" />				
+						</td>
+						<td>
+							<input
+								type="image" 
+								onclick="setAction('search', 'searchForm');"
+								src="<%=sessionBean.getApplicationBean().getSearchImage()%>"/>
+						</td>
+					</tr>
+					<tr>
+						<td>
+							<label>Search in:</label>
+							<input type="radio" name="searchIn" value="0" <%= (sessionBean.getSearchPage().getSearchIn() == 0) ? "checked" : "" %>/><label>Section Name</label>
+							<input type="radio" name="searchIn" value="1" <%= (sessionBean.getSearchPage().getSearchIn() == 1) ? "checked" : "" %>/><label>Book Name</label>
+							
+						</td>
+					</tr>
+					<tr><td><label class="label"><%= (StringUtils.isNotEmpty(sessionBean.getSearchPage().getSearchMessage())) ? sessionBean.getSearchPage().getSearchMessage() : ""%></label></td></tr>
+					<tr><td><label class="label"><%= (StringUtils.isNotEmpty(sessionBean.getSearchPage().getFilteringMessage())) ? sessionBean.getSearchPage().getFilteringMessage() : ""%></label></td></tr>
+				</table>
+		
+		
+				<% if (sessionBean.getSearchPage().getCompleteSectionList() != null) { %>
+		
+		
+					<jsp:include page="../componentes/paginator.jsp">
+						<jsp:param name="formName" value="searchForm"/>
+					</jsp:include> 
+						
+					<div class="tableDiv double-scroll">
+						<table class="pageTable">
+							<tbody>
+								<tr>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Book Id</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image" 
+																onclick="setAction('sortByBookIdUp', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByBookIdDown', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+										</table>
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Book Name</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByBookNameUp', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByBookNameDown', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																	
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+										</table>					
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Level 1</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByLevel1Up', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByLevel1Down', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+											<tr>
+												<td>
+													<input type="text" class="filterInput" name="level1Filter" id="level1Filter" value="<%= sessionBean.getSearchPage().getLevel1Filter()%>"/>
+												</td>									
+												<td>
 													<input type="image"
-														onclick="setAction('sortByDynastyDown', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
-												</td></tr>
-											</table>
-										</td>
-									</tr>
-									<tr>
-										<td>
-											<input type="text" class="filterInput" name="dynastyFilter" id="dynastyFilter" value="<%= sessionBean.getSearchPage().getDynastyFilter()%>"/>
-										</td>									
-										<td>
-											<input type="image"
-												onclick="setAction('filter', 'searchForm');"
-												src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
-										</td>							
-									</tr>
-								</table>					
-							</th>
-							<th>
-								<table class="sortTable">
-									<tr>
-										<td><label class="tableTitle">Period</label></td>
-										<td>
-											<table>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByPeriodUp', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
-												</td></tr>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByPeriodDown', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
-												</td></tr>
-											</table>
-										</td>
-									</tr>
-								</table>						
-							</th>
-							<th>
-								<table class="sortTable">
-									<tr>
-										<td><label class="tableTitle">Admin Type</label></td>
-										<td>
-											<table>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByAdminTypeUp', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
-												</td></tr>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByAdminTypeDown', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
-												</td></tr>
-											</table>
-										</td>
-									</tr>
-									<tr>
-										<td>
-											<input type="text" class="filterInput" name="adminTypeFilter" id="adminTypeFilter" value="<%= sessionBean.getSearchPage().getAdminTypeFilter()%>"/>
-										</td>									
-										<td>
-											<input type="image"
-												onclick="setAction('filter', 'searchForm');"
-												src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
-										</td>							
-									</tr>								
-								</table>	
-							</th>
-							<!-- 
-							<th>
-								<table class="sortTable">
-									<tr>
-										<td><label class="tableTitle">Volume</label></td>
-										<td>
-											<table>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByVolumeUp', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
-												</td></tr>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByVolumeDown', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
-												</td></tr>
-											</table>
-										</td>
-									</tr>
-								</table>						
-							</th>
-							-->
-							<th>
-								<table class="sortTable">
-									<tr>
-										<td><label class="tableTitle">Section Name</label></td>
-										<td>
-											<table>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortBySectionNameUp', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
-												</td></tr>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortBySectionNameDown', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
-												</td></tr>
-											</table>
-										</td>
-									</tr>
-								</table>	
-							</th>
-							<th>
-								<table class="sortTable">
-									<tr>
-										<td><label class="tableTitle">Pages</label></td>
-										<td>
-											<table>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByStartPageUp', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
-												</td></tr>
-												<tr><td>
-													<input type="image"
-														onclick="setAction('sortByStartPageDown', 'searchForm');"
-														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
-												</td></tr>
-											</table>
-										</td>
-									</tr>
-								</table>							
-							
-							</th>
-							<th><label class="tableTitle">View Page Text</label></th>
-							<th><label class="tableTitle">Existing Branches</label></th>
-						</tr>
-					
-		
-						<%
-							for (DBSection section : sessionBean.getSearchPage().getDisplaySectionList()) {
-						%>
-						<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">
-									<%=section.getBook().getId()%>
-								</a>	
-								<img alt="More Information" src="<%=sessionBean.getApplicationBean().getMoreInfoImage()%>" data-section-id="<%=section.getId()%>" class="moreInfo"/>
-							</td>
-							<td><%=section.getBook().getName()%></td>
-							<td><%=section.getBook().getLevel1()%></td>
-							<td><%=section.getBook().getLevel2()%></td>
-							<td><%=section.getBook().getDynasty()%></td>
-							<td><%=section.getBook().getPeriod()%></td>
-							<td><%=section.getBook().getAdmin_type() %></td>
-							<td><%=section.getName()%></td>
-							<td><%=section.getPages()%></td>
-							<td>
-								<a	href="#"
-									title="Show Section in Extraction Interface" 
-								 	onclick="sectionInExtractionInterface('<%=section.getId() %>', '<%=section.getName() %>', '<%=section.getBook().getId() %>', '<%=section.getBook().getName() %>', '<%=sessionBean.getUser().getId() %>', '<%=sessionBean.getApplicationBean().getExtractionInterfaceUrl()%>');">
-								 	<img alt="Show Section in Extraction Interface" src="<%=sessionBean.getApplicationBean().getShowImage()%>">
-								</a>
-							</td>
-							<td style="max-width:300px;">
-								<% if(section.getBranches() != null && !section.getBranches().isEmpty()) { %>
-									<table style="width:100%">
-										<% for(LGBranch branch : section.getBranches()) { %>
+														onclick="setAction('filter', 'searchForm');"
+														src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
+												</td>							
+											</tr>								
+										</table>	
+									</th>
+									<th><label class="tableTitle">Level 2</label></th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Dynasty</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByDynastyUp', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByDynastyDown', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
 											<tr>
 												<td>
-													<table style="width:100%">
-													<tr><td><%=branch.getFomattedLastChange() %></td></tr>
-													<tr><td><%=branch.getLabel() %></td></tr>
+													<input type="text" class="filterInput" name="dynastyFilter" id="dynastyFilter" value="<%= sessionBean.getSearchPage().getDynastyFilter()%>"/>
+												</td>									
+												<td>
+													<input type="image"
+														onclick="setAction('filter', 'searchForm');"
+														src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
+												</td>							
+											</tr>
+										</table>					
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Period</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByPeriodUp', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByPeriodDown', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+										</table>						
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Admin Type</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByAdminTypeUp', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByAdminTypeDown', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
 													</table>
 												</td>
-												<td style="max-width:150px">
-													<% if (branch.hasContributor(sessionBean.getUser().getId())) { %>
-													<a href="<%=sessionBean.getApplicationBean().getRootServer() %>/pages/branchPage.jsp?branchId=<%=branch.getId() %>" >
-														<img alt="Manage Branch" src="<%=sessionBean.getApplicationBean().getEditBranchImage()%>"/>
-													</a>												
-													<% } else { %>
-														<label>Contributors: <%=branch.getContributorsNameList() %></label>
-													<% } %>
+											</tr>
+											<tr>
+												<td>
+													<input type="text" class="filterInput" name="adminTypeFilter" id="adminTypeFilter" value="<%= sessionBean.getSearchPage().getAdminTypeFilter()%>"/>
+												</td>									
+												<td>
+													<input type="image"
+														onclick="setAction('filter', 'searchForm');"
+														src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
+												</td>							
+											</tr>								
+										</table>	
+									</th>
+									<!-- 
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Volume</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByVolumeUp', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByVolumeDown', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+										</table>						
+									</th>
+									-->
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Section Name</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortBySectionNameUp', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortBySectionNameDown', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
 												</td>
 											</tr>
-										<% } %>
-									</table>
-								<% } %>
-							</td>
-			
-						</tr>
-						<%
-							}
-						%>
-					</tbody>
-				</table>
-		
+										</table>	
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Pages</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByStartPageUp', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByStartPageDown', 'searchForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+										</table>							
+									
+									</th>
+									<th><label class="tableTitle">View Text</label></th>
+									<th><label class="tableTitle">Add to Topic</label></th>
+									<th><label class="tableTitle">Existing Tasks</label></th>
+								</tr>
+							
 				
-			<%
-				}
-			%>
-			
-			</div>
-			
-			<jsp:include page="../componentes/paginator.jsp">
-				<jsp:param name="formName" value="searchForm"/>
-			</jsp:include> 
-			
-		</form>
-	
+								<%
+									for (DBSection section : sessionBean.getSearchPage().getDisplaySectionList()) {
+								%>
+								<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">
+											<%=section.getBook().getId()%>
+										</a>	
+										<img alt="More Information" src="<%=sessionBean.getApplicationBean().getMoreInfoImage()%>" data-section-id="<%=section.getId()%>" class="moreInfo"/>
+									</td>
+									<td><%=section.getBook().getName()%></td>
+									<td><%=section.getBook().getLevel1()%></td>
+									<td><%=section.getBook().getLevel2()%></td>
+									<td><%=section.getBook().getDynasty()%></td>
+									<td><%=section.getBook().getPeriod()%></td>
+									<td><%=section.getBook().getAdmin_type() %></td>
+									<td><%=section.getName()%></td>
+									<td><%=section.getPages()%></td>
+									
+									
+									<!-- View text in Ext-Interface -->
+									<td>
+										<a href="#"
+											title="Show Section in Extraction Interface"
+										 	onclick="sectionInExtractionInterface('<%=section.getId() %>', '<%=section.getName() %>', '<%=section.getBook().getId() %>', '<%=section.getBook().getName() %>', '<%=sessionBean.getUser().getId() %>', '<%=sessionBean.getApplicationBean().getExtractionInterfaceUrl()%>');">
+										 	<img alt="Show Section in Extraction Interface" src="<%=sessionBean.getApplicationBean().getShowImage()%>">
+										</a>
+										
+									</td>
+									
+									<!-- Add to Topic -->
+									<td>
+										
+										<img width="10" height="10" alt="Add the section to Topic" src="<%=sessionBean.getApplicationBean().getPlusImage()%>" data-section-id="<%=section.getId()%>" class="addSectionToTopic">
+						
+									</td>
+									
+									
+									<!-- Existing Tasks -->
+									<td style="max-width:300px;">
+										<% if(section.getBranches() != null && !section.getBranches().isEmpty()) { %>
+											<table style="width:100%">
+												<% for(LGBranch branch : section.getBranches()) { %>
+													<tr>
+														<td>
+															<table style="width:100%">
+															<tr><td><%=branch.getFomattedLastChange() %></td></tr>
+															<tr><td><%=branch.getLabel() %></td></tr>
+															</table>
+														</td>
+														<td style="max-width:150px">
+															<% if (branch.hasContributor(sessionBean.getUser().getId())) { %>
+															<a href="<%=sessionBean.getApplicationBean().getRootServer() %>/pages/branchPage.jsp?branchId=<%=branch.getId() %>" >
+																<img alt="Manage Branch" src="<%=sessionBean.getApplicationBean().getEditBranchImage()%>"/>
+															</a>												
+															<% } else { %>
+																<label>Contributors: <%=branch.getContributorsNameList() %></label>
+															<% } %>
+														</td>
+													</tr>
+												<% } %>
+											</table>
+										<% } %>
+									</td>
+					
+								</tr>
+								<% } %>
+							</tbody>
+						</table>
+				
+						
+					<% } %>
+					
+					</div>
+					
+					<jsp:include page="../componentes/paginator.jsp">
+						<jsp:param name="formName" value="searchForm"/>
+					</jsp:include> 
+				
+			</form>
+
 		<% } %>
 		
 	</div>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/main/webapp/pages/topicList.jsp	Thu Dec 17 13:44:08 2015 +0100
@@ -0,0 +1,308 @@
+<%@page import="de.mpiwg.gazetteer.bo.LGTopic"%>
+<%@page import="org.apache.commons.lang.StringUtils"%>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+
+<jsp:useBean id="sessionBean" class="de.mpiwg.web.jsp.SessionBean" scope="session" />
+
+<html>
+
+<head>
+	<jsp:include page="../componentes/headContent.jsp"/>	
+	<script>
+		$(function() {
+			var dialogCreateTopic = $("#dialogCreateTopic").dialog(
+					{autoOpen: false}
+		  	);	  
+			$("#createTopic").button().on( "click", function() {
+				dialogCreateTopic.dialog( "open" );
+			});
+			
+			
+		});
+		
+	</script>
+</head>
+
+<body>
+
+	<jsp:include page="../componentes/template.jsp"/>
+
+	<div id="page">
+		
+		<% if(sessionBean.getUser() == null) { %>
+			<label class="subTitel">You must login!</label>
+		<% } else { 
+			
+			if (sessionBean.getTopicListPage().getCompleteTopicList() == null){ 
+				sessionBean.getTopicListPage().loadParameters(request, response);
+				sessionBean.getTopicListPage().reloadTopics();
+			}
+			
+		%>
+		
+		<% if(sessionBean.getTopicListPage().getCompleteTopicList().isEmpty()) { %>
+			<label class="subTitel">There's no topic in the system!</label>
+		<% } else { %>
+					
+			<div id="dialogCreateTopic" title="Create a New Topic:">
+				<form name="createTopicForm" id="createTopicForm"
+					action="<%= sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
+					method="post">
+					<input name="bean" type="hidden" value="topicListBean" /> 
+					<table>
+						<tr>
+							<td>
+								<span>Name (Eng)</span>
+							</td>
+							<td>
+								<input id="nameEn" name="nameEn" type="text" placeholder="e.g. Local Product"/>
+							</td>
+						</tr>
+						<tr>
+							<td>
+								<span>name (中文)</span>
+							</td>
+							<td>
+								<input id="nameCh" name="nameCh" type="text" placeholder="e.g. 物產"/>
+							</td>
+						</tr>
+						<tr>
+							<td>
+								<span>name (Pinyin)</span>
+							</td>
+							<td>
+								<input id="namePinyin" name="namePinyin" type="text" placeholder="e.g. wu chan"/>
+							</td>
+						</tr>
+						<tr>
+							<td>
+								<span>description</span>
+							</td>
+							<td>
+								<input id="description" name="description" type="text" placeholder=""/>
+							</td>
+						</tr>
+						<tr>
+							<td>
+								<button onclick="setAction('createTopic', 'createTopicForm'); document.getElementById('createTopicForm').submit();">Submit</button> 
+							</td>
+						</tr>
+								
+					</table>	
+				</form>
+			</div>	
+		
+			<form name="topicListForm" id="topicListForm" method="post"
+				action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp" >
+				<input name="bean" type="hidden" value="topicListBean" /> 
+				
+				<div class="subTitel">Topic 
+					<input type="image"
+						onclick="setAction('forceLoadTopics', 'topicListForm');"
+						src="<%=sessionBean.getApplicationBean().getRefreshImage()%>" width="20" height="20"/>
+			
+					<p class="label">You have <%= sessionBean.getTopicListPage().getTopicNumber() %> topics.</p>
+					<p class="label"><%= (StringUtils.isNotEmpty(sessionBean.getTopicListPage().getFilteringMessage())) ? sessionBean.getTopicListPage().getFilteringMessage() : ""%> </p>
+				</div>
+				
+				
+				
+				<button id="createTopic" type="button" class="lgButton">Create New Topic</button>		
+				
+				
+				<jsp:include page="../componentes/paginator.jsp">
+					<jsp:param name="formName" value="topicListForm"/>
+				</jsp:include> 
+		
+				<div class="tableDiv double-scroll">
+					<table class="pageTable" >
+						<tr>
+							<td>
+								<table class="sortTable">
+									<tr>
+										<td><label class="tableTitle">Topic ID</label></td>
+										<td>
+											<table>
+												<tr><td>
+													<input type="image" 
+														onclick="setAction('sortByTopicIdUp', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+												</td></tr>
+												<tr><td>
+													<input type="image"
+														onclick="setAction('sortByTopicIdDown', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+												</td></tr>
+											</table>
+										</td>
+									</tr>
+								</table>
+							</td>
+			
+							
+							<td>
+								<table class="sortTable">
+									<tr>
+										<td><label class="tableTitle">Name(Eng)</label></td>
+										<td>
+											<table>
+												<tr><td>
+													<input type="image" 
+														onclick="setAction('sortByNameEnUp', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+												</td></tr>
+												<tr><td>
+													<input type="image"
+														onclick="setAction('sortByNameEnDown', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+												</td></tr>
+											</table>
+										</td>
+									</tr>
+									
+								</table>
+							</td>
+							<td>
+								<table class="sortTable">
+									<tr>
+										<td><label class="tableTitle">Name(Chi)</label></td>
+										<td>
+											<table>
+												<tr><td>
+													<input type="image" 
+														onclick="setAction('sortByNameChUp', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+												</td></tr>
+												<tr><td>
+													<input type="image"
+														onclick="setAction('sortByNameChDown', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+												</td></tr>
+											</table>
+										</td>
+									</tr>
+									
+								</table>
+							</td>
+							<td>
+								<table class="sortTable">
+									<tr>
+										<td><label class="tableTitle">Name(Pinyin)</label></td>
+										<td>
+											<table>
+												<tr><td>
+													<input type="image" 
+														onclick="setAction('sortByNamePinyinUp', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+												</td></tr>
+												<tr><td>
+													<input type="image"
+														onclick="setAction('sortByNamePinyinDown', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+												</td></tr>
+											</table>
+										</td>
+									</tr>
+									
+								</table>
+							</td>
+							<td>
+								<table class="sortTable">
+									<tr>
+										<td><label class="tableTitle">Description</label></td>
+										<td>
+											<table>
+												<tr><td>
+													<input type="image" 
+														onclick="setAction('sortByDescriptionUp', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+												</td></tr>
+												<tr><td>
+													<input type="image"
+														onclick="setAction('sortByNDescriptionDown', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+												</td></tr>
+											</table>
+										</td>
+									</tr>
+									
+								</table>
+							</td>
+							<td><label class="tableTitle">Contributors</label></td>
+							<td>
+								<table class="sortTable">
+									<tr>
+										<td><label class="tableTitle">Last Modified</label></td>
+										<td>
+											<table>
+												<tr><td>
+													<input type="image" 
+														onclick="setAction('sortByLastModifiedUp', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>										
+												</td></tr>
+												<tr><td>
+													<input type="image"
+														onclick="setAction('sortByLastModifiedDown', 'topicListForm');"
+														src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+												</td></tr>
+											</table>
+										</td>
+									</tr>
+									
+								</table>
+							</td>
+							
+							
+							<td><label class="tableTitle">Manage</label></td>
+							<td><label class="tableTitle">Delete</label></td>
+						</tr>	
+						
+						<% for (LGTopic topic : sessionBean.getTopicListPage().getDisplayTopicList() ) {
+						%>
+						<tr>
+							<td><%=topic.getId() %></td>
+							<td><%=topic.getNameEn() %></td>
+							<td><%=topic.getNameCh() %></td>
+							<td><%=topic.getNamePinyin() %></td>
+							<td><%=topic.getDescription() %></td>
+							<td>
+								<table style="width:120px;">
+								<% for(String contributor : topic.getContributorsNameList()) { %>
+									<tr><td><label><%= contributor %></label></td></tr>
+								<% } %>
+								</table>
+							</td>
+							<td><%=topic.getFomattedLastChange() %></td>
+							
+						
+							<td>
+								<a href="<%=sessionBean.getApplicationBean().getRootServer() %>/pages/topicPage.jsp?topicId=<%=topic.getId() %>" >
+									<img alt="Manage Topic" src="<%=sessionBean.getApplicationBean().getEditBranchImage()%>"/>
+								</a>
+							</td>
+							<td>
+								<input type="image" 
+									onclick="<%=sessionBean.getApplicationBean().getJSConfirmationDelete() %> deleteTopic('deleteTopic', 'topicListForm', '<%=topic.getId() %>');" 
+									src="<%=sessionBean.getApplicationBean().getDeleteImage()%>"/>
+							</td>
+							
+					
+						</tr>
+						
+						<% } %>
+				
+					</table>
+
+				</div>
+				
+				
+				<jsp:include page="../componentes/paginator.jsp">
+					<jsp:param name="formName" value="topicListForm"/>
+				</jsp:include> 
+				
+			</form>
+		<% } %>
+		<% } %>
+	</div>
+	
+</body>
\ No newline at end of file
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/main/webapp/pages/topicPage.jsp	Thu Dec 17 13:44:08 2015 +0100
@@ -0,0 +1,541 @@
+<%@page import="de.mpiwg.gazetteer.dataverse.bo.VDCUser"%>
+<%@page import="de.mpiwg.gazetteer.bo.LGFile"%>
+<%@page import="de.mpiwg.gazetteer.bo.LGBranch"%>
+<%@page import="org.apache.commons.lang.StringUtils"%>
+<%@page import="de.mpiwg.gazetteer.db.DBSection"%>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+<jsp:useBean id="sessionBean" class="de.mpiwg.web.jsp.SessionBean" scope="session" />
+
+<html>
+<head>
+
+	<jsp:include page="../componentes/headContent.jsp"/>	
+	
+	<script>
+		  $(function() {
+			  
+			    $( "#dialogDataverse" ).dialog({
+			        autoOpen: false,
+			        modal: true,
+			        width: 600,
+			        position: { my: "center", at: "top", of: window },
+			        hide: {
+			          effect: "explode",
+			          duration: 1000
+			        }
+				});			
+				
+				$( ".get-studies" ).click(function() {
+					var fileId = $( this ).data('file-id');
+					
+					var url0 = "<%=sessionBean.getApplicationBean().getRootServer()%>/methods/getDataverseForm.jsp?fileId=" + fileId;
+
+					$.ajax( url0 )
+					.done(function(data) {
+						$( "#dialogDataverseTable" ).replaceWith(data);
+						$( "#dialogDataverse" ).dialog( "open" );
+					})
+				  	.fail(function() {
+				    	console.error("Error calling: " + query);
+				  	})
+					
+			    });					  
+			  
+			  
+			 var dialog = $( "#dialogAddContributors" ).dialog(
+					{autoOpen: false}
+		  	);	  
+			 
+			$( "#addContributors" ).button().on( "click", function() {
+			        dialog.dialog( "open" );
+			});	 
+		  });
+	</script>
+	
+</head>
+
+<body>
+	<jsp:include page="../componentes/template.jsp"/>
+	
+	
+
+	<div id="page">
+		
+		<% if(sessionBean.getUser() == null) { %>
+			<label class="subTitel">You must login!</label>
+		<% } else { %>
+		
+			<% if(sessionBean.getTopicPage().getCompleteSectionList() == null || sessionBean.getParameter("topicId") != null) {
+				sessionBean.getTopicPage().loadParameters(request, response);
+				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"
+							action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
+							method="post">
+							<input name="bean" type="hidden" value="topicBean" /> 
+						<table>
+							<% for(VDCUser user : sessionBean.getTopicPage().getSuggestionUserList()) { %>
+								<tr>
+									<td><a href="#" onclick="setAction0('addContributor', 'contributorsForm', 'userId', <%=user.getId() %>);document.getElementById('contributorsForm').submit();"><%=user.getUserName()%></a></td>
+								</tr>
+							<% } %>
+						</table>
+					</form>
+				</div>
+				
+				<!-- Topic Detail -->
+				<div>
+					<label class="subTitel">Topic "<%=sessionBean.getTopicPage().getTopic().getNameEn() %> (<%=sessionBean.getTopicPage().getTopic().getNameCh()%>)" Details </label>
+					
+					<table class="tableComponent">
+						<tr>
+							<td><label>Topic Id</label></td>
+							<td><label><%=sessionBean.getTopicPage().getTopic().getId() %></label></td>
+						</tr>
+						<tr>
+							<td><label>Topic Name(eng)</label></td>
+							<td><label><%=sessionBean.getTopicPage().getTopic().getNameEn() %></label></td>
+						</tr>
+						<tr>
+							<td><label>Topic Name(chi)</label></td>
+							<td><label><%=sessionBean.getTopicPage().getTopic().getNameCh() %></label></td>
+						</tr>
+						<tr>
+							<td><label>Topic Name(pinyin)</label></td>
+							<td><label><%=sessionBean.getTopicPage().getTopic().getNamePinyin() %></label></td>
+						</tr>
+						<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 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>
+							</td>
+						<tr>
+							<td><label>Created</label></td>
+							<td><label><%=sessionBean.getTopicPage().getTopic().getFomattedCreation() %></label></td>
+						</tr>
+						<tr>
+							<td><label>Last Modified</label></td>
+							<td><label><%=sessionBean.getTopicPage().getTopic().getFomattedLastChange() %></label></td>
+						</tr>
+						<tr>
+							<td><label>Creator</label></td>
+							<td><label><%=sessionBean.getTopicPage().getTopic().getUsername() %></label></td>
+						</tr>
+						<tr>
+							<td><label>Contributors</label></td>
+							<td>
+								<table>
+									<tr>
+										<td>
+											<form name="contributorForm"
+												action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
+												method="post">
+												<input name="bean" type="hidden" value="topicBean" />
+												<table style="width: 300px;" class="pageTable">
+													<% for(VDCUser contr : sessionBean.getTopicPage().getContributors()) { %>
+														<tr>
+															<td><label><%=contr.getUserName() %></label></td>
+															<td>
+																<input type="image" 
+																	onclick="<%=sessionBean.getApplicationBean().getJSConfirmationDelete() %> setAction0('removeContributor', 'contributorForm', 'userId',  <%=contr.getId() %>);" 
+																	src="<%=sessionBean.getApplicationBean().getDeleteImage()%>"/>																	
+															</td>
+														</tr>
+													<% } %>
+												</table>
+											</form>
+										</td>
+										<td>
+											<button id="addContributors" type="button" class="lgButton">Add Contributors</button>
+										</td>
+									</tr>
+								</table>
+							</td>
+						</tr>
+					</table>
+				</div>
+				
+				
+				
+				<!-- Sections in Topic -->
+				
+				<div>
+					<form name="topicSectionRelationForm"
+						action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp"
+						method="post">
+						<input name="bean" type="hidden" value="topicBean" />
+						
+						<label class="subTitel">Sections in Topic
+							<input type="image"
+								onclick="setAction('forceLoadTopicSectionRelation', 'topicSectionRelationForm');"
+								src="<%=sessionBean.getApplicationBean().getRefreshImage()%>" width="20" height="20"/>
+						</label>
+									
+						<div class="tableDiv double-scroll">
+							<table class="pageTable">
+								<tr>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Book Id</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByBookIdUp', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByBookIdDown', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+											<tr>
+												<td>
+													<input type="text" class="filterInput" name="bookIdFilter" id="bookIdFilter" value="<%= sessionBean.getTopicPage().getBookIdFilter() %>"/>
+												</td>									
+												<td>
+													<input type="image"
+														onclick="setAction('filter', 'topicSectionRelationForm');"
+														src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
+												</td>							
+											</tr>								
+										</table>										
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Book Name</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByBookNameUp', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByBookNameDown', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+											<tr>
+												<td>
+													<input type="text" class="filterInput" name="bookNameFilter" id="bookNameFilter" value="<%= sessionBean.getTopicPage().getBookNameFilter() %>"/>
+												</td>									
+												<td>
+													<input type="image"
+														onclick="setAction('filter', 'topicSectionRelationForm');"
+														src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
+												</td>							
+											</tr>								
+										</table>
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Level 1</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByLevel1Up', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByLevel1Down', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+											<tr>
+												<td>
+													<input type="text" class="filterInput" name="level1Filter" id="level1Filter" value="<%= sessionBean.getTopicPage().getLevel1Filter()%>"/>
+												</td>				
+												<td>
+													<input type="image"
+														onclick="setAction('filter', 'topicSectionRelationForm');"
+														src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
+												</td>
+											</tr>
+										</table>
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Level 2</label></td>
+												<td>
+													<table>
+														<tr>
+															<td>
+																<input type="image"
+																onclick="setAction('sortByLevel2Up', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+															</td>
+														</tr>
+														<tr>
+															<td>
+																<input type="image"
+																onclick="setAction('sortByLevel2Down', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+															</td>
+														</tr>
+													</table>
+												</td>
+											</tr>
+											<tr>
+												<td>
+													<input type="text" class="filterInput" name="level2Filter" id="level2Filter" value="<%= sessionBean.getTopicPage().getLevel2Filter()%>"/>
+												</td>									
+												<td>
+													<input type="image"
+														onclick="setAction('filter', 'topicSectionRelationForm');"
+														src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
+												</td>					
+											</tr>					
+										</table>
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Dynasty</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByDynastyUp', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByDynastyDown', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+											<tr>
+												<td>
+													<input type="text" class="filterInput" name="dynastyFilter" id="dynastyFilter" value="<%= sessionBean.getTopicPage().getDynastyFilter() %>"/>
+												</td>									
+												<td>
+													<input type="image"
+														onclick="setAction('filter', 'topicSectionRelationForm');"
+														src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
+												</td>
+											</tr>
+										</table>
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Period</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByPeriodUp', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByPeriodDown', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+											<tr>
+												<td>
+													<input type="text" class="filterInput" name="periodFilter" id="periodFilter" value="<%= sessionBean.getTopicPage().getPeriodFilter()%>"/>
+												</td>									
+												<td>
+													<input type="image"
+														onclick="setAction('filter', 'topicSectionRelationForm');"
+														src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
+												</td>							
+											</tr>
+										</table>
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Admin Type</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByAdminTypeUp', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByAdminTypeDown', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+											<tr>
+												<td>
+													<input type="text" class="filterInput" name="adminTypeFilter" id="adminTypeFilter" value="<%= sessionBean.getTopicPage().getAdminTypeFilter()%>"/>
+												</td>									
+												<td>
+													<input type="image"
+														onclick="setAction('filter', 'topicSectionRelationForm');"
+														src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
+												</td>							
+											</tr>
+										</table>
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Section Name</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortBySectionNameUp', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortBySectionNameDown', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+											<tr>
+												<td>
+													<input type="text" class="filterInput" name="sectionNameFilter" id="sectionNameFilter" value="<%= sessionBean.getTopicPage().getSectionNameFilter()%>"/>
+												</td>									
+												<td>
+													<input type="image"
+														onclick="setAction('filter', 'topicSectionRelationForm');"
+														src="<%=sessionBean.getApplicationBean().getFilterImage()%>"/>
+												</td>
+											</tr>
+										</table>
+									</th>
+									<th>
+										<table class="sortTable">
+											<tr>
+												<td><label class="tableTitle">Section Pages</label></td>
+												<td>
+													<table>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByStartPageUp', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getUpImage()%>"/>
+														</td></tr>
+														<tr><td>
+															<input type="image"
+																onclick="setAction('sortByStartPageDown', 'topicSectionRelationForm');"
+																src="<%=sessionBean.getApplicationBean().getDownImage()%>"/>																				
+														</td></tr>
+													</table>
+												</td>
+											</tr>
+										</table>
+									</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>	
+								
+								<% for(DBSection section : sessionBean.getTopicPage().getDisplaySectionList() ) { %>
+								<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">
+											<%=section.getBookId()%>
+										</a>	
+									</td>
+									<td><label><%= section.getBook().getName() %></label></td>
+									<td><label><%= section.getBook().getLevel1() %></label></td>
+									<td><label><%= section.getBook().getLevel2() %></label></td>
+									<td><label><%= section.getBook().getDynasty() %></label></td>
+									<td><label><%= section.getBook().getPeriod() %></label></td>
+									<td><label><%= section.getBook().getAdmin_type() %></label></td>
+									<td><label><%= section.getName() %></label></td>
+									<td><label><%= section.getPages() %></label></td>
+								
+									<!-- view text in Ext-Interface -->
+									<td>
+										<a	href="#"
+											title="Show Section in Extraction Interface" 
+										 	onclick="sectionInExtractionInterface('<%=section.getId() %>', '<%=section.getName() %>', '<%=section.getBookId() %>', '<%=section.getBook().getName() %>', '<%=sessionBean.getUser().getId() %>', '<%=sessionBean.getApplicationBean().getExtractionInterfaceUrl()%>');">
+										 	<img alt="Show Section in Extraction Interface" src="<%=sessionBean.getApplicationBean().getShowImage()%>">
+										</a>
+									</td>
+									
+									<!-- existing branches (tasks) -->
+									<td style="max-width:300px;">
+										<% if(section.getBranches() != null && !section.getBranches().isEmpty()) { %>
+											<table style="width:100%">
+												<% for(LGBranch branch : section.getBranches()) { %>
+													<tr>
+														<td>
+															<table style="width:100%">
+															<tr><td><%=branch.getFomattedLastChange() %></td></tr>
+															<tr><td><%=branch.getLabel() %></td></tr>
+															</table>
+														</td>
+														<td style="max-width:150px">
+															<% if (branch.hasContributor(sessionBean.getUser().getId())) { %>
+															<a href="<%=sessionBean.getApplicationBean().getRootServer() %>/pages/branchPage.jsp?branchId=<%=branch.getId() %>" >
+																<img alt="Manage Branch" src="<%=sessionBean.getApplicationBean().getEditBranchImage()%>"/>
+															</a>												
+															<% } else { %>
+																<label>Contributors: <%=branch.getContributorsNameList() %></label>
+															<% } %>
+														</td>
+													</tr>
+												<% } %>
+											</table>
+										<% } %>
+									</td>						
+									<td>
+										<input type="image" 
+											onclick="<%=sessionBean.getApplicationBean().getJSConfirmationDelete() %> setAction0('deleteSection', 'topicSectionRelationForm', 'sectionId', <%=section.getId() %>);" 
+											src="<%=sessionBean.getApplicationBean().getDeleteImage()%>"/>
+									</td>
+								</tr>
+								<% } %>				
+							</table>
+						</div>
+					</form>
+				</div>
+			
+											
+			<% } %>
+
+		<% } %>
+	
+	</div>
+	
+</body>
\ No newline at end of file
Binary file src/main/webapp/resources/.DS_Store has changed
--- a/src/main/webapp/resources/css/style.css	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/webapp/resources/css/style.css	Thu Dec 17 13:44:08 2015 +0100
@@ -268,6 +268,10 @@
     padding:0 0;
 }
 
+.filterInput{
+	width:60px;
+}
+
 #loading{
 	position:fixed;
 	z-index:2000;
Binary file src/main/webapp/resources/images/plus.png has changed
--- a/src/main/webapp/resources/js/proxyMethods.js	Mon Dec 07 17:06:57 2015 +0100
+++ b/src/main/webapp/resources/js/proxyMethods.js	Thu Dec 17 13:44:08 2015 +0100
@@ -35,6 +35,18 @@
 	setAction(action, formName);
 }
 
+function deleteTopic(action, formName, topicId){
+	
+	var theForm = document.forms[formName];
+    var input = document.createElement('input');
+    input.type = 'hidden';
+    input.name = 'topicId';
+    input.value = topicId;
+    theForm.appendChild(input);  
+	
+	setAction(action, formName);
+}
+
 function addContributor(action, formName, userId){
 	var theForm = document.forms[formName];
     var input = document.createElement('input');