cinera.css: Search page mobile style

cinera_search.js: Conditionally display the results summary
This commit is contained in:
Matt Mascarenhas 2019-03-03 00:44:05 +00:00
parent 21814d1e48
commit d6e633cf3e
3 changed files with 41 additions and 3 deletions

View File

@ -17,7 +17,7 @@ typedef struct
version CINERA_APP_VERSION = { version CINERA_APP_VERSION = {
.Major = 0, .Major = 0,
.Minor = 6, .Minor = 6,
.Patch = 5 .Patch = 6
}; };
#include <stdarg.h> // NOTE(matt): varargs #include <stdarg.h> // NOTE(matt): varargs

View File

@ -78,7 +78,7 @@
} }
#cineraIndexEntries div a::before { #cineraIndexEntries div a::before {
content: ""; content: "\2713";
margin: 0 4px; margin: 0 4px;
} }
@ -105,6 +105,41 @@
#cineraResultsSummary { #cineraResultsSummary {
margin: 10px 0; margin: 10px 0;
text-align: center; text-align: center;
display: none;
}
@media (max-width: 512px), (max-height: 512px)
{
.cineraQueryContainer {
margin: 4px auto;
}
#cineraIndex #cineraIndexSort,
#cineraResultsSummary {
font-size: 64%;
}
#cineraIndex #cineraIndexSort {
margin-bottom: 4px;
}
#cineraResults .dayContainer {
flex-direction: column;
}
#cineraResults .dayContainer .dayname {
font-weight: bold;
text-align: center;
width: 100%;
}
#cineraResults .dayContainer .markerList {
max-width: 100%;
}
#cineraIndexEntries div a {
font-size: 80%;
}
} }
/* Player */ /* Player */

View File

@ -13,6 +13,7 @@ var projectID = indexContainer.attributes.getNamedItem("data-project").value;
var theme = indexContainer.classList.item(0); var theme = indexContainer.classList.item(0);
var baseURL = indexContainer.attributes.getNamedItem("data-baseURL").value; var baseURL = indexContainer.attributes.getNamedItem("data-baseURL").value;
var playerLocation = indexContainer.attributes.getNamedItem("data-playerLocation").value; var playerLocation = indexContainer.attributes.getNamedItem("data-playerLocation").value;
var resultsSummary = document.getElementById("cineraResultsSummary");
var indexSort = indexContainer.querySelector("#cineraIndexSort"); var indexSort = indexContainer.querySelector("#cineraIndexSort");
var indexEntries = indexContainer.querySelector("#cineraIndexEntries"); var indexEntries = indexContainer.querySelector("#cineraIndexEntries");
@ -106,6 +107,7 @@ function runSearch() {
var totalSeconds = 0; var totalSeconds = 0;
if (queryStr && queryStr.length > 0) { if (queryStr && queryStr.length > 0) {
indexContainer.style.display = "none"; indexContainer.style.display = "none";
resultsSummary.style.display = "block";
if (episodes.length > 0) { if (episodes.length > 0) {
var query = new RegExp(queryStr.replace("(", "\\(").replace(")", "\\)").replace(/\|+/, "\|").replace(/\|$/, "").replace(/(^|[^\\])\\$/, "$1"), "gi"); var query = new RegExp(queryStr.replace("(", "\\(").replace(")", "\\)").replace(/\|+/, "\|").replace(/\|$/, "").replace(/(^|[^\\])\\$/, "$1"), "gi");
for (var i = 0; i < episodes.length; ++i) { for (var i = 0; i < episodes.length; ++i) {
@ -143,11 +145,12 @@ function runSearch() {
else else
{ {
indexContainer.style.display = "block"; indexContainer.style.display = "block";
resultsSummary.style.display = "none";
} }
var totalTime = Math.floor(totalSeconds/60/60) + "h " + Math.floor(totalSeconds/60)%60 + "m " + totalSeconds%60 + "s "; var totalTime = Math.floor(totalSeconds/60/60) + "h " + Math.floor(totalSeconds/60)%60 + "m " + totalSeconds%60 + "s ";
document.getElementById("cineraResultsSummary").textContent = "Found: " + numEpisodes + " episodes, " + numMarkers + " markers, " + totalTime + "total."; resultsSummary.textContent = "Found: " + numEpisodes + " episodes, " + numMarkers + " markers, " + totalTime + "total.";
} }
function renderResults() { function renderResults() {