<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <nav class="navbar navbar-expand-lg" style="background-color: #e3f2fd;">
            <div class="container-fluid">
              <a class="navbar-brand" href="#">Movie Booking System</a>
              <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
              </button>
              <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
                <div class="navbar-nav">
                  <a class="nav-link" href="/book_movies?user=<%=user%>&user_id=<%=user_id%>">View currently streaming movies</a>
                </div>
              </div>
            </div>
        </nav>
        <meta name="viewport" content="width=device-width,initial-scale=1">
        <title>Update Booking</title>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3" crossorigin="anonymous"></script>
    </head>
    <body>
        <div class="d-flex justify-content-center align-items-center flex-column"  style="margin-top: 5em;"">
            <div class="card text-bg-info border-primary mb-3" style="padding: 2em;">
                <form class="validated-form" method="post" action="/modify_booking?_method=PUT&movie_id=<%=movie_id%>&username=<%=user%>&user_id=<%=user_id%>" novalidate>
                    <div class="row">
                        <div class="col-6">
                            <label class="form-label" for="seat_type">Select preferred seat type : </label>
                        </div>
                        <div class="col">
                            <select class="form-select" name="seat_type" id="seat_type" aria-label="Select Seats">
                                <option value="Silver" <%=seat_type==='Silver'?'selected':''%>>Silver (Front-Row Seats) - (₹320)</option>
                                <option value="Gold" <%=seat_type==='Gold'?'selected':''%>>Gold(Back-Row Seats) - (₹340)</option>
                                <option value="Premium" <%=seat_type==='Premium'?'selected':''%>>Premium (Recliner Seats) - (₹610) </option>
                            </select>
                        </div>
                    </div>
                    <br>
                    <div class="row">
                        <div class="col-6">
                            <label class="form-label" for="admits">Enter the number of seats : </label>
                        </div>
                        <div class="col">
                            <input class="form-control" type="number" name="admits" id="admits" min="1" value="<%=admits%>" required>
                        </div>
                        <div class="valid-feedback">
                            Looks Good!
                        </div>
                        <div class="invalid-feedback">
                            Please select a valid number of admits
                        </div>
                    </div>
                    <br>
                    <div class="row">
                        <div class="col-6">
                            <label class="form-label" for="show_time">Select the show time : </label>
                        </div>
                        <div class="col">
                            <select class="form-select" name="show_time" id="show_time" aria-label="Select Time show">
                                <option value="06:00:00" <%=show_time==='06:00:00'?'selected':''%>>6 AM</option>
                                <option value="08:00:00" <%=show_time==='08:00:00'?'selected':''%>>8 AM</option>
                                <option value="12:00:00" <%=show_time==='12:00:00'?'selected':''%>>12 PM</option>
                                <option value="14:00:00" <%=show_time==='14:00:00'?'selected':''%>>2 PM</option>
                                <option value="17:00:00" <%=show_time==='17:00:00'?'selected':''%>>5 PM</option>
                                <option value="20:00:00" <%=show_time==='20:00:00'?'selected':''%>>8 PM</option>
                                <option value="23:00:00"<%=show_time==='23:00:00'?'selected':''%>>11 PM</option>
                            </select>
                        </div>
                    </div>
                    <br>
                    <br>
                    <div class="d-flex justify-content-center">
                        <button type="submit" class="btn btn-primary">Update Booking</button>
                    </div>
                </form>
            </div>
        </div>
    </body>    