pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[IMP] survey: update "Press Enter" tooltip depending on field type

Browse Source 
Purpose
=======
Have the "or press CTRL+Enter" (metaKey if it's a mac) shown if the input field selected is a text area, and "or press Enter" otherwise.
Hide the text at the beginning of the survey if it's from mobile.

PR: odoo/odoo/pull/77726
Task-2637120

closes odoo/odoo#77726

Signed-off-by: Thibault Delavallee (tde) <tde@openerp.com>
This commit is contained in:
Fabio Barbero
2021-10-18 07:56:17 +00:00
parent 6b264fab91
commit 54909f5339
2 changed files with 23 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/survey/static/src/js/survey_form.js
+15 -1
View File
@@ -10,6 +10,7 @@ var dom = require('web.dom');
var utils = require('web.utils');
var _t = core._t;
var isMac = navigator.platform.toUpperCase().includes('MAC');
publicWidget.registry.SurveyFormWidget = publicWidget.Widget.extend({
selector: '.o_survey_form',
@@ -17,6 +18,8 @@ publicWidget.registry.SurveyFormWidget = publicWidget.Widget.extend({
'change .o_survey_form_choice_item': '_onChangeChoiceItem',
'click .o_survey_matrix_btn': '_onMatrixBtnClick',
'click button[type="submit"]': '_onSubmit',
'focusin .form-control': '_updateEnterButtonText',
'focusout .form-control': '_updateEnterButtonText'
},
custom_events: {
'breadcrumb_click': '_onBreadcrumbClick',
@@ -89,7 +92,7 @@ publicWidget.registry.SurveyFormWidget = publicWidget.Widget.extend({
*/
_onKeyDown: function (event) {
// If user is answering a text input, do not handle keydown (can be forced by pressing CTRL)
if ((this.$("textarea").is(":focus") || this.$('input').is(':focus')) && !event.ctrlKey) {
if ((this.$("textarea").is(":focus") || this.$('input').is(':focus')) && !(event.ctrlKey || event.metaKey)) {
return;
}
// If in session mode and question already answered, do not handle keydown
@@ -271,6 +274,17 @@ publicWidget.registry.SurveyFormWidget = publicWidget.Widget.extend({
// Custom Events
// -------------------------------------------------------------------------
/**
* Changes the tooltip according to the type of the field.
* @param {Event} event
*/
_updateEnterButtonText: function (event) {
const $target = event.target;
const isTextbox = event.type == "focusin" && $target.tagName.toLowerCase() === 'textarea';
const text = !isTextbox ? _t('or press Enter') : isMac ? _t("or press ⌘+Enter") : _t("or press CTRL+Enter");
$('#enter-tooltip').text(text);
},
_onBreadcrumbClick: function (event) {
this._submitForm({'previousPageId': event.data.previousPageId});
addons/survey/views/survey_templates.xml
+8 -6
View File
@@ -149,7 +149,7 @@
Start Survey
</t>
</button>
<span class="o_survey_enter font-weight-bold text-muted ml-2">or press Enter</span>
<span class="o_survey_enter font-weight-bold text-muted ml-2 d-none d-md-inline">or press Enter</span>
</t>
</div>
</div>
@@ -171,8 +171,10 @@
</t>
<div class="text-center mt16 mb256">
<button type="submit" value="finish" class="btn btn-primary">
Submit</button><span class="font-weight-bold text-muted ml-2 d-none d-md-inline">or press Enter</span>
<button type="submit" value="finish" class="btn btn-primary">Submit</button>
<span class="font-weight-bold text-muted ml-2 d-none d-md-inline">
<span id="enter-tooltip">or press Enter</span>
</span>
</div>
</t>
@@ -190,7 +192,8 @@
<button type="submit" t-att-value="'next' if not survey_last else 'finish'" class="btn btn-primary">
<t t-if="not survey_last">Continue</t>
<t t-else="">Submit</t>
</button><span class="font-weight-bold text-muted ml-2 d-none d-md-inline"> or press Enter</span>
</button>
<span class="font-weight-bold text-muted ml-2 d-none d-md-inline" id="enter-tooltip"> or press Enter</span>
</div>
</div>
</t>
@@ -229,8 +232,7 @@
<t t-else="">Continue</t>
</button>
<span class="font-weight-bold text-muted ml-2 d-none d-md-inline">
<span t-if="question.question_type == 'text_box'">or press CTRL+Enter</span>
<span t-else="">or press Enter</span>
<span id="enter-tooltip">or press Enter</span>
</span>
</div>
</div>