|
|
@@ -1,21 +1,38 @@
|
|
|
-function Video({ src, classes }) {
|
|
|
+function Video({ src, classes, embed = true }) {
|
|
|
return (
|
|
|
<div
|
|
|
className={classes}
|
|
|
style={{ position: 'relative', paddingBottom: '56.25%', height: 0 }}
|
|
|
>
|
|
|
- <video
|
|
|
- src={src}
|
|
|
- className="aspect-video w-full"
|
|
|
- style={{
|
|
|
- position: 'absolute',
|
|
|
- top: 0,
|
|
|
- left: 0,
|
|
|
- }}
|
|
|
- controls
|
|
|
- playsInline
|
|
|
- preload="metadata"
|
|
|
- />
|
|
|
+ {embed ? (
|
|
|
+ <iframe
|
|
|
+ src={src}
|
|
|
+ className="aspect-video w-full"
|
|
|
+ style={{
|
|
|
+ position: 'absolute',
|
|
|
+ top: 0,
|
|
|
+ left: 0,
|
|
|
+ width: '100%',
|
|
|
+ height: '100%',
|
|
|
+ }}
|
|
|
+ allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
|
|
+ referrerPolicy="strict-origin-when-cross-origin"
|
|
|
+ allowFullScreen
|
|
|
+ />
|
|
|
+ ) : (
|
|
|
+ <video
|
|
|
+ src={src}
|
|
|
+ className="aspect-video w-full"
|
|
|
+ style={{
|
|
|
+ position: 'absolute',
|
|
|
+ top: 0,
|
|
|
+ left: 0,
|
|
|
+ }}
|
|
|
+ controls
|
|
|
+ playsInline
|
|
|
+ preload="metadata"
|
|
|
+ />
|
|
|
+ )}
|
|
|
</div>
|
|
|
)
|
|
|
}
|