{% load static %} 
{% include "header.html" %}
{% include "navigation.html" with main_path='/main/' %}

<br/>
<br/>

<div class="container">
  <div class="dashboard">
    <div class="span8 offset2">
      <h1>New Task</h1> 
      <hr>

      {% if data.step == 'one' %}

          <h3>Step 1: name, container and computing.</h3> 
          
          <br/>
          
          <form action="/create_task/" method="POST">
          {% csrf_token %}
          <input type="hidden" name="step" value="one" />


          <table class="dashboard" style="max-width:700px">
          <tr><td colspan="2"></td></tr>

           <tr>
            <td><b>Task name </b></td>
            <td>
             <input type="text" name="task_name" value="" placeholder="" size="23" required />
            </td>
           </tr>

          <tr>
            <td><b>Task container</b></td><td>
              {% if data.task_container %}
              <select name="task_container_uuid">
              <option value="{{data.task_container.uuid}}" selected>{{data.task_container.name}} ({{data.task_container.type.title}})</option>
              </select>
              {% else %}
              <select name="task_container_uuid" >
              {% for container in data.containers %}
              <option value="{{container.uuid}}">{{container.name}} ({{container.type.title}})</option>
              {% endfor %}
              </select>
              {% endif %}
            </td>
           </tr>
           
           <tr>
            <td><b>Computing resource</b></td><td>
              <select name="task_computing_uuid" >
              {% for computing in data.computings %}}
              <option value="{{ computing.uuid }}">{{ computing.name}}</option>
              {% endfor %}
              </select>
            </td>
           </tr>

           <tr>
           <td colspan=2 align=center style="padding:20px">
           <input type="submit" value="Next">
           </td>
           </tr>
          </table>
          </form>

      {% elif data.step == 'two' %}

          <h3>Step 2: add authentication and computing details</h3> 

          <br/>
          <table class="dashboard" style="max-width:700px">
          <tr><td colspan="2"></td></tr>

           <tr>
            <td><b>Task name </b></td>
            <td>
             <input type="text" name="task_name_RECAP" value="{{ data.task_name }}" placeholder="" size="23" disabled />
            </td>
           </tr>

          <tr>
            <td><b>Task container</b></td><td>
              <select name="task_container_uuid_RECAP">
              <option value="" selected>{{data.task_container.name}} ({{data.task_container.type.title}})</option>
              </select>
            </td>
           </tr>
           
           <tr>
            <td><b>Computing resource</b></td><td>
              <select name="task_computing_uuid_RECAP" >
              <option value="">{{ data.task_computing.name}}</option>
              </select>
            </td>
           </tr>

          </table>
          
          <br>          
          {% if data.task_container.type == 'singularity' and not data.task_container.supports_dynamic_ports %}
          <div> <p style="font-size:15px; max-width:700px; margin-bottom:20px; margin-left:5px">
          <i class="fa fa-exclamation-triangle" style="color:orange"></i> This container does not support dynamic ports and you are running it with Singularity, without network insulation. This means that if the container port is already occupied, it will not be able to start.
          </p></div>
          {% endif %}
          
          {% if data.task_container.ports and not data.task_container.supports_pass_auth %}
          <div> <p style="font-size:15px; max-width:700px; margin-bottom:20px; margin-left:5px">
          <i class="fa fa-exclamation-triangle" style="color:orange"></i> This container does not support configuring any authentication. This means that unless it is built-in within the container, anyone running on the same network will be able to access it.
          </p></div>
          {% endif %}
        
          <form action="/create_task/" method="POST">
          {% csrf_token %}
          <input type="hidden" name="step" value="two" />
          <input type="hidden" name="task_name" value="{{ data.task_name }}" />
          <input type="hidden" name="task_container_uuid" value="{{ data.task_container.uuid }}" />
          <input type="hidden" name="task_computing_uuid" value="{{ data.task_computing.uuid }}" />

          <table class="dashboard" style="max-width:700px">
          <tr><td colspan="2"></td></tr>
           {% if data.task_container.supports_user_auth %}
           <tr>
            <td><b>Task user</b></td>
            <td>
             <input type="text" name="auth_user" value="" placeholder="" size="23" />
            </td>
           </tr>
           {% endif %}

           {% if data.task_container.supports_dynamic_ports and data.task_computing.type == 'remotehop' %}
           <tr>
            <td valign="top" style="width:180px"><b>Set custom port </b></td>
            <td>
             <input type="text" name="task_base_port" value="" placeholder="" size="23" style="margin-bottom:5px"/><br>
             <p style="line-height: 0.95"><font size=-1>This container supports dynamic ports and you can thus set a custom port (>5900) to avoid clashes with services already running on the computing resource.</font></p>
            </td>
           </tr>
           {% endif %}

           {% if data.task_container.supports_pass_auth %}
           <tr>
            <td valign="top"><b>Set task password</b></td>
            <td>
             <input type="password" name="auth_password" value="" placeholder="" size="23" /><br>
             <font size=-1>Use a non-sensitive password as it will be stored in plain text. 6 chars min.</font>
            </td>
           </tr>
           {% endif %}


           {% if data.task_container.type == 'singularity' %}
           <tr>
            <td valign="top" style="width:180px"><b>Extra binds</b></td>
            <td>
             <input type="text" name="extra_binds" value="" placeholder="" size="40" /><br>
             <p style="line-height: 0.95"><font size=-1>Here you can set extra binds on top of the ones already define by the administrator. Format is <i>host_directory:container_directory</i>, comma separated.</font></p>
            </td>
           </tr>
           {% endif %}

           <tr>
            <td><b>Access method</b></td><td>
              <select name="access_method" >
              <option value="https_proxy" disabled>HTTPS proxy</option>
              <option value="direct_tunnel" selected>Direct tunnel</option>
              <option value="None">None</option>
              </select>
            </td>
           </tr>

           <!-- <tr>
            <td><b>Run using</b></td><td>
              <select name="run_using" >
              <option value="docker" selected>Docker</option>
              <option value="singularity">Singularity</option>
              </select>
            </td>
           </tr>  -->
           
           {% if data.task_computing.type == 'slurm' %}
           <tr>
            <td><b>Computing options</b></td>
            <td>
            <table>
             <tr><td>Partition</td><td><input type="text" name="computing_partition" value="{{ data.task_computing.conf_params.default_partition }}" placeholder="" size="20" /></td></tr>
             <tr><td>Cpus</td><td><input type="text" name="computing_cpus" value="{{ data.task_computing.conf_params.default_cpus }}" placeholder="" size="5" /></td></tr>
             <tr><td>Memory</td><td><input type="text" name="computing_memory" value="{{ data.task_computing.conf_params.default_memory }}" placeholder="" size="5" /></td></tr>
             </table>
            </td>
           </tr>
           {% endif %}
             
           <tr><td colspan=2>
           <table><tr><td  style="border: 1px solid lightgray;" >
           I understand that files saved or modified in this container, if not explicitly saved to a persistent bind, will be LOST when the task ends.
           </td><td  style="border: 1px solid lightgray;" >
           <input class="form-check-input" type="checkbox" value="" id="invalidCheck" required>
           </td></table>
           </td></tr>
           <tr>
           <td colspan=2 align=center style="padding:20px">
           <input type="submit" value="Create">
           </td>
           </tr>
          </table>
          </form>


      {% else %}
        Ok, task created. Go back to your <a href="/tasks">task list</a>.
        

      {% endif %} 
  
      <br/>
      <br/>
      <br/>
      <br/>
      <br/>
      <br/>
      
    </div>
  </div>
</div>

{% include "footer.html" %}






