All files / src/components/music UgePlayer.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import React, { useEffect } from "react";
import trackerActions from "store/features/tracker/trackerActions";
import API from "renderer/lib/api";
import { MusicDataReceivePacket } from "shared/lib/music/types";
import { useAppDispatch, useAppSelector, useAppStore } from "store/hooks";
import type { RootState } from "store/configureStore";
 
const selectIsPlaybackMetronomeEnabled = (state: RootState) => {
  const midiState = state.tracker.midiInput;
  const metronomeEnabled = state.tracker.metronomeEnabled;
  const view = state.tracker.view;
  return (
    metronomeEnabled &&
    view === "roll" &&
    midiState.enabled &&
    midiState.selectedInputId !== null &&
    midiState.recordingEnabled
  );
};
 
export const UgePlayer = () => {
  const store = useAppStore();
  const dispatch = useAppDispatch();
 
  useEffect(() => {
    API.music.openMusic();
    return function close() {
      API.music.closeMusic();
    };
  }, []);
 
  const play = useAppSelector((state) => state.tracker.playing);
  const exporting = useAppSelector((state) => state.tracker.exporting);
  const loopSequenceId = useAppSelector(
    (state) => state.tracker.loopSequenceId,
  );
 
  const playbackMetronomeEnabled = useAppSelector(
    selectIsPlaybackMetronomeEnabled,
  );
 
  useEffect(() => {
    const listener = (_event: unknown, d: MusicDataReceivePacket) => {
      switch (d.action) {
        case "initialized":
          const state = store.getState();
          const song = state.trackerDocument.present.song;
          Iif (song) {
            API.music.sendToMusicWindow({
              action: "load-song",
              song,
            });
          }
          break;
        case "loaded":
          dispatch(trackerActions.playerReady(true));
          break;
        case "muted":
          dispatch(trackerActions.setChannelStatus(d.channels));
          break;
      }
    };
 
    const unsubscribeMusicData = API.events.music.response.subscribe(listener);
 
    return () => {
      unsubscribeMusicData();
    };
  }, [store, dispatch]);
 
  useEffect(() => {
    Iif (exporting) {
      return;
    }
    const state = store.getState();
    const song = state.trackerDocument.present.song;
    const playbackMetronomeEnabled = selectIsPlaybackMetronomeEnabled(state);
 
    if (play && song) {
      API.music.sendToMusicWindow({
        action: "play",
        song: song,
        metronomeEnabled: playbackMetronomeEnabled,
        loopSequenceId,
      });
    } else {
      API.music.sendToMusicWindow({
        action: "stop",
      });
    }
  }, [store, play, exporting, loopSequenceId]);
 
  useEffect(() => {
    API.music.sendToMusicWindow({
      action: "set-metronome-enabled",
      enabled: playbackMetronomeEnabled,
    });
  }, [playbackMetronomeEnabled]);
 
  return <div />;
};