Tybe the demo index.js file

This commit is contained in:
Jordan Eldredge 2021-01-01 18:45:29 -08:00
parent 1bbfe047af
commit 0a3334594e
2 changed files with 29 additions and 13 deletions

View file

@ -1,7 +1,6 @@
/* global SENTRY_DSN */
import * as Sentry from "@sentry/browser";
import ReactDOM from "react-dom";
// @ts-ignore
import isButterchurnSupported from "butterchurn/lib/isSupported.min";
import { getWebampConfig } from "./webampConfig";
@ -18,18 +17,29 @@ import { disableMarquee, skinUrl as configSkinUrl } from "./config";
import DemoDesktop from "./DemoDesktop";
import enableMediaSession from "./mediaSession";
declare global {
const SENTRY_DSN: string;
const COMMITHASH: string | undefined;
interface Window {
__webamp: WebampLazy;
}
}
const DEFAULT_DOCUMENT_TITLE = document.title;
let screenshot = false;
let skinUrl = configSkinUrl;
if ("URLSearchParams" in window) {
const params = new URLSearchParams(location.search);
screenshot = params.get("screenshot");
screenshot = Boolean(params.get("screenshot"));
skinUrl = params.get("skinUrl") || skinUrl;
}
function supressDragAndDrop(e) {
function supressDragAndDrop(e: DragEvent) {
e.preventDefault();
if (e.dataTransfer == null) {
return;
}
e.dataTransfer.effectAllowed = "none";
e.dataTransfer.dropEffect = "none";
}
@ -41,8 +51,7 @@ window.addEventListener("drop", supressDragAndDrop);
try {
Sentry.init({
dsn: SENTRY_DSN,
/* global COMMITHASH */
release: typeof COMMITHASH !== "undefined" ? COMMITHASH : "DEV",
release: COMMITHASH ?? "DEV",
});
} catch (e) {
// Archive.org tries to rewrite the DSN to point to a archive.org version
@ -51,19 +60,24 @@ try {
}
async function main() {
const about = document.getElementsByClassName("about")[0];
const about = document.getElementsByClassName("about")[0] as HTMLDivElement;
if (screenshot) {
about.style.visibility = "hidden";
}
if (!WebampLazy.browserIsSupported()) {
document.getElementById("browser-compatibility").style.display = "block";
document.getElementById("app").style.visibility = "hidden";
(document.getElementById(
"browser-compatibility"
) as HTMLDivElement).style.display = "block";
(document.getElementById("app") as HTMLDivElement).style.visibility =
"hidden";
return;
}
about.classList.add("loaded");
if (isButterchurnSupported()) {
document.getElementById("butterchurn-share").style.display = "flex";
(document.getElementById(
"butterchurn-share"
) as HTMLDivElement).style.display = "flex";
}
const webamp = new WebampLazy(getWebampConfig(screenshot, skinUrl));
@ -113,8 +127,8 @@ async function main() {
fileInput.id = "webamp-file-input";
fileInput.style.display = "none";
fileInput.type = "file";
fileInput.value = null;
fileInput.addEventListener("change", (e) => {
// @ts-ignore We know this will always be a file input
const firstFile = e.target.files[0];
if (firstFile == null) {
return;
@ -127,7 +141,9 @@ async function main() {
// Expose webamp instance for debugging and integration tests.
window.__webamp = webamp;
await webamp.renderWhenReady(document.getElementById("app"));
await webamp.renderWhenReady(
document.getElementById("app") as HTMLDivElement
);
if (!screenshot) {
ReactDOM.render(

View file

@ -360,7 +360,7 @@ export type Action =
}
| {
type: "SET_DUMMY_VIZ_DATA";
data: null;
data: DummyVizData;
}
| {
type: "SET_BAND_VALUE";