quick-search: improve styling of search input and results.
This commit is contained in:
parent
4eccdc24d9
commit
ed7e61efb5
4 changed files with 86 additions and 36 deletions
|
|
@ -32,7 +32,13 @@ def assert_and_get_main_filter_content(result):
|
|||
|
||||
if data_item['type'] == 'search':
|
||||
display_val = data_item['value_display']
|
||||
assert 'Search for:' in display_val, display_val
|
||||
if data_item['id'] == -1:
|
||||
assert 'File search for:' in display_val, display_val
|
||||
elif data_item['id'] == -2:
|
||||
assert 'Commit search for:' in display_val, display_val
|
||||
else:
|
||||
assert False, 'No Proper ID returned {}'.format(data_item['id'])
|
||||
|
||||
elif data_item['type'] == 'repo':
|
||||
repos.append(data_item)
|
||||
elif data_item['type'] == 'repo_group':
|
||||
|
|
|
|||
|
|
@ -263,19 +263,30 @@ class HomeView(BaseAppView):
|
|||
'commit_id:{}*'.format(commit_hash), 'commit', auth_user,
|
||||
raise_on_exc=False)
|
||||
|
||||
return [
|
||||
{
|
||||
commits = []
|
||||
for entry in result['results']:
|
||||
repo_data = {
|
||||
'repository_id': entry.get('repository_id'),
|
||||
'repository_type': entry.get('repo_type'),
|
||||
'repository_name': entry.get('repository'),
|
||||
}
|
||||
|
||||
commit_entry = {
|
||||
'id': entry['commit_id'],
|
||||
'value': org_query,
|
||||
'value_display': 'repo `{}` commit: {}'.format(
|
||||
'value_display': '`{}` commit: {}'.format(
|
||||
entry['repository'], entry['commit_id']),
|
||||
'type': 'commit',
|
||||
'repo': entry['repository'],
|
||||
'repo_data': repo_data,
|
||||
|
||||
'url': h.route_path(
|
||||
'repo_commit',
|
||||
repo_name=entry['repository'], commit_id=entry['commit_id'])
|
||||
}
|
||||
for entry in result['results']]
|
||||
|
||||
commits.append(commit_entry)
|
||||
return commits
|
||||
|
||||
@LoginRequired()
|
||||
@view_config(
|
||||
|
|
@ -373,7 +384,7 @@ class HomeView(BaseAppView):
|
|||
label = u'Commit search for `{}` in this repository.'.format(query)
|
||||
queries.append(
|
||||
{
|
||||
'id': -10,
|
||||
'id': -20,
|
||||
'value': query,
|
||||
'value_display': label,
|
||||
'type': 'search',
|
||||
|
|
@ -392,7 +403,7 @@ class HomeView(BaseAppView):
|
|||
label = u'File search for `{}` in this repository group'.format(query)
|
||||
queries.append(
|
||||
{
|
||||
'id': -20,
|
||||
'id': -30,
|
||||
'value': query,
|
||||
'value_display': label,
|
||||
'type': 'search',
|
||||
|
|
@ -410,7 +421,7 @@ class HomeView(BaseAppView):
|
|||
label = u'Commit search for `{}` in this repository group'.format(query)
|
||||
queries.append(
|
||||
{
|
||||
'id': -20,
|
||||
'id': -40,
|
||||
'value': query,
|
||||
'value_display': label,
|
||||
'type': 'search',
|
||||
|
|
@ -425,16 +436,16 @@ class HomeView(BaseAppView):
|
|||
{
|
||||
'id': -1,
|
||||
'value': query,
|
||||
'value_display': u'Commit search for: `{}`'.format(query),
|
||||
'value_display': u'File search for: `{}`'.format(query),
|
||||
'type': 'search',
|
||||
'url': h.route_path('search',
|
||||
_query={'q': query, 'type': 'content'})
|
||||
})
|
||||
queries.append(
|
||||
{
|
||||
'id': -1,
|
||||
'id': -2,
|
||||
'value': query,
|
||||
'value_display': u'File search for: `{}`'.format(query),
|
||||
'value_display': u'Commit search for: `{}`'.format(query),
|
||||
'type': 'search',
|
||||
'url': h.route_path('search',
|
||||
_query={'q': query, 'type': 'commit'})
|
||||
|
|
|
|||
|
|
@ -636,8 +636,10 @@ ul#context-pages {
|
|||
border-bottom: 1px solid @grey4;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin-left: -7px;
|
||||
background: @grey3;
|
||||
background: inherit;
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 9px;
|
||||
}
|
||||
|
||||
.main_filter_input_box {
|
||||
|
|
@ -652,24 +654,36 @@ ul#context-pages {
|
|||
background: @grey3;
|
||||
border: 1px solid black;
|
||||
position: absolute;
|
||||
white-space: pre-wrap;
|
||||
white-space: pre;
|
||||
z-index: 9999;
|
||||
color: @nav-grey;
|
||||
margin: 1px 7px;
|
||||
padding: 0 2px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.main_filter_input {
|
||||
padding: 5px;
|
||||
min-width: 220px;
|
||||
min-width: 260px;
|
||||
color: @nav-grey;
|
||||
background: @grey3;
|
||||
min-height: 18px;
|
||||
|
||||
|
||||
&:active {
|
||||
color: @grey2 !important;
|
||||
background: white !important;
|
||||
}
|
||||
&:focus {
|
||||
color: @grey2 !important;
|
||||
background: white !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.main_filter_input::placeholder {
|
||||
color: @nav-grey;
|
||||
opacity: 1;
|
||||
color: @nav-grey;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.notice-box {
|
||||
|
|
|
|||
|
|
@ -492,17 +492,17 @@
|
|||
</div>
|
||||
|
||||
<div id="main_filter_help" style="display: none">
|
||||
Use '/' key to quickly access this field.
|
||||
Enter name of repository, or repository group for quick search.
|
||||
- Use '/' key to quickly access this field.
|
||||
|
||||
Prefix query to allow special search:
|
||||
- Enter a name of repository, or repository group for quick search.
|
||||
|
||||
user:admin, to search for usernames
|
||||
- Prefix query to allow special search:
|
||||
|
||||
user_group:devops, to search for user groups
|
||||
user:admin, to search for usernames
|
||||
|
||||
commit:efced4, to search for commits
|
||||
user_group:devops, to search for user groups
|
||||
|
||||
commit:efced4, to search for commits
|
||||
</div>
|
||||
</li>
|
||||
|
||||
|
|
@ -626,10 +626,23 @@ commit:efced4, to search for commits
|
|||
var valueDisplay = data['value_display'];
|
||||
|
||||
var escapeRegExChars = function (value) {
|
||||
return value.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
|
||||
return value.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
|
||||
};
|
||||
var pattern = '(' + escapeRegExChars(value) + ')';
|
||||
|
||||
var getRepoIcon = function(repo_type) {
|
||||
if (repo_type === 'hg') {
|
||||
return '<i class="icon-hg"></i> ';
|
||||
}
|
||||
else if (repo_type === 'git') {
|
||||
return '<i class="icon-git"></i> ';
|
||||
}
|
||||
else if (repo_type === 'svn') {
|
||||
return '<i class="icon-svn"></i> ';
|
||||
}
|
||||
return ''
|
||||
};
|
||||
|
||||
// highlight match
|
||||
valueDisplay = Select2.util.escapeMarkup(valueDisplay);
|
||||
valueDisplay = valueDisplay.replace(new RegExp(pattern, 'gi'), '<strong>$1<\/strong>');
|
||||
|
|
@ -639,19 +652,16 @@ commit:efced4, to search for commits
|
|||
if (searchType === 'hint') {
|
||||
icon += '<i class="icon-folder-close"></i> ';
|
||||
}
|
||||
// full text search
|
||||
else if (searchType === 'search') {
|
||||
icon += '<i class="icon-more"></i> ';
|
||||
}
|
||||
// repository
|
||||
else if (searchType === 'repo') {
|
||||
if (data['repo_type'] === 'hg') {
|
||||
icon += '<i class="icon-hg"></i> ';
|
||||
}
|
||||
else if (data['repo_type'] === 'git') {
|
||||
icon += '<i class="icon-git"></i> ';
|
||||
}
|
||||
else if (data['repo_type'] === 'svn') {
|
||||
icon += '<i class="icon-svn"></i> ';
|
||||
}
|
||||
|
||||
var repoIcon = getRepoIcon(data['repo_type']);
|
||||
icon += repoIcon;
|
||||
|
||||
if (data['private']) {
|
||||
icon += '<i class="icon-lock" ></i> ';
|
||||
}
|
||||
|
|
@ -659,17 +669,26 @@ commit:efced4, to search for commits
|
|||
icon += '<i class="icon-unlock-alt"></i> ';
|
||||
}
|
||||
}
|
||||
// repository groups
|
||||
else if (searchType === 'repo_group') {
|
||||
icon += '<i class="icon-folder-close"></i> ';
|
||||
}
|
||||
// user group
|
||||
else if (searchType === 'user_group') {
|
||||
icon += '<i class="icon-group"></i> ';
|
||||
}
|
||||
else if (searchType === 'user') {
|
||||
icon += '<img class="gravatar" src="{0}"/>'.format(data['icon_link']);
|
||||
}
|
||||
// commit
|
||||
else if (searchType === 'commit') {
|
||||
icon += '<i class="icon-tag"></i>';
|
||||
var repo_data = data['repo_data'];
|
||||
var repoIcon = getRepoIcon(repo_data['repository_type']);
|
||||
if (repoIcon) {
|
||||
icon += repoIcon;
|
||||
} else {
|
||||
icon += '<i class="icon-tag"></i>';
|
||||
}
|
||||
}
|
||||
|
||||
var tmpl = '<div class="ac-container-wrap">{0}{1}</div>';
|
||||
|
|
@ -715,7 +734,7 @@ commit:efced4, to search for commits
|
|||
|
||||
showMainFilterBox = function () {
|
||||
$('#main_filter_help').toggle();
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<script src="${h.asset('js/rhodecode/base/keyboard-bindings.js', ver=c.rhodecode_version_hash)}"></script>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue