diff --git a/src/video-recorder.js b/src/video-recorder.js index a4a7d39..6ce7f51 100644 --- a/src/video-recorder.js +++ b/src/video-recorder.js @@ -26,7 +26,7 @@ const getMimeType = () => { return mimeType } -let constraints = { +const CONSTRAINTS = { audio: true, video: true } @@ -155,6 +155,8 @@ export default class VideoRecorder extends Component { componentDidMount () { if (this.state.isInlineRecordingSupported && this.props.isOnInitially) { this.turnOnCamera() + } else if (this.state.isVideoInputSupported && this.props.isOnInitially) { + this.handleOpenVideoInput() } } @@ -186,7 +188,7 @@ export default class VideoRecorder extends Component { }) navigator.mediaDevices - .getUserMedia(constraints) + .getUserMedia(CONSTRAINTS) .then(this.handleSuccess) .catch(this.handleError) } diff --git a/src/video-recorder.stories.js b/src/video-recorder.stories.js index fe17a18..6cc24da 100644 --- a/src/video-recorder.stories.js +++ b/src/video-recorder.stories.js @@ -13,25 +13,37 @@ injectGlobal` const Wrapper = styled.div` height: 100%; ` -storiesOf('VideoRecorder', module).add('default', () => { - return ( - - { - const urlCreator = window.URL || window.webkitURL - const thumbUrl = urlCreator.createObjectURL(thumbnailBlob) - const videoUrl = urlCreator.createObjectURL(videoBlob) - console.log('Video Blob', videoBlob.size, videoBlob, videoUrl) - console.log('Thumb Blob', thumbnailBlob, thumbUrl) - console.log('Started:', startedAt) - console.log('Duration:', duration) - }} - /> - - ) -}) + +const handleRecordingComplete = ( + videoBlob, + startedAt, + thumbnailBlob, + duration +) => { + const urlCreator = window.URL || window.webkitURL + const thumbUrl = urlCreator.createObjectURL(thumbnailBlob) + const videoUrl = urlCreator.createObjectURL(videoBlob) + console.log('Video Blob', videoBlob.size, videoBlob, videoUrl) + console.log('Thumb Blob', thumbnailBlob, thumbUrl) + console.log('Started:', startedAt) + console.log('Duration:', duration) +} + +storiesOf('VideoRecorder', module) + .add('default', () => { + return ( + + + + ) + }) + .add('isOnInitially', () => { + return ( + + + + ) + })