<%- include('../partials/header'); %>
    <div class="container" align="center">
        <div class="jumbotron" >
            <h1>Edit Container and Associated Part</h1>    
            <div class="row">
                <div class="card col-6 justify-content-start align-items-start">
                    <div class="card-header justify-content-center">
                        <h3 class="mb-0">Edit Container</h3>
                    </div>
                    <div class="card-body">
                        <form class ="form" action="/containers/<%=foundContainer._id%>?_method=PUT" method="POST">
                            <div class="form-group row align-items-center">
                                <label class="col-lg-4 col-form-label form-control-label">Container name</label>
                                <div class="col-lg-8">
                                    <input class="form-control" type="text" name="container[nameID]" value="<%=foundContainer.nameID%>">
                                </div>
                            </div>
                            <div class="form-group row align-items-center">
                                <label class="col-lg-4 col-form-label form-control-label">Container Local URL</label>
                                <div class="col-lg-8">
                                    <input class="form-control" type="text" name="container[localURL]" value="<%=foundContainer.localURL%>">
                                </div>
                            </div>
                        <div class="form-group row">
                            <label class="col-lg-4 col-form-label form-control-label"></label>
                            <div class="col-lg-4">
                                <button class="btn btn-dark mt-3">Update</button>                             
                            </div>
                        </form>
                            <div class="col-lg-4">
                                <form class ="form" action="/containers/<%=foundContainer._id%>?_method=DELETE" method="POST">
                                    <button class="btn btn-dark mt-3 ml-3">Delete</button>
                                </form>      
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card col-6 justify-content-start align-items-start">
                    <div class="card-header">
                        <h3 class="mb-0">Associated Part</h3>
                    </div>
                    <div class="card-body">
                        <%  if (foundContainer.parts.length > 0) { %>
                            <% var part = foundContainer.parts.slice(-1)[0]; %>
                            <% var partID = part._id; %>
                            <% var partName = part.nameID; %>
                            <% var partQuant = part.data.slice(-1)[0].quantity %>
                            <% var partWeight = part.weight; %>
                            <% var partZO = part.zero_offset; %>
                            <% var partCF = part.calibration_factor; %>
                            <% var formURL = "?_method=PUT"; %>
                            <% var buttonText  = 'Update'; %> 
                            <% var display  = 'block'; %> 
                        <% } else { %>
                            <% var partID = ""; %>
                            <% var partName = ""; %>
                            <% var partQuant= ""; %>
                            <% var partWeight = ""; %>
                            <% var partZO = ""; %>
                            <% var partCF = ""; %>
                            <% var formURL = ""; %>
                            <% var buttonText  = 'Create'; %>  
                            <% var display  = 'none'; %> 
                        <% } %>
                        <form id="part-form" action="/containers/<%=foundContainer._id%>/<%=partID%><%=formURL%>" class ="form"  method="POST">
                            <div class="form-group row align-items-center">
                                <label class="col-lg-4 col-form-label form-control-label">Part name</label>
                                <div class="col-lg-8">
                                    <input class="form-control" type="text" name="part[nameID]" value="<%=partName%>">
                                </div>
                            </div>
                            <div class="form-group row align-items-center">
                                <label class="col-lg-4 col-form-label form-control-label">Quantity</label>
                                <div class="col-lg-8">
                                    <input class="form-control" type="number" name="part[quantity]" value="<%=partQuant%>">
                                </div>
                            </div>
                            <div class="form-group row align-items-center">
                                <label class="col-lg-4 col-form-label form-control-label">Weight</label>
                                <div class="col-lg-8">
                                    <input class="form-control" type="number" step="0.0001" name="part[weight]" value="<%=partWeight%>">
                                </div>
                            </div>
                            <div class="form-group row align-items-center">
                                <label class="col-lg-4 col-form-label form-control-label">Zero Offset</label>
                                <div class="col-lg-8">
                                    <input class="form-control" type="number" step="0.0001" name="part[zero_offset]" value="<%=partZO%>">
                                </div>
                            </div>
                            <div class="form-group row align-items-center">
                                <label class="col-lg-4 col-form-label form-control-label">Calibration Factor</label>
                                <div class="col-lg-8">
                                    <input class="form-control" type="number" step="0.0001" name="part[calibration_factor]" value="<%=partCF%>">
                                </div>
                            </div>
                        <div class="form-group row">
                            <label class="col-lg-4 col-form-label form-control-label"></label>
                            <div class="col-lg-4">
                                <button id="create-update" class="btn btn-dark mt-3"><%=buttonText%></button>                  
                            </div>
                        </form>
                            <div class="col-lg-4">
                                <form style="display: <%=display%>" action="/containers/<%=foundContainer._id%>/<%=partID%>?_method=DELETE" method="POST">
                                    <button class="btn btn-dark mt-3 ml-3">Delete</button>
                                </form>                                    
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
<%- include('../partials/footer'); %>