<!DOCTYPE html>
<html lang="<%= env.get("preferences").as(Preferences).locale %>">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="thumbnail" content="<%= thumbnail %>">
  <%= rendered "components/player_sources" %>
  <link rel="stylesheet" href="/css/default.css">
  <title><%= HTML.escape(video.title) %> - Invidious</title>
  <style>
  #player {
    position: fixed;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
  }
  </style>
</head>

<body>
<%= rendered "components/player" %>

<script>
<% if plid %>
function get_playlist(plid, timeouts = 0) {
    if (timeouts > 10) {
        console.log('Failed to pull playlist');
        return;
    }

    if (plid.startsWith('RD')) {
        var plid_url = '/api/v1/mixes/' + plid +
            '?continuation=<%= video.id %>' +
            '&format=html&hl=<%= env.get("preferences").as(Preferences).locale %>';
    } else {
        var plid_url = '/api/v1/playlists/' + plid +
            '?continuation=<%= video.id %>' +
            '&format=html&hl=<%= env.get("preferences").as(Preferences).locale %>';
    }

    var xhr = new XMLHttpRequest();
    xhr.responseType = 'json';
    xhr.timeout = 20000;
    xhr.open('GET', plid_url, true);
    xhr.send();

    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4) {
            if (xhr.status == 200) {
                if (xhr.response.nextVideo) {
                    player.on('ended', function() {
                        location.assign('/watch?v=' + xhr.response.nextVideo +
                            '&list=' + plid +
                            <% if params.listen != preferences.listen %>
                                '&listen=<%= params.listen %>' +
                            <% end %>
                            <% if params.autoplay || params.continue_autoplay %>
                                '&autoplay=1' +
                            <% end %>
                            <% if params.speed != preferences.speed %>
                                '&speed=<%= params.speed %>' +
                            <% end %>
                            ''
                        );
                    });
                }
            }
        }
    }

    xhr.ontimeout = function() {
        console.log('Pulling playlist timed out.');
        get_playlist(plid, timeouts + 1);
    }
}

get_playlist('<%= plid %>');
<% elsif video_series %>
player.on('ended', function() {
    location.assign('/embed/<%= video_series.shift %>' +
        <% if !video_series.empty? %>
            '?playlist=<%= video_series.join(",") %>' +
        <% end %>
        <% if params.listen != preferences.listen %>
            '&listen=<%= params.listen %>' +
        <% end %>
        <% if params.autoplay || params.continue_autoplay %>
            '&autoplay=1' +
        <% end %>
        <% if params.speed != preferences.speed %>
            '&speed=<%= params.speed %>' +
        <% end %>
        ''
    );
});
<% end %>
</script>
</body>
</html>
