Significantly improve the media player UX

This commit is contained in:
Michael Fabian 'Xaymar' Dirks
2022-11-27 00:53:36 +01:00
parent 445d5f45f5
commit 60aaaf7132
4 changed files with 224 additions and 184 deletions
@@ -68,16 +68,17 @@ videos:
{% for video in page.videos.videos %}
{% capture capture_video %}
{% include blocks/media.liquid type="video" caption=caption poster=video.poster muted=true preload="none" id=video.id player=true %}
<script>
document.getElementById("{{ video.id }}").variants = {
{% for bitrate in page.videos.bitrates %}"{{ bitrate }}kbit/s" : {
{% for resolution in page.videos.resolutions %}"{{ resolution }}" : {
{% for encoder in page.videos.encoders %}
{% assign real_url = encoder.url | replace: ":video", video.id | replace: ":res", resolution | replace: ":rate", bitrate | absolute_url%}"{{ encoder.name }}" : "{{ real_url }}",{% endfor %}
},{% endfor %}
},{% endfor %}
};
{% capture video_sources %}
{% for bitrate in page.videos.bitrates %}
{% for resolution in page.videos.resolutions %}
{% for encoder in page.videos.encoders %}
{% assign real_url = encoder.url | replace: ":video", video.id | replace: ":res", resolution | replace: ":rate", bitrate | absolute_url%}
<source src="{{ real_url }}" title="{{ bitrate }} kbit/s, {{ resolution }}, {{ encoder.name }}">
{% endfor %}
{% endfor %}
{% endfor %}
{% endcapture %}
{% include blocks/media.liquid type="video" caption=caption poster=video.poster muted=true preload="none" player=true content=video_sources %}
</script>
{% endcapture %}
{% include blocks/details.liquid title=video.name content=capture_video level=1 open=true %}