Improving experiment execution

- Showing loader while generation heat map for analyses
- Fix the when mark execution as finished
- Focus on response text area when click to answer the task
- Strip spaces and line brakes when checking the provided answer

experiments/templates/pause_execution.html

@@ -4,9 +4,28 @@
 
 {% block content %}
 <div class="jumbotron">
-    <h2>Tarefa Pausada</h2>
+    <h2 id="page_title">Tarefa Pausada</h2>
     <hr>
     <div>
+        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin:auto;display:none;" width="200px" height="100px" viewBox="0 0 80 80" preserveAspectRatio="xMidYMid" id="loader">
+            <g transform="translate(20 50)">
+            <circle cx="0" cy="0" r="6" fill="#e15b64" transform="scale(0.452993 0.452993)">
+              <animateTransform attributeName="transform" type="scale" begin="-0.375s" calcMode="spline" keySplines="0.3 0 0.7 1;0.3 0 0.7 1" values="0;1;0" keyTimes="0;0.5;1" dur="1s" repeatCount="indefinite"></animateTransform>
+            </circle>
+            </g><g transform="translate(40 50)">
+            <circle cx="0" cy="0" r="6" fill="#f8b26a" transform="scale(0.794556 0.794556)">
+              <animateTransform attributeName="transform" type="scale" begin="-0.25s" calcMode="spline" keySplines="0.3 0 0.7 1;0.3 0 0.7 1" values="0;1;0" keyTimes="0;0.5;1" dur="1s" repeatCount="indefinite"></animateTransform>
+            </circle>
+            </g><g transform="translate(60 50)">
+            <circle cx="0" cy="0" r="6" fill="#abbd81" transform="scale(0.996168 0.996168)">
+              <animateTransform attributeName="transform" type="scale" begin="-0.125s" calcMode="spline" keySplines="0.3 0 0.7 1;0.3 0 0.7 1" values="0;1;0" keyTimes="0;0.5;1" dur="1s" repeatCount="indefinite"></animateTransform>
+            </circle>
+            </g><g transform="translate(80 50)">
+            <circle cx="0" cy="0" r="6" fill="#81a3bd" transform="scale(0.869185 0.869185)">
+              <animateTransform attributeName="transform" type="scale" begin="0s" calcMode="spline" keySplines="0.3 0 0.7 1;0.3 0 0.7 1" values="0;1;0" keyTimes="0;0.5;1" dur="1s" repeatCount="indefinite"></animateTransform>
+            </circle>
+            </g>
+        </svg>
         <a id="navigationButton"
            href="{% url 'experiments:previous_task' pause.execution.participant.id pause.execution.task.experiment.id %}"
            class="btn btn-primary">Voltar para a tarefa</a>
@@ -50,6 +69,10 @@ <h5 class="modal-title" id="exampleModalLabel">Qual a sua resposta?</h5>
                 event.preventDefault();
                 submitResponse();
             });
+
+            $('#answerModal').on('shown.bs.modal', function () {
+                $('#task_response').trigger('focus');
+            })
         });
 
         function submitResponse() {
@@ -66,8 +89,8 @@ <h5 class="modal-title" id="exampleModalLabel">Qual a sua resposta?</h5>
 
                     if (result.correct) {
                         alert('Resposta correta!');
+                        showLoader();
                         gotoHeatMap();
-                        hideResponseButton();
                     } else {
                         alert('Resposta incorreta!')
                         $("#responseButton").html("Digite outra Resposta");
@@ -76,6 +99,17 @@ <h5 class="modal-title" id="exampleModalLabel">Qual a sua resposta?</h5>
             );
         }
 
+        function showLoader() {
+            $("#loader").show();
+            $("#navigationButton").hide();
+            $("#page_title").html("Registrando Resposta...");
+            hideResponseButton();
+        }
+
+        function hideLoader() {
+           $("#loader").hide(); 
+        }
+
         function gotoHeatMap() {
             window.location.replace("{% url 'experiments:heat_map' pause.execution.id %}");
         }

experiments/views/heat_map.py

@@ -49,8 +49,10 @@ def get_initial(self):
         initial['execution_id'] = self.kwargs['execution_id']
         # execution = self.__execution(245)
         execution = self.__execution(self.kwargs['execution_id'])
-        execution.end = datetime.now()
-        execution.save()
+
+        if not execution.end:
+            execution.end = datetime.now()
+            execution.save()
 
         if not execution.heatmap:
             self.__generate_heat_map(execution)

experiments/views/submit_answer.py

@@ -26,17 +26,26 @@ def post(self, request, *args, **kwargs):
         return HttpResponse(json.dumps({'correct': answer.correct}, default=date_handler), **response_kwargs)
 
     def create_new_answer(self):
-        execution_id = int(self.kwargs['execution_id'])
         user_answer = self.request.POST.get('answer')
-        execution = Execution.objects.get(pk=execution_id)
-        correct = execution.task.correct_answer == user_answer
-
+        execution = self.__execution()
+        correct = execution.task.correct_answer == user_answer.strip()
+        execution_id = self.__execution_id()
         if not correct: self.increment_number_of_errors(execution_id)
 
         return Answer.objects.create(execution_id=execution_id, answer=user_answer, correct=correct)
 
-    def increment_number_of_errors(self, execution_id):
-        Execution.objects.filter(pk=execution_id).update(number_of_errors=F('number_of_errors') + 1)
+    def increment_number_of_errors(self):
+        Execution.objects.filter(pk=self.__execution_id()).update(number_of_errors=F('number_of_errors') + 1)
 
-        execution = Execution.objects.get(pk=execution_id)
+        execution = Execution.objects.get(pk=self.__execution_id())
         return execution.number_of_errors
+
+    def __execution_id(self):
+        try:
+            return self.execution_id
+        except AttributeError:
+            self.execution_id = int(self.kwargs['execution_id'])
+            return self.execution_id
+
+    def __execution(self):
+        return Execution.objects.get(pk=self.__execution_id())