cinera: Finer-grained search input autofocus

This commit is contained in:
Matt Mascarenhas 2018-07-05 20:13:25 +01:00
parent aa0a8ba327
commit 8607ca87ea
2 changed files with 28 additions and 7 deletions

View File

@ -16,7 +16,7 @@ typedef struct
version CINERA_APP_VERSION = { version CINERA_APP_VERSION = {
.Major = 0, .Major = 0,
.Minor = 5, .Minor = 5,
.Patch = 64 .Patch = 65
}; };
// TODO(matt): Copy in the DB 3 stuff from cinera_working.c // TODO(matt): Copy in the DB 3 stuff from cinera_working.c
@ -2324,8 +2324,7 @@ PrintUsage(char *BinaryLocation, config *DefaultConfig)
" Override default output player location (\"%s\")\n" " Override default output player location (\"%s\")\n"
"\n" "\n"
" -1\n" " -1\n"
" Open search result links in the same browser tab and do not autofocus\n" " Open search result links in the same browser tab\n"
" search input box on page load\n"
" NOTE: Ideal for a guide embedded in an iframe\n" " NOTE: Ideal for a guide embedded in an iframe\n"
" -f\n" " -f\n"
" Force integration with an incomplete template\n" " Force integration with an incomplete template\n"
@ -5510,13 +5509,13 @@ 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) + (Config.Mode & MODE_SINGLETAB ? 0 : 10); 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[659 + 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\"%s>\n" " <input type=\"text\" id=\"query\">\n"
" <div class=\"spinner\">\n" " <div class=\"spinner\">\n"
" Downloading data...\n" " Downloading data...\n"
" </div>\n" " </div>\n"
@ -5529,7 +5528,6 @@ IndexToBuffer(index *Index, buffers *CollationBuffers) // NOTE(matt): This guy m
" <div id=\"cineraIndexSort\">Sort: Old to New &#9206;</div>\n" " <div id=\"cineraIndexSort\">Sort: Old to New &#9206;</div>\n"
" <div id=\"cineraIndexEntries\">\n", " <div id=\"cineraIndexEntries\">\n",
Theme, Theme,
Config.Mode & MODE_SINGLETAB ? "": " autofocus",
Config.Mode & MODE_SINGLETAB ? 1 : 0, Config.Mode & MODE_SINGLETAB ? 1 : 0,
Theme, Theme,
Config.ProjectID, Config.ProjectID,

View File

@ -209,7 +209,30 @@ function renderResults() {
} }
} }
var queryEl = document.getElementById("query") function IsVisible(el) {
var xPos = 0;
var yPos = 0;
var Height = parseInt(getComputedStyle(el).height);
while (el) {
if (el.tagName == "BODY") {
var xScroll = el.scrollLeft || document.documentElement.scrollLeft;
var yScroll = el.scrollTop || document.documentElement.scrollTop;
xPos += (el.offsetLeft - xScroll + el.clientLeft)
yPos += (el.offsetTop - yScroll + el.clientTop)
} else {
xPos += (el.offsetLeft - el.scrollLeft + el.clientLeft);
yPos += (el.offsetTop - el.scrollTop + el.clientTop);
}
el = el.offsetParent;
}
return ((xPos > 0 && xPos < window.innerWidth) && (yPos > 0 && yPos + Height < window.innerHeight));
}
var queryEl = document.getElementById("query");
if(document.hasFocus() && IsVisible(queryEl)) { queryEl.focus(); }
queryEl.addEventListener("input", function(ev) { queryEl.addEventListener("input", function(ev) {
history.replaceState(null, null, "#" + encodeURIComponent(queryEl.value)); history.replaceState(null, null, "#" + encodeURIComponent(queryEl.value));
runSearch(); runSearch();