From 7ca2d84a2a07341da239025414f92a72fe3c9687 Mon Sep 17 00:00:00 2001 From: Jordan Eldredge Date: Fri, 1 Jan 2021 14:02:08 -0800 Subject: [PATCH] Consolidate where the demo site reaches out into Webamp --- packages/webamp/demo/js/DemoDesktop.tsx | 2 +- packages/webamp/demo/js/MilkIcon.tsx | 5 ++-- packages/webamp/demo/js/Mp3Icon.tsx | 3 +- packages/webamp/demo/js/SkinIcon.tsx | 2 +- packages/webamp/demo/js/Webamp.ts | 30 +++++++++++++++++++ packages/webamp/demo/js/WebampIcon.tsx | 2 +- packages/webamp/demo/js/butterchurnOptions.ts | 2 +- packages/webamp/demo/js/config.ts | 2 +- packages/webamp/demo/js/dropboxFilePicker.ts | 2 +- packages/webamp/demo/js/eventLogger.ts | 2 +- packages/webamp/demo/js/index.js | 6 ++-- packages/webamp/demo/js/mediaSession.ts | 2 +- .../webamp/demo/js/screenshotInitialState.ts | 2 +- 13 files changed, 45 insertions(+), 17 deletions(-) create mode 100644 packages/webamp/demo/js/Webamp.ts diff --git a/packages/webamp/demo/js/DemoDesktop.tsx b/packages/webamp/demo/js/DemoDesktop.tsx index b136bfb6..19279b3c 100644 --- a/packages/webamp/demo/js/DemoDesktop.tsx +++ b/packages/webamp/demo/js/DemoDesktop.tsx @@ -1,4 +1,4 @@ -import WebampLazy from "../../js/webampLazy"; +import { WebampLazy } from "./Webamp"; import { Suspense } from "react"; import WebampIcon from "./WebampIcon"; // import Mp3Icon from "./Mp3Icon"; diff --git a/packages/webamp/demo/js/MilkIcon.tsx b/packages/webamp/demo/js/MilkIcon.tsx index f69db8d5..4700f448 100644 --- a/packages/webamp/demo/js/MilkIcon.tsx +++ b/packages/webamp/demo/js/MilkIcon.tsx @@ -1,11 +1,10 @@ -import WebampLazy from "../../js/webampLazy"; +import { WebampLazy, loadPresets } from "./Webamp"; import { useCallback } from "react"; // @ts-ignore import iconLarge from "../images/manifest/icon-96x96.png"; // @ts-ignore import iconSmall from "../images/manifest/icon-48x48.png"; import DesktopIcon from "./DesktopIcon"; -import * as Actions from "../../js/actionCreators"; const iconUrl = window.devicePixelRatio > 1 ? iconLarge : iconSmall; @@ -25,7 +24,7 @@ const MilkIcon = ({ webamp, preset }: Props) => { }, } as const; - webamp.store.dispatch(Actions.loadPresets([statePreset])); + webamp.store.dispatch(loadPresets([statePreset])); }, [preset, webamp]); return ( 1 ? iconLarge : iconSmall; diff --git a/packages/webamp/demo/js/SkinIcon.tsx b/packages/webamp/demo/js/SkinIcon.tsx index 25f5e865..8c9c2e21 100644 --- a/packages/webamp/demo/js/SkinIcon.tsx +++ b/packages/webamp/demo/js/SkinIcon.tsx @@ -1,4 +1,4 @@ -import WebampLazy from "../../js/webampLazy"; +import { WebampLazy } from "./Webamp"; // @ts-ignore import iconSmall from "../images/icons/paint-file-32x32.png"; import DesktopIcon from "./DesktopIcon"; diff --git a/packages/webamp/demo/js/Webamp.ts b/packages/webamp/demo/js/Webamp.ts new file mode 100644 index 00000000..9aca6b38 --- /dev/null +++ b/packages/webamp/demo/js/Webamp.ts @@ -0,0 +1,30 @@ +// This is a temporary module intended to collect all the places where the demo +// site reaches out into Webamp code. The goal is to eventually have the demo +// site consume the actual Webamp NPM module, so hopefully this module can go +// away once we've figured out how to expose all the things that the demo site +// needs, or reduce the things that the demo site needs access to. + +export { default as WebampLazy } from "../../js/webampLazy"; +export { + ButterchurnOptions, + Track, + AppState, + URLTrack, + FilePicker, + Action, +} from "../../js/types"; +export { WINDOWS } from "../../js/constants"; +export { + STEP_MARQUEE, + UPDATE_TIME_ELAPSED, + UPDATE_WINDOW_POSITIONS, + SET_VOLUME, + SET_BALANCE, + SET_BAND_VALUE, + DISABLE_MARQUEE, + TOGGLE_REPEAT, + TOGGLE_SHUFFLE, + SET_EQ_AUTO, + SET_DUMMY_VIZ_DATA, +} from "../../js/actionTypes"; +export { loadPresets } from "../../js/actionCreators"; diff --git a/packages/webamp/demo/js/WebampIcon.tsx b/packages/webamp/demo/js/WebampIcon.tsx index 621d6d59..fa31c5c6 100644 --- a/packages/webamp/demo/js/WebampIcon.tsx +++ b/packages/webamp/demo/js/WebampIcon.tsx @@ -1,4 +1,4 @@ -import WebampLazy from "../../js/webampLazy"; +import { WebampLazy } from "./Webamp"; import { useEffect, useState } from "react"; // @ts-ignore import iconSmall from "../images/icons/winamp2-32x32.png"; diff --git a/packages/webamp/demo/js/butterchurnOptions.ts b/packages/webamp/demo/js/butterchurnOptions.ts index 809fefe1..d0fe6fcc 100644 --- a/packages/webamp/demo/js/butterchurnOptions.ts +++ b/packages/webamp/demo/js/butterchurnOptions.ts @@ -1,4 +1,4 @@ -import { ButterchurnOptions } from "../../js/types"; +import { ButterchurnOptions } from "./Webamp"; const KNOWN_PRESET_URLS_REGEXES = [ /^https:\/\/unpkg\.com\/butterchurn-presets\/.*\.json$/, diff --git a/packages/webamp/demo/js/config.ts b/packages/webamp/demo/js/config.ts index 9f9f4aa0..b6b3deee 100644 --- a/packages/webamp/demo/js/config.ts +++ b/packages/webamp/demo/js/config.ts @@ -1,4 +1,4 @@ -import { Track, AppState, URLTrack } from "../../js/types"; +import { Track, AppState, URLTrack } from "./Webamp"; // @ts-ignore import llamaAudio from "../mp3/llama-2.91.mp3"; import { DeepPartial } from "redux"; diff --git a/packages/webamp/demo/js/dropboxFilePicker.ts b/packages/webamp/demo/js/dropboxFilePicker.ts index f60fcf56..9ee87c2e 100644 --- a/packages/webamp/demo/js/dropboxFilePicker.ts +++ b/packages/webamp/demo/js/dropboxFilePicker.ts @@ -1,4 +1,4 @@ -import { FilePicker } from "../../js/types"; +import { FilePicker } from "./Webamp"; interface DropboxFile { link: string; diff --git a/packages/webamp/demo/js/eventLogger.ts b/packages/webamp/demo/js/eventLogger.ts index 01ea9399..9a5b2540 100644 --- a/packages/webamp/demo/js/eventLogger.ts +++ b/packages/webamp/demo/js/eventLogger.ts @@ -1,5 +1,5 @@ import { log, GoogleAnalyticsEvent } from "./logger"; -import { Action } from "../../js/types"; +import { Action } from "./Webamp"; function logEventFromAction(action: Action): GoogleAnalyticsEvent | null { switch (action.type) { diff --git a/packages/webamp/demo/js/index.js b/packages/webamp/demo/js/index.js index 9fc91b26..9c020a7a 100644 --- a/packages/webamp/demo/js/index.js +++ b/packages/webamp/demo/js/index.js @@ -4,11 +4,11 @@ import * as Sentry from "@sentry/browser"; import ReactDOM from "react-dom"; import createMiddleware from "redux-sentry-middleware"; import isButterchurnSupported from "butterchurn/lib/isSupported.min"; -import { WINDOWS } from "../../js/constants"; import { loggerMiddleware } from "./eventLogger"; -import WebampLazy from "../../js/webampLazy"; import { + WebampLazy, + WINDOWS, STEP_MARQUEE, UPDATE_TIME_ELAPSED, UPDATE_WINDOW_POSITIONS, @@ -20,7 +20,7 @@ import { TOGGLE_SHUFFLE, SET_EQ_AUTO, SET_DUMMY_VIZ_DATA, -} from "../../js/actionTypes"; +} from "./Webamp"; import { getButterchurnOptions } from "./butterchurnOptions"; import dropboxFilePicker from "./dropboxFilePicker"; diff --git a/packages/webamp/demo/js/mediaSession.ts b/packages/webamp/demo/js/mediaSession.ts index 24f82970..f18d2840 100644 --- a/packages/webamp/demo/js/mediaSession.ts +++ b/packages/webamp/demo/js/mediaSession.ts @@ -1,4 +1,4 @@ -import WebampLazy from "../../js/webampLazy"; +import { WebampLazy } from "./Webamp"; export default function enableMediaSession(webamp: WebampLazy) { if ("mediaSession" in navigator) { diff --git a/packages/webamp/demo/js/screenshotInitialState.ts b/packages/webamp/demo/js/screenshotInitialState.ts index 8fe3feaf..520756da 100644 --- a/packages/webamp/demo/js/screenshotInitialState.ts +++ b/packages/webamp/demo/js/screenshotInitialState.ts @@ -1,5 +1,5 @@ import { DeepPartial } from "redux"; -import { AppState } from "../../js/types"; +import { AppState } from "./Webamp"; const defaultTracksState = { "0": {