grav icon indicating copy to clipboard operation
grav copied to clipboard

Set thumb image as the attribute poster of video automatically

Open dallaslu opened this issue 2 years ago • 2 comments

ref #3428

dallaslu avatar Aug 25 '21 06:08 dallaslu

Can you please provide a use case for this PR in this "conversation" section of the PR itself. I read your issue, but it's not clear which use case/example this PR is addressing.

rhukster avatar Aug 25 '21 15:08 rhukster

Example:

Auto poster

Both 1280x720_1mb.mp4 and 1280x720_1mb.mp4.thumb.jpg was uploaded to /user/pages/02.typography/.

/user/pages/02.typography/default.md:

![Video Sample](1280x720_1mb.mp4)

/user/themes/{theme}/templates/default.html.twig:

{{ page.media['1280x720_1mb.mp4'].html()|raw }}

Both will get the same HTML:

<video poster="/user/pages/02.typography/1280x720_1mb.mp4.thumb.jpg" alt="">
	<source src="/user/pages/02.typography/1280x720_1mb.mp4">
	Your browser does not support the video tag.
</video>

Disable poster

When 1280x720_1mb.mp4.thumb.jpg is missing, the poster attribute is not output by default.

Or manually set it to not output poster.

/user/pages/02.typography/default.md:

![Video Sample](1280x720_1mb.mp4?poster=0)

/user/themes/{theme}/templates/default.html.twig:

{{ page.media['1280x720_1mb.mp4'].poster(0).html()|raw }}

HTML Result:

<video alt="">
	<source src="/user/pages/02.typography/1280x720_1mb.mp4">
	Your browser does not support the video tag.
</video>

Manual

The manual assignment of the poster function is not affected.

dallaslu avatar Aug 26 '21 03:08 dallaslu