From 77324d5ddea55f8b19c8ea4419a75a884c5944e3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Aur=C3=A9lien=20Warnon?= <awa@odoo.com>
Date: Mon, 18 Oct 2021 07:29:57 +0000
Subject: [PATCH] [IMP] survey: keep navigation buttons at the same location

This commit slightly adapts the survey navigation buttons to make sure that
they are always positioned at the same spot.

Before this change, if you rapidly click the "back" button a lot of times, when
it disappears, you will misclick the "Odoo" button and land on the Odoo
website, which can be very annoying during a real test with a timer.

Now, we disable the button when it becomes non-clickable instead of removing
it, so that it always stays at the same spot.

Task-2665998

closes odoo/odoo#78513

Signed-off-by: Thibault Delavallee (tde) <tde@openerp.com>
---
 .../static/src/scss/survey_templates_form.scss |  8 ++++++++
 .../views/survey_templates_management.xml      | 18 +++++++++++-------
 2 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/addons/survey/static/src/scss/survey_templates_form.scss b/addons/survey/static/src/scss/survey_templates_form.scss
index e6fcd12cb60..30c87c28237 100644
--- a/addons/survey/static/src/scss/survey_templates_form.scss
+++ b/addons/survey/static/src/scss/survey_templates_form.scss
@@ -35,6 +35,14 @@ _::-webkit-full-page-media, _:future, :root .o_survey_wrap {
 
 .o_survey_navigation_wrapper .o_survey_navigation_submit {
     cursor: pointer;
+
+    &:disabled {
+        cursor: default;
+        opacity: 1;
+        i {
+            opacity: .3;
+        }
+    }
 }
 
 .o_survey_timer {
diff --git a/addons/survey/views/survey_templates_management.xml b/addons/survey/views/survey_templates_management.xml
index e3a8c431e4b..2536eec6aff 100644
--- a/addons/survey/views/survey_templates_management.xml
+++ b/addons/survey/views/survey_templates_management.xml
@@ -137,15 +137,19 @@
     </template>
 
     <template id="survey_navigation" name="Survey: Navigation">
-        <!-- Keep this enclosing div so that the template always returns valid HTML content, no matter the use case -->
         <div class="d-inline-block">
-            <button t-if="can_go_back"
-                type="submit" class="btn p-0 shadow-none o_survey_navigation_submit" name="button_submit" value="previous" t-att-data-previous-page-id="previous_page_id">
-                <i class="border-left fa fa-chevron-left p-2" />
+            <button
+                t-if="survey and survey.users_can_go_back"
+                t-att-disabled="not can_go_back"
+                type="submit" class="btn border-left p-0 shadow-none o_survey_navigation_submit" name="button_submit" value="previous" t-att-data-previous-page-id="previous_page_id">
+                <i class="fa fa-chevron-left p-2" />
             </button>
-            <button t-if="survey and survey.questions_layout in ['page_per_question', 'page_per_section'] and answer and answer.state != 'done' and not answer.is_session_answer"
-                type="submit" class="btn p-0 shadow-none o_survey_navigation_submit" t-att-value="'next' if not survey_last else 'finish'">
-                <i class="border-left fa fa-chevron-right p-2" />
+            <t t-set="can_go_forward"
+                t-value="survey and survey.questions_layout in ['page_per_question', 'page_per_section'] and answer and answer.state != 'done' and not answer.is_session_answer"/>
+            <button
+                t-att-disabled="not can_go_forward"
+                type="submit" class="btn border-left p-0 shadow-none o_survey_navigation_submit" t-att-value="'next' if not survey_last else 'finish'">
+                <i class="fa fa-chevron-right p-2" />
             </button>
         </div>
     </template>