ruffle: update to ruffle 2023-05-13 release, later versions interfere… (#181)

* ruffle:
- switch to ruffle 2023-05-13 release, later versions interfere with loading, it seems (see #180)
fixes #180

* add ruffle toggling options
- disable by default in embed mode, can be enabled with 'useruffle' attr
- enable by default in standalone, can be disabled with 'skipruffle' attr
- fixes #182

* update CHANGES for 1.8.1

src/appmain.js

@@ -17,6 +17,7 @@ class ReplayWebApp extends LitElement
     this.collTitle = null;
     this.showAbout = false;
     this.showFileDropOverlay = false;
+
     this.pageParams = new URLSearchParams();
 
     this.inited = false;
@@ -31,6 +32,9 @@ class ReplayWebApp extends LitElement
     this.swName = swName;
     this.swmanager = null;
 
+    this.skipRuffle = false;
+    this.useRuffle = false;
+
     this.safariKeyframes();
 
     this.addEventListener("dragenter", (dragEvent) => {
@@ -88,6 +92,7 @@ class ReplayWebApp extends LitElement
       pageTitle: { type: String },
       pageReplay: { type: Boolean },
       source: { type: String },
+      skipRuffle: { type: Boolean },
 
       swErrorMsg: { type: Object },
     };
@@ -323,7 +328,10 @@ class ReplayWebApp extends LitElement
   firstUpdated() {
     this.initRoute();
 
-    this.swmanager = new SWManager({name: this.swName, appName: this.appName});
+    // service worker name
+    const name = this.swName + (this.useRuffle ? "?ruffle=1" : "");
+
+    this.swmanager = new SWManager({name, appName: this.appName});
     this.swmanager.register().catch(() => this.swErrorMsg = this.swmanager.renderErrorReport(this.mainLogo));
 
     window.addEventListener("popstate", () => {
@@ -414,6 +422,12 @@ class ReplayWebApp extends LitElement
     this.sourceUrl = this.pageParams.get("source") || "";
     this.embed = this.pageParams.get("embed") || "";
 
+    if (!this.embed) {
+      this.useRuffle = !this.skipRuffle;
+    } else {
+      this.useRuffle = this.pageParams.get("ruffle") === "1";
+    }
+
     if (this.pageParams.has("terms")) {
       this.showAbout = true;
     }

src/embed.js

@@ -43,6 +43,7 @@ class Embed extends LitElement
     this.noSandbox = null;
     this.logo = rwpLogo;
     this.loading = "";
+    this.useRuffle = false;
   }
 
   static setDefaultReplayFile(replayfile) {
@@ -88,6 +89,8 @@ class Embed extends LitElement
       requireSubdomainIframe: {type: Boolean},
 
       loading: { type: String },
+
+      useRuffle: { type: Boolean },
     };
   }
 
@@ -252,6 +255,10 @@ class Embed extends LitElement
         params.swName = this.swName;
       }
 
+      if (this.useRuffle) {
+        params.ruffle = "1";
+      }
+
       this.paramString = new URLSearchParams(params).toString();
 
       this.hashString = new URLSearchParams({

src/sw.js

@@ -12,15 +12,15 @@ if (self.registration) {
 
   staticData.set(prefix, {type: "text/html", content: INDEX_HTML});
   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('@webrecorder/wabac/src/swmain');
+  const sp = new URLSearchParams(self.location.search);
 
-  const defaultConfig = {
-    injectScripts: ["ruffle/ruffle.js"],
-  };
+  const defaultConfig = {};
+
+  if (sp.get("ruffle") == "1") {
+    defaultConfig.injectScripts = ["ruffle/ruffle.js"];
+  }
 
-  self.ipfsCustomPreload = true;
   self.sw = new SWReplay({staticData, defaultConfig});
 } else {
   new WorkerLoader(self);