-
+ >${this.appLogo
+ ? html`
+
+ `
+ : nothing}
Powered by ReplayWeb.page
diff --git a/src/embed.js b/src/embed.ts
similarity index 68%
rename from src/embed.js
rename to src/embed.ts
index c22e3a34..11fda330 100644
--- a/src/embed.js
+++ b/src/embed.ts
@@ -1,94 +1,75 @@
-import { LitElement, html, css } from "lit";
+import { LitElement, html, css, TemplateResult } from "lit";
import { ifDefined } from "lit/directives/if-defined.js";
import { wrapCss, rwpLogo } from "./misc";
import { SWManager } from "./swmanager";
+import { property } from "lit/decorators.js";
-var scriptSrc = document.currentScript && document.currentScript.src;
+const scriptSrc =
+ document.currentScript && (document.currentScript as HTMLScriptElement).src;
-var defaultReplayFile = "";
+let defaultReplayFile = "";
const DEFAULT_REPLAY_BASE = "https://replayweb.page/";
// ===========================================================================
class Embed extends LitElement {
- constructor() {
- super();
- this.replaybase = "./replay/";
- this.replayfile = defaultReplayFile;
- // eslint-disable-next-line no-undef
- this.swName = __SW_NAME__;
- this.mainElementName = "replay-app-main";
- this.appName = "ReplayWeb.page";
- this.view = "replay";
- this.ts = "";
- this.url = "";
- this.query = "";
- this.config = "";
- this.customConfig = null;
- this.coll = "";
- this.paramString = null;
- this.deepLink = false;
- this.newWindowBase = "";
- this.inited = false;
- this.embed = null;
- this.reloadCount = 0;
- this.sandbox = false;
- this.noWebWorker = false;
- this.noCache = false;
- // deprecated;
- this.noSandbox = null;
- this.logo = rwpLogo;
- this.loading = "";
- this.useRuffle = false;
- }
+ @property({ type: String }) url = "";
+ @property({ type: String }) ts = "";
+ @property({ type: String }) query = "";
- static setDefaultReplayFile(replayfile) {
- defaultReplayFile = replayfile;
- }
+ @property({ type: String }) source;
+ @property({ type: String }) src;
+
+ @property({ type: String }) view = "replay";
+ @property({ type: String }) embed: string | null = null;
- static get properties() {
- return {
- url: { type: String },
- ts: { type: String },
- query: { type: String },
+ @property({ type: String }) replaybase = "./replay/";
+ @property({ type: String }) swName = __SW_NAME__;
- source: { type: String },
- src: { type: String },
+ @property({ type: String }) title!: string;
- view: { type: String },
- embed: { type: String },
+ @property({ type: String }) coll = "";
+ @property({ type: String }) config = "";
- replaybase: { type: String },
- swName: { type: String },
+ @property({ type: Boolean }) inited = false;
- title: { type: String },
+ @property({ type: String }) paramString: string | null = null;
+ @property({ type: String }) hashString: string | undefined;
- coll: { type: String },
- config: { type: String },
+ @property({ type: Boolean }) deepLink = false;
+ @property({ type: Boolean }) sandbox = false;
+ @property({ type: Boolean }) noSandbox: boolean | null = null;
+ @property({ type: Boolean }) noWebWorker = false;
+ @property({ type: Boolean }) noCache = false;
+ @property({ type: Boolean }) hideOffscreen: boolean | undefined;
- inited: { type: Boolean },
+ @property({ type: String }) newWindowBase = "";
- paramString: { type: String },
- hashString: { type: String },
+ @property({ type: String }) errorMessage:
+ | ""
+ | TemplateResult<1>
+ | string
+ | undefined;
- deepLink: { type: Boolean },
- sandbox: { type: Boolean },
- noSandbox: { type: Boolean },
- noWebWorker: { type: Boolean },
- noCache: { type: Boolean },
- hideOffscreen: { type: Boolean },
+ @property({ type: Boolean }) requireSubdomainIframe;
- newWindowBase: { type: String },
+ @property({ type: String }) loading = "";
- errorMessage: { type: String },
+ @property({ type: Boolean }) useRuffle = false;
- requireSubdomainIframe: { type: Boolean },
+ replayfile = defaultReplayFile;
+ mainElementName = "replay-app-main";
+ appName = "ReplayWeb.page";
+ customConfig = null;
+ reloadCount = 0;
+ logo = rwpLogo;
- loading: { type: String },
+ isCrossOrigin: boolean | undefined;
+ swmanager: SWManager | undefined;
- useRuffle: { type: Boolean },
- };
+ static setDefaultReplayFile(replayfile) {
+ defaultReplayFile = replayfile;
}
async doRegister() {
@@ -168,6 +149,7 @@ class Embed extends LitElement {
// likely safari < 16, don't use web workers due to issues with split storage state
if (
+ // @ts-expect-error - TS2339 - Property 'GestureEvent' does not exist on type 'Window & typeof globalThis'.
window.GestureEvent !== undefined &&
window.SharedWorker === undefined
) {
@@ -184,15 +166,19 @@ class Embed extends LitElement {
const qs = new URLSearchParams(window.location.hash.slice(1));
if (qs.has("url")) {
+ // @ts-expect-error - TS2339 - Property 'url' does not exist on type 'Embed'.
this.url = qs.get("url");
}
if (qs.has("ts")) {
+ // @ts-expect-error - TS2339 - Property 'ts' does not exist on type 'Embed'.
this.ts = qs.get("ts");
}
if (qs.has("query")) {
+ // @ts-expect-error - TS2339 - Property 'query' does not exist on type 'Embed'.
this.query = qs.get("query");
}
if (qs.has("view")) {
+ // @ts-expect-error - TS2339 - Property 'view' does not exist on type 'Embed'.
this.view = qs.get("view");
}
}
@@ -203,6 +189,7 @@ class Embed extends LitElement {
}
if (this.config) {
+ // @ts-expect-error - TS2339 - Property 'customConfig' does not exist on type 'Embed'. | TS2339 - Property 'config' does not exist on type 'Embed'.
const config = { ...this.customConfig, ...JSON.parse(this.config) };
return JSON.stringify(config);
} else {
@@ -229,7 +216,20 @@ class Embed extends LitElement {
const config = this.mergeConfigs();
- const params = {
+ const params: {
+ source: URL;
+ customColl: string;
+ config: string;
+ basePageUrl: string;
+ baseUrlSourcePrefix: string;
+ embed: string;
+ noWebWorker?: "1";
+ noCache?: "1";
+ hideOffscreen?: "1";
+ loading?: "eager";
+ swName?: string;
+ ruffle?: "1";
+ } = {
source,
customColl: this.coll,
config,
@@ -258,7 +258,6 @@ class Embed extends LitElement {
params.loading = "eager";
}
- // eslint-disable-next-line no-undef
if (this.swName !== __SW_NAME__) {
params.swName = this.swName;
}
@@ -267,7 +266,10 @@ class Embed extends LitElement {
params.ruffle = "1";
}
- this.paramString = new URLSearchParams(params).toString();
+ this.paramString = new URLSearchParams(
+ // Converting to unknown here so that we can ignore the URL -> string conversion necessary for the types to work out
+ params as unknown as Record,
+ ).toString();
this.hashString = new URLSearchParams({
url: this.url,
@@ -317,7 +319,8 @@ class Embed extends LitElement {
allow-popups allow-popups-to-escape-sandbox allow-presentation allow-scripts\
allow-same-origin allow-forms"
: undefined,
- )}"
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- the typedef for the `sandbox` attribute here is incorrect, it doesn't support multiple values
+ ) as any}"
@load="${this.onLoad}"
src="${this.replaybase}${this.replayfile}?${this
.paramString}#${this.hashString}"
diff --git a/src/gdrive.js b/src/gdrive.ts
similarity index 54%
rename from src/gdrive.js
rename to src/gdrive.ts
index 655f31b2..28499705 100644
--- a/src/gdrive.js
+++ b/src/gdrive.ts
@@ -7,9 +7,13 @@ import fabGoogleDrive from "@fortawesome/fontawesome-free/svgs/brands/google-dri
class GDrive extends LitElement {
constructor() {
super();
+ // @ts-expect-error - TS2339 - Property 'state' does not exist on type 'GDrive'.
this.state = "trypublic";
+ // @ts-expect-error - TS2339 - Property 'sourceUrl' does not exist on type 'GDrive'.
this.sourceUrl = "";
+ // @ts-expect-error - TS2339 - Property 'scriptLoaded' does not exist on type 'GDrive'.
this.scriptLoaded = false;
+ // @ts-expect-error - TS2339 - Property 'error' does not exist on type 'GDrive'.
this.error = false;
}
@@ -24,10 +28,13 @@ class GDrive extends LitElement {
updated(changedProperties) {
if (changedProperties.has("sourceUrl")) {
+ // @ts-expect-error - TS2339 - Property 'error' does not exist on type 'GDrive'.
this.error = false;
+ // @ts-expect-error - TS2339 - Property 'state' does not exist on type 'GDrive'.
this.state = "trypublic";
this.tryPublicAccess().then((result) => {
if (!result) {
+ // @ts-expect-error - TS2339 - Property 'state' does not exist on type 'GDrive'.
this.state = "tryauto";
this.requestUpdate();
}
@@ -37,17 +44,19 @@ class GDrive extends LitElement {
async tryPublicAccess() {
try {
+ // @ts-expect-error - TS2339 - Property 'sourceUrl' does not exist on type 'GDrive'.
const sourceUrl = this.sourceUrl;
const fileId = sourceUrl.slice("googledrive://".length);
- // eslint-disable-next-line no-undef
const publicCheckUrl = `${__HELPER_PROXY__}/g/${fileId}`;
let resp = null;
try {
+ // @ts-expect-error - TS2322 - Type 'Response' is not assignable to type 'null'.
resp = await fetch(publicCheckUrl);
} catch (e) {
return false;
}
+ // @ts-expect-error - TS2531 - Object is possibly 'null'.
const json = await resp.json();
if (!json.url || !json.name || !json.size) {
return false;
@@ -63,8 +72,10 @@ class GDrive extends LitElement {
try {
const abort = new AbortController();
const signal = abort.signal;
+ // @ts-expect-error - TS2322 - Type 'Response' is not assignable to type 'null'.
resp = await fetch(publicUrl, { signal });
abort.abort();
+ // @ts-expect-error - TS2531 - Object is possibly 'null'.
if (resp.status != 200) {
return false;
}
@@ -88,10 +99,13 @@ class GDrive extends LitElement {
}
onLoad() {
+ // @ts-expect-error - TS2339 - Property 'scriptLoaded' does not exist on type 'GDrive'.
this.scriptLoaded = true;
this.gauth("none", (response) => {
if (response.error) {
+ // @ts-expect-error - TS2339 - Property 'state' does not exist on type 'GDrive'.
if (this.state !== "implicitonly") {
+ // @ts-expect-error - TS2339 - Property 'state' does not exist on type 'GDrive'.
this.state = "trymanual";
}
} else {
@@ -109,6 +123,7 @@ class GDrive extends LitElement {
}
async authed(response) {
+ // @ts-expect-error - TS2339 - Property 'sourceUrl' does not exist on type 'GDrive'.
const sourceUrl = this.sourceUrl;
const fileId = sourceUrl.slice("googledrive://".length);
const metadataUrl = `https://www.googleapis.com/drive/v3/files/${fileId}`;
@@ -121,13 +136,17 @@ class GDrive extends LitElement {
);
if (resp.status === 404 || resp.status == 403) {
+ // @ts-expect-error - TS2339 - Property 'state' does not exist on type 'GDrive'.
if (this.state !== "implicitonly") {
+ // @ts-expect-error - TS2339 - Property 'state' does not exist on type 'GDrive'.
this.state = "trymanual";
}
+ // @ts-expect-error - TS2339 - Property 'error' does not exist on type 'GDrive'.
this.error = true;
return;
}
+ // @ts-expect-error - TS2339 - Property 'error' does not exist on type 'GDrive'.
this.error = false;
const metadata = await resp.json();
@@ -147,38 +166,48 @@ class GDrive extends LitElement {
render() {
return html` ${this.script()}
- ${this.state !== "trymanual"
- ? html`
Connecting to Google Drive...
`
- : html`
- ${this.error
- ? html`
-
-
- ${this.reauth
- ? "Some resources are loaded on demand from Google Drive, which requires reauthorization."
- : "Could not access this file with the current Google Drive account."}
-
-
- If you have multiple Google Drive accounts, be sure to
- select the correct one.
-
-
-
- `
- : ""}
-
- `}`;
+ ${
+ // @ts-expect-error - TS2339 - Property 'state' does not exist on type 'GDrive'.
+ this.state !== "trymanual"
+ ? html`
Connecting to Google Drive...
`
+ : html`
+ ${
+ // @ts-expect-error - TS2339 - Property 'error' does not exist on type 'GDrive'.
+ this.error
+ ? html`
+
+
+ ${
+ // @ts-expect-error - TS2339 - Property 'reauth' does not exist on type 'GDrive'.
+ this.reauth
+ ? "Some resources are loaded on demand from Google Drive, which requires reauthorization."
+ : "Could not access this file with the current Google Drive account."
+ }
+
+
+ If you have multiple Google Drive accounts, be sure to
+ select the correct one.
+
+
+
+ `
+ : ""
+ }
+
+ `
+ }`;
}
script() {
+ // @ts-expect-error - TS2339 - Property 'state' does not exist on type 'GDrive'. | TS2339 - Property 'scriptLoaded' does not exist on type 'GDrive'.
if (this.state === "trypublic" || this.scriptLoaded) {
return html``;
}
@@ -189,10 +218,11 @@ class GDrive extends LitElement {
}
gauth(prompt, callback) {
+ // @ts-expect-error - TS2339 - Property 'gapi' does not exist on type 'Window & typeof globalThis'.
self.gapi.load("auth2", () => {
+ // @ts-expect-error - TS2339 - Property 'gapi' does not exist on type 'Window & typeof globalThis'.
self.gapi.auth2.authorize(
{
- // eslint-disable-next-line no-undef
client_id: __GDRIVE_CLIENT_ID__,
scope: "https://www.googleapis.com/auth/drive.file",
response_type: "token",
diff --git a/src/index.d.ts b/src/index.d.ts
index e59f331d..17f1aa6d 100644
--- a/src/index.d.ts
+++ b/src/index.d.ts
@@ -1,2 +1,13 @@
declare module "*.svg";
-declare let __SW_NAME__: string;
+declare const __SW_NAME__: string;
+declare const __HELPER_PROXY__: string;
+declare const __GDRIVE_CLIENT_ID__: string;
+declare const __VERSION__: string;
+
+// showOpenFilePicker doesn't yet exist in Typescript's DOM lib
+// see https://developer.mozilla.org/en-US/docs/Web/API/Window/showOpenFilePicker for details
+interface Window {
+ showOpenFilePicker: (options?: {
+ types: { description: string; accept: Record }[];
+ }) => Promise<[FileSystemFileHandle]>;
+}
diff --git a/src/item-index.ts b/src/item-index.ts
index 3cfc6b28..39ed8dd5 100644
--- a/src/item-index.ts
+++ b/src/item-index.ts
@@ -20,12 +20,15 @@ class ItemIndex extends LitElement {
query = "";
@property({ type: Array })
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- TODO fixme
filteredItems: any[] = [];
@property({ type: Array })
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- TODO fixme
sortedItems: any[] | null = null;
@property({ type: Boolean })
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- TODO fixme
hideHeader: any = null;
@property({ type: String })
@@ -35,6 +38,7 @@ class ItemIndex extends LitElement {
headerName = "Loaded Archives";
@state()
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- TODO fixme
private _deleting: any = {};
private typeFilter = "";
diff --git a/src/item.ts b/src/item.ts
index 67408fee..e73f0203 100644
--- a/src/item.ts
+++ b/src/item.ts
@@ -48,16 +48,36 @@ import fasAngleLeft from "@fortawesome/fontawesome-free/svgs/solid/angle-left.sv
import fasAngleRight from "@fortawesome/fontawesome-free/svgs/solid/angle-right.svg";
import fasCaretDown from "@fortawesome/fontawesome-free/svgs/solid/caret-down.svg";
-import { RWPEmbedReceipt } from "./embed-receipt.js";
+import { RWPEmbedReceipt } from "./embed-receipt";
import Split from "split.js";
import type { Item as ItemInfo } from "./types";
import type { Replay } from "./replay";
+import { ifDefined } from "lit/directives/if-defined.js";
import "./item-info";
const RWP_SCHEME = "search://";
+export type LoadInfo = {
+ extraConfig?: {
+ baseUrlSourcePrefix?: unknown;
+ baseUrl?: unknown;
+ headers?: unknown;
+ recording?: unknown;
+ };
+ customColl?: string | null;
+ noWebWorker?: boolean;
+ noCache?: boolean;
+ hideOffscreen?: boolean;
+ loadEager?: boolean;
+ sourceUrl?: string;
+ loadUrl?: string;
+ swError?: string;
+ newFullImport?: unknown;
+ name?: string;
+};
+
// ===========================================================================
class Item extends LitElement {
@property({ type: Boolean })
@@ -67,7 +87,7 @@ class Item extends LitElement {
sourceUrl: string | null = null;
@property({ type: Object, attribute: false })
- loadInfo: any;
+ loadInfo: LoadInfo | null = null;
@property({ type: Boolean })
showSidebar: boolean | null = null;
@@ -142,9 +162,9 @@ class Item extends LitElement {
autoUpdateInterval = 10;
@property({ type: String })
- swName: any = null;
+ swName: string | null = null;
- private splitter: any = null;
+ private splitter: Split.Instance | null = null;
private _replaceLoc = false;
private _locUpdateNeeded = false;
@@ -224,7 +244,7 @@ class Item extends LitElement {
this.updateTabData({ multiTs: json.timestamps });
}
- willUpdate(changedProperties: Map) {
+ willUpdate(changedProperties: Map>) {
if (changedProperties.has("tabData") && this.tabData) {
// Format tab data from URL query params
const tabData = {};
@@ -266,7 +286,9 @@ class Item extends LitElement {
if (!this.itemInfo || !this.itemInfo.coll) {
return;
}
- const newHash = "#" + new URLSearchParams(this.tabData as any).toString();
+ const newHash =
+ "#" +
+ new URLSearchParams(this.tabData as Record).toString();
if (!this.tabData.url) {
this.url =
@@ -338,7 +360,7 @@ class Item extends LitElement {
},
};
- this.splitter = Split([contents as any, replay], opts);
+ this.splitter = Split([contents, replay], opts);
}
} else if (this.splitter) {
try {
@@ -850,6 +872,7 @@ class Item extends LitElement {
if (!isReplay && this.tabData && this.tabData.view) {
const detail = {
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- TODO fixme
title: (this.tabLabels as any)[this.tabData.view],
replayTitle: false,
};
@@ -866,7 +889,7 @@ class Item extends LitElement {
return html`
${this.renderTabHeader(isSidebar)}
@@ -961,9 +984,9 @@ class Item extends LitElement {
href="#story"
class="is-size-6"
aria-label="Story"
- aria-current="${(this.tabData.view === "story"
- ? "location"
- : "") as any}"
+ aria-current="${ifDefined(
+ this.tabData.view === "story" ? "location" : undefined,
+ )}"
>
`
: ""}
@@ -1530,7 +1553,7 @@ class Item extends LitElement {
class="is-paddingless ${isResources ? "" : "is-hidden"} ${isSidebar
? "sidebar"
: ""}"
- role="${(isSidebar ? "" : "main") as any}"
+ role="${ifDefined(isSidebar ? undefined : "main")}"
>
`
: ""}
@@ -1548,7 +1571,7 @@ class Item extends LitElement {
id="pages"
@coll-update="${this.onItemUpdate}"
class="${isPages ? "" : "is-hidden"} ${isSidebar ? "sidebar" : ""}"
- role="${(isSidebar ? "" : "main") as any}"
+ role="${ifDefined(isSidebar ? undefined : "main")}"
>
`
: ""}
@@ -1738,6 +1761,7 @@ class Item extends LitElement {
_stringToParams(value) {
const q = new URLSearchParams(value.slice(RWP_SCHEME.length));
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any -- TODO fixme
const data: any = {};
data.url = "";
data.ts = "";
@@ -1757,7 +1781,7 @@ class Item extends LitElement {
return data;
}
- _paramsToString(value) {
+ _paramsToString(value: Record) {
const q = new URLSearchParams();
for (const param of [
@@ -1768,14 +1792,14 @@ class Item extends LitElement {
"urlSearchType",
]) {
if (param in value) {
- q.set(param, value[param]);
+ q.set(param, String(value[param]));
}
}
return q.toString();
}
- onRefresh(event, replayOnly = false) {
+ onRefresh(event: Event | null, replayOnly = false) {
if (event) {
event.preventDefault();
}
diff --git a/src/loader.js b/src/loader.ts
similarity index 79%
rename from src/loader.js
rename to src/loader.ts
index e9237c20..73e58687 100644
--- a/src/loader.js
+++ b/src/loader.ts
@@ -4,52 +4,36 @@ import { wrapCss } from "./misc";
import prettyBytes from "pretty-bytes";
import { parseURLSchemeHostPath } from "./pageutils";
+import { property } from "lit/decorators.js";
+import { LoadInfo } from "./item";
// ===========================================================================
class Loader extends LitElement {
- constructor() {
- super();
- this.progress = 0;
- this.total = 0;
- this.percent = 0;
- this.coll = "";
- this.state = "waiting";
- this.loadInfo = null;
-
- this.currentSize = 0;
- this.totalSize = 0;
-
- this.tryFileHandle = !!window.showOpenFilePicker;
-
- this.fileHandle = null;
-
- this.errorAllowRetry = false;
-
- this.pingInterval = 0;
-
- this.noWebWorker = false;
- }
-
- static get properties() {
- return {
- sourceUrl: { type: String },
- loadInfo: { type: Object },
- state: { type: String },
- progress: { type: Number },
- percent: { type: Number },
- currentSize: { type: Number },
- totalSize: { type: Number },
- error: { type: String },
- total: { type: Number },
- status: { type: String },
- coll: { type: String },
- embed: { type: String },
- tryFileHandle: { type: Boolean },
- errorAllowRetry: { type: Boolean },
- extraMsg: { type: String },
- swName: { type: String },
- };
- }
+ @property({ type: String }) sourceUrl?: string;
+ @property({ type: Object }) loadInfo: LoadInfo | null = null;
+ @property({ type: String }) state = "waiting";
+ @property({ type: Number }) progress = 0;
+ @property({ type: Number }) percent = 0;
+ @property({ type: Number }) currentSize = 0;
+ @property({ type: Number }) totalSize = 0;
+ @property({ type: String }) error?: string;
+ @property({ type: Number }) total = 0;
+ @property({ type: String }) status?: string;
+ @property({ type: String }) coll = "";
+ @property({ type: String }) embed?: string;
+ @property({ type: Boolean }) tryFileHandle = !!window.showOpenFilePicker;
+ @property({ type: Boolean }) errorAllowRetry = false;
+ @property({ type: String }) extraMsg?: string;
+ @property({ type: String }) swName?: string;
+
+ pingInterval: number | NodeJS.Timer = 0;
+ fileHandle: FileSystemHandle | null = null;
+ noWebWorker = false;
+ worker?: Worker | null;
+
+ // Google Drive
+ _gdWait?: Promise;
+ _gdResolve!: (value: LoadInfo | PromiseLike) => void;
firstUpdated() {
this.initMessages();
@@ -57,17 +41,17 @@ class Loader extends LitElement {
}
initMessages() {
- this.noWebWorker = this.loadInfo && this.loadInfo.noWebWorker;
+ this.noWebWorker = Boolean(this.loadInfo && this.loadInfo.noWebWorker);
if (!this.noWebWorker) {
- // eslint-disable-next-line no-undef
- this.worker = new Worker(this.swName);
+ this.worker = new Worker(this.swName!);
} else {
if (!navigator.serviceWorker) {
return;
}
- this.worker = navigator.serviceWorker;
+ // TODO figure out if this is okay?
+ this.worker = navigator.serviceWorker as unknown as Worker;
}
this.worker.addEventListener("message", (event) => {
@@ -110,7 +94,7 @@ class Loader extends LitElement {
);
if (!this.noWebWorker) {
- this.worker.terminate();
+ this.worker?.terminate();
} else {
if (this.pingInterval) {
clearInterval(this.pingInterval);
@@ -125,7 +109,7 @@ class Loader extends LitElement {
async doLoad() {
let sourceUrl = this.sourceUrl;
- let source = null;
+ let source: LoadInfo | null = null;
this.percent = this.currentSize = this.totalSize = 0;
@@ -145,7 +129,7 @@ class Loader extends LitElement {
switch (scheme) {
case "googledrive":
this.state = "googledrive";
- source = await this.googledriveInit();
+ source = (await this.googledriveInit()) ?? null;
break;
case "s3":
@@ -170,7 +154,7 @@ You can select a file to upload from the main page by clicking the 'Choose File.
break;
case "proxy":
- sourceUrl = "proxy:" + sourceUrl.slice("proxy://".length);
+ sourceUrl = "proxy:" + sourceUrl!.slice("proxy://".length);
break;
}
} catch (e) {
@@ -184,7 +168,7 @@ You can select a file to upload from the main page by clicking the 'Choose File.
this.state = "started";
let type = undefined;
- let extraConfig = undefined;
+ let extraConfig: LoadInfo["extraConfig"] = undefined;
if (this.loadInfo) {
source.newFullImport = this.loadInfo.newFullImport;
@@ -196,10 +180,11 @@ You can select a file to upload from the main page by clicking the 'Choose File.
}
// todo: too special case?
if (
- sourceUrl.startsWith("proxy:") &&
+ sourceUrl!.startsWith("proxy:") &&
extraConfig &&
extraConfig.recording
) {
+ // @ts-expect-error - TS2322 - Type '"recordingproxy"' is not assignable to type 'undefined'.
type = "recordingproxy";
}
}
@@ -216,6 +201,7 @@ You can select a file to upload from the main page by clicking the 'Choose File.
if (!navigator.serviceWorker.controller) {
await new Promise((resolve) => {
navigator.serviceWorker.addEventListener("controllerchange", () =>
+ // @ts-expect-error - TS2794 - Expected 1 arguments, but got 0. Did you forget to include 'void' in your type argument to 'Promise'?
resolve(),
);
});
@@ -225,11 +211,13 @@ You can select a file to upload from the main page by clicking the 'Choose File.
if (!this.noWebWorker) {
this.worker.postMessage(msg);
} else {
+ // @ts-expect-error - TS2531 - Object is possibly 'null'.
navigator.serviceWorker.controller.postMessage(msg);
// ping service worker with messages to avoid shutdown while loading
// (mostly for Firefox)
this.pingInterval = setInterval(() => {
+ // @ts-expect-error - TS2531 - Object is possibly 'null'.
navigator.serviceWorker.controller.postMessage({ msg_type: "ping" });
}, 15000);
}
@@ -350,7 +338,7 @@ You can select a file to upload from the main page by clicking the 'Choose File.
switch (this.state) {
case "googledrive":
return html``;
@@ -363,10 +351,15 @@ You can select a file to upload from the main page by clicking the 'Choose File.
max="100"
>
+
${this.currentSize && this.totalSize
? html`
- Loaded ${prettyBytes(this.currentSize)} of
+ Loaded
+ ${prettyBytes(this.currentSize)}
+ of
+
${prettyBytes(this.totalSize)}
+
${this.extraMsg &&
html`
(${this.extraMsg})
`}
`
@@ -417,7 +410,10 @@ You can select a file to upload from the main page by clicking the 'Choose File.
}
async onAskPermission() {
- const result = await this.fileHandle.requestPermission({ mode: "read" });
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ const result = await (this.fileHandle as any)?.requestPermission({
+ mode: "read",
+ });
if (result === "granted") {
this.doLoad();
}
diff --git a/src/misc.js b/src/misc.ts
similarity index 66%
rename from src/misc.js
rename to src/misc.ts
index edbe16af..8ed8ae30 100644
--- a/src/misc.js
+++ b/src/misc.ts
@@ -4,6 +4,7 @@ import { LitElement, html, css, unsafeCSS } from "lit";
import { unsafeSVG } from "lit/directives/unsafe-svg.js";
import { styleMap } from "lit/directives/style-map.js";
+// @ts-expect-error - TS2307 - Cannot find module '../assets/main.scss' or its corresponding type declarations.
import allCssRaw from "../assets/main.scss";
import rwpLogo from "../assets/logo.svg";
@@ -18,11 +19,12 @@ function wrapCss(custom) {
}
const IS_APP =
+ // @ts-expect-error - TS2339 - Property 'IS_APP' does not exist on type 'Window & typeof globalThis'.
window.IS_APP ||
+ // @ts-expect-error - TS2551 - Property 'electron' does not exist on type 'Window & typeof globalThis'. Did you mean 'Electron'? | TS2551 - Property 'electron' does not exist on type 'Window & typeof globalThis'. Did you mean 'Electron'?
(window.electron && window.electron.IS_APP) ||
window.matchMedia("(display-mode: standalone)").matches;
-// eslint-disable-next-line no-undef
const VERSION = __VERSION__;
// ===========================================================================
@@ -39,8 +41,11 @@ function clickOnSpacebarPress(event) {
class FaIcon extends LitElement {
constructor() {
super();
+ // @ts-expect-error - TS2339 - Property 'size' does not exist on type 'FaIcon'.
this.size = "1.1em";
+ // @ts-expect-error - TS2339 - Property 'width' does not exist on type 'FaIcon'.
this.width = null;
+ // @ts-expect-error - TS2339 - Property 'height' does not exist on type 'FaIcon'.
this.height = null;
}
@@ -70,26 +75,39 @@ class FaIcon extends LitElement {
}
render() {
+ // @ts-expect-error - TS2339 - Property 'svg' does not exist on type 'FaIcon'.
if (!this.svg) {
return html``;
}
const styles = {};
+ // @ts-expect-error - TS2339 - Property 'size' does not exist on type 'FaIcon'.
if (this.size) {
+ // @ts-expect-error - TS2339 - Property 'width' does not exist on type '{}'. | TS2339 - Property 'size' does not exist on type 'FaIcon'.
styles.width = this.size;
+ // @ts-expect-error - TS2339 - Property 'height' does not exist on type '{}'. | TS2339 - Property 'size' does not exist on type 'FaIcon'.
styles.height = this.size;
} else {
+ // @ts-expect-error - TS2339 - Property 'width' does not exist on type 'FaIcon'.
if (this.width) {
+ // @ts-expect-error - TS2339 - Property 'width' does not exist on type '{}'. | TS2339 - Property 'width' does not exist on type 'FaIcon'.
styles.width = this.width;
}
+ // @ts-expect-error - TS2339 - Property 'height' does not exist on type 'FaIcon'.
if (this.height) {
+ // @ts-expect-error - TS2339 - Property 'height' does not exist on type '{}'. | TS2339 - Property 'height' does not exist on type 'FaIcon'.
styles.height = this.height;
}
}
return html``;
}
}
@@ -98,6 +116,7 @@ class FaIcon extends LitElement {
class AnimLogo extends FaIcon {
constructor() {
super();
+ // @ts-expect-error - TS2339 - Property 'svg' does not exist on type 'AnimLogo'.
this.svg = rwpLogo;
}
@@ -155,7 +174,9 @@ class WrModal extends LitElement {
constructor() {
super();
this.title = "";
+ // @ts-expect-error - TS2339 - Property 'bgClass' does not exist on type 'WrModal'.
this.bgClass = "";
+ // @ts-expect-error - TS2339 - Property 'noBgClose' does not exist on type 'WrModal'.
this.noBgClose = false;
}
@@ -188,10 +209,18 @@ class WrModal extends LitElement {
return html`