switch case form to crispy and start using bootstrap nav

This commit is contained in:
Ross
2024-12-23 10:09:08 +00:00
parent 55507d215c
commit 1fdb4c9159
12 changed files with 346 additions and 122 deletions
+30 -2
View File
@@ -48,6 +48,8 @@ from generic.models import Examination#, Sign
from django.contrib.admin.widgets import FilteredSelectMultiple
from django.forms.widgets import RadioSelect, TextInput, Textarea, Select
from crispy_forms.layout import Submit, Layout, Fieldset, Field, Div
from crispy_forms.bootstrap import Accordion, AccordionGroup
from tinymce.widgets import TinyMCE
@@ -304,8 +306,6 @@ class CaseForm(ModelForm):
js = ["jsi18n.js", "tesseract.min.js", "js/upload_form_helpers.js"]
def __init__(self, *args, **kwargs):
logging.info("LOG")
logging.debug(kwargs)
self.user = kwargs.pop(
"user"
) # To get request.user. Do not use kwargs.pop('user', None) due to potential security hole
@@ -340,6 +340,34 @@ class CaseForm(ModelForm):
case_queryset = get_cases_available_to_user(self.user)
self.fields["previous_case"].queryset=case_queryset
self.helper = FormHelper()
self.helper.form_id = "id-case-form"
self.helper.form_class = "case-form"
self.helper.form_method = "post"
self.helper.form_action = "submit"
self.helper.form_tag = False
self.helper.layout = Layout(
Fieldset(
"Case details",
"title",
"subspecialty",
"description",
"history",
"presentation",
"discussion",
"condition",
"pathological_process",
"report",
"open_access",
"previous_case",
"diagnostic_certainty",
),
)
def get_queryset(self, request):
return (
super()
+76 -12
View File
@@ -5,19 +5,83 @@
{% endblock %}
{% block navigation %}
Atlas:
{% if request.user.is_authenticated %}
<a href="{% url 'atlas:collection_view' %}">Collections</a> /
<a href="{% url 'atlas:case_view' %}">Cases</a> /
<a href="{% url 'atlas:series_view' %}">Series</a> /
<a href="{% url 'atlas:categories_list' %}">Categories</a> /
{% comment %} <a href="{% url 'atlas:resource_view' %}">Resources</a> / {% endcomment %}
<a href="{% url 'atlas:case_create' %}" title="Create a new atlas case">Create Case</a> /
<a href="{% url 'atlas:series_create' %}" title="Create a new image series">Create Series</a> /
<a href="{% url 'atlas:resource_view' %}" title="Resources">Resources</a> /
<a href="{% url 'atlas:user_uploads' %}" title="View unimported uploads">Uploads</a> /
<a href="{% url 'atlas:question_schema_overview' %}" title="View and edit question schemas">Question Schemas</a> /
<a href="{% url 'atlas:help' %}" title="View the atlas help pages">Help</a>
<nav class="navbar navbar-expand-lg navbar-dark submenu">
<div class="container-fluid">
<a class="navbar-brand" href="{% url 'atlas:index' %}">Atlas</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item dropdown">
<a class="nav-link d-inline" href="{% url 'atlas:collection_view' %}">Collections</a>
<a class="nav-link d-inline dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false">
<span class="visually-hidden">Toggle Dropdown</span>
</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="{% url 'atlas:user_collections' %}">Collections to view / take</a>
</li>
<li><hr class="dropdown-divider"></li>
<li>
<a class="dropdown-item" href="{% url 'atlas:collection_view' %}">Manage Collections</a>
</li>
<li>
<a class="dropdown-item" href="{% url 'atlas:exam_create' %}">Create collection</a>
</li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link d-inline" href="{% url 'atlas:case_view' %}">Cases</a>
<a class="nav-link d-inline dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false">
<span class="visually-hidden">Toggle Dropdown</span>
</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="{% url 'atlas:case_view' %}">Manage Cases</a>
</li>
<li>
<a class="dropdown-item" href="{% url 'atlas:case_create' %}">Create Case</a>
</li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link d-inline" href="{% url 'atlas:series_view' %}">Series</a>
<a class="nav-link d-inline dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false">
<span class="visually-hidden">Toggle Dropdown</span>
</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="{% url 'atlas:series_view' %}">Manage Series</a>
</li>
<li>
<a class="dropdown-item" href="{% url 'atlas:series_create' %}">Create Series</a>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'atlas:categories_list' %}">Categories</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'atlas:resource_view' %}" title="Resources">Resources</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'atlas:user_uploads' %}" title="View unimported uploads">Uploads</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'atlas:question_schema_overview' %}" title="View and edit question schemas">Question Schemas</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'atlas:help' %}" title="View the atlas help pages">Help</a>
</li>
</ul>
</div>
</div>
</nav>
{% endif %}
{% comment %} </br>
Questions by:
+23 -1
View File
@@ -1,4 +1,24 @@
<div class="atlas {% if case.scrapped %}atlas-scrapped{% endif %}">
<h2>Case: {{ case.title }}</h2>
{% if case.previous_case or case.next_case %}
<div class="alert alert-info" role="alert">
This case is part of a series.<br/>
<div class="row">
{% if case.previous_case %}
<div class="col-sm-6 mb-3 mb-sm-0">
<h5 class="card-title">Previous Case</h5>
{{ case.previous_case.get_link }}
</div>
{% endif %}
{% if case.next_case %}
<div class="col-sm-6">
<h5 class="card-title">Next Case</h5>
{{ case.next_case.get_link }}
</div>
{% endif %}
</div>
</div>
{% endif %}
<div><a href="/ohif/viewer/dicomjson?url=https://www.penracourses.org.uk{% url 'atlas:case_dicom_json' case.pk %}">View case in OHIF</a> <a target="_blank" href="/ohif/viewer/dicomjson?url=https://www.penracourses.org.uk{% url 'atlas:case_dicom_json' case.pk %}">(new tab)</a>
<div class="date">
@@ -7,7 +27,6 @@
<div class="id">
ID: {{ case.id }}
</div>
<p class="pre-whitespace"><b>Title:</b> {{ case.title }}</p>
<p class="pre-whitespace"><b>Description:</b> {{ case.description }}</p>
@@ -176,6 +195,9 @@
{% endfor %}
</ul>
</p>
<p class="pre-whitespace"><b>Previous case:</b> {{ case.previous_case.get_link }}</p>
<p class="pre-whitespace"><b>Next case:</b> {{ case.next_case.get_link }}</p>
<div>
+36 -30
View File
@@ -1,6 +1,7 @@
{% extends "atlas/base.html" %}
<!-- {% load static from static %} -->
{% load crispy_forms_tags %}
{% block css %}
{% endblock %}
{% block js %}
@@ -59,6 +60,8 @@
{% include "atlas/question_link_header.html" %}
{% endif %}
<h2>Submit Case</h2>
<details>
<summary>Instructions</summary>
@@ -68,74 +71,77 @@
</details>
{% if form.collection %}
<div class="alert alert-info" role="alert">Creating a case in the collection: <a href="{% url 'atlas:collection_detail' pk=form.collection.pk %}">{{form.collection.name}}</a></div>
<div class="alert alert-info" role="alert">Creating a case in the collection: <a href="{% url 'atlas:collection_detail' pk=form.collection.pk %}">{{form.collection.name}}</a></div>
{% endif %}
<form class="highlight" action="" method="post" enctype="multipart/form-data" id="atlas-form">
{% csrf_token %}
{% crispy form form.helper %}
{% comment %} {% crispy series_formset %} {% endcomment %}
{% comment %} {{ form }} {% endcomment %}
{{ form }}
<h3>Series:</h3>
Add image sets here. These can only be added once created (they can also be added to cases on creation).
<input type="button" value="Add More Series" id="add_more_series">
<div id="series_formset" class="list_formset">
<ol>
{% for form in series_formset %}
<li class="no-error series-formset">
{{form.non_field_errors}}
{{form.errors}}
{{ form }}
</li>
{% endfor %}
{% for form in series_formset %}
<li class="no-error series-formset">
{{form.non_field_errors}}
{{form.errors}}
{{ form | crispy}}
</li>
{% endfor %}
</ol>
</div>
{{ series_formset.management_form }}
{{ series_formset.management_form | crispy }}
<h3>Differential:</h3>
Add differential here.
<input type="button" value="Add Another Differential" id="add_more_differential">
<div id="casedifferential_formset" class="list_formset">
<ol>
{% for form in casedifferential_formset %}
<li class="no-error casedifferential_formset">
{{form.non_field_errors}}
{{form.errors}}
{{ form }}
</li>
{% endfor %}
{% for form in casedifferential_formset %}
<li class="no-error casedifferential_formset">
{{form.non_field_errors}}
{{form.errors}}
{{ form | crispy}}
</li>
{% endfor %}
</ol>
</div>
{{ casedifferential_formset.management_form }}
{{ casedifferential_formset.management_form | crispy }}
<h3>Resource:</h3>
Add resource here. Resource can be anything that is useful for the case (videos, pdf, etc). This can either be avalaible before attempting the case (such a for a pre reading list) or after.
<input type="button" value="Add Another Resource" id="add_more_resource">
<div id="caseresource_formset" class="list_formset">
<ol>
{% for form in caseresource_formset %}
<li class="no-error caseresource_formset">
{{form.non_field_errors}}
{{form.errors}}
{{ form }}
</li>
{% endfor %}
{% for form in caseresource_formset %}
<li class="no-error caseresource_formset">
{{form.non_field_errors}}
{{form.errors}}
{{ form | crispy}}
</li>
{% endfor %}
</ol>
</div>
{{ caseresource_formset.management_form }}
{{ caseresource_formset.management_form | crispy}}
<br/>
<input type="submit" class="submit-button" value="Submit" name="submit">
</form>
<div id="empty_series_form" style="display:none">
<li class='no_error series-formset'>
{{ series_formset.empty_form }}
{{ series_formset.empty_form | crispy}}
</li>
</div>
<div id="empty_casedifferential_form" style="display:none">
<li class='no_error casedifferential_formset'>
{{ casedifferential_formset.empty_form }}
{{ casedifferential_formset.empty_form | crispy}}
</li>
</div>
<div id="empty_caseresource_form" style="display:none">
<li class='no_error caseresource_formset'>
{{ caseresource_formset.empty_form }}
{{ caseresource_formset.empty_form | crispy}}
</li>
</div>
{% endblock %}
+27
View File
@@ -0,0 +1,27 @@
{% extends 'atlas/base.html' %}
{% load render_table from django_tables2 %}
{% block css %}
{% endblock %}
{% block content %}
<div class="container-fluid">
<h2>My Cases</h2>
<details>
<summary>
<h4>Filter</h4>
</summary>
<div id="view-filter-options">
<form action="" method="get">
{{ filter.form }}
<input class="btn btn-primary btn-sm mt-1 mb-1" type="submit" />
</form>
</div>
View my <a href='{% url "atlas:case_view" %}?author={{request.user.id}}'>cases</a>.
</details>
{% render_table table %}
</div>
<div id="exam-options"></div>
{% endblock %}
@@ -1,7 +1,6 @@
{% extends 'atlas/base.html' %}
{% block content %}
<a href="{% url 'atlas:exam_create' %}">Create collection</a>
<ul>
{% for collection in collections %}
<li><a href='{{collection.get_absolute_url}}'>{{collection.name}}</a></li>
+27
View File
@@ -0,0 +1,27 @@
{% extends 'atlas/base.html' %}
{% load render_table from django_tables2 %}
{% block css %}
{% endblock %}
{% block content %}
<div class="container-fluid">
<h2>My Series</h2>
<details>
<summary>
<h4>Filter</h4>
</summary>
<div id="view-filter-options">
<form action="" method="get">
{{ filter.form }}
<input class="btn btn-primary btn-sm mt-1 mb-1" type="submit" />
</form>
</div>
View my <a href='{% url "atlas:case_view" %}?author={{request.user.id}}'>cases</a>.
</details>
{% render_table table %}
</div>
<div id="exam-options"></div>
{% endblock %}
-4
View File
@@ -7,10 +7,6 @@
{% block content %}
<div class="container-fluid">
Create a new <a href='{{request.path}}create'>collection</a> / <a href="{% url 'atlas:user_collections' %}">Collections to view / take</a>
<h2>My Collections</h2>
<details>
<summary>
+2 -2
View File
@@ -1182,7 +1182,7 @@ def get_examination_id(request):
class CaseView(LoginRequiredMixin, SingleTableMixin, FilterView):
model = Case
table_class = CaseTable
template_name = "atlas/view.html"
template_name = "atlas/case_view.html"
filterset_class = CaseFilter
@@ -1190,7 +1190,7 @@ class CaseView(LoginRequiredMixin, SingleTableMixin, FilterView):
class SeriesView(LoginRequiredMixin, SingleTableMixin, FilterView):
model = Series
table_class = SeriesTable
template_name = "atlas/view.html"
template_name = "atlas/series_view.html"
filterset_class = SeriesFilter
+17 -15
View File
@@ -142,18 +142,6 @@ button a {
color: inherit;
}
.main-nav-header {
/* max-width: 50%; */
float: right;
}
.main-nav-header span {
float: right;
padding-left: 10px;
}
.top-bar-link {}
.marking-list pre {
display: inline;
white-space: pre-wrap;
@@ -1114,7 +1102,7 @@ tr:has(> td > a) {
#logout-form {
display: inline;
}
#logout-form button {
/* #logout-form button {
background: none;
border: none;
cursor: pointer;
@@ -1122,7 +1110,7 @@ tr:has(> td > a) {
text-decoration: underline;
color: #3282b8;
}
*/
.resource-block {
max-width: fit-content;
}
@@ -1317,4 +1305,18 @@ details.help-text > summary {
.accordion-button {
background-color: darkgray;
}
}
.navbar {
padding: 0px;
}
.navbar .nav-link {
padding: 0px;
}
.navbar .navbar-brand {
padding-top: 1px;
padding-bottom: 1px;
}
+33 -10
View File
@@ -5,16 +5,39 @@
{% endblock %}
{% block navigation %}
Sbas:
{% if request.user.is_authenticated %}
<a href="{% url 'sbas:exam_list' %}">Exams</a> /
<a href="{% url 'sbas:exam_create' %}" title="Create a new exam">Create Exam</a> /
<a href="{% url 'sbas:question_view' %}">Questions</a> /
<a href="{% url 'sbas:question_create' %}" title="Create a new question">Create Question</a>
{% if request.user.is_superuser %}
/ <a href="{% url 'sbas:user_answer_table_view' %}" title="User answers">Answers</a>
{% endif %}
{% endif %}
<nav class="navbar navbar-expand-lg navbar-dark submenu">
<div class="container-fluid">
<a class="navbar-brand" href="{% url 'sbas:index' %}">SBAs</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse">
<ul class="navbar-nav">
{% if request.user.is_authenticated %}
<li class="nav-item">
<a class="nav-link" href="{% url 'sbas:exam_list' %}"><i class="bi bi-mortarboard"></i> Exams</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'sbas:question_view' %}"><i class="bi bi-question-circle"></i> Questions</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#" role="button" aria-expanded="false"><i class="bi bi-file-earmark-plus"></i> Create</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="{% url 'sbas:exam_create' %}" title="Create a new exam"><i class="bi bi-mortarboard"></i> Exam</a></li>
<li><a class="dropdown-item" href="{% url 'sbas:question_create' %}" title="Create a new question"><i class="bi bi-question-circle"></i> Question</a></li>
</ul>
</li>
{% if request.user.is_superuser %}
<li class="nav-item">
<a class="nav-link" href="{% url 'sbas:user_answer_table_view' %}" title="User answers">Answers</a>
</li>
{% endif %}
{% endif %}
</ul>
</div>
</div>
</nav>
{% endblock %}
{% block content %}
{% endblock %}
+75 -45
View File
@@ -73,57 +73,87 @@
{% endblock %}
<link rel="stylesheet" href="{% static 'css/anatomy.css' %}">
<link rel="stylesheet" href="{% static 'css/forms.css' %}">
<style>
.dropdown-menu {
background-color: rgb(28, 25, 25)
}
.dropdown-item {
color: lightblue;
}
</style>
{% block css %}
{% endblock %}
</head>
<body hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'>
<div class="main-nav-header">
{% if request.user.is_authenticated %}
<span id="logout-link" class="top-bar-link">
<form id="logout-form" method="post" action="{% url 'logout' %}">
{% csrf_token %}
<button type="submit">Log out</button>
</form>
{% comment %} <a href="{% url 'logout' %}">Logout</a> {% endcomment %}
</span>
<span id="profile-link" class=" top-bar-link">
<a href="{% url 'profile' %}">Profile</a>
</span>
<span id="rapids-link" class="top-bar-link">
<a href="{% url 'rapids:index' %}">Rapids</a>
</span>
<span id="longs-link" class="top-bar-link">
<a href="{% url 'longs:index' %}">Longs</a>
</span>
<span id="physics-link" class="top-bar-link">
<a href="{% url 'physics:index' %}">Physics</a>
</span>
<span id="anatomy-link" class="top-bar-link">
<a href="{% url 'anatomy:index' %}">Anatomy</a>
</span>
<span id="sbas-link" class="top-bar-link">
<a href="{% url 'sbas:index' %}">SBAs</a>
</span>
<span id="atlas-link" class="top-bar-link">
<a href="{% url 'atlas:index' %}">Atlas</a>
</span>
{% if request.user|has_group:"cid_user_manager" %}
<span id="candidate-link" class="top-bar-link">
<a href="{% url 'people' %}">People</a>
</span>
{% endif %}
{% endif %}
{% if request.user.is_staff %}
<span id="admin-link" class="top-bar-link">
<a href="{% url 'admin:index' %}">Admin</a>
</span>
{% endif %}
<span id="index-link" class="top-bar-link">
<a href="{% url 'home' %}">Home</a>
</span>
</div>
<nav class="navbar navbar-expand-lg bg-body-tertiary py-0">
<div class="container-fluid">
<a class="navbar-brand pt-0" href="/">Home</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"><i class="bi bi-text-indent-right"></i></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ms-auto ">
{% if request.user.is_authenticated %}
<li id="atlas-link" class="nav-item">
<a class="nav-link active" href="{% url 'atlas:index' %}">Atlas</a>
</li>
<li class="nav-item dropdown pt-0">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
FRCR
</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="{% url 'rapids:index' %}">Rapids</a>
</li>
<li>
<a class="dropdown-item" href="{% url 'longs:index' %}">Longs</a>
</li>
<li>
<a class="dropdown-item" href="{% url 'anatomy:index' %}">Anatomy</a>
</li>
<li>
<a class="dropdown-item" href="{% url 'physics:index' %}">Physics</a>
</li>
<li>
<a class="dropdown-item" href="{% url 'sbas:index' %}">SBAs</a>
</li>
</ul>
</li>
{% if request.user|has_group:"cid_user_manager" %}
<li id="candidate-link" class="nav-item">
<a class="nav-link active" href="{% url 'people' %}">People</a>
</li>
{% endif %}
<li id="profile-link" class=" nav-item">
<a class="nav-link active" href="{% url 'profile' %}">Profile</a>
</li>
{% endif %}
{% if request.user.is_staff %}
<li class="nav-item">
<a class="nav-link active" href="{% url 'admin:index' %}">Admin</a>
</li>
{% endif %}
{% if request.user.is_authenticated %}
<li id="logout-link" class="nav-item">
<form id="logout-form" method="post" action="{% url 'logout' %}">
{% csrf_token %}
<button class="nav-link btn btn-link" type="submit">Log out</button>
</form>
{% comment %} <a href="{% url 'logout' %}">Logout</a> {% endcomment %}
</li>
{% endif %}
</ul>
{% comment %} <form class="d-flex" role="search">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
</form> {% endcomment %}
</div>
</div>
</nav>
<div class="content container">
{% block navigation %}
{% endblock %}