{% 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 == 'two' %} 
      <h3>Choose computing resource</h3> 
      {% elif data.step == 'three' %}  
      <h3>Task details and confirm</h3>    
      {% endif %}

      <br/> -->

      {% if data.step != 'created' %}
      <div style="float:left; background:#ffffff; margin-left:10px; margin-right:10px; margin-top:0px; margin-bottom:20px">
          <h4>Software container</h4>
          <div class="row" style="padding:5px">
          {% include "components/container.html" with container=data.task_container disable_play_button=True %}
          </div>
      </div>
      {% endif %}
      

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

      <div style="width:300px; float:left; background:#ffffff; margin-left:10px; margin-right:10px; margin-top:0px; margin-bottom:0px">
          <h4>Computing resource</h4>
          <div class="row" style="padding:5px">
          {% for computing in data.computings %}
          {% include "components/computing.html" with container=data.task_container %}
          {% endfor %}
          </div>
      </div>


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


      <div style="width:300px; float:left; background:#ffffff; margin-left:10px; margin-right:10px; margin-top:0px; margin-bottom:0px">
          <h4>Computing resource</h4>
          <div class="row" style="padding:5px">
          {% include "components/computing.html" with computing=data.task_computing %}
          </div>
      </div>
          
          
          <!-- <div style="width:300px; float:left; border: #e0e0e0 solid 0px; margin:10px; background:#f8f8f8; margin-bottom:15px">
          <table style="width:100%; height:126px;  border: #e0e0e0 solid 1px; margin:0">

           <tr valign="top">
            <td><b>Computing</b></td><td>
              <select name="task_computing_uuid_RECAP" >
              <option value="">{{ data.task_computing.name}}</option>
              </select>
            </td>
           </tr>

          </table>
          </div> -->

      <div style="width:300px;  background:#ffffff; margin-left:10px; margin-right:10px; margin-top:10px; margin-bottom:0px">

          <h4>Details and confirm</h4>
          <div style="width:640px; float:left; border: #e0e0e0 solid 0px; margin:10px; ; margin-bottom:15px">
              
        
          <form action="/create_task/" method="POST">
          {% csrf_token %}
          <input type="hidden" name="task_container_uuid" value="{{data.task_container.uuid}}">
          <input type="hidden" name="step" value="{{ data.next_step }}" />
          <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; margin-bottom:20px">
           <tr><td colspan="2"></td></tr>

           <tr>
            <td valign="top"><b>Task name</b></td>
            <td><input type="text" name="task_name" value="" placeholder="" size="37" required /></td>
           </tr>
           
           <tr>
            <td valign="top"><b>Task&nbsp;password</b></td>
            <td>
            
             <input type="password" name="task_auth_password" placeholder="{{data.task_auth_token}}" size="37" /><br>
             <input type="hidden" name="task_auth_token" value="{{data.task_auth_token}}">

             <!-- <font size=-1>A one-time task password. By default set to a randomly generated token, and automatically handled by Rosetta. Can be also set to a custom one, which in this case will be required to be entered manually when connecting to the task (as it will not be stored by Rosetta). Six characters minimum.</font> -->
             <font size=-1>A one-time task password. By default set to a randomly generated token, and automatically handled by Rosetta. Six chars min.</font>

            </td>
           </tr>
           
           <!-- {% if data.task_computing.supports_custom_binds %}
           <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>For this computing resource, you can set extra FS binds on top of the ones already define by the administrators. 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>Container runtime</b></td><td>
              <select name="run_using" >
              <option value="default" selected>Default</option>
              <!-- <option value="docker" selected>default</option> -->
              <!-- <option value="singularity">Singularity</option> -->
              </select>
            </td>
           </tr>
           
           {% if data.task_computing.wms == '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.default_partition }}" placeholder="" size="20" /></td></tr>
             <tr><td>Cpus</td><td><input type="text" name="computing_cpus" value="{{ data.task_computing.conf.default_cpus }}" placeholder="" size="5" /></td></tr>
             <tr><td>Memory</td><td><input type="text" name="computing_memory" value="{{ data.task_computing.conf.default_memory }}" placeholder="" size="5" /></td></tr>
             </table>
            </td>
           </tr>
           {% endif %}
             
           <tr><td colspan=2>
           
           </td></tr>

          </table>
          
          
          {% if data.task_computing.default_container_runtime == 'singularity' and not data.task_container.supports_custom_interface_port %}
          <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 custom interface ports and the computing resource you selected might use a container runtime which does not support port mapping (Singularity). In this case, if the container interface port is already allocated, the task will fail to start.
          </p></div>
          {% endif %}
          
          <!-- {% if data.task_container.interface_port and not data.task_container.supports_interface_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 somehow built-in within the container, anyone will be able to access it.
          </p></div>
          {% endif %}  -->
         
          <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 storage, will be LOST upon task completition.
          </td><td  style="border: 1px solid lightgray;" >
          <input class="form-check-input" type="checkbox" value="" id="invalidCheck" required>
          </td></table>
          
          <div style="width:640px; text-align:center; padding:20px">
          <input type="submit" value="Create task">    
          </div>
          </form>
          </div>
      </div>


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

      {% endif %} 
  

      
    </div>
  </div>
</div>
      <br/>
      <br/>
      <br/>
      <br/>
      <br/>
      <br/>
{% include "footer.html" %}






