<!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?v=<%= ASSET_COMMIT %>">
    <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>
<script>
var video_data = {
    id: '<%= video.id %>',
    plid: '<%= plid %>',
    length_seconds: '<%= video.info["length_seconds"].to_f %>',
    video_series: <%= video_series.to_json %>,
    params: <%= params.to_json %>,
    preferences: <%= preferences.to_json %>
}
</script>

<%= rendered "components/player" %>
<script src="/js/embed.js?v=<%= ASSET_COMMIT %>"></script>
</body>
</html>
