more improvements ot image annotatiotns

anatomy/templates/anatomy/exam.html

@@ -41,7 +41,7 @@
 <table>
     <tr>
         <td>
-            <div id="dicom-image" data-url="{{ question.image.url}}" />
+            <div id="dicom-image" data-url="{{ question.image.url}}" data-annotations='{{question.image_annotations}}'>
             </div>
 
             <form method="POST" class="post-form">{% csrf_token %}

anatomy/templates/anatomy/mark.html

@@ -4,7 +4,7 @@
 <h2>Marking question {{question_details.current}} of {{question_details.total}}</h2>
 <p>{{ question.question_type }}</p>
 
-<div id="dicom-image" data-url="{{ question.image.url}}" />
+<div id="dicom-image" data-url="{{ question.image.url}}" data-annotations='{{question.image_annotations}}'>
 </div>
 <div class="marking">
 <form method="POST" class="post-form">{% csrf_token %}

anatomy/templates/anatomy/question_detail.html

@@ -1,15 +1,56 @@
 {% extends 'anatomy/base.html' %}
 
 {% block content %}
-<div id="dicom-image" data-url="{{ question.image.url}}" />
+{% load static %}
+<div id="dicom-image" data-url="{{ question.image.url}}"  data-annotations='{{question.image_annotations}}' data-edit_annotation=true>
+    <!-- testing -->
+<!--<div id="dicom-image" data-url="http://localhost:8000/static/abdoct.jpg"
+    data-annotations='{{question.image_annotations}}' data-edit_annotation=true></div>-->
+<button id="save-annotations">Save Annotations</button>
 <div class="question">
     <div class="date">
-        {{ question.created_date }}
+        Created: {{ question.created_date }}
+    </div>
+    <h1>{{ question.GetPrimaryAnswer }}</h1>
+    <h2>{{question.question_type}}</h2>
+    Answers (score): {% for answer in question.answers.all %}
+    {{ answer }} ({{answer.status}}),
+    {% endfor %}
+    <div>
+        Examinations: {% for exam in question.exams.all %}
+        {{ exam.name }}
+        {% endfor %}
+    </div>
+    <div>
+        Annotation JSON: {{ question.image_annotations }}
     </div>
-    <h1>{% for answer in question.answers.all %}
-        {{ answer }},
-        {% endfor %}</h1>
     <p>{{ question.question_type.first|linebreaksbr }}</p>
     <img src="/media/anatomy/{{ question.image|linebreaksbr }}" />
 </div>
+<script type="text/javascript">
+    $(document).ready(function () {
+        // send request to change the is_private state on customSwitches toggle
+        $("#save-annotations").click(function () {
+            json = getJsonToolStateNoId();
+            $.ajax({
+                url: "{% url 'anatomy:question_save_annotation' pk=question.pk %}",
+                data: {
+                    csrfmiddlewaretoken: "{{ csrf_token }}",
+                    annotation: json,
+                },
+                type: "POST",
+                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]');
+                })
+        })
+    });
+</script>
 {% endblock %}