0ct0pu5/fess
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix #902

Browse source
This commit is contained in:
Kaoru FUZITA 2017-02-22 11:55:11 +09:00 • committed by Shinsuke Sugaya
parent e745c70f19
commit 049f024dd5
7 changed files with 223 additions and 311 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

94
src/main/webapp/WEB-INF/view/common/searchOptions.jsp Executable file
View file

@ -0,0 +1,94 @@
<%@page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%>
<h3 id="searchOptionsLabel">
<la:message key="labels.search_options" />
</h3>
<div>
<fieldset class="form-group">
<label for="contentNum"><la:message key="labels.index_num" /></label>
<la:select property="num" styleId="numSearchOption"
styleClass="form-control">
<option value="">
<la:message key="labels.search_result_select_num" />
</option>
<la:option value="10">10</la:option>
<la:option value="20">20</la:option>
<la:option value="30">30</la:option>
<la:option value="40">40</la:option>
<la:option value="50">50</la:option>
<la:option value="100">100</la:option>
</la:select>
</fieldset>
<fieldset class="form-group">
<label for="contentSort"><la:message key="labels.index_sort" /></label>
<la:select property="sort" styleId="sortSearchOption"
styleClass="form-control">
<option value="">
<la:message key="labels.search_result_select_sort" />
</option>
<la:option value="score.desc">
<la:message key="labels.search_result_sort_score_desc" />
</la:option>
<la:option value="filename.asc">
<la:message key="labels.search_result_sort_filename_asc" />
</la:option>
<la:option value="filename.desc">
<la:message key="labels.search_result_sort_filename_desc" />
</la:option>
<la:option value="created.asc">
<la:message key="labels.search_result_sort_created_asc" />
</la:option>
<la:option value="created.desc">
<la:message key="labels.search_result_sort_created_desc" />
</la:option>
<la:option value="content_length.asc">
<la:message key="labels.search_result_sort_content_length_asc" />
</la:option>
<la:option value="content_length.desc">
<la:message key="labels.search_result_sort_content_length_desc" />
</la:option>
<la:option value="last_modified.asc">
<la:message key="labels.search_result_sort_last_modified_asc" />
</la:option>
<la:option value="last_modified.desc">
<la:message key="labels.search_result_sort_last_modified_desc" />
</la:option>
<c:if test="${searchLogSupport}">
<la:option value="click_count.asc">
<la:message key="labels.search_result_sort_click_count_asc" />
</la:option>
<la:option value="click_count.desc">
<la:message key="labels.search_result_sort_click_count_desc" />
</la:option>
</c:if>
<c:if test="${favoriteSupport}">
<la:option value="favorite_count.asc">
<la:message key="labels.search_result_sort_favorite_count_asc" />
</la:option>
<la:option value="favorite_count.desc">
<la:message key="labels.search_result_sort_favorite_count_desc" />
</la:option>
</c:if>
</la:select>
</fieldset>
<fieldset class="form-group">
<label for="contentLang"><la:message key="labels.index_lang" /></label>
<la:select property="lang" styleId="langSearchOption" multiple="true"
styleClass="form-control">
<c:forEach var="item" items="${langItems}">
<la:option value="${f:u(item.value)}">${f:h(item.label)}</la:option>
</c:forEach>
</la:select>
</fieldset>
<c:if test="${displayLabelTypeItems}">
<fieldset class="form-group">
<label for="contentLabelType"><la:message
key="labels.index_label" /></label>
<la:select property="fields.label" styleId="labelTypeSearchOption"
multiple="true" styleClass="form-control">
<c:forEach var="item" items="${labelTypeItems}">
<la:option value="${f:u(item.value)}">${f:h(item.label)}</la:option>
</c:forEach>
</la:select>
</fieldset>
</c:if>
</div>

109
src/main/webapp/WEB-INF/view/header.jsp
View file

@ -73,121 +73,22 @@ ${fe:facetForm()}${fe:geoForm()}
</nav>
<div id="searchOptions" class="control-options">
<div class="container">
<h4 id="searchOptionsLabel">
<la:message key="labels.search_options" />
</h4>
<jsp:include page="common/searchOptions.jsp" />
<div>
<fieldset class="form-group">
<label for="contentNum"><la:message key="labels.index_num" /></label>
<la:select property="num" styleId="numSearchOption"
styleClass="form-control">
<option value="">
<la:message key="labels.search_result_select_num" />
</option>
<la:option value="10">10</la:option>
<la:option value="20">20</la:option>
<la:option value="30">30</la:option>
<la:option value="40">40</la:option>
<la:option value="50">50</la:option>
<la:option value="100">100</la:option>
</la:select>
</fieldset>
<fieldset class="form-group">
<label for="contentSort"><la:message
key="labels.index_sort" /></label>
<la:select property="sort" styleId="sortSearchOption"
styleClass="form-control">
<option value="">
<la:message key="labels.search_result_select_sort" />
</option>
<la:option value="score.desc">
<la:message key="labels.search_result_sort_score_desc" />
</la:option>
<la:option value="filename.asc">
<la:message key="labels.search_result_sort_filename_asc" />
</la:option>
<la:option value="filename.desc">
<la:message key="labels.search_result_sort_filename_desc" />
</la:option>
<la:option value="created.asc">
<la:message key="labels.search_result_sort_created_asc" />
</la:option>
<la:option value="created.desc">
<la:message key="labels.search_result_sort_created_desc" />
</la:option>
<la:option value="content_length.asc">
<la:message key="labels.search_result_sort_content_length_asc" />
</la:option>
<la:option value="content_length.desc">
<la:message key="labels.search_result_sort_content_length_desc" />
</la:option>
<la:option value="last_modified.asc">
<la:message key="labels.search_result_sort_last_modified_asc" />
</la:option>
<la:option value="last_modified.desc">
<la:message key="labels.search_result_sort_last_modified_desc" />
</la:option>
<c:if test="${searchLogSupport}">
<la:option value="click_count.asc">
<la:message key="labels.search_result_sort_click_count_asc" />
</la:option>
<la:option value="click_count.desc">
<la:message key="labels.search_result_sort_click_count_desc" />
</la:option>
</c:if>
<c:if test="${favoriteSupport}">
<la:option value="favorite_count.asc">
<la:message key="labels.search_result_sort_favorite_count_asc" />
</la:option>
<la:option value="favorite_count.desc">
<la:message key="labels.search_result_sort_favorite_count_desc" />
</la:option>
</c:if>
</la:select>
</fieldset>
<fieldset class="form-group">
<label for="contentLang"><la:message
key="labels.index_lang" /></label>
<la:select property="lang" styleId="langSearchOption"
multiple="true" styleClass="form-control">
<c:forEach var="item" items="${langItems}">
<la:option value="${f:u(item.value)}">
${f:h(item.label)}
</la:option>
</c:forEach>
</la:select>
</fieldset>
<c:if test="${displayLabelTypeItems}">
<fieldset class="form-group">
<label for="contentLabelType"><la:message
key="labels.index_label" /></label>
<la:select property="fields.label" styleId="labelTypeSearchOption"
multiple="true" styleClass="form-control">
<c:forEach var="item" items="${labelTypeItems}">
<la:option value="${f:u(item.value)}">
${f:h(item.label)}
</la:option>
</c:forEach>
</la:select>
</fieldset>
</c:if>
</div>
<div>
<button class="btn btn-secondary" id="searchOptionsClearButton">
<button type="button" class="btn btn-secondary" id="searchOptionsClearButton">
<la:message key="labels.search_options_clear" />
</button>
<button class="btn btn-primary" type="submit">
<button type="submit" class="btn btn-primary">
<i class="fa fa-search"></i>
<la:message key="labels.search" />
</button>
<button class="btn btn-secondary pull-right"
<button type="button" class="btn btn-secondary pull-right"
data-toggle="control-options" data-target="#searchOptions"
id="searchOptionsCloseButton">
<i class="fa fa-angle-double-right"></i>
<i class="fa fa-times-circle"></i>
<la:message key="labels.search_options_close" />
</button>
</div>
</div>
</div>
<!-- /#searchOptions -->
</la:form>

279
src/main/webapp/WEB-INF/view/index.jsp
View file

@ -18,71 +18,71 @@
type="text/css" />
</head>
<body>
<nav class="navbar navbar-dark bg-inverse navbar-static-top pos-f-t">
<div class="container">
<ul class="nav navbar-nav pull-right">
<c:choose>
<c:when test="${!empty username && username != 'guest'}">
<li class="nav-item">
<div class="dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown"
href="#" role="button" aria-haspopup="true"
aria-expanded="false"> <i class="fa fa-user"></i>${username}
</a>
<div class="dropdown-menu" aria-labelledby="userMenu">
<c:if test="${editableUser == true}">
<la:link href="/profile" styleClass="dropdown-item">
<la:message key="labels.profile" />
<la:form styleClass="form-stacked" action="search" method="get"
styleId="searchForm">
${fe:facetForm()}${fe:geoForm()}
<nav class="navbar navbar-dark bg-inverse navbar-static-top pos-f-t">
<div id="content" class="container">
<ul class="nav navbar-nav pull-right">
<c:choose>
<c:when test="${!empty username && username != 'guest'}">
<li class="nav-item">
<div class="dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown"
href="#" role="button" aria-haspopup="true"
aria-expanded="false"> <i class="fa fa-user"></i>${username}
</a>
<div class="dropdown-menu" aria-labelledby="userMenu">
<c:if test="${editableUser == true}">
<la:link href="/profile" styleClass="dropdown-item">
<la:message key="labels.profile" />
</la:link>
</c:if>
<c:if test="${adminUser == true}">
<la:link href="/admin" styleClass="dropdown-item">
<la:message key="labels.administration" />
</la:link>
</c:if>
<la:link href="/logout/" styleClass="dropdown-item">
<la:message key="labels.logout" />
</la:link>
</c:if>
<c:if test="${adminUser == true}">
<la:link href="/admin" styleClass="dropdown-item">
<la:message key="labels.administration" />
</la:link>
</c:if>
<la:link href="/logout/" styleClass="dropdown-item">
<la:message key="labels.logout" />
</la:link>
</div>
</div>
</div>
</li>
</c:when>
<c:when test="${ pageLoginLink }">
<li class="nav-item username"><la:link href="/login"
styleClass="nav-link" role="button" aria-haspopup="true"
aria-expanded="false">
<i class="fa fa-sign-in"></i>
<la:message key="labels.login" />
</la:link></li>
</c:when>
</c:choose>
<li class="nav-item"><la:link href="/help"
styleClass="nav-link help-link">
<i class="fa fa-question-circle"></i>
<la:message key="labels.index_help" />
</la:link></li>
</ul>
</div>
</nav>
<div class="container">
<div class="row content">
<div class="center-block searchFormBox">
<h1 class="mainLogo">
<img src="${f:url('/images/logo.png')}"
alt="<la:message key="labels.index_title" />" />
</h1>
<div class="notification">${notification}</div>
<div>
<la:info id="msg" message="true">
<div class="alert alert-info">${msg}</div>
</la:info>
<la:errors header="errors.front_header"
footer="errors.front_footer" prefix="errors.front_prefix"
suffix="errors.front_suffix" />
</div>
<la:form styleClass="form-stacked" action="search" method="get"
styleId="searchForm">
${fe:facetForm()}${fe:geoForm()}
</li>
</c:when>
<c:when test="${ pageLoginLink }">
<li class="nav-item username"><la:link href="/login"
styleClass="nav-link" role="button" aria-haspopup="true"
aria-expanded="false">
<i class="fa fa-sign-in"></i>
<la:message key="labels.login" />
</la:link></li>
</c:when>
</c:choose>
<li class="nav-item"><la:link href="/help"
styleClass="nav-link help-link">
<i class="fa fa-question-circle"></i>
<la:message key="labels.index_help" />
</la:link></li>
</ul>
</div>
</nav>
<div class="container">
<div class="row content">
<div class="center-block searchFormBox">
<h1 class="mainLogo">
<img src="${f:url('/images/logo.png')}"
alt="<la:message key="labels.index_title" />" />
</h1>
<div class="notification">${notification}</div>
<div>
<la:info id="msg" message="true">
<div class="alert alert-info">${msg}</div>
</la:info>
<la:errors header="errors.front_header"
footer="errors.front_footer" prefix="errors.front_prefix"
suffix="errors.front_suffix" />
</div>
<fieldset>
<div class="clearfix">
<div class="centered col-lg-5 col-md-6 col-sm-6 col-xs-8">
@ -115,147 +115,34 @@
<la:message key="labels.index_form_search_btn" />
</button>
<button type="button" class="btn btn-secondary"
data-toggle="modal" data-target="#searchOptions">
data-toggle="control-options" data-target="#searchOptions"
id="searchOptionsButton">
<i class="fa fa-cog"></i>
<la:message key="labels.index_form_option_btn" />
</button>
</div>
</fieldset>
<div class="modal fade" id="searchOptions" tabindex="-1"
role="dialog" aria-labelledby="searchOptionsLabel"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true">&times;</span> <span class="sr-only">Close</span>
</button>
<h4 class="modal-title" id="searchOptionsLabel">
<la:message key="labels.search_options" />
</h4>
</div>
<div class="modal-body">
<fieldset class="form-group">
<label for="contentNum"><la:message
key="labels.index_num" /></label>
<la:select property="num" styleId="numSearchOption"
styleClass="form-control">
<option value="">
<la:message key="labels.search_result_select_num" />
</option>
<la:option value="10">10</la:option>
<la:option value="20">20</la:option>
<la:option value="30">30</la:option>
<la:option value="40">40</la:option>
<la:option value="50">50</la:option>
<la:option value="100">100</la:option>
</la:select>
</fieldset>
<fieldset class="form-group">
<label for="contentSort"><la:message
key="labels.index_sort" /></label>
<la:select property="sort" styleId="sortSearchOption"
styleClass="form-control">
<option value="">
<la:message key="labels.search_result_select_sort" />
</option>
<la:option value="score.desc">
<la:message key="labels.search_result_sort_score_desc" />
</la:option>
<la:option value="filename.asc">
<la:message key="labels.search_result_sort_filename_asc" />
</la:option>
<la:option value="filename.desc">
<la:message key="labels.search_result_sort_filename_desc" />
</la:option>
<la:option value="created.asc">
<la:message key="labels.search_result_sort_created_asc" />
</la:option>
<la:option value="created.desc">
<la:message key="labels.search_result_sort_created_desc" />
</la:option>
<la:option value="content_length.asc">
<la:message
key="labels.search_result_sort_content_length_asc" />
</la:option>
<la:option value="content_length.desc">
<la:message
key="labels.search_result_sort_content_length_desc" />
</la:option>
<la:option value="last_modified.asc">
<la:message
key="labels.search_result_sort_last_modified_asc" />
</la:option>
<la:option value="last_modified.desc">
<la:message
key="labels.search_result_sort_last_modified_desc" />
</la:option>
<c:if test="${searchLogSupport}">
<la:option value="click_count.asc">
<la:message key="labels.search_result_sort_click_count_asc" />
</la:option>
<la:option value="click_count.desc">
<la:message
key="labels.search_result_sort_click_count_desc" />
</la:option>
</c:if>
<c:if test="${favoriteSupport}">
<la:option value="favorite_count.asc">
<la:message
key="labels.search_result_sort_favorite_count_asc" />
</la:option>
<la:option value="favorite_count.desc">
<la:message
key="labels.search_result_sort_favorite_count_desc" />
</la:option>
</c:if>
</la:select>
</fieldset>
<fieldset class="form-group">
<label for="contentLang"><la:message
key="labels.index_lang" /></label>
<la:select property="lang" styleId="langSearchOption"
multiple="true" styleClass="form-control">
<c:forEach var="item" items="${langItems}">
<la:option value="${f:u(item.value)}">
${f:h(item.label)}
</la:option>
</c:forEach>
</la:select>
</fieldset>
<c:if test="${displayLabelTypeItems}">
<fieldset class="form-group">
<label for="contentLabelType"><la:message
key="labels.index_label" /></label>
<la:select property="fields.label"
styleId="labelTypeSearchOption" multiple="true"
styleClass="form-control">
<c:forEach var="item" items="${labelTypeItems}">
<la:option value="${f:u(item.value)}">
${f:h(item.label)}
</la:option>
</c:forEach>
</la:select>
</fieldset>
</c:if>
</div>
<div class="modal-footer">
<button class="btn btn-secondary" id="searchOptionsClearButton">
<la:message key="labels.search_options_clear" />
</button>
<button class="btn btn-secondary" data-dismiss="modal">
<la:message key="labels.search_options_close" />
</button>
</div>
</div>
</div>
</div>
</la:form>
</div>
</div>
<jsp:include page="footer.jsp" />
</div>
<div id="searchOptions" class="control-options">
<div class="container">
<jsp:include page="common/searchOptions.jsp" />
<div>
<button type="button" class="btn btn-secondary" id="searchOptionsClearButton">
<la:message key="labels.search_options_clear" />
</button>
<button type="button" class="btn btn-secondary pull-right"
data-toggle="control-options" data-target="#searchOptions"
id="searchOptionsCloseButton">
<i class="fa fa-times-circle"></i>
<la:message key="labels.search_options_close" />
</button>
</div>
</div>
<jsp:include page="footer.jsp" />
</div>
</la:form>
<input type="hidden" id="contextPath" value="${contextPath}" />
<script type="text/javascript"
src="${f:url('/js/jquery-2.2.4.min.js')}"></script>

2
src/main/webapp/WEB-INF/view/search.jsp
View file

@ -20,7 +20,7 @@
</head>
<body class="search">
<jsp:include page="header.jsp" />
<div class="container">
<div id="content" class="container">
<div class="row">
<div class="col-md-12">
<ul class="searchOptionLabels">

31
src/main/webapp/css/style.css
View file

@ -198,20 +198,31 @@ ul.searchOptionLabels li {
vertical-align: middle;
}
body.search #searchOptions, body.help #searchOptions, body.error #searchOptions {
#searchOptions {
position: fixed;
top: 0;
z-index: 10;
}
#searchOptions .container {
width: 500px;
overflow: hidden;
position: fixed;
top: 0;
right: -500px;
padding-top: 72px;
padding-bottom: 20px;
z-index: 1000;
right: -500px;
background: #eceeef;
width: 500px;
color: #fff;
background-color: rgba(60, 60, 60, 0.93);
transition: all .4s ease 0s;
}
body.search #searchOptions.active, body.help #searchOptions.active, body.error #searchOptions.active {
#searchOptions.active .container {
height: auto;
overflow-y: scroll;
top: 0;
right: 0;
bottom: 0;
}
.centered {
@ -291,11 +302,11 @@ body.search #searchOptions.active, body.help #searchOptions.active, body.error
#result .info {
display: none;
}
body.search #searchOptions, body.help #searchOptions, body.error #searchOptions {
#searchOptions .container {
width: 100%;
right: -100%;
}
body.search #searchOptions.active, body.help #searchOptions.active, body.error #searchOptions.active {
#searchOptions.active {
right: 0;
}
.description {
@ -357,14 +368,14 @@ body.search #searchOptions.active, body.help #searchOptions.active, body.error
}
@media ( max-height : 480px) {
#searchOptions {
#searchOptions .container {
max-height: 450px;
overflow-y: scroll;
}
}
@media ( max-height : 390px) {
#searchOptions {
#searchOptions .container {
max-height: 300px;
overflow-y: scroll;
}

13
src/main/webapp/js/index.js
View file

@ -12,6 +12,19 @@ $(function() {
return true;
});
$(document).on('click touchend', function(e) {
if (!$(e.target).closest('#searchOptions, #searchOptionsButton').length) {
$('#searchOptions').removeClass('active');
}
});
$("[data-toggle='control-options']").click(function(e) {
var target = $(this).attr('data-target') || $(this).attr('href');
if (target) {
$(target).toggleClass("active");
}
});
$('#searchOptionsClearButton').on('click', function(e) {
$('#labelTypeSearchOption').prop('selectedIndex', -1);
$('#langSearchOption').prop('selectedIndex', 0);

6
src/main/webapp/js/search.js
View file

@ -13,6 +13,12 @@ $(function() {
return true;
});
$('#content').on('click touchend', function(e) {
if (!$(e.target).closest("#searchOptions, [data-toggle='control-options']").length) {
$('#searchOptions').removeClass('active');
}
});
$("[data-toggle='control-options']").click(function(e) {
e.preventDefault();
var target = $(this).attr('data-target') || $(this).attr('href');