1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 21:06:42 +07:00

better audio player

This commit is contained in:
Fedor Katurov 2019-10-15 17:30:31 +07:00
parent 87b9b5f514
commit c84dfdd2ab
7 changed files with 54 additions and 14 deletions

View file

@ -6,6 +6,11 @@ export const playerSetFile = (file: IPlayerState['file']) => ({
file,
});
export const playerSetFileAndPlay = (file: IPlayerState['file']) => ({
type: PLAYER_ACTIONS.SET_FILE_AND_PLAY,
file,
});
export const playerSetStatus = (status: IPlayerState['status']) => ({
type: PLAYER_ACTIONS.SET_STATUS,
status,
@ -19,6 +24,14 @@ export const playerPause = () => ({
type: PLAYER_ACTIONS.PAUSE,
});
export const playerStop = () => ({
type: PLAYER_ACTIONS.STOP,
});
export const playerStopped = () => ({
type: PLAYER_ACTIONS.STOPPED,
});
export const playerSeek = (seek: number) => ({
type: PLAYER_ACTIONS.SEEK,
seek,

View file

@ -2,11 +2,14 @@ const prefix = 'PLAYER.';
export const PLAYER_ACTIONS = {
SET_FILE: `${prefix}SET_FILE`,
SET_FILE_AND_PLAY: `${prefix}SET_FILE_AND_PLAY`,
SET_STATUS: `${prefix}SET_STATUS`,
PLAY: `${prefix}PLAY`,
PAUSE: `${prefix}PAUSE`,
SEEK: `${prefix}SEEK`,
STOP: `${prefix}STOP`,
STOPPED: `${prefix}STOPPED`,
};
export const PLAYER_STATES = {

View file

@ -1,10 +1,11 @@
import { takeLatest } from 'redux-saga/effects';
import { PLAYER_ACTIONS } from './constants';
import { playerSetFile, playerSeek } from './actions';
import { takeLatest, put } from 'redux-saga/effects';
import { PLAYER_ACTIONS, PLAYER_STATES } from './constants';
import { playerSetFile, playerSeek, playerSetStatus } from './actions';
import { Player } from '~/utils/player';
import { getURL } from '~/utils/dom';
function setFileSaga({ file }: ReturnType<typeof playerSetFile>) {
function* setFileAndPlaySaga({ file }: ReturnType<typeof playerSetFile>) {
yield put(playerSetFile(file));
Player.set(getURL(file));
Player.play();
}
@ -17,13 +18,24 @@ function pauseSaga() {
Player.pause();
}
function stopSaga() {
Player.stop();
}
function seekSaga({ seek }: ReturnType<typeof playerSeek>) {
Player.jumpToPercent(seek * 100);
}
function* stoppedSaga() {
yield put(playerSetStatus(PLAYER_STATES.UNSET));
yield put(playerSetFile(null));
}
export default function* playerSaga() {
yield takeLatest(PLAYER_ACTIONS.SET_FILE, setFileSaga);
yield takeLatest(PLAYER_ACTIONS.SET_FILE_AND_PLAY, setFileAndPlaySaga);
yield takeLatest(PLAYER_ACTIONS.PAUSE, pauseSaga);
yield takeLatest(PLAYER_ACTIONS.PLAY, playSaga);
yield takeLatest(PLAYER_ACTIONS.SEEK, seekSaga);
yield takeLatest(PLAYER_ACTIONS.STOP, stopSaga);
yield takeLatest(PLAYER_ACTIONS.STOPPED, stoppedSaga);
}