cinera_search.js: Mitigate flickering
This commit is contained in:
parent
8607ca87ea
commit
f3b728ee6f
|
@ -16,7 +16,7 @@ typedef struct
|
||||||
version CINERA_APP_VERSION = {
|
version CINERA_APP_VERSION = {
|
||||||
.Major = 0,
|
.Major = 0,
|
||||||
.Minor = 5,
|
.Minor = 5,
|
||||||
.Patch = 65
|
.Patch = 66
|
||||||
};
|
};
|
||||||
|
|
||||||
// TODO(matt): Copy in the DB 3 stuff from cinera_working.c
|
// 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;
|
char *Theme = StringsDiffer(Config.Theme, "") ? Config.Theme : Config.ProjectID;
|
||||||
int Allowance = StringLength(Theme) * 2 + StringLength(Config.ProjectID) + StringLength(Config.BaseURL) + StringLength(Config.PlayerLocation);
|
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),
|
CopyString(queryContainer, sizeof(queryContainer),
|
||||||
"<div class=\"cineraQueryContainer %s\">\n"
|
"<div class=\"cineraQueryContainer %s\">\n"
|
||||||
" <label for=\"query\">Query:</label>\n"
|
" <label for=\"query\">Query:</label>\n"
|
||||||
" <div class=\"inputContainer\">\n"
|
" <div class=\"inputContainer\">\n"
|
||||||
" <input type=\"text\" id=\"query\">\n"
|
" <input type=\"text\" autocomplete=\"off\" id=\"query\">\n"
|
||||||
" <div class=\"spinner\">\n"
|
" <div class=\"spinner\">\n"
|
||||||
" Downloading data...\n"
|
" Downloading data...\n"
|
||||||
" </div>\n"
|
" </div>\n"
|
||||||
|
|
|
@ -88,6 +88,7 @@ function padTimeComponent(component) {
|
||||||
return (component < 10 ? "0" + component : component);
|
return (component < 10 ? "0" + component : component);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var renderHandle;
|
||||||
function runSearch() {
|
function runSearch() {
|
||||||
var queryStr = document.getElementById("query").value;
|
var queryStr = document.getElementById("query").value;
|
||||||
if (lastQuery != queryStr) {
|
if (lastQuery != queryStr) {
|
||||||
|
@ -131,9 +132,10 @@ function runSearch() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!rendering) {
|
if (rendering) {
|
||||||
renderResults();
|
clearTimeout(renderHandle);
|
||||||
}
|
}
|
||||||
|
renderResults();
|
||||||
} else {
|
} else {
|
||||||
document.querySelector(".spinner").classList.add("show");
|
document.querySelector(".spinner").classList.add("show");
|
||||||
}
|
}
|
||||||
|
@ -151,7 +153,7 @@ function runSearch() {
|
||||||
function renderResults() {
|
function renderResults() {
|
||||||
if (resultsIndex < resultsToRender.length) {
|
if (resultsIndex < resultsToRender.length) {
|
||||||
rendering = true;
|
rendering = true;
|
||||||
var maxItems = 10;
|
var maxItems = 42;
|
||||||
var numItems = 0;
|
var numItems = 0;
|
||||||
while (numItems < maxItems && resultsIndex < resultsToRender.length) {
|
while (numItems < maxItems && resultsIndex < resultsToRender.length) {
|
||||||
var query = resultsToRender[resultsIndex].query;
|
var query = resultsToRender[resultsIndex].query;
|
||||||
|
@ -203,7 +205,7 @@ function renderResults() {
|
||||||
resultsIndex++;
|
resultsIndex++;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
setTimeout(renderResults, 0);
|
renderHandle = setTimeout(renderResults, 0);
|
||||||
} else {
|
} else {
|
||||||
rendering = false;
|
rendering = false;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue