Files
netdisco/Netdisco/views/inc/js/search.js
2012-01-09 10:58:28 +00:00

108 lines
3.8 KiB
JavaScript

$(document).ready(function() {
// parameterised for the active tab - submits search form and injects
// HTML response into the tab pane, or an error/empty-results message
function do_search (event, tab) {
var form = '#' + tab + '_form';
var target = '#' + tab + '_pane';
var mark = '#' + tab + '_bookmark';
// stop form from submitting normally
event.preventDefault();
// get the form params
var query = $(form).serialize();
// in case of slow data load, let the user know
$(target).html(
'<div class="span3 alert-message notice"><p>Waiting for results...</p></div>'
);
// submit the query and put results into the tab pane
$(target).load( '/ajax/content/search/' + tab + '?' + query,
function(response, status, xhr) {
if (status !== "success") {
$(target).html(
'<div class="span6 alert-message error">' +
'<p>Search failed! Please contact your site administrator.</p></div>'
);
return;
}
if (response === "") {
$(target).html(
'<div class="span3 alert-message info"><p>No matching records.</p></div>'
);
}
// looks good, update the bookmark for this search
$(mark).attr('href', '/search?' + query);
}
);
}
// search hook for each tab
[% FOREACH tab IN vars.tabs %]
$('[% "#${tab.id}_form" %]').submit(function(event){ do_search(event, '[% tab.id %]'); });
[% END %]
// on page load, load the content for the active tab
[% IF params.tab %]
$('#[% params.tab %]_form').trigger("submit");
[% END %]
// on tab change, hide previous tab's search form and show new tab's
// search form. also trigger to load the content for the newly active tab.
$('#search_results').bind('change', function(e) {
var to = $(e.target).attr('href').replace(/^#/,"").replace(/_pane$/,"");
var from = $(e.relatedTarget).attr('href').replace(/^#/,"").replace(/_pane$/,"");
$('#' + from + '_search').toggleClass('active');
$('#' + to + '_search').toggleClass('active');
var to_form = '#' + to + '_form';
var from_form = '#' + from + '_form';
// copy current search string to new form's input box
$(to_form).find("input[name=q]").val(
$(from_form).find("input[name=q]").val()
);
$(to_form).trigger("submit");
});
// fix green background on search checkboxes
// https://github.com/twitter/bootstrap/issues/742
syncCheckBox = function() {
$(this).parents('.add-on').toggleClass('active', $(this).is(':checked'));
};
$('.add-on :checkbox').each(syncCheckBox).click(syncCheckBox);
// highlight active search filters in green
// there must be a way to factor this out to a func but my JS is weak :-/
$("form .clearfix input").not("[name=q]").each(function() {
if ($(this).val() === "") {
$(this).parent(".clearfix").removeClass('success');
} else {
$(this).parent(".clearfix").addClass('success');
}
});
$("form .clearfix input").not("[name=q]").change(function() {
if ($(this).val() === "") {
$(this).parent(".clearfix").removeClass('success');
} else {
$(this).parent(".clearfix").addClass('success');
}
});
$("form .clearfix select").each(function() {
if ($(this).find(":selected").length === 0) {
$(this).parent(".clearfix").removeClass('success');
} else {
$(this).parent(".clearfix").addClass('success');
}
});
$("form .clearfix select").change(function() {
if ($(this).find(":selected").length === 0) {
$(this).parent(".clearfix").removeClass('success');
} else {
$(this).parent(".clearfix").addClass('success');
}
});
});