{% extends "layout.html" %}

{% block content %}

    <!-- Starts image section -->
    <div class="row justify-content-md-center mb-4">
        <h2 class='text-primary'>Data Augmentation with Meta Reinforcement Learning</h2>
    </div>
    
    <div>
      <img src="{{url_for('autoaugmentation/static', filename='images/data augment cat.jpeg')}}" class="img-thumbnail" />
      <div class="caption">
        <p><strong>Data Augmentation</strong></p>
      </div>
    </div>
    <!-- Ends image section -->
    
    <!-- Starts upload section -->

    <section>

      <div class="container-fluid details">
        <form action="/predict" method="post" enctype="multipart/form-data" onsubmit="showloading()">

            <input type="file" name="image" class="upload"><br><br>
            
            <label for="user_classify">Which classfiication can best describe the uploading picutre:</label>
            <select id="user_classify" name="user_classify">
                <option value="Not sure">Not sure</option>
                <option value="Diseased Leaf">Diseased Leaf</option>
                <option value="Diseased Plant">Diseased Plant</option>
                <option value="Healthy Leaf">Healthy Leaf</option>
                <option value="Healthy Plant">Healthy Plant</option>
            </select><br><br>

            <label class="camera distance" for="Myheight"> Input yout height(m):</label>
            <input type="text" id="Myheight" name="Myheight"><br>

            <label class="camera distance" for="camera_dist_left"> Camera predicted distance from the left pillar(m):</label>
            <input type="text" id="camera_dist_left" name="camera_dist_left"><br>

            <label class="camera distance" for="camera_dist_right"> Camera predicted distance from the right pillar(m):</label>
            <input type="text" id="camera_dist_right" name="camera_dist_right"><br><br>

            <h5>More information about this cotton plant (optional)</h5>
            <label class='measurements' for='height'>Cotton plant height: </label>
            <input type='text' id='height' name = 'height'><br>
            <label class='measurements' for='width'>Cotton plant width:</label>
            <input type='text' id='width' name = 'width'><br>
            <label class='notes' for='added_notes'>Additional notes: </label>
            <input type='text' id='added_notes' name = 'added_notes'><br><br>

            <input type="submit" value="Submit and Predict!"> <br><br><br>
        </form>
      </div>
    </section>
    
    <!-- Ends upload section -->



{% endblock %}