add interface

master
lgf 3 years ago
parent 43769627fc
commit 08c2bf0b45
  1. 2
      src/appComponent.tsx
  2. 8
      src/core/controller/index.tsx
  3. 21
      src/core/index.tsx
  4. 13
      src/interface/index.ts

@ -80,7 +80,6 @@ const AppComponent = memo(function AppComponent(props) {
height: 420, height: 420,
theme: '#00D3FF', theme: '#00D3FF',
poster: 'https://cdn.gudsen.com/2021/06/28/f81356b08b4842d7a3719499f557c8e4.JPG', poster: 'https://cdn.gudsen.com/2021/06/28/f81356b08b4842d7a3719499f557c8e4.JPG',
isAutoPlay: true,
}} }}
onProgressMouseDown={onProgressMouseDown} onProgressMouseDown={onProgressMouseDown}
onPlay={onPlay} onPlay={onPlay}
@ -99,7 +98,6 @@ const AppComponent = memo(function AppComponent(props) {
height: 420, height: 420,
theme: 'red', theme: 'red',
poster: 'https://cdn.gudsen.com/2021/06/28/f81356b08b4842d7a3719499f557c8e4.JPG', poster: 'https://cdn.gudsen.com/2021/06/28/f81356b08b4842d7a3719499f557c8e4.JPG',
isAutoPlay: false,
}} }}
/> />
<button onClick={() => videoMethod('play')}></button> <button onClick={() => videoMethod('play')}></button>

@ -102,7 +102,13 @@ const Index = memo(function Index(props) {
<Progress /> <Progress />
<Controls /> <Controls />
</div> </div>
{isEndEd ? <EndComponent handle={() => [handleChangePlayState(), hiddleCursor()]} /> : null} {isEndEd ? (
propsAttributes!.setEndPlayContent ? (
propsAttributes!.setEndPlayContent
) : (
<EndComponent handle={() => [handleChangePlayState(), hiddleCursor()]} />
)
) : null}
</div> </div>
); );
}); });

@ -31,7 +31,7 @@ const JoLPlayer = function JoLPlayer(props: videoparameter, ref: React.Ref<unkno
onError, onError,
onvolumechange, onvolumechange,
} = props; } = props;
const { videoSrc, width, height, theme, poster, isAutoPlay } = option; const { videoSrc, width, height, theme, poster, setBufferContent } = option;
/** /**
* @description * @description
*/ */
@ -156,14 +156,17 @@ const JoLPlayer = function JoLPlayer(props: videoparameter, ref: React.Ref<unkno
{returnVideoSource} {returnVideoSource}
</video> </video>
{!isVideoUseful && <p className="video-no-useful-tip"> ( ́︿ ̀)</p>} {!isVideoUseful && <p className="video-no-useful-tip"> ( ́︿ ̀)</p>}
{isBufferring && ( {isBufferring &&
<Broadcast (setBufferContent ? (
iconClass="loading" setBufferContent
fill={theme ? theme : defaultTheme} ) : (
className="player-loading" <Broadcast
fontSize="55px" iconClass="loading"
/> fill={theme ? theme : defaultTheme}
)} className="player-loading"
fontSize="55px"
/>
))}
<FlowContext.Provider value={contextProps}> <FlowContext.Provider value={contextProps}>
<Controller /> <Controller />
</FlowContext.Provider> </FlowContext.Provider>

@ -6,6 +6,7 @@ export interface hoverShowStyleType {
progressBgRefEle: HTMLDivElement; progressBgRefEle: HTMLDivElement;
progressScrubberRefEle: HTMLDivElement; progressScrubberRefEle: HTMLDivElement;
} }
export type pausePlacement = 'bottomRight' | 'center';
export interface videoOption<T = string, K = boolean, U = number> { export interface videoOption<T = string, K = boolean, U = number> {
/** /**
* @description width * @description width
@ -28,9 +29,17 @@ export interface videoOption<T = string, K = boolean, U = number> {
*/ */
poster?: T; poster?: T;
/** /**
* @description * @description
*/ */
isAutoPlay?: K; setEndPlayContent?: React.ReactNode;
/**
* @description
*/
setBufferContent?: React.ReactNode;
/**
* @description
*/
pausePlacement?: pausePlacement;
} }
export interface videoAttributes<T = number, K = boolean> { export interface videoAttributes<T = number, K = boolean> {
/** /**

Loading…
Cancel
Save