bootstrap layout

atdb/taskdatabase/models.py

@@ -13,7 +13,7 @@ class Workflow(models.Model):
     path = models.CharField(max_length=100, blank=True, null=True)
 
     def __str__(self):
-        return str(self.workflow_uri)
+        return str(self.id)
 
 
 class Task(models.Model):

atdb/taskdatabase/templates/tables2/base.html

@@ -39,12 +39,12 @@
                     ATDB-LDV</a>
                 </li>
                 <li><a class="nav-link" href="{% url 'index' %}">Tasks</a></li>
-                <li><a class="nav-link" href="{% url 'tables2' %}">Alternative</a></li>
-                <li><a class="nav-link" href="https://git.astron.nl/astron-sdc/atdb-ldv/-/raw/master/atdb/docs/ATDB-LDV%20Workflow%20Diagram.png">State Diagram</a></li>
-
+                <li><a class="nav-link" href="{% url 'tables2' %}">Query</a></li>
+                <li><a class="nav-link" href="{% url 'diagram' %}">State Diagram</a></li>
+                <li><a class="nav-link" href="{% url 'admin:index' %}">Admin</a></li>
             </ul>
         </div>
-        {% include 'taskdatabase/search.html' %}
+        {% include 'taskdatabase/filter/search.html' %}
 
     </nav>
 

atdb/taskdatabase/templates/taskdatabase/base.html

@@ -13,18 +13,16 @@
     <title>{% block myBlockTitle %}ATDB-LDV{% endblock %}</title>
 
     <!-- loads the path to static files -->
-    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
-
-    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
+    <script src="https://code.jquery.com/jquery-3.3.1.min.js"  crossorigin="anonymous"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
 
-    <link rel="stylesheet" type="text/css" href="{% static 'taskdatabase/style.css' %}"/>
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
     <link href='https://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'>
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.2/css/all.css" integrity="sha384-/rXc/GQVaYpyDdyxK+ecHPVYJSN9bmVFBvjA/9eOB+pb3F2w2N6fc5qB9Ew5yIns" crossorigin="anonymous">
-
     <link href="{% static 'fontawesome_free/css/all.min.css' %}" rel="stylesheet" type="text/css">
 
+    <link rel="stylesheet" type="text/css" href="{% static 'taskdatabase/style.css' %}"/>
     <link rel="icon" href="{% static 'favicon.ico' %}">
 
     {% block extra_js %}{% endblock %}
@@ -41,12 +39,16 @@
                     ATDB-LDV</a>
                 </li>
                 <li><a class="nav-link" href="{% url 'index' %}">Tasks</a></li>
-                <li><a class="nav-link" href="{% url 'tables2' %}">Alternative</a></li>
-                <li><a class="nav-link" href="https://git.astron.nl/astron-sdc/atdb-ldv/-/raw/master/atdb/docs/ATDB-LDV%20Workflow%20Diagram.png">State Diagram</a></li>
+                <li><a class="nav-link" href="{% url 'tables2' %}">Query</a></li>
+                <li><a class="nav-link" href="{% url 'diagram' %}">State Diagram</a></li>
+                <li><a class="nav-link" href="{% url 'admin:index' %}">Admin</a></li>
+
 
             </ul>
+
         </div>
-        {% include 'taskdatabase/search.html' %}
+        User: {{ user.get_username }}
+        {% include 'taskdatabase/filter/search.html' %}
 
     </nav>
 

atdb/taskdatabase/templates/taskdatabase/diagram.html

+{% extends 'taskdatabase/base.html' %}
+{% load static %}
+
+{% block myBlock %}
+
+<div class="embed-responsive embed-responsive-21by9">
+  <iframe class="embed-responsive-item" src="{% static 'taskdatabase/ATDB-LDV Workflow Diagram.png' %}" allowfullscreen></iframe>
+</div>
+<p class="footer"> Version 1.0.0 (2 mar 2021 - 17:00)
+
+{% endblock %}
+

atdb/taskdatabase/templates/taskdatabase/index.html

@@ -5,7 +5,7 @@
 
 <div class="container-fluid details-container">
 
-    {% include 'taskdatabase/filter_buttons.html' %}
+    {% include 'taskdatabase/filter/filter_buttons.html' %}
     &nbsp;
     <div class="row">
     <div class="col-sm-12 col-md-12 col-lg-12">
@@ -26,7 +26,7 @@
                         <th>Status</th>
                         <th>Project</th>
                         <th>SAS_ID</th>
-                        <th width="15%">Workflow</th>
+                        <th>Workflow</th>
                         <th>Created</th>
 
                         <th>size-to-process</th>
@@ -43,13 +43,13 @@
 
             </div>
         </div>
-
+        {% include 'taskdatabase/pagination.html' %}
        </div>
     </div>
-    {% include 'taskdatabase/pagination.html' %}
+    <p class="footer"> Version 1.0.0 (3 mar 2021 - 08:00)
+
 </div>
 
-<p class="footer"> Version 1.0.0 (2 mar 2021 - 17:00)
 
 
 <script type="text/javascript">
@@ -85,5 +85,8 @@ function writeToLocalStorage(id) {
 }
 </script>
 
+{% include "taskdatabase/workflow/workflow_modal_script.html" %}
+{% include "taskdatabase/workflow/workflow_modal.html" %}
+
 {% endblock %}
 

atdb/taskdatabase/templates/taskdatabase/tasks.html

@@ -4,7 +4,6 @@
     <div class="row">
         <tr class="{{ task.status }}">
 
-
             <td>
                 <a href="{{ task.get_absolute_url }}" target="_blank">{{ task.id }} </a>
             </td>
@@ -12,7 +11,6 @@
                <a href="{% url 'task-change-priority' task.pk '-10' my_tasks.number %}" class="btn btn-primary btn-sm" role="button">-10</a>
                 {{ task.priority }}
                 <a href="{% url 'task-change-priority' task.pk '10' my_tasks.number %}" class="btn btn-primary btn-sm" role="button">+10</a>
-
             </td>
 
             {% if task.resume  %}
@@ -23,39 +21,44 @@
 
             {% if not task.resume  %}
                 <td>
-                   <a href="{% url 'task-hold-resume' task.pk 'resume' my_tasks.number %}" class="btn btn-success btn-sm" role="button"><i class="fas fa-play"></i> resume</a>
+                   <a href="{% url 'task-hold-resume' task.pk 'resume' my_tasks.number %}" class="btn btn-success btn-sm" role="button"><i class="fas fa-play"></i> start</a>
                 </td>
             {% endif %}
 
-            <td>{{ task.status }}</td>
+            <td class="bigger">{{ task.status }}</td>
 
             <td>{{ task.project }}</td>
             <td>{{ task.sas_id }}</td>
 
-            <td>{{ task.workflow }}
+            <td><a class="open-workflow btn btn-secondary btn-sm"
+                   href="{% url 'workflow-details' task.workflow %}"
+                   data-popup-url="{% url 'workflow-details' task.workflow %}"
+                   target="_blank"> {{ task.workflow }}
+                </a>
 
             <td>{{ task.creationTime|date:"Y-m-d H:i:s" }} </td>
             <td>{{ task.size_to_process|filesizeformat }} </td>
             </td>
 
             <td>
-                {% if task.status == "defining" %}
-                    <a href="{% url 'task-setstatus-view' task.pk 'defined' my_tasks.number %}" class="btn btn-success btn-sm" role="button">Stage</a>
-                {% endif %}
-
-                {% if task.status != "defining" %}
-                    <a href="{% url 'task-setstatus-view' task.pk 'defining' my_tasks.number %}" class="btn btn-warning btn-sm" role="button">Reset</a>
-                {% endif %}
+                {% if user.is_authenticated %}
+                    {% if task.status == "defining" %}
+                        <a href="{% url 'task-setstatus-view' task.pk 'defined' my_tasks.number %}" class="btn btn-success btn-sm" role="button">Stage</a>
+                    {% endif %}
 
-                <a href="{% url 'task-setstatus-view' task.pk 'staged' my_tasks.number %}" class="btn btn-primary btn-sm" role="button">staged</a>
-                <a href="{% url 'task-setstatus-view' task.pk 'processed' my_tasks.number %}" class="btn btn-primary btn-sm" role="button">processed</a>
-                <a href="{% url 'task-setstatus-view' task.pk 'validated' my_tasks.number %}" class="btn btn-primary btn-sm" role="button">validated</a>
-                <a href="{% url 'task-setstatus-view' task.pk 'scrubbed' my_tasks.number %}" class="btn btn-primary btn-sm" role="button">scrubbed</a>
-                <a href="{% url 'task-setstatus-view' task.pk 'archived' my_tasks.number %}" class="btn btn-primary btn-sm" role="button">archived</a>
-                <a href="{% url 'task-setstatus-view' task.pk 'finished' my_tasks.number %}" class="btn btn-primary btn-sm" role="button">finished</a>
+                    {% if task.status != "defining" %}
+                        <a href="{% url 'task-setstatus-view' task.pk 'defining' my_tasks.number %}" class="btn btn-warning btn-sm" role="button"><i class="fas fa-undo"></i> Reset</a>
+                    {% endif %}
 
+                    <a href="{% url 'task-setstatus-view' task.pk 'staged' my_tasks.number %}" class="btn btn-secondary btn-sm" role="button"></i> staged</a>
+                    <a href="{% url 'task-setstatus-view' task.pk 'processed' my_tasks.number %}" class="btn btn-secondary btn-sm" role="button">processed</a>
+                    <a href="{% url 'task-setstatus-view' task.pk 'validated' my_tasks.number %}" class="btn btn-secondary btn-sm" role="button">validated</a>
+                    <a href="{% url 'task-setstatus-view' task.pk 'scrubbed' my_tasks.number %}" class="btn btn-secondary btn-sm" role="button">scrubbed</a>
+                    <a href="{% url 'task-setstatus-view' task.pk 'archived' my_tasks.number %}" class="btn btn-secondary btn-sm" role="button">archived</a>
+                    <a href="{% url 'task-setstatus-view' task.pk 'finished' my_tasks.number %}" class="btn btn-secondary btn-sm" role="button">finished</a>
+                    {% endif %}
                 {% if task.status == "processed" %}
-                    <a href="{% url 'task-setstatus-view' task.pk 'validated' my_tasks.number %}" class="btn btn-success btn-sm" role="button">Validate</a>
+                    <a href="{% url 'task-setstatus-view' task.pk 'validated' my_tasks.number %}" class="btn btn-success btn-sm" role="button"><i class="fas fa-check"></i> Validate</a>
                 {% endif %}
 
             </td>
@@ -64,3 +67,5 @@
     {% endif %}
 {% endfor %}
 
+{% include "taskdatabase/workflow/workflow_modal_script.html" %}
+{% include "taskdatabase/workflow/workflow_modal.html" %}
\ No newline at end of file

atdb/taskdatabase/templates/taskdatabase/workflow/workflow_details.html

+
+{% load static %}
+{% block myBlock %}
+
+
+<div class="card">
+ <div class="card-body">
+     <h3>Workflow: {{ workflow.workflow_uri }}</h3>
+       <table class="table table-striped">
+           <tbody>
+            <tr><td><b>id</b></td><td><a href="{% url 'workflow-detail-view-api' workflow.pk %}" target="_blank">{{ workflow.id }} </a></td></tr>
+            <tr><td><b>uri</b></td><td>{{ workflow.workflow_uri }}</td></tr>
+            <tr><td><b>repository</b></td><td>{{ workflow.repository }}</td></tr>
+            <tr><td><b>commit_id</b></td><td>{{ workflow.commit_id }}</td></tr>
+            <tr><td><b>path</b></td><td>{{ workflow.path }}</td></tr>
+            <tr>
+                <td><b>workflows list</b></td><td><a href="{% url 'workflows' %}" class="btn btn-secondary btn-sm" role="button">REST API</a></td>
+            </tr>
+           </tbody>
+       </table>
+ </div>
+</div>
+
+{% endblock %}
\ No newline at end of file

atdb/taskdatabase/templates/taskdatabase/workflow/workflow_modal.html

+
+<div id="popup" class="modal fade" role="dialog">
+  <div class="modal-dialog modal-lg">
+    <div class="modal-content">
+      <div class="modal-body"></div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-info" data-dismiss="modal">Close
+        </button>
+      </div>
+    </div>
+  </div>
+</div>
\ No newline at end of file

atdb/taskdatabase/templates/taskdatabase/workflow/workflow_modal_script.html

+<!-- To place above the workflow-modal html -->
+<script>
+  $(document).on("click", ".open-workflow", function (e) {
+    e.preventDefault();
+    var $popup = $("#popup");
+    var popup_url = $(this).data("popup-url");
+    $(".modal-body", $popup).load(popup_url, function () {
+      $popup.modal("show");
+    });
+  });
+</script>
\ No newline at end of file

atdb/taskdatabase/urls.py

@@ -13,12 +13,15 @@ urlpatterns = [
     path('tables2basic/', views.TaskTables2View.as_view(), name='tasktables2'),
     path('tables2/', views.FilteredTaskListView.as_view(), name='tables2'),
 
+    path('diagram/', views.DiagramView.as_view(), name='diagram'),
+
     # --- REST API ---
     path('tasks/', views.TaskListViewAPI.as_view()),
     path('tasks/<int:pk>/', views.TaskDetailsViewAPI.as_view(), name='task-detail-view-api'),
 
-    path('workflows/', views.WorkflowListViewAPI.as_view()),
+    path('workflows/', views.WorkflowListViewAPI.as_view(), name='workflows'),
     path('workflows/<int:pk>/', views.WorkflowDetailsViewAPI.as_view(), name='workflow-detail-view-api'),
+    path('workflow_details/<uri>/', views.WorkflowDetails, name='workflow-details'),
 
     path('logentries/', views.LogEntryListViewAPI.as_view()),
     path('logentries/<int:pk>/', views.LogEntryDetailsViewAPI.as_view(), name='logentry-detail-view-api'),

atdb/taskdatabase/views.py

@@ -98,6 +98,12 @@ class FilteredTaskListView(SingleTableMixin, FilterView):
     template_name = "tables2/index.html"
     filterset_class = TaskFilterGUI
 
+
+class DiagramView(ListView):
+    model = Task
+    template_name = "taskdatabase/diagram.html"
+
+
 # ---------- GUI Views -----------
 
 class IndexView(ListView):
@@ -228,6 +234,11 @@ class WorkflowDetailsViewAPI(generics.RetrieveUpdateDestroyAPIView):
     serializer_class = WorkflowSerializer
 
 
+def WorkflowDetails(request, uri):
+    workflow = Workflow.objects.get(id=uri)
+    return render(request, "taskdatabase/workflow/workflow_details.html", {'workflow': workflow})
+
+
 # example: /atdb/logentries/
 class LogEntryListViewAPI(generics.ListCreateAPIView):
     model = LogEntry