<% 
    function getTimeString(min) {
        var result = "";

        if (min > 60) {
            let divisor = parseInt(min / 60);
            // result = divisor + ' h ' + min - (divisor * 60) + ' min';
            result = divisor + ' h ' + (min - (divisor * 60)) + ' min';
        } else {
            result = min + ' min';
        }

        return result;
    }

    let weekdays = ['Sön', 'Mån', 'Tis', 'Ons', 'Tors', 'Fre', 'Lör']

    function getDateString(dateStr) {
        let date = new Date(dateStr);
        let string = "";
        let spanDate = "<span class='date'>";
        let spanTime = "<span class='time'>";
        let spanEnd = "</span>";
        
        string += weekdays[date.getUTCDay()] + " ";

        string += spanDate + date.getUTCDate() + "/" + (date.getUTCMonth() + 1) + spanEnd + " ";

        string += spanTime + date.getUTCHours() + ":" + (date.getUTCMinutes() == 0 ? '00' : date.getUTCMinutes()) + spanEnd;
        
        return string;
    }
%>

<% if (film !=null) { %>
<div class="filmElement" id="filmElement<%- id %>" onclick="movieElementClicked('filmElement<%- id %>')" tabindex="0" onselect="movieElementClicked('filmElement<%- id %>')">
    <img class="poster" src="<%= film.posterURL %>" alt="Affisch för filmen">
    <div class="mainBody">
        <h3 class="title"><%= film.name %></h3>
        <p class="genre hidden"><%= film.genre %></p>
        <p class="runtime hidden"><%= getTimeString(film.runtime) %></p>
        <% if (type == 'kontrast') { %>
            <a id="kontrastTag" href="bio-rosen/bio-kontrast">BIO KONTRAST</a>
        <% } %>
        <p class="runDate"><%- getDateString(film.date) %></p>
        <p class="ageRating hidden">
            <% if (film.ageRating != '') { %>
                Åldersgräns: <%= film.ageRating %>
            <% } else { %>
                Ingen Åldersgräns
            <% } %>
        </p>
    </div>
    <div class="hidden youtubeTrailer" src="<%= film.trailerURL.replace("watch?v=", "embed/") + "?rel=0" %>"></div>
    <div class="hidden description"><%- film.description.length > 0 ? film.description : 'Beskrivning saknas.' %></div>
    <div class="hidden ticketURL" href="<%- film.ticketURL %>"></div>
    <div class="hidden type"><%- type %></div>
</div>
<% } else { %>
    <div class="filmElement empty">
        <% if (type == 'film') { %>
            <h3>Ingen Film Uppkommande</h3>
        <% } else if (type == 'live') { %>
            <h3>Ingen Livesändning Uppkommande</h3>
        <% } else if (type == 'kontrast') { %>
            <div class="mainBody">
                <a id="kontrastTag" href="bio-rosen/bio-kontrast" style="align-self: center;">BIO KONTRAST</a>
                <h3>Ingen Kontrast Uppkommande</h3>
            </div>
        <% } %>
    </div>
<% } %>