misc fixes:

- import from '@webrecorder/wabac' package for sw.js, though using github overrides for now
- replay: show loading spinner on beforeunload event in iframe
- embed: support passing basePageUrl param as part of extraConfig for custom top-level page

src/appmain.js

@@ -304,6 +304,16 @@ class App extends LitElement
       }
     }
 
+    if (this.pageParams.get("basePageUrl")) {
+      if (!this.loadInfo) {
+        this.loadInfo = {extraConfig: {}}
+      }
+      if (!this.loadInfo.extraConfig) {
+        this.loadInfo.extraConfig = {};
+      }
+      this.loadInfo.extraConfig.baseUrl = this.pageParams.get("basePageUrl");
+    }
+
     if (this.pageParams.get("customColl")) {
       if (!this.loadInfo) {
         this.loadInfo = {}

src/electron-main.js

@@ -8,7 +8,7 @@ import {app, session, BrowserWindow, ipcMain, shell} from 'electron';
 import path from 'path';
 import fs from 'fs';
 
-import { ArchiveResponse, Rewriter } from 'wabac/src/rewrite';
+import { ArchiveResponse, Rewriter } from '@webrecorder/wabac/src/rewrite';
 
 import { PassThrough } from 'stream';
 

src/electron-preload.js

@@ -1,6 +1,6 @@
 "use strict";
 
-import { CollectionLoader } from 'wabac/src/loaders';
+import { CollectionLoader } from '@webrecorder/wabac/src/loaders';
 
 const { ipcRenderer, contextBridge } = require('electron');
 

src/embed.js

@@ -112,6 +112,7 @@ class Embed extends LitElement
         source: this.source,
         customColl: this.coll,
         config: this.config,
+        basePageUrl: window.location.href.split("#")[0],
         embed: this.embed,
       }).toString();
   

src/replay.js

@@ -123,7 +123,7 @@ class Replay extends LitElement
         this.replayTS = event.data.ts;
         this.replayUrl = event.data.url;
         this.title = event.data.title || this.title;
-        this.clearLoading();
+        this.clearLoading(iframe.contentWindow);
 
         if (event.data.icons) {
           const icons = event.data.icons;
@@ -166,17 +166,23 @@ class Replay extends LitElement
       const iframe = this.renderRoot.querySelector("iframe");
       if (!iframe || !iframe.contentDocument || !iframe.contentWindow || 
         (iframe.contentDocument.readyState === "complete" && !iframe.contentWindow._WBWombat)) {
-          this.clearLoading();
+          this.clearLoading(iframe && iframe.contentWindow);
       }
     }, 5000);
   }
 
-  clearLoading() {
+  clearLoading(iframeWin) {
     this.isLoading = false;
     if (this._loadPoll) {
       window.clearInterval(this._loadPoll);
       this._loadPoll = null;
     }
+
+    if (iframeWin) {
+      iframeWin.addEventListener("beforeunload", () => {
+        this.isLoading = true;
+      });
+    }
   }
 
   static get styles() {

src/sw.js

@@ -11,11 +11,11 @@ if (self.registration) {
   staticData.set(prefix + "index.html", {type: "text/html", content: INDEX_HTML});
   //staticData.set(prefix + "ui.js", {type: "application/javascript", content: UI_JS});
 
-  const { SWReplay } = require('wabac/src/swmain');
+  const { SWReplay } = require('@webrecorder/wabac/src/swmain');
   self.sw = new SWReplay(staticData);
 
 } else if (self.postMessage) {
 // Inited as Web Worker
-  const { WorkerLoader } = require('wabac/src/loaders');
+  const { WorkerLoader } = require('@webrecorder/wabac/src/loaders');
   const loader = new WorkerLoader(self);
 }