2.1.1 • Published 5 years ago
the-video v2.1.1
the-video
Video for the-components
Installation
$ npm install the-video --save
Usage
'use strict'
import React from 'react'
import { TheVideo, TheVideoStyle } from 'the-video'
import { TheIconStyle } from 'the-icon'
const VIDEO_URL = './mov_bbb.mp4'
class ExampleComponent extends React.PureComponent {
render() {
const width = 120
const height = 120
return (
<div>
<TheIconStyle />
<TheVideoStyle />
<TheVideo controls {...{ width, height }} src={VIDEO_URL} scale='none' />
<TheVideo controls {...{ width, height }} src={VIDEO_URL} scale='fill' />
<TheVideo controls {...{ width, height }} src={VIDEO_URL} scale='fit' />
<TheVideo controls {...{ width, height }} src={'__invalid_url__'} />
<TheVideo controls {...{ width, height }} src={VIDEO_URL} scale='fit' asLink />
<TheVideo controls {...{ width, height }} src={null} scale='fit' />
<hr />
<div style={{ width: 120, height: 120, background: '#CCC' }}>
<TheVideo height="24px" width='33%' src={VIDEO_URL} scale='fill' asLink />
<TheVideo height="24px" width='33%' src={VIDEO_URL} scale='fill' asLink />
<TheVideo height="24px" width='33%' src={VIDEO_URL} scale='fill' />
</div>
</div>
)
}
}
export default ExampleComponent
Components
TheVideo
Video for the-components
Props
Name | Type | Description | Default |
---|---|---|---|
asLink | bool | Render as link | false |
height | union | Image height | 'auto' |
notFoundMessage | string | Message when not found | 'Not Found' |
onError | func | Handler for failed event | null |
onLoad | func | Handler for load event | null |
playsInline | bool | false | |
resizeInterval | number | Interval for resize | -1 |
scale | enum | How to scale video | 'fill' |
videoRef | func | Handle video ref |
|
width | union | 'auto' | |
onVideo | () => {} | ||
preload | 'metadata' |
TheVideoStyle
Style for TheVideo
Props
Name | Type | Description | Default |
---|---|---|---|
options | object | Style options | {} |
License
This software is released under the MIT License.
Links
2.1.1
5 years ago
2.1.0
5 years ago
2.0.25
5 years ago
2.0.24
6 years ago
2.0.23
6 years ago
2.0.22
6 years ago
2.0.21
6 years ago
2.0.20
6 years ago
2.0.19
6 years ago
2.0.18
6 years ago
2.0.17
6 years ago
2.0.16
6 years ago
2.0.15
6 years ago
2.0.14
6 years ago
2.0.13
6 years ago
2.0.12
6 years ago
2.0.11
6 years ago
2.0.10
6 years ago
2.0.9
6 years ago
2.0.8
6 years ago
2.0.7
6 years ago
2.0.6
6 years ago
2.0.5
6 years ago
2.0.4
7 years ago
2.0.3
7 years ago
2.0.2
7 years ago
2.0.1
7 years ago
2.0.0
7 years ago
1.1.6
7 years ago
1.1.5
7 years ago
1.1.4
7 years ago
1.1.3
7 years ago
1.1.2
7 years ago
1.1.1
7 years ago
1.1.0
7 years ago
1.0.2
7 years ago
1.0.1
7 years ago
1.0.0
7 years ago