{% extends "layout.html" %}
{% block page_title %}Private Page{% endblock %}
{% block body %}
    {{ super() }}

    <h4>You can take notes here. Only yourself can access them. They will be removed when your account is removed.</h4>

    <hr>
    
    <h3>Add Note</h3>
    <div class="form-group">
      <label for="textArea" class="col-lg-3 control-label">Note to Take</label>
      <div class="col-lg-9">
      <form action="/write_note" method="post">
        <input class="form-control" name="text_note_to_take"></input>
        <button type="submit" class="btn btn-success">Submit</button>
        </form>
      </div>
    </div>

    <hr>

    {% if notes %}
        <h3>Your Notes</h3>
        <table class="table small">
            <thead>
                <tr>
                  <th>Note ID</th>
                  <th>Timestamp</th>
                  <th>Note</th>
                  <th>Action</th>
                </tr>
            </thead>
            {% for note_id, timestamp, note, act in notes %}
                    <tr>
                       <td> {{ note_id }} </td>
                       <td> {{ timestamp }} </td>
                       <td> {{ note }} </td>
                       <td><a href={{act}}>Delete</a></td>
                    </tr>
                    
            {% endfor %}
        </table>
    {% endif %}

    <hr>
    <h3>Upload Image</h3>
    <form method='post' action='/upload_image' enctype=multipart/form-data>
      <p><input type=file name=file>
         <input type=submit value=Upload>
    </form>

    {% if images %}
        <h3>Your Images</h3>
        <table class="table small">
            <thead>
                <tr>
                  <th>Image ID</th>
                  <th>Timestamp</th>
                  <th>Image Name</th>
                  <th>Action</th>
                </tr>
            </thead>
            {% for image_id, timestamp, image_name, act in images %}
                    <tr>
                       <td> {{ image_id }} </td>
                       <td> {{ timestamp }} </td>
                       <td> {{ image_name }} </td>
                       <td><a href={{act}}>Delete</a></td>
                    </tr>
                    
            {% endfor %}
        </table>
    {% endif %}

{% endblock %}