[IMP] survey: scoring & certification

Task #1902306

Purpose
=======

This commit adds certification capabilities to the survey module.

A certification is a survey with the "certification" flag set to true than can be linked
to a certification email template that contains a certification document (PDF).
This template can be edited by the user in the technical settings to customize the certification email/document.

To be able to implement this certification concept, we also have to add scoring mechanisms to surveys.
survey.questions of type 'simple_choice' and 'multiple_choice' now have scores for the suggested answers.
These question scores allow to compute a global score that is used to determine whether the user has successfully
passed the certification or not.

As additional features, we also have:
- A time limit with an interface timer that limits the test to X minutes
  When reached, the survey is automatically submitted and unregistered (= unsubmitted) answers are not taken into account.
- A limited number of attempts for the survey/certification
  If reached, the user can't take the survey/certification anymore

The 'survey result' layout was adapted accordingly to show the success rate of participants and the correct answers
to the survey questions.

Specs
=======
- Create a new survey :
  - Add a description field for the survey

- Options on a survey :
  - Passing score : (sum of all good answers) in %
  - If No scoring => No passing score, no certificate
  - If Scoring with answers => Passing score and can see the answers (can create certificate)
  - If Scoring without answers => Passing score but can't review the answers at the end (can create certificate)
  - for the questions, if "no scoring" selected, can 't see the option "good answer" and "score" on the questions
  - If the 2 others options, can see the options "good answer" and "score" on the questions
  - all the types of questions are available for each option.

- Questions
  - Add the option correct answer on the multiples questions (one or more good answers)

- Certifications
  - If scoring, force "mandatory" for "mutliple choices (1or multiple answers)"
  - On the dashboard => visual information that this specific survey is a certification
  - Time Limit : The student is informed on the home screen of the survey of the time limit.
    The clock start when he clicks on "start survey"
  - Template of the certificate : send email with attachment PDF

- Front-end :
  - Add some margin
  - Replace "Back to survey" with the blue-bar from the portal
  - Add a timer (start when the survey starts)
  - Add a progress bar (number of section and number of question inside the section)

- Analyse of the results :
  - First a global graph with the number of people who''ve participated and passed the test

- Stages of a survey :
  - Remove the stage "Permanent"
  - 3 stages :
    - draft : not on-line but can be tested (with phantom token)
    - In progress : on-line
    - closed : not on-line
  - Who can test a survey : the manager and the user. Add this condition to the phantom token.

6 files changed, 89 insertions, 5 deletions

diff --git a/addons/survey/static/src/img/certification_background.png b/addons/survey/static/src/img/certification_background.png
new file mode 100644
index 00000000000..966d05cf903
--- /dev/null
+++ b/addons/survey/static/src/img/certification_background.png
diff --git a/addons/survey/static/src/js/survey_result.js b/addons/survey/static/src/js/survey_result.js
index 1cc571ed78c..f70aefe9a1f 100644
--- a/addons/survey/static/src/js/survey_result.js
+++ b/addons/survey/static/src/js/survey_result.js
@@ -67,7 +67,7 @@ if(!$('.js_surveyresult').length) {
     }
 
     //load chart to svg element chart:initialized chart, response:AJAX response, quistion_id:if of survey question, tick_limit:text length limit
-    function load_chart(chart, response, question_id, tick_limit, graph_type){
+    function load_chart(chart, response, svgSelector, tick_limit, graph_type){
         // Custom Tick fuction for replacing long text with '...'
         var customtick_function = function(d){
             if(! this || d.length <= tick_limit){
@@ -83,7 +83,7 @@ if(!$('.js_surveyresult').length) {
             chart.yAxis
                 .tickFormat(d3.format('d'));
         }
-        d3.select('#graph_question_' + question_id + ' svg')
+        d3.select(svgSelector)
             .datum(response)
             .transition().duration(500).call(chart);
         nv.utils.windowResize(chart.update);
@@ -95,26 +95,35 @@ if(!$('.js_surveyresult').length) {
         var question_id = $(graph).attr("data-question_id");
         var graph_type = $(graph).attr("data-graph_type");
         var graph_data = JSON.parse($(graph).attr("graph-data"));
+        var svgSelector = '#graph_question_' + question_id + ' svg';
         if(graph_type == 'multi_bar'){
             nv.addGraph(function(){
                 var chart = init_multibar_chart();
-                return load_chart(chart, graph_data, question_id, 25);
+                return load_chart(chart, graph_data, svgSelector, 25);
             });
         }
         else if(graph_type == 'bar'){
             nv.addGraph(function() {
                 var chart = init_bar_chart();
-                return load_chart(chart, graph_data, question_id, 35);
+                return load_chart(chart, graph_data, svgSelector, 35);
             });
         }
         else if(graph_type == 'pie'){
             nv.addGraph(function() {
                 var chart = init_pie_chart();
-                return load_chart(chart, graph_data, question_id, 25, 'pie');
+                return load_chart(chart, graph_data, svgSelector, 25, 'pie');
             });
         }
     });
 
+    var $scoringResultsChart = $('#scoring_results_chart');
+    if ($scoringResultsChart.length > 0) {
+        nv.addGraph(function () {
+            var chart = init_pie_chart();
+            return load_chart(chart, $scoringResultsChart.data('graph_data'), '#scoring_results_chart svg', 25, 'pie');
+        });
+    }
+
     // Script for filter
     $('td.survey_answer').hover(function(){
         $(this).find('i.fa-filter').removeClass('invisible');
diff --git a/addons/survey/static/src/js/survey_timer.js b/addons/survey/static/src/js/survey_timer.js
new file mode 100644
index 00000000000..bb7af08104f
--- /dev/null
+++ b/addons/survey/static/src/js/survey_timer.js
@@ -0,0 +1,45 @@
+odoo.define('survey.timer', function (require) {
+'use strict';
+
+require('web.dom_ready');
+
+if (!$('.js_survey_timer').length) {
+    return $.Deferred().reject("DOM doesn't contain '.js_survey_timer'");
+}
+
+var $parent = $('.js_survey_timer');
+var timeLimitMinutes = parseInt($parent.data('time_limit_minutes'));
+
+if (timeLimitMinutes <= 0) {
+    return $.Deferred().reject("Timer is not positive");
+}
+
+var countDownDate = moment.utc($parent.data('timer')).add(timeLimitMinutes, 'minutes');
+
+if (countDownDate.diff(moment.utc(), 'seconds') < 0) {
+    return $.Deferred().reject("Timer is already finished");
+}
+
+var formatTime = function (time) {
+    return time > 9 ? time : '0' + time;
+};
+
+var $timer = $parent.find('.timer');
+var interval = null;
+var updateTimer = function () {
+    var timeLeft = countDownDate.diff(moment.utc(), 'seconds');
+
+    if (timeLeft >= 0) {
+        var timeLeftMinutes = parseInt(timeLeft / 60);
+        var timeLeftSeconds = timeLeft - (timeLeftMinutes * 60);
+        $timer.html(formatTime(timeLeftMinutes) + ':' + formatTime(timeLeftSeconds));
+    } else {
+        clearInterval(interval);
+        $('.js_surveyform').submit();
+    }
+};
+
+updateTimer();
+interval = setInterval(updateTimer, 1000);
+
+});
diff --git a/addons/survey/static/src/scss/survey_reports.scss b/addons/survey/static/src/scss/survey_reports.scss
new file mode 100644
index 00000000000..ac31d56abed
--- /dev/null
+++ b/addons/survey/static/src/scss/survey_reports.scss
@@ -0,0 +1,17 @@
+.certification-wrapper {
+    background: url(/survey/static/src/img/certification_background.png) no-repeat;
+    background-size: 100% 100%;
+    height: 610px;
+    width: 860px;
+
+    .certification {
+        margin-left: 350px;
+        padding-top: 140px;
+        width: 510px;
+        text-align: center;
+
+        h2 {
+            color: #876B81;
+        }
+    }
+}
diff --git a/addons/survey/static/src/scss/survey_templates.scss b/addons/survey/static/src/scss/survey_templates.scss
new file mode 100644
index 00000000000..d54c3853625
--- /dev/null
+++ b/addons/survey/static/src/scss/survey_templates.scss
@@ -0,0 +1,8 @@
+.o_survey_header {
+    padding-top: 15px;
+    padding-bottom: 25px;
+}
+
+.js_question-wrapper {
+    padding-bottom: 25px;
+}
diff --git a/addons/survey/static/src/scss/survey_views.scss b/addons/survey/static/src/scss/survey_views.scss
new file mode 100644
index 00000000000..92f4dd73a31
--- /dev/null
+++ b/addons/survey/static/src/scss/survey_views.scss
@@ -0,0 +1,5 @@
+.o_kanban_card_survey {
+    .certification_icon {
+        font-size: 20px;
+    }
+}