Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Have search boxes update on right-click paste #935

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
+112 −118
Open

Have search boxes update on right-click paste #935

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
90 changes: 54 additions & 36 deletions views/layout.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -100,45 +100,63 @@
</div>
<script>
(function() {
const update_search = (search_element, should_delay, debug_label) => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks intentionally identical to the code in the other layout file. Please add a comment to each noting that these should stay in sync.

var search_term = search_element.value;
var searchbox = $(search_element).closest('.searchbox');
var dropdown = $('.search_dropdown', searchbox);

var searchresult = $('.searchresult', searchbox);
if (searchresult && searchresult.attr('data-highlight')) {
onezoom.controller.highlight_remove(searchresult.attr('data-highlight'));
}

if (search_term.length==0) {
$('.popular_species', dropdown).show();
$('.recents', dropdown).show();
{{if is_testing:}}console.log("Hiding no_result section of dropdown");{{pass}}
$('.no_results', dropdown).hide();
$('.search_hits', dropdown).empty();
OZui.search_manager.full_search("");
$('.searchinput', searchbox).removeClass('waiting_for_search_result');
return;
}

const trimmed_search_term = search_term.replace(/ /g,'');
if (
trimmed_search_term.length > 2 ||
((trimmed_search_term.length > 1) && !should_delay)
) {
// never search for a single character
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Move this comment up before the if condition for readability.

// and only search for two characters if enter has been pressed.
OZui.search_manager.full_search(
search_term,
function(original_string, actual_search, results) {
OZui.searchPopulate(searchbox, original_string, results);
},
should_delay ? 1000 : 0,
function() {
{{if is_testing:}}console.log("Search for '" + search_term + "' sent to OneZoom API from " + debug_label + " search");{{pass}}

if(!($(".searchinput").hasClass('waiting_for_search_result')))
{
$(".searchinput", searchbox).addClass('waiting_for_search_result'); // switch flag for search to on
}
}
);
}
}

var box_selector = $('#header_searchnav');

$('.searchinput input', box_selector)
.on('keyup', function(event) {

var search_term = this.value;
var searchbox = $(this).closest('.searchbox');
var searchresult = $('.searchresult', searchbox);
var dropdown = $('.search_dropdown', searchbox);
if (search_term.length==0) {
$('.popular_species', dropdown).show();
$('.recents', dropdown).show();
{{if is_testing:}}console.log("Hiding no_result section of dropdown");{{pass}}
$('.no_results', dropdown).hide();
$('.search_hits', dropdown).empty();
OZui.search_manager.full_search(""); // this clears the search
$('.searchinput', searchbox).removeClass('waiting_for_search_result');
} else {
//$('.searchinput', searchbox).addClass('waiting_for_search_result');
var delay_ms = 1000;
if (event.which == 13) {
delay_ms = 1; //enter was pressed - don't delay
}
if ((search_term.replace(/ /g,'').length > 2)||((search_term.replace(/ /g,'').length > 1)&&(delay_ms == 1))) { // we're never going to search for a single character

OZui.search_manager.full_search(
search_term,
function(original_string, actual_search, results) {
OZui.searchPopulate(searchbox, original_string, results);
},
delay_ms,
function() {
{{if is_testing:}}console.log("Search for '" + search_term + "' sent to OneZoom API from advanced search");{{pass}}
if(!($(".searchinput").hasClass('waiting_for_search_result'))) {
$(".searchinput", searchbox).addClass('waiting_for_search_result'); // switch flag for search to on
}});
}
}
});
.on('input', function(event) {
update_search(this, true, 'home page');
})
.on('keyup', function(event) {
if (event.which == 13) {
update_search(this, false, 'home page');
}
});
}())
</script>

Expand Down
140 changes: 58 additions & 82 deletions views/treeviewer/layout.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -307,6 +307,52 @@
}
}

function update_search(search_element, should_delay, debug_label) {
var search_term = search_element.value;
var searchbox = $(search_element).closest('.searchbox');
var dropdown = $('.search_dropdown', searchbox);

var searchresult = $('.searchresult', searchbox);
if (searchresult && searchresult.attr('data-highlight')) {
onezoom.controller.highlight_remove(searchresult.attr('data-highlight'));
}

if (search_term.length==0) {
$('.popular_species', dropdown).show();
$('.recents', dropdown).show();
{{if is_testing:}}console.log("Hiding no_result section of dropdown");{{pass}}
$('.no_results', dropdown).hide();
$('.search_hits', dropdown).empty();
OZui.search_manager.full_search("");
$('.searchinput', searchbox).removeClass('waiting_for_search_result');
return;
}

const trimmed_search_term = search_term.replace(/ /g,'');
if (
trimmed_search_term.length > 2 ||
((trimmed_search_term.length > 1) && !should_delay)
) {
// never search for a single character
// and only search for two characters if enter has been pressed.
OZui.search_manager.full_search(
search_term,
function(original_string, actual_search, results) {
OZui.searchPopulate(searchbox, original_string, results);
},
should_delay ? 1000 : 0,
function() {
{{if is_testing:}}console.log("Search for '" + search_term + "' sent to OneZoom API from " + debug_label + " search");{{pass}}

if(!($(".searchinput").hasClass('waiting_for_search_result')))
{
$(".searchinput", searchbox).addClass('waiting_for_search_result'); // switch flag for search to on
}
}
);
}
}

function load_into_searchbox(searchbox, result, highlight) {
// Reconstitute compile_searchbox_data() format
var given_name = result[0],
Expand Down Expand Up @@ -474,45 +520,12 @@
// https://github.com/uikit/uikit/blob/8313ce565be686952ab6edf8a7caee5fdfcca08c/src/js/core/toggle.js#L138-L151
event.stopPropagation();
})
.on('keyup', function(event) {

var search_term = this.value;
var searchbox = $(this).closest('.searchbox');
var searchresult = $('.searchresult', searchbox);
var dropdown = $('.search_dropdown', searchbox);
if (searchresult.attr('data-highlight')) {
onezoom.controller.highlight_remove(searchresult.attr('data-highlight'));
}
if (search_term.length==0) {
$('.popular_species', dropdown).show();
$('.recents', dropdown).show();
{{if is_testing:}}console.log("Hiding no_result section of dropdown");{{pass}}
$('.no_results', dropdown).hide();
$('.search_hits', dropdown).empty();
OZui.search_manager.full_search(""); // this clears the search
$('.searchinput', searchbox).removeClass('waiting_for_search_result');
} else {
//$('.searchinput', searchbox).addClass('waiting_for_search_result');
var delay_ms = 1000;
if (event.which == 13) {
delay_ms = 1; //enter was pressed - don't delay
}
if ((search_term.replace(/ /g,'').length > 2)||((search_term.replace(/ /g,'').length > 1)&&(delay_ms == 1))) { // we're never going to search for a single character and we only search for two characters if enter has been pressed.

//if (search_term.replace(/ /g,'').length > 1) { // we're never going to search for a single character

OZui.search_manager.full_search(
search_term,
function(original_string, actual_search, results) {
OZui.searchPopulate(searchbox, original_string, results);
},
delay_ms,
function() {
{{if is_testing:}}console.log("Search for '" + search_term + "' sent to OneZoom API from advanced search");{{pass}}
if(!($(".searchinput").hasClass('waiting_for_search_result'))) {
$(".searchinput", searchbox).addClass('waiting_for_search_result'); // switch flag for search to on
}});
}
.on('input', function(event) {
update_search(this, true, "advanced");
})
.on('keydown', function(event) {
if (event.which == 13) {
update_search(this, false, "advanced");
}
});

Expand Down Expand Up @@ -715,50 +728,13 @@
// https://github.com/uikit/uikit/blob/8313ce565be686952ab6edf8a7caee5fdfcca08c/src/js/core/toggle.js#L138-L151
event.stopPropagation();
})
.keyup(function(event) {
var search_term = this.value;
var searchbox = $(this).closest('.searchbox');
var dropdown = $('.search_dropdown', searchbox);
if (search_term.length==0) {
$('.popular_species', dropdown).show();
$('.recents', dropdown).show();
{{if is_testing:}}console.log("Hiding no_result section of dropdown");{{pass}}
$('.no_results', dropdown).hide();
$('.search_hits', dropdown).empty();
OZui.search_manager.full_search("");
$('.searchinput', searchbox).removeClass('waiting_for_search_result');
} else {
var delay_ms = 1000;
if (event.which == 13) {
delay_ms = 1; //enter was pressed - don't delay
// we should probably catch the case of short string here and give the user a warning - todo.
}
if ((search_term.replace(/ /g,'').length > 2)||((search_term.replace(/ /g,'').length > 1)&&(delay_ms == 1))) { // we're never going to search for a single character and we only search for two characters if enter has been pressed.

// we want to test for whether the search is working already or not....

OZui.search_manager.full_search(
search_term,
function(original_string, actual_search, results) {
OZui.searchPopulate(searchbox, original_string, results);
},
delay_ms,
function() {
{{if is_testing:}}console.log("Search for '" + search_term + "' sent to OneZoom API from basic search");{{pass}}

if(!($(".searchinput").hasClass('waiting_for_search_result')))
{
$(".searchinput", searchbox).addClass('waiting_for_search_result'); // switch flag for search to on
}
}
);

}
else
{
// the user should get some comment back here ideally because they tried to search for a single character
}
.on('keydown', function(event) {
if (event.which == 13) {
update_search(this, false, "basic");
}
})
.on('input', function(event) {
update_search(this, true, "basic");
});

/* Advanced search stuff */
Expand Down
Loading