made the acp search a bit more cooler

v1.18.x
psychobunny 10 years ago
parent 8a978e46de
commit cf22fad6fd

@ -213,6 +213,20 @@
} }
#acp-search { #acp-search {
input {
background: black;
border: 0;
color: white;
box-shadow: none;
width: 31px;
.transition(.4s ease width);
font-family: @font-family-monospace;
&:focus {
width: 200px;
}
}
.search-match { .search-match {
font-weight: 700; font-weight: 700;
color: black; color: black;

@ -102,18 +102,22 @@ define('forum/admin/footer', ['forum/admin/settings'], function(Settings) {
function setupACPSearch() { function setupACPSearch() {
var menu = $('#acp-search .dropdown-menu'), var menu = $('#acp-search .dropdown-menu'),
routes = [], routes = [],
input = $('#acp-search input'),
firstResult = null; firstResult = null;
$('#acp-search input').on('keyup', function() { input.on('keyup', function() {
$('#acp-search .dropdown').addClass('open'); $('#acp-search .dropdown').addClass('open');
}); });
$('#acp-search').parents('form').on('submit', function(ev) { $('#acp-search').parents('form').on('submit', function(ev) {
var href = firstResult ? firstResult : RELATIVE_PATH + '/search/' + $(this).find('input').val(); var input = $(this).find('input'),
href = firstResult ? firstResult : RELATIVE_PATH + '/search/' + input.val();
ajaxify.go(href.replace(/^\//, '')); ajaxify.go(href.replace(/^\//, ''));
setTimeout(function() { setTimeout(function() {
$('#acp-search .dropdown').removeClass('open'); $('#acp-search .dropdown').removeClass('open');
$(input).blur();
}, 150); }, 150);
ev.preventDefault(); ev.preventDefault();
@ -124,7 +128,11 @@ define('forum/admin/footer', ['forum/admin/settings'], function(Settings) {
routes.push($(link).attr('href')); routes.push($(link).attr('href'));
}); });
$('#acp-search input').on('keyup focus', function() { input.on('blur', function() {
$(this).val('').attr('placeholder', '/');
});
input.on('keyup focus', function() {
var $input = $(this), var $input = $(this),
value = $input.val().toLowerCase(), value = $input.val().toLowerCase(),
menuItems = $('#acp-search .dropdown-menu').html(''); menuItems = $('#acp-search .dropdown-menu').html('');
@ -133,6 +141,8 @@ define('forum/admin/footer', ['forum/admin/settings'], function(Settings) {
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(); return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
} }
$input.attr('placeholder', '');
firstResult = null; firstResult = null;
if (value.length >= 3) { if (value.length >= 3) {

@ -65,7 +65,7 @@
<form class="navbar-form navbar-left hidden-xs" role="search"> <form class="navbar-form navbar-left hidden-xs" role="search">
<div class="form-group" id="acp-search" > <div class="form-group" id="acp-search" >
<div class="dropdown" > <div class="dropdown" >
<input type="text" data-toggle="dropdown" class="form-control" placeholder="Search ACP..."> <input type="text" data-toggle="dropdown" class="form-control" placeholder="/">
<ul class="dropdown-menu" role="menu"></ul> <ul class="dropdown-menu" role="menu"></ul>
</div> </div>
</div> </div>

Loading…
Cancel
Save