<!DOCTYPE html>
<html lang="en">
<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/bootstrap.min.css"/>
    <link rel="stylesheet" href="/styles/edit.css">
    
    <title> Edit movie </title>
</head>

<body>

    <main class="container md">
        <div class="container-lg">
            <div class="text-center">
                <h2 class="text-white"> Edit <%= foundMovie.title %> data!</h2>
            </div>

            <div class="row justify-content-center my-5">

                <div class="col-lg-6">
                    
                    <form action="/movies/<%= foundMovie._id %>?_method=PUT" method="POST">
                
                        <label class="form-label text-white" for="title"> Title </label>
                        <input type="text" name="title" class="form-control" placeholder="Movie title" value="<%= foundMovie.title %>">
                
                        <label class="form-label text-white" for="synopsis"> Synopsis </label>
                        <textarea name="synopsis" class="form-control" placeholder="Write the movie synopsis" rows="3"> <%= foundMovie.synopsis %></textarea>

                        <label class="form-label text-white" for="duration"> Duration </label>
                        <input name="duration" type="text" class="form-control" placeholder=" 2 hours 19 minutes" value="<%= foundMovie.duration %>">

                        <label class="form-label text-white" for="releaseDate"> Release date </label>
                        <input name="releaseDate" type="text" class="form-control" placeholder=" October 15, 1999 (United States)" value="<%= foundMovie.releaseDate %>">

                        <label class="form-label text-white" for="image"> Image url </label>
                        <input name="image" type="text" class="form-control" placeholder=" https://upload.wikimedia.org/wikipedia/pt/f/f3/Moonlight_%28filme%29.png" value="<%= foundMovie.image %>">

                        <label class="form-label text-white" for="categories"> Categories </label>
                        <input name="categories" type="text" class="form-control" placeholder=" Drama" value="<%= foundMovie.categories %>">

                        <div class="buttonsContainer">
                            <button type="submit" class="btn btn-outline-success mt-3"> Submit edit </button>
                            <a href="/movies" class="btn btn-outline-danger"> Back to movies</a>
                        </div>
                    </form>

                </div>
            </div>
        </div>


    </main>

    <script language="javascript" src="/js/bootstrap.min.js"></script>
</body>
</html>