<template>
	<view class="stream-root">
		<video
			v-if="src"
			class="stream-video"
			:src="src"
			:controls="false"
			:autoplay="true"
			:show-center-play-btn="false"
			object-fit="cover"
			:enable-progress-gesture="false"
			@error="onError"
		/>
		<image v-else-if="poster" class="stream-poster" :src="poster" mode="aspectFill" />
	</view>
</template>

<script>
export default {
	name: 'StreamView',
	props: {
		src: { type: String, default: '' },
		poster: { type: String, default: '' }
	},
	methods: {
		onError(e) {
			this.$emit('fault', e)
		}
	}
}
</script>

<style scoped>
.stream-root {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: #000;
}
.stream-video,
.stream-poster {
	width: 100%;
	height: 100%;
}
</style>
