Show All Pages Option (#177)

* show all pages:
- add option to 'show all pages' if additional non-seed pages are present in the wacz file
- only show checkbox if there are additional pages
- tweak page results to just show 'Pages' or 'Pages Shown' to avoid confusion over 'Pages Found'
- bump to 1.8.0

fixes #176

CHANGES: add changes for 1.8.0

CHANGES.md

@@ -1,5 +1,10 @@
 ## CHANGES
 
+v1.8.0
+- UI: Add 'Show All Pages' option to show non-seed pages that are previously only available via search
+- Embeds: add 'swName' option to allow customizing 'sw.js' to a different filename
+- Dependencies: Update to wabac.js 2.16.1 -- varioues loading improvements related to surt
+
 v1.7.15
 - UI: Loading: support URLs that have query/hashes after extension
 - Dependencies: Update to wabac.js 2.16.0 -- improved support for Multi WACZ files

_data/package.json

@@ -1,7 +1,7 @@
 {
   "name": "replaywebpage",
   "productName": "ReplayWeb.page",
-  "version": "1.7.15",
+  "version": "1.8.0",
   "description": "Serverless Web Archive Replay",
   "repository": "https://github.com/webrecorder/replayweb.page",
   "homepage": "https://replayweb.page/",
@@ -14,7 +14,7 @@
     "electron-log": "^4.4.1",
     "electron-updater": "^5.3.0",
     "fetch-ndjson": "^1.1.6",
-    "flexsearch": "^0.7.21",
+    "flexsearch": "^0.7.31",
     "keyword-mark-element": "^0.2.0",
     "lit": "^2.1.1",
     "marked": "^4.0.10",

package.json

@@ -1,7 +1,7 @@
 {
   "name": "replaywebpage",
   "productName": "ReplayWeb.page",
-  "version": "1.7.15",
+  "version": "1.8.0",
   "description": "Serverless Web Archive Replay",
   "repository": "https://github.com/webrecorder/replayweb.page",
   "homepage": "https://replayweb.page/",
@@ -14,7 +14,7 @@
     "electron-log": "^4.4.1",
     "electron-updater": "^5.3.0",
     "fetch-ndjson": "^1.1.6",
-    "flexsearch": "^0.7.21",
+    "flexsearch": "^0.7.31",
     "keyword-mark-element": "^0.2.0",
     "lit": "^2.1.1",
     "marked": "^4.0.10",

src/pages.js

@@ -29,6 +29,9 @@ class Pages extends LitElement
     this.loading = false;
     this.updatingSearch = false;
 
+    this.showAllPages = false;
+    this.hasExtraPages = false;
+
     this.currList = 0;
 
     this.active = false;
@@ -77,6 +80,8 @@ class Pages extends LitElement
       filteredPages: { type: Array },
       sortedPages: { type: Array },
 
+      showAllPages: { type: Boolean },
+
       query: { type: String },
       defaultKey: { type: String },
 
@@ -120,7 +125,10 @@ class Pages extends LitElement
 
     } else if (changedProperties.has("currList")) {
       this.filter();
+    } else if (changedProperties.has("showAllPages")) {
+      this.filter();
     }
+
     if (changedProperties.has("active") && this.active) {
       if (this.changeNeeded) {
         this.filter();
@@ -173,6 +181,8 @@ class Pages extends LitElement
     if (this.flex && this.query && this.textPages) {
       const results = await this.flex.searchAsync(this.query, 25);
       this.filteredPages = results.map(inx => this.textPages[inx]);
+    } else if (this.showAllPages && this.hasExtraPages) {
+      this.filteredPages = [...this.textPages];
     } else {
       this.filteredPages = [...this.collInfo.pages];
     }
@@ -213,6 +223,9 @@ class Pages extends LitElement
     this.flex = flex;
     this.textPages = pages;
 
+    this.hasExtraPages = this.textPages && this.collInfo && this.collInfo.pages &&
+    this.textPages.length > this.collInfo.pages.length;
+    
     return Promise.all(pages.map((page, index) => {
       let text = page.url;
       if (page.title) {
@@ -526,7 +539,7 @@ class Pages extends LitElement
       </div>
     </div>
     <div class="main columns">
-      <div class="column index-bar is-one-fifth is-hidden-mobile">
+      <div class="column index-bar is-one-fifth">
 
         ${this.editable && this.editing ? html`
         <form @submit="${this.onUpdateTitle}"><input id="titleEdit" class="input" value="${this.collInfo.title}" @blur="${this.onUpdateTitle}"></form>
@@ -535,7 +548,15 @@ class Pages extends LitElement
 
         ${this.editable ? html`<fa-icon class="editIcon" .svg="${fasEdit}"></fa-icon>` : html``}
 
-        <span class="num-results" aria-live="polite" aria-atomic="true">${this.formatResults()}</span>
+        ${this.hasExtraPages ? html`
+        <span class="check-select">
+          <label class="checkbox">
+          <input @change=${e => this.showAllPages = e.currentTarget.checked} type="checkbox" .checked="${this.showAllPages}">
+          Show Non-Seed Pages
+          </label>
+        </span>` : ""}
+
+        <span class="num-results is-hidden-mobile" aria-live="polite" aria-atomic="true">${this.formatResults()}</span>
 
         ${this.editable ? html`
         <div class="index-bar-actions">
@@ -855,19 +876,19 @@ class Pages extends LitElement
   formatResults() {
     // Default behavior: Count all available pages
     if (!this.query) {
-      const length = this.collInfo.pages.length;
+      const length = this.filteredPages.length;
       if (length === this.sortedPages.length) {
-        return `${length} Page${length ? "s" : ""} Found`;
+        return `${length} Page${length !== 1 ? "s" : ""}`;
       } else {
-        return `${this.sortedPages.length} of ${length} Pages Found`;
+        return `${this.sortedPages.length} of ${length} Pages Shown`;
       }
     }
 
     // ... unless they were filtered
     if (this.sortedPages.length === 1) {
-      return "1 Page Found";
+      return "1 Page";
     } else {
-      return `${this.sortedPages.length} Pages Found`;
+      return `${this.sortedPages.length} Pages`;
     }
   }
 

yarn.lock

@@ -2546,10 +2546,10 @@ flatted@^3.1.0:
   resolved "https://registry.yarnpkg.com/flatted/-/flatted-3.2.7.tgz#609f39207cb614b89d0765b477cb2d437fbf9787"
   integrity sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==
 
-flexsearch@^0.7.21:
+flexsearch@^0.7.31:
-  version "0.7.21"
+  version "0.7.31"
-  resolved "https://registry.yarnpkg.com/flexsearch/-/flexsearch-0.7.21.tgz#0f5ede3f2aae67ddc351efbe3b24b69d29e9d48b"
+  resolved "https://registry.yarnpkg.com/flexsearch/-/flexsearch-0.7.31.tgz#065d4110b95083110b9b6c762a71a77cc52e4702"
-  integrity sha512-W7cHV7Hrwjid6lWmy0IhsWDFQboWSng25U3VVywpHOTJnnAZNPScog67G+cVpeX9f7yDD21ih0WDrMMT+JoaYg==
+  integrity sha512-XGozTsMPYkm+6b5QL3Z9wQcJjNYxp0CYn3U1gO7dwD6PAqU1SVWZxI9CCg3z+ml3YfqdPnrBehaBrnH2AGKbNA==
 
 follow-redirects@^1.0.0:
   version "1.14.8"