1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-18 08:16:07 +00:00

[search] added 'scales' option

This commit is contained in:
llj
2013-04-20 19:19:38 +08:00
committed by lins05
parent adfc9c7638
commit d0c96aada3
2 changed files with 83 additions and 10 deletions

View File

@@ -21,7 +21,7 @@ body,
h1,h2,h3,h4,h5,h6,
ul,ol,li,dl,dt,dd,
p,pre,blockquote,
form,input,textarea,button,img {
form,input,textarea,select,button,img {
padding:0;
margin:0;
}
@@ -455,9 +455,10 @@ textarea:-moz-placeholder {/* for FF */
margin-bottom:25px;
}
#header-inner {
height:40px;
width:950px;
margin:0 auto;
overflow:hidden;
/*overflow:hidden;*/
}
#main {
min-height: 400px;
@@ -2227,11 +2228,10 @@ textarea:-moz-placeholder {/* for FF */
border:1px solid #ddd;
border-radius:3px;
background:#fff;
overflow:hidden;/*for some chromium*/
/*overflow:hidden;for some chromium*/
position:relative;
}
#top-search-form {
width:214px;
*width:218px;
margin-top:4px;
}
.search-input,
@@ -2239,12 +2239,37 @@ textarea:-moz-placeholder {/* for FF */
height:24px;
border:0;
margin:0;
vertical-align:middle;
vertical-align:top;
}
.search-input {
width:180px;
width:172px;
outline:0;
}
.search-form .icon-caret-down {
color:#bbb;
cursor:pointer;
line-height:24px;
}
.search-scales {
position:absolute;
padding:2px 0;
font-weight:normal;
background:#fff;
border:1px solid #ddd;
border-radius:3px;
box-shadow:0 0 10px #ddd;
}
.search-scales .item {
padding:2px 6px;
}
.search-scales .item-hover {
color:#fff;
background:#666;
cursor:pointer;
}
.search-scales [class^="icon-"] {
margin-right:5px;
}
.search-form .search-submit {
width:30px;
background:#fff;

View File

@@ -72,13 +72,18 @@
{% if enable_file_search and request.user.is_authenticated %}
<form id="top-search-form" method="get" action="{% url 'search' %}" class="search-form fright">
<input class="search-input" name="q" placeholder="{% trans 'Search Files' %}" value="{{ keyword }}" />
<button type="submit" class="search-submit"><span class="icon-search"></span></button>
<input type="hidden" name="scale" value="all" />
<span class="icon-caret-down" title="{% trans "choose search scale" %}"></span><button type="submit" class="search-submit"><span class="icon-search"></span></button>
<ul class="search-scales hide">
<li class="item" data-value="all"><span class="icon-ok"></span>{% trans "In all libraries" %}</li>
<li class="item" data-value="current"><span class="icon-"></span>{% trans "In this library" %}</li>
</ul>
</form>
{% endif %}
</div>
</div>
<div id="main">
<div id="main" class="clear">
<div id="title-panel" class="w100 ovhd">
{% block title_panel %}{% endblock %}
</div>
@@ -187,6 +192,45 @@ $(document).ready(function(){
return false;
});
{% if enable_file_search %}
$('#top-search-form .icon-caret-down').click(function() {
var form = $(this).parent();
form.find('.search-scales').css({'right':form.find('.search-submit').outerWidth(true), 'top':form.outerHeight()}).toggleClass('hide');
});
$('.search-scales li').hover(
function() {
$(this).addClass('item-hover');
},
function() {
$(this).removeClass('item-hover');
}
).click(function() {
$(this).parent().find('span').attr('class', 'icon-');
$(this).children('span').attr('class', 'icon-ok');
if (!pseudo_support) {
$(this).parent().find('span').html('');
setCon($(this).children('span'), 'icon-', fa_icons);
}
$('#top-search-form [name="scale"]').val($(this).data('value'));
$(this).parent().addClass('hide');
var search_input = $('#top-search-form .search-input');
if ($.trim(search_input.val())) {
$('#top-search-form').submit();
} else {
search_input.attr('placeholder', $(this).text().replace(/^&#x\w+;$/,'')); // replace(...) to rm icon text for some browsers
if (!('placeholder' in document.createElement('input'))) { // for browsers which don't natively support 'placeholder' attr
search_input.attr('value', search_input.attr('placeholder'));
}
}
});
$(document).click(function(e) {
var target = e.target || event.srcElement;
if (!$('.search-scales, #top-search-form .icon-caret-down').is(target) && !($('.search-scales').find('*').is(target))) {
$('.search-scales').addClass('hide');
}
});
{% endif %}
{% endif %}
</script>
{% block extra_script %}{% endblock %}
@@ -225,7 +269,9 @@ $(document).ready(function(){
{'name':'undo', 'con':'f0e2'},
{'name':'repeat', 'con':'f01e'},
{'name':'star', 'con':'f005'},
{'name':'star-empty', 'con':'f006'}
{'name':'star-empty', 'con':'f006'},
{'name':'caret-down', 'con':'f0d7'},
{'name':'ok', 'con':'f00c'}
];
function setCon(icon, icon_class_prefix, icon_list) {
for (var i = 0, len = icon_list.length; i < len; i++) {
@@ -235,8 +281,10 @@ $(document).ready(function(){
}
}
}
var pseudo_support = true;
var pseudo_test = $('body').append('<span class="sf-icon-share pseudo-test" style="color:#fff;position:fixed;left:0;bottom:0;"></span>').children('.pseudo-test');
if (pseudo_test.width() == 0) {
pseudo_support = false;
$('[class^="sf-icon-"]').each(function() {
setCon($(this), 'sf-icon-', sf_icons);
});