Mercurial > hg > LGServices
diff src/main/webapp/pages/home.jsp @ 58:b8ad346e39a0
new: modify based on doc 'Improving LGServices interface.docx': user workflow improvement, functions like adding task into a topic and search suggestions.
| author | Zoe Hong <zhong@mpiwg-berlin.mpg.de> |
|---|---|
| date | Mon, 02 May 2016 12:03:30 +0200 |
| parents | 5cbe567a9c52 |
| children | 90d5e86c157d |
line wrap: on
line diff
--- a/src/main/webapp/pages/home.jsp Wed Feb 17 14:58:19 2016 +0100 +++ b/src/main/webapp/pages/home.jsp Mon May 02 12:03:30 2016 +0200 @@ -1,4 +1,5 @@ <%@page import="de.mpiwg.gazetteer.bo.LGBranch"%> +<%@page import="de.mpiwg.gazetteer.bo.LGTopicSectionRelation"%> <%@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"%> @@ -9,13 +10,259 @@ <head> <jsp:include page="../componentes/headContent.jsp"/> + <script> + $(function() { + + + $( ".addSectionToTopic" ).click(function() { + var sectionId = $( this ).data('section-id'); + console.log("addSectionToTopic. sectionId = " + sectionId); + + var url0 = "<%=sessionBean.getApplicationBean().getRootServer()%>/methods/addSectionToTopic.jsp?sectionId=" + sectionId + "&sourceBean=home"; + + $.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 + }); + + + + $("#level1Filter").autocomplete({ + source : function(request, response) { + $.ajax({ + url : "<%=sessionBean.getApplicationBean().getRootServer()%>/methods/taskLevel1Autocomplete.jsp", + type : "POST", + dataType : "json", + data : { + term : request.term + }, + success : function(data) { + + response($.map(data, function(item) { + return { + label : item.name, + value : item.value, + } + })); + }, + error : function(error) { + alert('error: ' + error); + } + }); + }, + minLength : 0 + }); + + $("#level2Filter").autocomplete({ + source : function(request, response) { + $.ajax({ + url : "<%=sessionBean.getApplicationBean().getRootServer()%>/methods/taskLevel2Autocomplete.jsp", + type : "POST", + dataType : "json", + data : { + term : request.term + }, + success : function(data) { + + response($.map(data, function(item) { + return { + label : item.name, + value : item.value, + } + })); + }, + error : function(error) { + alert('error: ' + error); + } + }); + }, + minLength : 0 + }); + + + $("#bookNameFilter").autocomplete({ + source : function(request, response) { + $.ajax({ + url : "<%=sessionBean.getApplicationBean().getRootServer()%>/methods/taskBookNameAutocomplete.jsp", + type : "POST", + dataType : "json", + data : { + term : request.term + }, + success : function(data) { + + response($.map(data, function(item) { + return { + label : item.name, + value : item.value, + } + })); + }, + error : function(error) { + alert('error: ' + error); + } + }); + }, + minLength : 0 + }); + + + $("#dynastyFilter").autocomplete({ + source : function(request, response) { + $.ajax({ + url : "<%=sessionBean.getApplicationBean().getRootServer()%>/methods/taskDynastyAutocomplete.jsp", + type : "POST", + dataType : "json", + data : { + term : request.term + }, + success : function(data) { + + response($.map(data, function(item) { + return { + label : item.name, + value : item.value, + } + })); + }, + error : function(error) { + alert('error: ' + error); + } + }); + }, + minLength : 0 + }); + + $("#periodFilter").autocomplete({ + source : function(request, response) { + $.ajax({ + url : "<%=sessionBean.getApplicationBean().getRootServer()%>/methods/taskPeriodAutocomplete.jsp", + type : "POST", + dataType : "json", + data : { + term : request.term + }, + success : function(data) { + + response($.map(data, function(item) { + return { + label : item.name, + value : item.value, + } + })); + }, + error : function(error) { + alert('error: ' + error); + } + }); + }, + minLength : 0 + }); + + $("#adminTypeFilter").autocomplete({ + source : function(request, response) { + $.ajax({ + url : "<%=sessionBean.getApplicationBean().getRootServer()%>/methods/taskAdminTypeAutocomplete.jsp", + type : "POST", + dataType : "json", + data : { + term : request.term + }, + success : function(data) { + + response($.map(data, function(item) { + return { + label : item.name, + value : item.value, + } + })); + }, + error : function(error) { + alert('error: ' + error); + } + }); + }, + minLength : 0 + }); + + $("#sectionNameFilter").autocomplete({ + source : function(request, response) { + $.ajax({ + url : "<%=sessionBean.getApplicationBean().getRootServer()%>/methods/taskSectionNameAutocomplete.jsp", + type : "POST", + dataType : "json", + data : { + term : request.term + }, + success : function(data) { + + response($.map(data, function(item) { + return { + label : item.name, + value : item.value, + } + })); + }, + error : function(error) { + alert('error: ' + error); + } + }); + }, + minLength : 0 + }); + + $("#labelFilter").autocomplete({ + source : function(request, response) { + $.ajax({ + url : "<%=sessionBean.getApplicationBean().getRootServer()%>/methods/taskLabelAutocomplete.jsp", + type : "POST", + dataType : "json", + data : { + term : request.term + }, + success : function(data) { + + response($.map(data, function(item) { + return { + label : item.name, + value : item.value, + } + })); + }, + error : function(error) { + alert('error: ' + error); + } + }); + }, + minLength : 0 + }); + + }); + + </script> </head> <body> <jsp:include page="../componentes/template.jsp"/> - + + <div id="dialogAddSectionToTopic" title="Add Section(s) into Topic:"> + <div id="dialogAddSectionToTopicTable"></div> + </div> + <div id="page"> <% if(sessionBean.getUser() == null) { %> @@ -24,15 +271,13 @@ if (sessionBean.getHomePage().getCompleteBranchList() == null){ sessionBean.getHomePage().loadParameters(request, response); - sessionBean.getHomePage().reloadBranches(); + //sessionBean.getHomePage().reloadBranches(); } - /* - sessionBean.getHomePage().loadParameters(request, response); sessionBean.getHomePage().reloadBranches(); - */ + %> - + <% if(sessionBean.getHomePage().getCompleteBranchList().isEmpty()) { %> @@ -43,7 +288,7 @@ action="<%=sessionBean.getApplicationBean().getRootServer()%>/proxy.jsp" > <input name="bean" type="hidden" value="homeBean" /> - <div class="subTitel">Your Task + <div class="subTitel">Your Tasks <input type="image" onclick="setAction('forceReloadBranches', 'homeForm');" src="<%=sessionBean.getApplicationBean().getRefreshImage()%>" width="20" height="20"/> @@ -58,6 +303,7 @@ <div class="tableDiv double-scroll"> <table class="pageTable" > <tr> + <!-- remove this to save space <td> <table class="sortTable"> <tr> @@ -79,7 +325,7 @@ </tr> </table> </td> - + --> <td> <table class="sortTable"> <tr> @@ -132,7 +378,7 @@ </tr> <tr> <td> - <input type="text" name="bookNameFilter" value="<%= sessionBean.getHomePage().getBookNameFilter()%>" size="8"/> + <input type="text" name="bookNameFilter" id="bookNameFilter" value="<%= sessionBean.getHomePage().getBookNameFilter()%>" size="8"/> </td> <td> <input type="image" @@ -164,7 +410,7 @@ </tr> <tr> <td> - <input type="text" name="level1Filter" value="<%= sessionBean.getHomePage().getLevel1Filter()%>" size="8"/> + <input type="text" class="filterInput" name="level1Filter" id="level1Filter" value="<%= sessionBean.getHomePage().getLevel1Filter()%>" size="8"/> </td> <td> <input type="image" @@ -195,7 +441,7 @@ </tr> <tr> <td> - <input type="text" name="level2Filter" value="<%= sessionBean.getHomePage().getLevel2Filter()%>" size="8"/> + <input type="text" name="level2Filter" id="level2Filter" value="<%= sessionBean.getHomePage().getLevel2Filter()%>" size="8"/> </td> <td> <input type="image" @@ -226,7 +472,7 @@ </tr> <tr> <td> - <input type="text" name="dynastyFilter" value="<%= sessionBean.getHomePage().getDynastyFilter()%>" size="8"/> + <input type="text" name="dynastyFilter" id="dynastyFilter" value="<%= sessionBean.getHomePage().getDynastyFilter()%>" size="8"/> </td> <td> <input type="image" @@ -257,7 +503,7 @@ </tr> <tr> <td> - <input type="text" name="periodFilter" value="<%= sessionBean.getHomePage().getPeriodFilter()%>" size="8"/> + <input type="text" name="periodFilter" id="periodFilter" value="<%= sessionBean.getHomePage().getPeriodFilter()%>" size="8"/> </td> <td> <input type="image" @@ -288,7 +534,7 @@ </tr> <tr> <td> - <input type="text" name="adminTypeFilter" value="<%= sessionBean.getHomePage().getAdminTypeFilter()%>" size="8"/> + <input type="text" name="adminTypeFilter" id="adminTypeFilter" value="<%= sessionBean.getHomePage().getAdminTypeFilter()%>" size="8"/> </td> <td> <input type="image" @@ -319,7 +565,7 @@ </tr> <tr> <td> - <input type="text" name="sectionNameFilter" value="<%= sessionBean.getHomePage().getSectionNameFilter()%>" size="8"/> + <input type="text" name="sectionNameFilter" id="sectionNameFilter" value="<%= sessionBean.getHomePage().getSectionNameFilter()%>" size="8"/> </td> <td> <input type="image" @@ -371,7 +617,7 @@ </tr> <tr> <td> - <input type="text" name="labelFilter" size="20" value="<%= sessionBean.getHomePage().getLabelFilter()%>" size="8"/> + <input type="text" name="labelFilter" id="labelFilter" size="20" value="<%= sessionBean.getHomePage().getLabelFilter()%>" size="8"/> </td> <td> <input type="image" @@ -385,7 +631,7 @@ <td> <table class="sortTable"> <tr> - <td><label class="tableTitle">Last Modified</label></td> + <td><label class="tableTitle">Last Saved</label></td> <td> <table> <tr><td> @@ -404,7 +650,7 @@ </table> </td> - <td><label class="tableTitle">Extraction Interface</label></td> + <td><label class="tableTitle">Load Text</label></td> <td> <table class="sortTable"> <tr> @@ -430,13 +676,13 @@ </td> <td><label class="tableTitle">Manage</label></td> + <td><label class="tableTitle">Add to Topic</label></td> <td><label class="tableTitle">Delete</label></td> </tr> <% for (LGBranch branch : sessionBean.getHomePage().getDisplayBranchList() ) { %> <tr> - <td><%=branch.getId() %></td> <td><%=branch.getBook().getId() %></td> <td><%=branch.getBook().getName() %></td> <td><%=branch.getBook().getLevel1() %></td> @@ -461,7 +707,7 @@ </td> <td><%=branch.getFomattedLastChange() %></td> <td> - <a onclick="branchInExtractionInterface('<%=branch.getId() %>', '<%=branch.getCurrentLastFileId() %>', '<%=branch.getSectionId() %>', '<%=branch.getSection().getName() %>', '<%=branch.getBook().getId() %>', '<%=branch.getBook().getName() %>', '<%=sessionBean.getUser().getId() %>', '<%=sessionBean.getApplicationBean().getExtractionInterfaceUrl() %>');"> + <a onclick="branchInExtractionInterface('<%=branch.getId() %>', '<%=branch.getCurrentLastFileId() %>', '<%=branch.getSectionId() %>', '<%=branch.getSection().getName() %>', '<%=branch.getBook().getId() %>', '<%=branch.getBook().getName() %>', '<%=sessionBean.getUser().getId() %>', '<%=sessionBean.getApplicationBean().getExtractionInterfaceUrl()%>');"> <img title="Show Task in Extraction Interface" src="<%=sessionBean.getApplicationBean().getShowImage()%>"/> </a> </td> @@ -469,11 +715,44 @@ <td> <%= (branch.isPublished()) ? "V":"" %> </td> + + <!-- Manage --> <td> <a href="<%=sessionBean.getApplicationBean().getRootServer() %>/pages/branchPage.jsp?branchId=<%=branch.getId() %>" > <img title="Manage the task" src="<%=sessionBean.getApplicationBean().getEditBranchImage()%>"/> </a> </td> + + <!-- Add to Topic --> + <td style="max-width:300px;"> + <!-- existing topic --> + <% if(branch.getSection().getTopicSectionRelation() != null && !branch.getSection().getTopicSectionRelation().isEmpty()) { %> + <lable>Already in topic: </lable> + <table style="width:100%"> + <% for(LGTopicSectionRelation relation : branch.getSection().getTopicSectionRelation()) { %> + <tr> + <td> + <table style="width:100%; min-width:100px"> + <tr><td><%=relation.getTopic().info() %></td></tr> + </table> + </td> + <td style="max-width:150px"> + + <a href="<%=sessionBean.getApplicationBean().getRootServer() %>/pages/topicPage.jsp?topicId=<%=relation.getTopicId() %>" > + <img title="Manage Topic" src="<%=sessionBean.getApplicationBean().getEditBranchImage()%>"/> + </a> + + </td> + </tr> + <% } %> + </table> + <% } %> + + <img width="10" height="10" title="Add the section to Topic" src="<%=sessionBean.getApplicationBean().getPlusImage()%>" data-section-id="<%=branch.getSection().getId()%>" class="addSectionToTopic"> + + </td> + + <!-- Delete --> <td> <input type="image" title="Delete it" onclick="<%=sessionBean.getApplicationBean().getJSConfirmationDelete() %> deleteBranch('deleteBranch', 'homeForm', '<%=branch.getId() %>');"