{#
#
# Licensed under the Apache License, Version 2.0 (the "License");
# you may not use this file except in compliance with the License.
# You may obtain a copy of the License at
#
# http://www.apache.org/licenses/LICENSE-2.0
#
# Unless required by applicable law or agreed to in writing, software
# distributed under the License is distributed on an "AS IS" BASIS,
# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
# See the License for the specific language governing permissions and
# limitations under the License.
#
#}
{% extends "airflow/dag.html" %}

{% block head_css %}
{{ super() }}
<link href="{{ admin_static.url(filename='vendor/bootstrap-daterangepicker/daterangepicker-bs2.css') }}" rel="stylesheet">
{% endblock %}

{% block body %}
  {{ super() }}
  <h4>
<form method="get" id="daform">
    <input name="_csrf_token" type="hidden" value="{{ csrf_token() }}">
    <div class="form-inline">
            <span style='color:#AAA;'>Task Instance: </span>
            <span>
              {{ task_id }}
              <input type="hidden" value="{{ dag.dag_id }}" name="dag_id">
            </span>
		    {{ form.execution_date(class_="form-control") | safe }}

    </div>
</form>
  </h4>
  <ul class="nav nav-pills">
    <li><a href="{{ url_for("airflow.task", dag_id=dag.dag_id, task_id=task_id, execution_date=execution_date) }}">
        <span class="glyphicon glyphicon-certificate" aria-hidden="true"></span>
      Task Instance Details</a></li>
    <li><a href="{{ url_for("airflow.rendered", dag_id=dag.dag_id, task_id=task_id, execution_date=execution_date) }}">
        <span class="glyphicon glyphicon-certificate" aria-hidden="true"></span>
      Rendered Template</a></li>
    <li><a href="{{ url_for("airflow.log", dag_id=dag.dag_id, task_id=task_id, execution_date=execution_date) }}">
        <span class="glyphicon glyphicon-certificate" aria-hidden="true"></span>
      Log</a></li>
    <li><a href="{{ url_for("airflow.xcom", dag_id=dag.dag_id, task_id=task_id, execution_date=execution_date) }}">
        <span class="glyphicon glyphicon-certificate" aria-hidden="true"></span>
      XCom</a></li>
  </ul>
  <hr>
{% endblock %}
{% block tail %}
  {{ super() }}
  <script src="{{ admin_static.url(filename='vendor/bootstrap-daterangepicker/daterangepicker.js') }}"></script>
  <script src="{{ admin_static.url(filename='admin/js/form-1.0.0.js') }}"></script>
  <script>
    $( document ).ready(function() {
      function date_change(){
          execution_date = $("input#execution_date").val().replace(' ', 'T');
          loc = decodeURIComponent(window.location.href);
          loc = loc.replace('{{ execution_date }}', execution_date);
          window.location = loc;
      }
      $("input#execution_date").on("change.daterangepicker", function(){
          date_change();
      });
      $("input#execution_date").on("apply.daterangepicker", function(){
          date_change();
      });
    });
  </script>
{% endblock %}
