Загрузка случайного фонового видео при загрузке без повторения того же видео

Question

Я давно работаю над фоновым видео на главной странице и всегда стараюсь с ним поработать, чтобы сделать его лучше.

Я только что провел тест, и мне потребовалось 37 обновлений страницы, чтобы загрузить каждое из моих 12 видео хотя бы один раз. Я остановился, когда наконец увидел все видео хотя бы один раз, но это означало, что я посмотрел около 5 раз.

Я использовал Squarespace, но это домашняя страница HTML. http://www.rupertlaycock.com/

window.onload = function(){
var videoList = [
"a",
"b",
"c",
"d",
"e",
"f",
"g",
"h",
"i",
"j",
"k",
"l"
];
$("#splash-vid").html("<video id='bgvid' autoplay muted id='bgvid' loop><source src='s/" + videoList[Math.floor(Math.random() * videoList.length)]  + ".mp4' type='video/mp4'>")

Плюс вот мой код для изменения расширения на.webm для chrome, так как у меня есть те же видео, загруженные в те же папки, то есть "a.mp4" и "a.webm". Кроме того, я не могу понять, как автоматизировать изменение тега type='video/mp4' для type='video/webm', как у меня для имен файлов src.

if (window.chrome)
$("[type=video\\\/mp4]").each(function()
{
    $(this).attr("src", $(this).attr("src").replace(".mp4", ".webm"));
    $(this).attr("src", $(this).attr("src").replace("/mp4", "/webm"));
});}

Если у кого-то есть улучшения по этому поводу, я был бы безумно благодарен!