Removed audio related code
This commit is contained in:
parent
d8a72dcac0
commit
320c826684
@ -1,100 +0,0 @@
|
||||
import { createPubSub } from '../pubsub';
|
||||
import { AudioState } from './types';
|
||||
|
||||
export const createAudio = () => {
|
||||
const pubsub = createPubSub();
|
||||
const element = document.createElement('video');
|
||||
let currentTime = 0;
|
||||
|
||||
let state: AudioState = {
|
||||
duration: 0,
|
||||
playing: false,
|
||||
volume: 0,
|
||||
};
|
||||
|
||||
const setState = (value: Partial<AudioState>) => {
|
||||
state = { ...state, ...value };
|
||||
|
||||
pubsub.publish('change', state);
|
||||
};
|
||||
|
||||
const setup = () => {
|
||||
element.addEventListener('durationchange', () =>
|
||||
setState({ duration: element.duration }),
|
||||
);
|
||||
|
||||
element.addEventListener('playing', () => setState({ playing: true }));
|
||||
|
||||
element.addEventListener('pause', () => setState({ playing: false }));
|
||||
|
||||
element.addEventListener('timeupdate', () => {
|
||||
const newCurrentTime = Math.round(element.currentTime);
|
||||
|
||||
if (currentTime !== newCurrentTime) {
|
||||
currentTime = newCurrentTime;
|
||||
|
||||
pubsub.publish('change-current-time', currentTime);
|
||||
}
|
||||
});
|
||||
|
||||
element.addEventListener('volumechange', () =>
|
||||
setState({ volume: element.volume }),
|
||||
);
|
||||
|
||||
setState({ volume: element.volume });
|
||||
};
|
||||
|
||||
setup();
|
||||
|
||||
return {
|
||||
seek(seconds: number) {
|
||||
element.currentTime = seconds;
|
||||
currentTime = seconds;
|
||||
|
||||
pubsub.publish('change-current-time', currentTime);
|
||||
},
|
||||
|
||||
getElement() {
|
||||
return element;
|
||||
},
|
||||
|
||||
getState() {
|
||||
return state;
|
||||
},
|
||||
|
||||
getCurrentTime() {
|
||||
return currentTime;
|
||||
},
|
||||
|
||||
play() {
|
||||
element.play();
|
||||
},
|
||||
|
||||
pause() {
|
||||
element.pause();
|
||||
},
|
||||
|
||||
volume(value: number) {
|
||||
element.volume = value;
|
||||
},
|
||||
|
||||
setUrl(url: string) {
|
||||
element.setAttribute('src', url);
|
||||
setState({ playing: false });
|
||||
},
|
||||
|
||||
subscribe(listener: (newState: AudioState) => void) {
|
||||
return pubsub.subscribe('change', listener);
|
||||
},
|
||||
|
||||
onChangeCurrentTime(listener: (newCurrentTime: number) => void) {
|
||||
return pubsub.subscribe('change-current-time', listener);
|
||||
},
|
||||
|
||||
onEnded(listener: () => void) {
|
||||
element.addEventListener('ended', listener);
|
||||
|
||||
return () => element.removeEventListener('ended', listener);
|
||||
},
|
||||
};
|
||||
};
|
@ -1,27 +0,0 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
|
||||
import player from './player';
|
||||
|
||||
export const usePlayerState = () => {
|
||||
const [state, setState] = useState(player.getState());
|
||||
|
||||
useEffect(() => {
|
||||
const unsubscribe = player.subscribe(setState);
|
||||
|
||||
return unsubscribe;
|
||||
}, []);
|
||||
|
||||
return state;
|
||||
};
|
||||
|
||||
export const useCurrentTime = () => {
|
||||
const [currentTime, setCurrentTime] = useState(player.getCurrentTime());
|
||||
|
||||
useEffect(() => {
|
||||
const unsubscribe = player.onChangeCurrentTime(setCurrentTime);
|
||||
|
||||
return unsubscribe;
|
||||
}, []);
|
||||
|
||||
return currentTime;
|
||||
};
|
@ -1,106 +0,0 @@
|
||||
import { createPubSub } from '../pubsub';
|
||||
import { createAudio } from './audio';
|
||||
import { State, Track } from './types';
|
||||
|
||||
const createPlayer = () => {
|
||||
const pubsub = createPubSub();
|
||||
const audio = createAudio();
|
||||
|
||||
let state: State = {
|
||||
...audio.getState(),
|
||||
tracks: [],
|
||||
currentTrackIndex: null,
|
||||
currentTrack: null,
|
||||
};
|
||||
|
||||
const setState = (value: Partial<State>) => {
|
||||
state = { ...state, ...value };
|
||||
|
||||
pubsub.publish('change', state);
|
||||
};
|
||||
|
||||
audio.subscribe(setState);
|
||||
|
||||
const changeTrack = () => {
|
||||
const track = state.currentTrack;
|
||||
|
||||
if (track) {
|
||||
audio.setUrl(track.url);
|
||||
audio.play();
|
||||
}
|
||||
};
|
||||
|
||||
const next = () => {
|
||||
if (state.currentTrackIndex === null) {
|
||||
return;
|
||||
}
|
||||
|
||||
const lastIndex = state.tracks.length - 1;
|
||||
const newIndex = state.currentTrackIndex + 1;
|
||||
|
||||
if (newIndex <= lastIndex) {
|
||||
setState({
|
||||
currentTrackIndex: newIndex,
|
||||
currentTrack: state.tracks[newIndex],
|
||||
});
|
||||
|
||||
changeTrack();
|
||||
}
|
||||
};
|
||||
|
||||
audio.onEnded(next);
|
||||
|
||||
return {
|
||||
play: audio.play,
|
||||
pause: audio.pause,
|
||||
seek: audio.seek,
|
||||
volume: audio.volume,
|
||||
getCurrentTime: audio.getCurrentTime,
|
||||
getElement: audio.getElement,
|
||||
onChangeCurrentTime: audio.onChangeCurrentTime,
|
||||
|
||||
getState() {
|
||||
return state;
|
||||
},
|
||||
|
||||
setQueue(tracks: Track[]) {
|
||||
setState({ tracks });
|
||||
},
|
||||
|
||||
playTrack(trackIndex: number) {
|
||||
setState({
|
||||
currentTrackIndex: trackIndex,
|
||||
currentTrack: state.tracks[trackIndex],
|
||||
});
|
||||
|
||||
changeTrack();
|
||||
},
|
||||
|
||||
next,
|
||||
|
||||
prev() {
|
||||
if (state.currentTrackIndex === null) {
|
||||
return;
|
||||
}
|
||||
|
||||
const newIndex = state.currentTrackIndex - 1;
|
||||
|
||||
if (newIndex >= 0) {
|
||||
setState({
|
||||
currentTrack: state.tracks[newIndex],
|
||||
currentTrackIndex: newIndex,
|
||||
});
|
||||
|
||||
changeTrack();
|
||||
}
|
||||
},
|
||||
|
||||
subscribe(listener: (newState: State) => void) {
|
||||
return pubsub.subscribe('change', listener);
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
const player = createPlayer();
|
||||
|
||||
export default player;
|
@ -1,17 +0,0 @@
|
||||
export type AudioState = {
|
||||
duration: number;
|
||||
playing: boolean;
|
||||
volume: number;
|
||||
};
|
||||
|
||||
export type Track = {
|
||||
url: string;
|
||||
title: string;
|
||||
};
|
||||
|
||||
export type State = AudioState & {
|
||||
tracks: Track[];
|
||||
currentTrack: Track | null;
|
||||
currentTrackIndex: number | null;
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user