diff --git a/package.json b/package.json index afd4f25..ac6c9ed 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,8 @@ "dependencies": { "@babel/core": "7.6.0", "@reduxjs/toolkit": "^1.0.4", - "@sentry/react": "^6.5.0", + "@sentry/react": "^6.3.1", + "@sentry/tracing": "^6.3.1", "@svgr/webpack": "4.3.2", "@types/dom-mediacapture-record": "^1.0.4", "@types/jest": "24.0.22", diff --git a/src/mixer/audio.ts b/src/mixer/audio.ts index e6dbf7b..97cbe4f 100644 --- a/src/mixer/audio.ts +++ b/src/mixer/audio.ts @@ -68,7 +68,7 @@ class Player extends ((PlayerEmitter as unknown) as { new (): EventEmitter }) { } stop() { - if (process.env.REACT_APP_BAPSICLE_INTERFACE) { + if (!process.env.REACT_APP_BAPSICLE_INTERFACE) { return this.wavesurfer.stop(); } } @@ -241,7 +241,7 @@ class Player extends ((PlayerEmitter as unknown) as { new (): EventEmitter }) { if (!process.env.REACT_APP_BAPSICLE_INTERFACE) { customOutput = outputId !== INTERNAL_OUTPUT_ID; } - + let waveform = document.getElementById("waveform-" + player.toString()); if (waveform == null) { throw new Error(); diff --git a/src/mixer/state.ts b/src/mixer/state.ts index dfafb31..c448b9e 100644 --- a/src/mixer/state.ts +++ b/src/mixer/state.ts @@ -32,15 +32,6 @@ import { sendBAPSicleChannel } from "../bapsicle"; import { changeSetting } from "../optionsMenu/settingsState"; import { PLAYER_COUNTER_UPDATE_PERIOD_MS } from "../showplanner/Player"; -import { changeSetting } from "../optionsMenu/settingsState"; -import { - DEFAULT_TRIM_DB, - OFF_LEVEL_DB, - BED_LEVEL_DB, - FULL_LEVEL_DB, -} from "./audio"; -import { PLAYER_COUNTER_UPDATE_PERIOD_MS } from "../showplanner/Player"; - const playerGainTweens: Array<{ target: VolumePresetEnum; tweens: Between[]; @@ -609,105 +600,107 @@ export const load = ( if (state.loadedItem && "outro" in state.loadedItem) { playerInstance.setOutro(state.loadedItem.outro); } + }); - if (process.env.REACT_APP_BAPSICLE_INTERFACE) { - playerInstance.on("timeChangeSeek", (time) => { - if ( - Math.abs(time - getState().mixer.players[player].timeCurrent) > 0.5 - ) { - sendBAPSicleChannel({ - channel: player, - command: "SEEK", - time: time, - }); - } - }); - } else { - playerInstance.on("play", () => { - dispatch( - mixerState.actions.setPlayerState({ player, state: "playing" }) - ); - - const state = getState().mixer.players[player]; - // Don't set played on Preview Channel - if (state.loadedItem != null && player !== PLAYER_ID_PREVIEW) { + if (process.env.REACT_APP_BAPSICLE_INTERFACE) { + playerInstance.on("timeChangeSeek", (time) => { + if ( + Math.abs(time - getState().mixer.players[player].timeCurrent) > 0.5 + ) { + sendBAPSicleChannel({ + channel: player, + command: "SEEK", + time: time, + }); + } + }); + } else { + playerInstance.on("play", () => { dispatch( - dispatch(setItemPlayed(itemId(state.loadedItem), true)); + mixerState.actions.setPlayerState({ player, state: "playing" }) ); - } - }); - playerInstance.on("pause", () => { - dispatch( - mixerState.actions.setPlayerState({ - player, - state: playerInstance.currentTime === 0 ? "stopped" : "paused", - }) - ); - }); - playerInstance.on("timeChange", (time) => { - if ( - Math.abs(time - getState().mixer.players[player].timeCurrent) > - PLAYER_COUNTER_UPDATE_PERIOD_MS / 1000 - ) { + + const state = getState().mixer.players[player]; + // Don't set played on Preview Channel + if (state.loadedItem != null && player !== PLAYER_ID_PREVIEW) { + dispatch(setItemPlayed(itemId(state.loadedItem), true)); + } + }); + playerInstance.on("pause", () => { dispatch( - mixerState.actions.setTimeCurrent({ + mixerState.actions.setPlayerState({ player, - time, + state: playerInstance.currentTime === 0 ? "stopped" : "paused", }) ); - } - }); - playerInstance.on("finish", () => { - // If the Preview Player finishes playing, turn off PFL in the UI. - if (player === PLAYER_ID_PREVIEW) { - dispatch(setChannelPFL(player, false)); - } - dispatch(mixerState.actions.setPlayerState({ player, state: "stopped" })); - const state = getState().mixer.players[player]; - if (state.tracklistItemID !== -1) { - dispatch(BroadcastState.tracklistEnd(state.tracklistItemID)); - } - if (state.repeat === "one") { - playerInstance.play(); - } else if (state.repeat === "all") { - if ("channel" in item) { - // it's not in the CML/libraries "column" - const itsChannel = getState() - .showplan.plan!.filter((x) => x.channel === item.channel) - .sort((x, y) => x.weight - y.weight); - const itsIndex = itsChannel.indexOf(item); - if (itsIndex === itsChannel.length - 1) { - dispatch(load(player, itsChannel[0])); - } else if (state.autoAdvance) { - if ("channel" in item) { - // it's not in the CML/libraries "column" - const itsChannel = getState() - .showplan.plan!.filter((x) => x.channel === item.channel) - .sort((x, y) => x.weight - y.weight); - // Sadly, we can't just do .indexOf() item directly, - // since the player's idea of an item may be changed over it's lifecycle (setting played,intro/cue/outro etc.) - // Therefore we'll find the updated item from the plan and match that. - const itsIndex = itsChannel.findIndex( - (x) => itemId(x) === itemId(item) - ); - if (itsIndex > -1 && itsIndex !== itsChannel.length - 1) { - dispatch(load(player, itsChannel[itsIndex + 1])); - } + }); + playerInstance.on("timeChange", (time) => { + if ( + Math.abs(time - getState().mixer.players[player].timeCurrent) > + PLAYER_COUNTER_UPDATE_PERIOD_MS / 1000 + ) { + dispatch( + mixerState.actions.setTimeCurrent({ + player, + time, + }) + ); + } + }); + playerInstance.on("finish", () => { + // If the Preview Player finishes playing, turn off PFL in the UI. + if (player === PLAYER_ID_PREVIEW) { + dispatch(setChannelPFL(player, false)); + } + dispatch( + mixerState.actions.setPlayerState({ player, state: "stopped" }) + ); + const state = getState().mixer.players[player]; + if (state.tracklistItemID !== -1) { + dispatch(BroadcastState.tracklistEnd(state.tracklistItemID)); + } + if (state.repeat === "one") { + playerInstance.play(); + } else if (state.repeat === "all") { + if ("channel" in item) { + // it's not in the CML/libraries "column" + const itsChannel = getState() + .showplan.plan!.filter((x) => x.channel === item.channel) + .sort((x, y) => x.weight - y.weight); + const itsIndex = itsChannel.indexOf(item); + if (itsIndex === itsChannel.length - 1) { + dispatch(load(player, itsChannel[0])); } } - }); + } else if (state.autoAdvance) { + if ("channel" in item) { + // it's not in the CML/libraries "column" + const itsChannel = getState() + .showplan.plan!.filter((x) => x.channel === item.channel) + .sort((x, y) => x.weight - y.weight); + // Sadly, we can't just do .indexOf() item directly, + // since the player's idea of an item may be changed over it's lifecycle (setting played,intro/cue/outro etc.) + // Therefore we'll find the updated item from the plan and match that. + const itsIndex = itsChannel.findIndex( + (x) => itemId(x) === itemId(item) + ); + if (itsIndex > -1 && itsIndex !== itsChannel.length - 1) { + dispatch(load(player, itsChannel[itsIndex + 1])); + } + } + } + }); + + // Double-check we haven't been aborted since + if (signal.aborted) { + // noinspection ExceptionCaughtLocallyJS + throw new DOMException("abort load", "AbortError"); } - }); - // Double-check we haven't been aborted since - if (signal.aborted) { - // noinspection ExceptionCaughtLocallyJS - throw new DOMException("abort load", "AbortError"); + playerInstance.setVolume(getState().mixer.players[player].gain); + playerInstance.setTrim(getState().mixer.players[player].trim); + delete loadAbortControllers[player]; } - - playerInstance.setVolume(getState().mixer.players[player].gain); - playerInstance.setTrim(getState().mixer.players[player].trim); - delete loadAbortControllers[player]; } catch (e) { if ("name" in e && e.name === "AbortError") { // load was aborted, ignore the error @@ -866,9 +859,6 @@ export const { setRepeat, setTracklistItemID, setMicBaseGain, - toggleAutoAdvance, - togglePlayOnLoad, - toggleRepeat, setPlayerMicAutoDuck, } = mixerState.actions; diff --git a/src/navbar/index.tsx b/src/navbar/index.tsx index c861eea..e668449 100644 --- a/src/navbar/index.tsx +++ b/src/navbar/index.tsx @@ -12,6 +12,7 @@ import { FaCompactDisc, FaHeadphonesAlt, } from "react-icons/fa"; +import LiveClock from "react-live-clock"; import { RootState } from "../rootReducer"; @@ -19,7 +20,7 @@ import * as BroadcastState from "../broadcast/state"; import appLogo from "../assets/images/webstudio.svg"; import myradioLogo from "../assets/images/myradio.svg"; import { MYRADIO_NON_API_BASE } from "../api"; -import logo from "../assets/images/navbarlogo.png"; + import "./navbar.scss"; import { closeAlert } from "./state"; import { BAPSicleModal } from "./BAPSicleModal"; @@ -165,6 +166,33 @@ export function NavBarMyRadio() { } export function NavBarMain() { + const [showBAPSicleModal, setShowBAPSicleModal] = useState(true); + if (process.env.REACT_APP_BAPSICLE_INTERFACE) { + return ( + <> + + + + setShowBAPSicleModal(false)} + isOpen={showBAPSicleModal} + /> + + ); + } return ( <>