pages tweaks:

- display no results message in main view
- better view of score column in mobile view
- rename: rwp:// -> search://, Score -> Match
- only cache textIndex if non-zero result
This commit is contained in:
Ilya Kreymer
2020-08-10 23:49:00 -07:00
parent 4efce70a39
commit 531f16a433
5 changed files with 55 additions and 36 deletions
+2 -5
View File
@@ -1,7 +1,7 @@
import { LitElement, html, css } from 'lit-element';
import { wrapCss, rwpLogo, IS_APP } from './misc';
import { sourceToId } from './pageutils';
import { sourceToId, tsToDate } from './pageutils';
import fasBook from '@fortawesome/fontawesome-free/svgs/solid/book.svg';
@@ -9,10 +9,7 @@ import farListAlt from '@fortawesome/fontawesome-free/svgs/regular/list-alt.svg'
import farResources from '@fortawesome/fontawesome-free/svgs/solid/puzzle-piece.svg';
import farPages from '@fortawesome/fontawesome-free/svgs/regular/file-image.svg';
import { tsToDate } from './pageutils';
import fasRefresh from '@fortawesome/fontawesome-free/svgs/solid/redo-alt.svg';
import fasSearch from '@fortawesome/fontawesome-free/svgs/solid/search.svg';
import fasFullscreen from '@fortawesome/fontawesome-free/svgs/solid/desktop.svg';
import fasUnfullscreen from '@fortawesome/fontawesome-free/svgs/solid/compress-arrows-alt.svg';
@@ -21,7 +18,7 @@ import fasRight from '@fortawesome/fontawesome-free/svgs/solid/arrow-right.svg';
import fasMenuV from '@fortawesome/fontawesome-free/svgs/solid/ellipsis-v.svg';
const RWP_SCHEME = "rwp://";
const RWP_SCHEME = "search://";
// ===========================================================================
+29 -15
View File
@@ -46,7 +46,7 @@ class Pages extends LitElement
return [
{
"key": "",
"name": "Score",
"name": "Best Match",
},
{
"key": "title",
@@ -191,9 +191,9 @@ class Pages extends LitElement
let resp = await cache.match(indexUrl);
if (!resp) {
if (!resp || !Number(resp.headers.get("Content-Length"))) {
resp = await fetch(`${this.collInfo.apiPrefix}/textIndex`);
if (resp.status === 200) {
if (resp.status === 200 && Number(resp.headers.get("Content-Length"))) {
cache.put(indexUrl, resp.clone());
}
}
@@ -353,6 +353,7 @@ class Pages extends LitElement
.mobile-header {
margin: 0.5rem;
margin-left: 1.0rem;
display: flex;
justify-content: space-between;
flex-direction: row;
@@ -499,7 +500,7 @@ class Pages extends LitElement
<div class="header columns is-hidden-mobile">
${this.query ? html`
<a @click="${this.onSort}" data-key="" class="column is-1 ${this.sortKey === "" ? (this.sortDesc ? "desc" : "asc") : ''}">Score</a>` : ``}
<a @click="${this.onSort}" data-key="" class="column is-1 ${this.sortKey === "" ? (this.sortDesc ? "desc" : "asc") : ''}">Match</a>` : ``}
<a @click="${this.onSort}" data-key="ts" class="column is-2 ${this.sortKey === "ts" ? (this.sortDesc ? "desc" : "asc") : ''}">Date</a>
<a @click="${this.onSort}" data-key="title" class="column is-6 pagetitle ${this.sortKey === "title" ? (this.sortDesc ? "desc" : "asc") : ''}">Page Title</a>
@@ -526,11 +527,12 @@ class Pages extends LitElement
${this.renderPageHeader()}
</div>
<div class="scroller" @scroll="${this.onScroll}">
${this.sortedPages.map((p, i) => html`
<div class="content ${this.selectedPages.has(p.id) ? 'selected' : ''}">
<wr-page-entry .index="${this.query ? (this.sortDesc ? this.sortedPages.length - i : i + 1) : 0}" .editable="${this.editable}" .selected="${this.selectedPages.has(p.id)}" @sel-page="${this.onSelectToggle}" @delete-page="${this.onDeletePage}" replayPrefix="${this.collInfo.replayPrefix}" query="${this.query}" .page="${p}">
</wr-page-entry>
</div>`)}
${this.sortedPages.length ? html`
${this.sortedPages.map((p, i) => html`
<div class="content ${this.selectedPages.has(p.id) ? 'selected' : ''}">
<wr-page-entry .index="${this.query ? (this.sortDesc ? this.sortedPages.length - i : i + 1) : 0}" .editable="${this.editable}" .selected="${this.selectedPages.has(p.id)}" @sel-page="${this.onSelectToggle}" @delete-page="${this.onDeletePage}" replayPrefix="${this.collInfo.replayPrefix}" query="${this.query}" .page="${p}">
</wr-page-entry>
</div>`)}` : html`<p class="mobile-header">${this.getNoResultsMessage()}</p>`}
</div>
`;
}
@@ -623,6 +625,14 @@ class Pages extends LitElement
}
formatResults() {
if (this.sortedPages.length === 1) {
return "1 Page Found";
} else {
return `${this.sortedPages.length} Pages Found`;
}
}
getNoResultsMessage() {
if (!this.collInfo || !this.collInfo.pages.length) {
return html`No Pages defined this archive. Check out&nbsp;<a href="#view=resources">Page Resources</a>&nbsp;to search by URL.`;
}
@@ -635,13 +645,11 @@ class Pages extends LitElement
return "Searching...";
}
if (!this.sortedPages.length) {
return this.query ? "No Pages Found. Try changing the search query." : "No Pages Found";
} else if (this.sortedPages.length === 1) {
return "1 Page Found";
} else {
return `${this.sortedPages.length} Pages Found`;
if (!this.query) {
return "No Pages Found. Try changing the search query.";
}
return "No Pages Found";
}
onScroll(event) {
@@ -738,6 +746,12 @@ class PageEntry extends LitElement
.col-date div {
display: inline;
}
.col-index {
position: absolute;
top: 0px;
left: 0px;
margin-top: -0.75em;
}
.columns {
display: flex;
flex-direction: column-reverse;
+3 -3
View File
File diff suppressed because one or more lines are too long
+20 -12
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -293,7 +293,7 @@
"@webrecorder/wabac@github:webrecorder/wabac.js":
version "2.0.4"
resolved "https://codeload.github.com/webrecorder/wabac.js/tar.gz/a286e76e705a8686c124e755cb22fad9618f4f23"
resolved "https://codeload.github.com/webrecorder/wabac.js/tar.gz/c9d31d3162050b5329fbe2287c80a0270c44c461"
dependencies:
brotli "github:foliojs/brotli.js"
fast-xml-parser "^3.15.1"