misc fixes:

- sw: ensure db is inited before api listAll() call
- ui: init dbworker earlier, on app load
- typo: fix date created -> date loader

src/appmain.js

@@ -1,7 +1,7 @@
 import { LitElement, html, css } from 'lit-element';
 import { wrapCss, rwpLogo, IS_APP } from './misc';
 
-import { registerSW } from './pageutils';
+import { registerSW, initDBWorker } from './pageutils';
 
 import prettyBytes from 'pretty-bytes';
 
@@ -25,6 +25,7 @@ class App extends LitElement
     this.inited = false;
 
     registerSW(__SW_NAME__);
+    initDBWorker();
   }
 
   static get properties() {

src/coll-index.js

@@ -17,8 +17,6 @@ class CollIndex extends LitElement
 
     this.colls = [];
     this.sortedColls = [];
-    //this.sortKey = localStorage.getItem("index:sortKey") || "title";
-    //this.sortDesc = localStorage.getItem("index:sortDesc") === "1";
 
     this.hideHeader = localStorage.getItem("index:hideHeader") === "1";
 
@@ -34,7 +32,7 @@ class CollIndex extends LitElement
        name: "Source"},
 
       {key: "ctime",
-       name: "Date Created"},
+       name: "Date Loaded"},
 
       {key: "size",
        name: "Total Size"}
@@ -213,6 +211,7 @@ class CollIndex extends LitElement
           <span>${this.hideHeader ? 'Expand' : 'Collapse'}</span>
         </a>
         <wr-sorter id="index"
+        defaultKey="title"
         .sortKeys="${CollIndex.sortKeys}"
         .data="${this.colls}"
         @sort-changed="${(e) => this.sortedColls = e.detail.sortedData}">

src/loader.js

@@ -1,20 +1,12 @@
 import { LitElement, html, css } from 'lit-element';
 import { wrapCss } from './misc';
 
-import { parseURLSchemeHostPath } from './pageutils';
+import { parseURLSchemeHostPath, initDBWorker } from './pageutils';
-
-let dbworker = null;
 
 
 // ===========================================================================
 class Loader extends LitElement
 {
-  static initDBWorker() {
-    if (dbworker === null) {
-      dbworker = new Worker(__SW_NAME__);
-    }
-  }
-
   constructor() {
     super();
     this.progress = 0;
@@ -24,7 +16,7 @@ class Loader extends LitElement
     this.state = "waiting";
     this.loadInfo = null;
 
-    Loader.initDBWorker();
+    this.dbworker = initDBWorker();
   }
 
   static get properties() {
@@ -47,7 +39,7 @@ class Loader extends LitElement
   }
 
   initMessages() {
-    dbworker.addEventListener("message", (event) => {
+    this.dbworker.addEventListener("message", (event) => {
       switch (event.data.msg_type) {
         case "collProgress":
           if (event.data.name === this.coll) {
@@ -119,7 +111,7 @@ You can select a file to upload from the main page by clicking the \'Choose File
       msg.extraConfig = this.loadInfo.extraConfig;
     }
 
-    dbworker.postMessage(msg);
+    this.dbworker.postMessage(msg);
   }
 
   googledriveInit() {
@@ -137,7 +129,7 @@ You can select a file to upload from the main page by clicking the \'Choose File
   }
 
   onCancel() {
-    dbworker.postMessage({"msg_type": "cancelLoad", "name": this.coll});
+    this.dbworker.postMessage({"msg_type": "cancelLoad", "name": this.coll});
   }
 
   updated(changedProperties) {

src/pages.js

@@ -191,6 +191,7 @@ class Pages extends LitElement
       <div class="panel-block status">
         <span class="num-results">${this.formatResults()}</span>
         <wr-sorter id="pages"
+        defaultKey="title"
         .sortKeys="${Pages.sortKeys}"
         .data="${this.filteredPages}"
         @sort-changed="${(e) => this.sortedPages = e.detail.sortedData}"
@@ -286,13 +287,16 @@ class PageEntry extends LitElement
 
   render() {
     const p = this.page;
-    const date = new Date(p.ts);
+    let date = null;
+    try {
+      date = new Date(p.ts);
+    } catch (e) { }
 
     return html`
     <div class="columns">
       <div class="column col-date is-one-fifth">
-      <div>${date.toLocaleDateString()}</div>
+      <div>${date ? date.toLocaleDateString() : ""}</div>
-      <div>${date.toLocaleTimeString()}</div>
+      <div>${date ? date.toLocaleTimeString() : ""}</div>
       </div>
       <div class="column">
         <a @click="${this.onReplay}" data-url="${p.url}" data-ts="${getTS(date.toISOString())}" href="#">

src/pageutils.js

@@ -1,5 +1,7 @@
 import { register } from 'register-service-worker';
 
+
+// ===========================================================================
 async function registerSW(name = "sw.js", scope = "./") {
   let resolve, reject;
   
@@ -24,6 +26,18 @@ async function registerSW(name = "sw.js", scope = "./") {
   await p;
 }
 
+// ===========================================================================
+let dbworker = null;
+
+function initDBWorker() {
+  if (dbworker === null) {
+    dbworker = new Worker(__SW_NAME__);
+  }
+  return dbworker;
+}
+
+
+// ===========================================================================
 async function digestMessage(message, hashtype) {
   const msgUint8 = new TextEncoder().encode(message);                           // encode as (utf-8) Uint8Array
   const hashBuffer = await crypto.subtle.digest(hashtype, msgUint8);           // hash the message
@@ -32,6 +46,8 @@ async function digestMessage(message, hashtype) {
   return hashHex;
 }
 
+
+// ===========================================================================
 function tsToDate(ts) {
   if (!ts) {
     return "";
@@ -51,10 +67,14 @@ function tsToDate(ts) {
   return new Date(datestr);
 };
 
+
+// ===========================================================================
 function getTS(iso) {
   return iso.replace(/[-:T]/g, '').slice(0, 14);
 }
 
+
+// ===========================================================================
 async function sourceToId(url) {
   try {
     url = new URL(url, window.location.origin).href;
@@ -65,6 +85,8 @@ async function sourceToId(url) {
   return {url, coll};
 }
 
+
+// ===========================================================================
 // simple parse of scheme, host, rest of path
 // not using URL due to different browser behavior
 function parseURLSchemeHostPath(url) {
@@ -97,4 +119,5 @@ function parseURLSchemeHostPath(url) {
 }
 
 
-export { digestMessage, tsToDate, getTS, sourceToId, parseURLSchemeHostPath, registerSW };
+export { digestMessage, tsToDate, getTS, sourceToId, parseURLSchemeHostPath,
+         registerSW, initDBWorker };