mirror of
https://github.com/muerwre/vault-frontend.git
synced 2025-04-25 12:56:41 +07:00
removed audiplayer
This commit is contained in:
parent
63b30b2921
commit
42fdb1290a
8 changed files with 3886 additions and 15941 deletions
71
src/components/media/AudioPlayer/index.jsx
Normal file
71
src/components/media/AudioPlayer/index.jsx
Normal file
|
@ -0,0 +1,71 @@
|
|||
import React from 'react';
|
||||
import { AUDIO_PLAYER_OPTIONS } from '~/redux/player/constants';
|
||||
|
||||
import JPlayer, {
|
||||
initializeOptions,
|
||||
Gui,
|
||||
SeekBar,
|
||||
BufferBar,
|
||||
Poster,
|
||||
Audio,
|
||||
Title,
|
||||
FullScreen,
|
||||
Mute,
|
||||
Play,
|
||||
PlayBar,
|
||||
Repeat,
|
||||
VolumeBar,
|
||||
Duration,
|
||||
CurrentTime,
|
||||
Download,
|
||||
BrowserUnsupported,
|
||||
} from 'react-jplayer';
|
||||
|
||||
initializeOptions(AUDIO_PLAYER_OPTIONS);
|
||||
|
||||
export const AudioPlayer = () => (
|
||||
<JPlayer id={AUDIO_PLAYER_OPTIONS.id} className="jp-sleek">
|
||||
<Audio />
|
||||
<Gui>
|
||||
<div className="jp-controls jp-icon-controls">
|
||||
<Play>
|
||||
<i className="fa">{/* Icon set in css */}</i>
|
||||
</Play>
|
||||
<Repeat>
|
||||
<i className="fa fa-repeat" />
|
||||
</Repeat>
|
||||
<div className="jp-progress">
|
||||
<SeekBar>
|
||||
<BufferBar />
|
||||
<PlayBar />
|
||||
<CurrentTime />
|
||||
<Duration />
|
||||
</SeekBar>
|
||||
</div>
|
||||
<div className="jp-volume-container">
|
||||
<Mute>
|
||||
<i className="fa">{/* Icon set in css */}</i>
|
||||
</Mute>
|
||||
<div className="jp-volume-slider">
|
||||
<div className="jp-volume-bar-container">
|
||||
<VolumeBar />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<FullScreen>
|
||||
<i className="fa fa-expand" />
|
||||
</FullScreen>
|
||||
<Download>
|
||||
<i className="fa fa-download" />
|
||||
</Download>
|
||||
<div className="jp-title-container">
|
||||
<Poster />
|
||||
<Title />
|
||||
</div>
|
||||
</div>
|
||||
<BrowserUnsupported />
|
||||
</Gui>
|
||||
</JPlayer>
|
||||
);
|
||||
|
||||
export default AudioPlayer;
|
0
src/components/media/AudioPlayer/styles.sass
Normal file
0
src/components/media/AudioPlayer/styles.sass
Normal file
14
src/redux/player/constants.ts
Normal file
14
src/redux/player/constants.ts
Normal file
|
@ -0,0 +1,14 @@
|
|||
export const AUDIO_PLAYER_OPTIONS = {
|
||||
id: 'AudioPlayer',
|
||||
keyEnabled: true,
|
||||
verticalVolume: true,
|
||||
media: {
|
||||
title: 'Bubble',
|
||||
artist: 'Miaow',
|
||||
sources: {
|
||||
m4a: 'http://jplayer.org/audio/m4a/Miaow-07-Bubble.m4a',
|
||||
oga: 'http://jplayer.org/audio/ogg/Miaow-07-Bubble.ogg',
|
||||
},
|
||||
free: true,
|
||||
},
|
||||
};
|
3
src/redux/player/reducer.ts
Normal file
3
src/redux/player/reducer.ts
Normal file
|
@ -0,0 +1,3 @@
|
|||
import { reducer } from 'react-jplayer';
|
||||
|
||||
export default reducer;
|
|
@ -19,6 +19,8 @@ import flowSaga from '~/redux/flow/sagas';
|
|||
import uploadReducer, { IUploadState } from '~/redux/uploads/reducer';
|
||||
import uploadSaga from '~/redux/uploads/sagas';
|
||||
|
||||
import playerReducer from '~/redux/player/reducer';
|
||||
|
||||
import { IAuthState } from '~/redux/auth/types';
|
||||
|
||||
import modalReducer, { IModalState } from '~/redux/modal/reducer';
|
||||
|
@ -36,6 +38,7 @@ export interface IState {
|
|||
node: INodeState;
|
||||
uploads: IUploadState;
|
||||
flow: IFlowState;
|
||||
player: any;
|
||||
}
|
||||
|
||||
export const sagaMiddleware = createSagaMiddleware();
|
||||
|
@ -54,6 +57,7 @@ export const store = createStore(
|
|||
node: nodeReducer,
|
||||
uploads: uploadReducer,
|
||||
flow: flowReducer,
|
||||
player: playerReducer,
|
||||
}),
|
||||
composeEnhancers(applyMiddleware(routerMiddleware(history), sagaMiddleware))
|
||||
);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue