{% load bootstrap4 %}
{% load tom_common_extras %}

<form method="POST" action="{% url 'tom_dataproducts:share_all' tg_pk=target.id %}" enctype="multipart/form-data" id="photometry-data-share-form">
    {% csrf_token %}
      {% for hidden in target_data_share_form.hidden_fields %}
        {{ hidden }}
      {% endfor %}
    <div class="card">
        <div class="card-header">
          Photometry Data
        </div>
        <table id="photData" class="table table-striped table-hover table-sm" cellspacing="0" width="100%">
            <thead>
                <tr><th><div class="form-check">
                    <input type="checkbox" class="form-check-input" id="share-all-phot" onclick="select_all_phot()" value=""/>
                    <label class="form-check-label" for="share-all-phot">Share</label>
                    </div></th>
                    <th>Timestamp</th>
                    <th>Telescope</th>
                    <th>Filter</th>
                    <th>Magnitude</th>
                    <th>Error</th>
                    <th>Source</th>
                </tr>
            </thead>
            <tbody>
            {% for datum in data %}
            <tr>
                <td><input type="checkbox" class="phot-row" id="phot-row-{{ datum.id }}" name="share-box" value="{{ datum.id }}" onchange="check_selected_phot()"></td>
                <td>{{ datum.timestamp }}</td>
                <td>{{ datum.telescope }}</td>
                <td>{{ datum.filter }}</td>
                <td>
                    <!-- prepend greater-than sign if this is a magnitude limit -->
                    {% if datum.limit %}>{% endif %}
                    {{ datum.magnitude|truncate_value_for_display }}
                </td>
                {% if datum.error %}
                    <td>{{ datum.error|truncate_value_for_display:5 }}</td>
                {% else %}
                    <td>{{ datum.magnitude_error|floatformat:4 }}</td>
                {% endif %}
                <td>{{ datum.source }}</td>
            </tr>
            {% empty %}
            <tr>
                <td colspan="2">No Photometry Data.</td>
            </tr>
            {% endfor %}
            </tbody>
        </table>
        {% if not target_share %}
            <div class="card">
                <div class="card-header">
                    Share Selected Data
                </div>
                {% if sharing_destinations %}
                    <div class="form-row" style="padding-inline:1rem">
                        <div class="col-sm-12">
                            {% bootstrap_field target_data_share_form.share_title %}
                        </div>
                    </div>
                    <div class="form-row" style="padding-inline:1rem">
                        <div class="col-sm-12">
                            {% bootstrap_field target_data_share_form.share_message %}
                        </div>
                    </div>
                    <div class="form-row" style="padding-inline:1rem">
                        <div class="col-sm-4">
                            {% bootstrap_field target_data_share_form.share_destination %}
                        </div>
                        <div class="col-sm-2 offset-sm-1">
                            <input type="submit" class="btn btn-primary" id="submit_selected_phot" value="Submit" name="share_targetdata_form" style="position:absolute; bottom:1rem" disabled onclick="setTargetOnPhotometryForm('')">
                        </div>
                        {% if hermes_sharing %}
                        <div class="col-sm-1">
                            <b style="position:absolute; bottom:1.2rem">or</b>
                        </div>
                        <div class="col-sm-4">
                            <button class="btn btn-info" type="submit" formaction="{% url 'tom_targets:hermes-preload' pk=target.id %}" onclick="setTargetOnPhotometryForm('_blank')" style="position:absolute; bottom:1rem">Open in Hermes &#x1F5D7;</button>
                        </div>
                        {% endif %}
                    </div>
                {% else %}
                    <em style="padding-inline:1rem">Not Configured. See
                        <a href="https://tom-toolkit.readthedocs.io/en/stable/managing_data/tom_direct_sharing.html"
                           target="_blank">Documentation</a>.</em>
                {% endif %}
            </div>
        {% endif %}
    </div>
</form>
<script>
  const photometryShareForm = document.getElementById('photometry-data-share-form');
  function setTargetOnPhotometryForm(val) {
      if (val && val != '') {
      photometryShareForm.setAttribute('target', val);
      }
      else{
      photometryShareForm.removeAttribute('target');
      }
      return true;
  };
  function select_all_phot()  {
  var share_all = document.getElementById("share-all-phot");
     if(share_all.checked == true){
        $('input[name=share-box][class=phot-row]').prop('checked', true);
     } else {
        $('input[name=share-box][class=phot-row]').prop('checked', false);
     }
     check_selected_phot()
  }
  function check_selected_phot()  {
  var share_boxes = document.querySelectorAll("[name='share-box'][class='phot-row']");
  var submit_btn = document.getElementById('submit_selected_phot');
    for (const box of share_boxes) {
        if(box.checked == true) {
            submit_btn.disabled = false;
            return;
        }
    }
    submit_btn.disabled = true;
  }
</script>
