cinera_search.js: Mitigate flickering

This commit is contained in:
Matt Mascarenhas 2018-07-15 23:52:52 +01:00
parent 8607ca87ea
commit f3b728ee6f
2 changed files with 9 additions and 7 deletions

View File

@ -16,7 +16,7 @@ typedef struct
version CINERA_APP_VERSION = {
.Major = 0,
.Minor = 5,
.Patch = 65
.Patch = 66
};
// TODO(matt): Copy in the DB 3 stuff from cinera_working.c
@ -5510,12 +5510,12 @@ IndexToBuffer(index *Index, buffers *CollationBuffers) // NOTE(matt): This guy m
char *Theme = StringsDiffer(Config.Theme, "") ? Config.Theme : Config.ProjectID;
int Allowance = StringLength(Theme) * 2 + StringLength(Config.ProjectID) + StringLength(Config.BaseURL) + StringLength(Config.PlayerLocation);
char queryContainer[659 + Allowance]; // NOTE(matt): Update the size if changing the string
char queryContainer[678 + Allowance]; // NOTE(matt): Update the size if changing the string
CopyString(queryContainer, sizeof(queryContainer),
"<div class=\"cineraQueryContainer %s\">\n"
" <label for=\"query\">Query:</label>\n"
" <div class=\"inputContainer\">\n"
" <input type=\"text\" id=\"query\">\n"
" <input type=\"text\" autocomplete=\"off\" id=\"query\">\n"
" <div class=\"spinner\">\n"
" Downloading data...\n"
" </div>\n"

View File

@ -88,6 +88,7 @@ function padTimeComponent(component) {
return (component < 10 ? "0" + component : component);
}
var renderHandle;
function runSearch() {
var queryStr = document.getElementById("query").value;
if (lastQuery != queryStr) {
@ -131,9 +132,10 @@ function runSearch() {
}
}
if (!rendering) {
renderResults();
if (rendering) {
clearTimeout(renderHandle);
}
renderResults();
} else {
document.querySelector(".spinner").classList.add("show");
}
@ -151,7 +153,7 @@ function runSearch() {
function renderResults() {
if (resultsIndex < resultsToRender.length) {
rendering = true;
var maxItems = 10;
var maxItems = 42;
var numItems = 0;
while (numItems < maxItems && resultsIndex < resultsToRender.length) {
var query = resultsToRender[resultsIndex].query;
@ -203,7 +205,7 @@ function renderResults() {
resultsIndex++;
}
}
setTimeout(renderResults, 0);
renderHandle = setTimeout(renderResults, 0);
} else {
rendering = false;
}