Browse Source

[FIX] web_responsive: Allow searching apps in mobile Chrome

This patch fixes #1251.

The keydown event is faked in mobile chrome because it's not something reliable due to today's virtual keyboards prediction features. Typing a <kbd>C</kbd> character doesn't mean it will be there when user uses autocorrection/autoguessing.

Instead of that, we use now the `keydown` event exclusively for movement features, and `input` event exclusively for content changes in the search input element.

Apart from fixing search in mobile Chrome, it also makes code more readable.

The search input also disables autocompletion since it would be useless and annoying here.
pull/1252/head
Jairo Llopis 5 years ago
parent
commit
771ab61d0b
No known key found for this signature in database GPG Key ID: 59564BF1E22F314F
  1. 17
      web_responsive/static/src/js/web_responsive.js
  2. 1
      web_responsive/static/src/xml/apps.xml

17
web_responsive/static/src/js/web_responsive.js

@ -72,6 +72,7 @@ odoo.define('web_responsive', function (require) {
AppsMenu.include({
events: _.extend({
"keydown .search-input input": "_searchResultsNavigate",
"input .search-input input": "_searchMenusSchedule",
"click .o-menu-search-result": "_searchResultChosen",
"shown.bs.dropdown": "_searchFocus",
"hidden.bs.dropdown": "_searchReset",
@ -217,17 +218,15 @@ odoo.define('web_responsive', function (require) {
* @param {jQuery.Event} event
*/
_searchResultsNavigate: function (event) {
// Exit soon when not navigating results
if (this.$search_results.html().trim() === "") {
// Just in case it is the 1st search
this._searchMenusSchedule();
return;
}
// Find current results and active element (1st by default)
var all = this.$search_results.find(".o-menu-search-result"),
pre_focused = all.filter(".active") || $(all[0]),
offset = all.index(pre_focused),
key = event.key;
// Keyboard navigation only supports search results
if (!all.length) {
return;
}
// Transform tab presses in arrow presses
if (key === "Tab") {
event.preventDefault();
@ -245,12 +244,8 @@ odoo.define('web_responsive', function (require) {
case "ArrowDown":
offset++;
break;
// Other keys trigger a search
default:
// All keys that write a character have length 1
if (key.length === 1 || key === "Backspace") {
this._searchMenusSchedule();
}
// Other keys are useless in this event
return;
}
// Allow looping on results

1
web_responsive/static/src/xml/apps.xml

@ -30,6 +30,7 @@
</div>
</div>
<input type="search"
autocomplete="off"
placeholder="Search menus..."
class="form-control"/>
</div>

Loading…
Cancel
Save