Video splitPoster 功能整理

This commit is contained in:
liaoxuezhi 2019-07-13 21:03:58 +08:00
parent c6e319a4b6
commit 2c9b8f5f8e

View File

@ -439,7 +439,7 @@ export default class Video extends React.Component<VideoProps, VideoState> {
} }
renderPosterAndPlayer() { renderPosterAndPlayer() {
let {poster, data, locals, minPosterDimension, classPrefix: ns} = this.props; let {poster, data, locals, minPosterDimension, classnames: cx} = this.props;
const posterInfo = this.state.posterInfo || {}; const posterInfo = this.state.posterInfo || {};
let dimensionClassName = ''; let dimensionClassName = '';
@ -449,14 +449,14 @@ export default class Video extends React.Component<VideoProps, VideoState> {
(minPosterDimension.width || minPosterDimension.height) && (minPosterDimension.width || minPosterDimension.height) &&
(minPosterDimension.width > posterInfo.width || minPosterDimension.height > posterInfo.height) (minPosterDimension.width > posterInfo.width || minPosterDimension.height > posterInfo.height)
) { ) {
dimensionClassName = `${ns}Text--danger`; dimensionClassName = `Text--danger`;
} }
return ( return (
<div className="pull-in-xs"> <div className="pull-in-xs">
<div className={`${ns}Hbox`}> <div className={cx('Hbox')}>
<div className={`${ns}Hbox-col`}> <div className={cx('Hbox-col')}>
<div className="Wrapper--xs"> <div className={cx('Wrapper Wrapper--xs')}>
<img <img
onLoad={this.onImageLoaded as any} onLoad={this.onImageLoaded as any}
className="w-full" className="w-full"
@ -472,7 +472,7 @@ export default class Video extends React.Component<VideoProps, VideoState> {
<span> <span>
{' '} {' '}
{' '} {' '}
<span className={`${ns}Text--danger`}> <span className={cx('Text--danger')}>
{minPosterDimension.width || '-'} x {minPosterDimension.height || '-'} {minPosterDimension.width || '-'} x {minPosterDimension.height || '-'}
</span> </span>
</span> </span>
@ -480,8 +480,8 @@ export default class Video extends React.Component<VideoProps, VideoState> {
</p> </p>
</div> </div>
</div> </div>
<div className={`${ns}Hbox-col`}> <div className={cx('Hbox-col')}>
<div className="Wrapper--xs">{this.renderPlayer()}</div> <div className={cx('Wrapper Wrapper--xs')}>{this.renderPlayer()}</div>
</div> </div>
</div> </div>
</div> </div>