<!DOCTYPE html>
<html lang="pt-br">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../css/estilo.css">
    <link rel="stylesheet" href="../css/estiloDetalhes.css">    
    <link rel="stylesheet" href="../css/estiloMensagem.css">
    <title>Detalhes</title>
</head>

<body>    
    <header>
        <%- include('nav') %>
    </header>
    <main>    
        <div class="imagembg">
            <input type="hidden" id="imagemAtual" value="<%= trailer.imagembg %>">                            
        </div>      
        <section class="detalhes" >              
            <section class="subDetalhes" id="informacao">  
                <div class="tituloDetalhes">  
                    <div>
                        <h1><%= trailer.titulo %></h1>              
                    </div>
                    <div class="tituloDetalhes2">
                        <img src="../img/<%= trailer.classificacao %>.png">                    
                        <h2>(<%= trailer.ano %>)</h2>
                    </div>                
                    <Div>
                        <img id="imgThumb" src="<%= trailer.thumb %>" alt="">
                    </Div>
                    <div class="botoesFuncoes">
                        <a href="/editar/<%=trailer.id%>"><button>Editar</button></a>
                        <a href="/deletarTrailer/<%=trailer.id%>"><button>Excluir</button></a>
                    </div>  
                    <div>   
                        <h1>Sinopse</h1>                    
                        <p><%= trailer.sinopse %></p>
                    </div>
                </div>
            </section>
            <section class="subDetalhes" id="sectionVideo">
                <div>                                        
                    <input type="hidden" id="videoAtual" value="<%= trailer.video %>">
                    <iframe id="video" src="" frameborder="0" allowfullscreen></iframe>                
                </div>  
            </section>  

        </section>
    </main>

    <% if (message != "") {  %>
        <section id="message">
            <p><%= message %></p> <span id="close">&times;</span>
        </section>
    <% }  %>

    <footer>
        <%- include('footer') %>
    </footer>    
    <script src="/js/scriptVideo.js"></script>
    <script src="/js/scriptImagem.js"></script>
    <script src="/js/scriptMensagem.js"></script>
    <script src="/js/scriptNav.js"></script> 
</body>

</html>