Skip to content

Commit

Permalink
decluttered experiment overview (#206)
Browse files Browse the repository at this point in the history
  • Loading branch information
@bbonf
bbonf authored Apr 30, 2024
1 parent 80960b0 commit 4cd4fb1
Show file tree
Hide file tree
Showing 3 changed files with 158 additions and 156 deletions.
14 changes: 9 additions & 5 deletions lab/experiments/templates/experiments/detail.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
{% load static %}

{% block header_title %}
{% transformat 'experiments:detail:header' experiment.name %} - {{ block.super }}
{% transformat 'experiments:detail:header' experiment.name %} - {{ block.super }}
{% endblock %}

{% block pre-messages-content %}
Expand All @@ -18,8 +18,12 @@ <h1 class="h2">
{% endblock %}

{% block content %}
{% include 'experiments/detail_parts/info.html' %}

{% include 'experiments/detail_parts/participants.html' %}

<div class="uu-container" >
<div class="col-6">
{% include 'experiments/detail_parts/info.html' %}
</div>
<div class="col-12">
{% include 'experiments/detail_parts/participants.html' %}
</div>
</div>
{% endblock %}
222 changes: 110 additions & 112 deletions lab/experiments/templates/experiments/detail_parts/info.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,119 +5,117 @@
{% load static %}


<div class="uu-container">
<div class="row gx-3 w-100">
<div class="col-4">
<div class="p-2">
<h3 class="d-inline">
{% trans 'experiments:detail:progress' %}
</h3>
</div>
<div>
<table class="table table-striped mt-1">
<tbody>
<tr>
<td>{% trans 'experiments:detail:progress:target' %}</td>
<td>{{ progress.target }}</td>
</tr>
<tr>
<td>{% trans 'experiments:detail:progress:tested' %}</td>
<td>{{ progress.tested }}</td>
</tr>
<tr>
<td>{% trans 'experiments:detail:progress:planned' %}</td>
<td>{{ progress.planned }}</td>
</tr>
<tr>
<td>{% trans 'experiments:detail:progress:excluded' %}</td>
<td>{{ progress.excluded }}</td>
</tr>
</tbody>
<tbody class="table-group-divider">
<tr>
<td>{% trans 'experiments:detail:progress:to_plan' %}</td>
<td>{{ progress.to_plan }}</td>
</tr>
<tr>
<td>{% trans 'experiments:detail:progress:to_test' %}</td>
<td>{{ progress.to_test }}</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="col-4">
<div class="p-2">
<h3 class="d-inline">
{% trans 'experiments:detail:info' %}
</h3>
<a href="{% url 'experiments:update' experiment.pk %}?next={{ request.path }}">
{% trans 'experiments:detail:edit_info' %}
</a>
</div>
<div>
<table class="table table-striped mt-1">
<tr>
<td>
{% trans 'experiment:attribute:duration' %}
</td>
<td>
{{ experiment.duration }}
</td>
</tr>
<tr>
<td>
{% trans 'experiment:attribute:session_duration' %}
</td>
<td>
{{ experiment.session_duration }}
</td>
</tr>
<tr>
<td>
{% trans 'experiments:detail:info:task_description' %}
</td>
<td>
{{ experiment.task_description }}
</td>
</tr>
<tr>
<td>
{% trans 'experiments:detail:info:additional_instructions' %}
</td>
<td>
{{ experiment.additional_instructions }}
</td>
</tr>
<tr>
<td>
{% trans 'experiments:detail:info:location' %}
</td>
<td>
{{ experiment.location }}
</td>
</tr>
<tr>
<td>
{% trans 'experiments:detail:info:leader' %}
</td>
<td>
{{ experiment.leader_names }}
</td>
</tr>
</table>
</div>


<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<button class="nav-link active" data-bs-toggle="tab" data-bs-target="#progress">{% trans 'experiments:detail:progress' %}</button>
</li>
<li class="nav-item">
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#info">{% trans 'experiments:detail:info' %}</button>
</li>
<li class="nav-item">
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#criteria">{% trans 'experiments:detail:criteria' %}</button>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane fade show active" id="progress" role="tabpanel">
<table class="table table-striped mt-1">
<tbody>
<tr>
<td>{% trans 'experiments:detail:progress:target' %}</td>
<td>{{ progress.target }}</td>
</tr>
<tr>
<td>{% trans 'experiments:detail:progress:tested' %}</td>
<td>{{ progress.tested }}</td>
</tr>
<tr>
<td>{% trans 'experiments:detail:progress:planned' %}</td>
<td>{{ progress.planned }}</td>
</tr>
<tr>
<td>{% trans 'experiments:detail:progress:excluded' %}</td>
<td>{{ progress.excluded }}</td>
</tr>
</tbody>
<tbody class="table-group-divider">
<tr>
<td>{% trans 'experiments:detail:progress:to_plan' %}</td>
<td>{{ progress.to_plan }}</td>
</tr>
<tr>
<td>{% trans 'experiments:detail:progress:to_test' %}</td>
<td>{{ progress.to_test }}</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="info" role="tabpanel">
<table class="table table-striped mt-1">
<tr>
<td>
{% trans 'experiment:attribute:duration' %}
</td>
<td>
{{ experiment.duration }}
</td>
</tr>
<tr>
<td>
{% trans 'experiment:attribute:session_duration' %}
</td>
<td>
{{ experiment.session_duration }}
</td>
</tr>
<tr>
<td>
{% trans 'experiments:detail:info:task_description' %}
</td>
<td>
{{ experiment.task_description }}
</td>
</tr>
<tr>
<td>
{% trans 'experiments:detail:info:additional_instructions' %}
</td>
<td>
{{ experiment.additional_instructions }}
</td>
</tr>
<tr>
<td>
{% trans 'experiments:detail:info:location' %}
</td>
<td>
{{ experiment.location }}
</td>
</tr>
<tr>
<td>
{% trans 'experiments:detail:info:leader' %}
</td>
<td>
{{ experiment.leader_names }}
</td>
</tr>
</table>
<div class="p-2">
<h3 class="d-inline">
</h3>
<a class="btn btn-secondary" href="{% url 'experiments:update' experiment.pk %}?next={{ request.path }}">
{% trans 'experiments:detail:edit_info' %}
</a>
</div>
<div class="col-4">
<div class="p-2">
<h3 class="d-inline">
{% trans 'experiments:detail:criteria' %}
</h3>
<a href="{% url 'experiments:default_criteria' experiment.pk %}?next={{ request.path }}">
{% trans 'experiments:detail:edit_default_criteria' %}
</a>
</div>
{% include 'experiments/criteria_snippit.html' %}
</div>
<div class="tab-pane fade" id="criteria" role="tabpanel">
{% include 'experiments/criteria_snippit.html' %}
<div class="p-2">
<a class="btn btn-secondary" href="{% url 'experiments:default_criteria' experiment.pk %}?next={{ request.path }}">
{% trans 'experiments:detail:edit_default_criteria' %}
</a>
</div>
</div>
</div>
78 changes: 39 additions & 39 deletions lab/experiments/templates/experiments/detail_parts/participants.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,46 +4,46 @@
{% load get_field_name %}
{% load static %}

<div class="uu-inner-container">
<div class="col-12">
<div class="bg-primary p-2 mb-2">
<h3 class="d-inline">
{% trans 'experiments:detail:appointments' %}
</h3>
<a href="{% url 'experiments:participants' experiment.pk %}">
{% trans 'experiments:detail:view_participants' %}
</a>
</div>
<table class="w-100 dt_custom table">
<thead>
<tr>
<th class="w-50">
{% trans 'experiments:detail:participants:name' %}
</th>
<th class="w-25">
{% trans 'experiments:detail:participants:appointment' %}
</th>
<th class="w-25">
{% trans 'experiments:detail:participants:outcome' %}
</th>
</tr>
</thead>
{% for appointment in appointments %}
<tr>
<td>
{{ appointment.participant.name }}
</td>
<td data-order="{{ appointment.start|date:'U' }}">
{{ appointment.start|date:"l d M Y, H:i"|capfirst }}
</td>
<td>
{{ appointment.outcome|lower }}
</td>
</tr>
{% endfor %}
</table>
</div>


<div class="bg-primary p-2 mb-2 mt-2">
<h3 class="d-inline">
{% trans 'experiments:detail:appointments' %}
</h3>
<a href="{% url 'experiments:participants' experiment.pk %}">
{% trans 'experiments:detail:view_participants' %}
</a>
</div>
<table class="w-100 dt_custom table">
<thead>
<tr>
<th class="w-50">
{% trans 'experiments:detail:participants:name' %}
</th>
<th class="w-25">
{% trans 'experiments:detail:participants:appointment' %}
</th>
<th class="w-25">
{% trans 'experiments:detail:participants:outcome' %}
</th>
</tr>
</thead>
{% for appointment in appointments %}
<tr>
<td>
{{ appointment.participant.name }}
</td>
<td data-order="{{ appointment.start|date:'U' }}">
{{ appointment.start|date:"l d M Y, H:i"|capfirst }}
</td>
<td>
{{ appointment.outcome|lower }}
</td>
</tr>
{% endfor %}
</table>


<script>
$('.dt_custom').DataTable({
dom: 'tip',
Expand Down

0 comments on commit 4cd4fb1

Please sign in to comment.