--- a/src/pyams_media/skin/templates/video.pt Fri Jan 18 15:34:46 2019 +0100
+++ b/src/pyams_media/skin/templates/video.pt Mon Feb 18 16:08:57 2019 +0100
@@ -3,16 +3,24 @@
thumbnails tales:thumbnails(video);
size thumbnails.get_image_size();
thumbnail thumbnails.get_thumbnail('{0}x{1}'.format(size[0], size[1]), 'png');
- timestamp tales:timestamp(thumbnail);"
+ global media_width 0;
+ global min_width 0;
+ global previous_type None;"
controls="${'controls' if controls else None}"
- poster="${href}/++thumb++${size[0]}x${size[1]}.png?_=${timestamp}">
- <tal:loop repeat="conversion conversions.get_conversions(order=('video/webm','video/mp4','video/x-flv'))">
- <source tal:define="media_width conversions.get_conversion_width(conversion.__name__);
- media_src tales:absolute_url(conversion);
- video_type tales:video_type(conversion);"
- tal:condition="video_type"
- type="${video_type}"
- src="${media_src.replace('+', '%2b')}"
- media="${'all and (max-width: {0}px)'.format(media_width) if media_width else None}" />
+ poster="${href}/++thumb++${size[0]}x${size[1]}.png?_=${tales:timestamp(thumbnail)}">
+ <tal:loop repeat="conversion conversions.get_conversions(order=('video/mp4','video/webm','video/ogg','video/x-flv'))">
+ <tal:var define="video_type tales:video_type(conversion);
+ min_width ((media_width or 0) + 1) if (video_type == previous_type) else 0;
+ global media_width conversions.get_conversion_width(conversion.__name__);
+ media_src tales:absolute_url(conversion);
+ media_url media_src.replace('+', '%2b');">
+ <source tal:condition="video_type"
+ type="${video_type}"
+ src="${media_url}?_=${tales:timestamp(conversion)}"
+ media="${'screen only{}{}'.format(
+ ' and (min-width: {}px)'.format(min_width) if min_width else '',
+ ' and (max-width: {}px)'.format(media_width) if media_width else '')}" />
+ <tal:var define="global previous_type video_type;" />
+ </tal:var>
</tal:loop>
</video>