add toastr
This commit is contained in:
@@ -139,6 +139,16 @@ button a {
|
|||||||
padding: 20px
|
padding: 20px
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#full-question-list li{
|
||||||
|
padding-bottom: 20px
|
||||||
|
}
|
||||||
|
|
||||||
|
#full-question-list img{
|
||||||
|
float: left;
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
#question-mark-list a {
|
#question-mark-list a {
|
||||||
color: #bbe1fa
|
color: #bbe1fa
|
||||||
}
|
}
|
||||||
@@ -151,4 +161,9 @@ button a {
|
|||||||
float: right;
|
float: right;
|
||||||
position: sticky;
|
position: sticky;
|
||||||
top: 30px;
|
top: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#save-annotations {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
}
|
}
|
||||||
@@ -4,7 +4,9 @@
|
|||||||
<head>
|
<head>
|
||||||
<title>Anatomy Quiz</title>
|
<title>Anatomy Quiz</title>
|
||||||
<link rel="stylesheet" href="{% static 'css/anatomy.css' %}">
|
<link rel="stylesheet" href="{% static 'css/anatomy.css' %}">
|
||||||
|
<link rel="stylesheet" href="{% static 'css/toastr.min.css' %}">
|
||||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
||||||
|
<script src="{% static 'js/toastr.min.js' %}"></script>
|
||||||
<script src="{% static 'js/cornerstone/hammer.js' %}"></script>
|
<script src="{% static 'js/cornerstone/hammer.js' %}"></script>
|
||||||
<script src="{% static 'js/cornerstone/cornerstone.min.js' %}"></script>
|
<script src="{% static 'js/cornerstone/cornerstone.min.js' %}"></script>
|
||||||
<script src="{% static 'js/cornerstone/dicomParser.min.js' %}"></script>
|
<script src="{% static 'js/cornerstone/dicomParser.min.js' %}"></script>
|
||||||
|
|||||||
@@ -8,28 +8,32 @@
|
|||||||
This exam has {{question_number}} questions.
|
This exam has {{question_number}} questions.
|
||||||
|
|
||||||
<div title="Click to enable / disable the exam">
|
<div title="Click to enable / disable the exam">
|
||||||
Exam active: <input type="checkbox" id="exam-active-switch" {% if exam.active %}checked{% endif %}>
|
Exam active: <input type="checkbox" id="exam-active-switch" {% if exam.active %}checked{% endif %}>
|
||||||
</div>
|
</div>
|
||||||
<p><a href="{% url 'anatomy:mark_overview' pk=exam.pk %}"><button>Mark exam</button></a></p>
|
<p><a href="{% url 'anatomy:mark_overview' pk=exam.pk %}"><button>Mark exam</button></a></p>
|
||||||
<!--<p><button><a href="{% url 'anatomy:exam_take' pk=exam.pk sk=0 %}">Click here to start</a></button></p>-->
|
<!--<p><button><a href="{% url 'anatomy:exam_take' pk=exam.pk sk=0 %}">Click here to start</a></button></p>-->
|
||||||
|
|
||||||
<ol>
|
<ol id="full-question-list">
|
||||||
{% for question in questions.all %}
|
{% for question in questions.all %}
|
||||||
|
|
||||||
<li>{{ question.description }}: {{ question.GetPrimaryAnswer }}<img src="{{ question.image|thumbnail_url:'exam-list' }}" alt="thumbail" />
|
<li>
|
||||||
<br />
|
<img src="{{ question.image|thumbnail_url:'exam-list' }}" alt="thumbail" />
|
||||||
Modality: {{ question.modality }}
|
{{ question.description }}
|
||||||
</li>
|
<br />
|
||||||
|
{{ question.question_type }}: {{ question.GetPrimaryAnswer }}
|
||||||
|
<br />
|
||||||
|
Modality: {{ question.modality }}, <a href="{% url 'anatomy:question_detail' pk=question.pk %}">View</a>
|
||||||
|
</li>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</ol>
|
</ol>
|
||||||
<a href="{% url 'anatomy:exam_json' pk=exam.pk %}">JSON</a>
|
<a href="{% url 'anatomy:exam_json' pk=exam.pk %}">JSON</a>
|
||||||
<a href="{% url 'anatomy:exam_json_recreate' pk=exam.pk %}">Refresh JSON cache</a>
|
<a href="{% url 'anatomy:exam_json_recreate' pk=exam.pk %}">Refresh JSON cache</a>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
$(document).ready(function() {
|
$(document).ready(function () {
|
||||||
// send request to change the is_private state on customSwitches toggle
|
// send request to change the is_private state on customSwitches toggle
|
||||||
$("#exam-active-switch").on("change", function() {
|
$("#exam-active-switch").on("change", function () {
|
||||||
$.ajax({
|
$.ajax({
|
||||||
url: "{% url 'anatomy:exam_toggle_active' pk=exam.pk %}",
|
url: "{% url 'anatomy:exam_toggle_active' pk=exam.pk %}",
|
||||||
data: {
|
data: {
|
||||||
@@ -37,17 +41,21 @@ Modality: {{ question.modality }}
|
|||||||
active: this.checked // true if checked else false
|
active: this.checked // true if checked else false
|
||||||
},
|
},
|
||||||
type: "POST",
|
type: "POST",
|
||||||
dataType : "json",
|
dataType: "json",
|
||||||
})
|
|
||||||
// $.ajax().done(), $.ajax().fail(), $ajax().always() are upto you. Add/change accordingly
|
|
||||||
.done(function(data) {
|
|
||||||
console.log(data);
|
|
||||||
// show some message according to the response.
|
|
||||||
// For eg. A message box showing that the status has been changed
|
|
||||||
})
|
|
||||||
.always(function() {
|
|
||||||
console.log('[Done]');
|
|
||||||
})
|
})
|
||||||
|
// $.ajax().done(), $.ajax().fail(), $ajax().always() are upto you. Add/change accordingly
|
||||||
|
.done(function (data) {
|
||||||
|
console.log(data);
|
||||||
|
|
||||||
|
if (data.success) {
|
||||||
|
toastr.info('Exam state changed.')
|
||||||
|
}
|
||||||
|
// show some message according to the response.
|
||||||
|
// For eg. A message box showing that the status has been changed
|
||||||
|
})
|
||||||
|
.always(function () {
|
||||||
|
console.log('[Done]');
|
||||||
|
})
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -2,11 +2,11 @@
|
|||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
{% load static %}
|
{% load static %}
|
||||||
|
<button id="save-annotations">Save Annotations</button>
|
||||||
<div id="dicom-image" data-url="{{ question.image.url}}" data-annotations='{{question.image_annotations}}' data-edit_annotation=true></div>
|
<div id="dicom-image" data-url="{{ question.image.url}}" data-annotations='{{question.image_annotations}}' data-edit_annotation=true></div>
|
||||||
<!-- testing -->
|
<!-- testing -->
|
||||||
<!--<div id="dicom-image" data-url="http://localhost:8000/static/abdoct.jpg"
|
<!--<div id="dicom-image" data-url="http://localhost:8000/static/abdoct.jpg"
|
||||||
data-annotations='{{question.image_annotations}}' data-edit_annotation=true></div>-->
|
data-annotations='{{question.image_annotations}}' data-edit_annotation=true></div>-->
|
||||||
<button id="save-annotations">Save Annotations</button>
|
|
||||||
<div class="question">
|
<div class="question">
|
||||||
<div class="date">
|
<div class="date">
|
||||||
Created: {{ question.created_date }}
|
Created: {{ question.created_date }}
|
||||||
@@ -44,6 +44,11 @@
|
|||||||
console.log(data);
|
console.log(data);
|
||||||
// show some message according to the response.
|
// show some message according to the response.
|
||||||
// For eg. A message box showing that the status has been changed
|
// For eg. A message box showing that the status has been changed
|
||||||
|
if (data.success) {
|
||||||
|
toastr.info('Annotations saved')
|
||||||
|
} else {
|
||||||
|
toastr.warn('Error saving annotations')
|
||||||
|
}
|
||||||
})
|
})
|
||||||
.always(function () {
|
.always(function () {
|
||||||
console.log('[Done]');
|
console.log('[Done]');
|
||||||
|
|||||||
+1
-1
@@ -512,7 +512,7 @@ def exam_json(request, pk):
|
|||||||
"title": "{}".format(q.description),
|
"title": "{}".format(q.description),
|
||||||
"question": str(q.question_type),
|
"question": str(q.question_type),
|
||||||
"images": [image_as_base64(q.image)],
|
"images": [image_as_base64(q.image)],
|
||||||
"annotations": [q.image_annotations],
|
"annotations": [str(q.image_annotations)],
|
||||||
"type": "anatomy",
|
"type": "anatomy",
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user