[MIG] web_responsive: Migrate to v12 and refactor #1066

yajo · 2018-10-05T10:49:58Z

This migration includes a full refactoring to make this module more
maintainable. Some things that have changed:

Removed external libraries.
Change Less for Scss.
Reduce ES and XML to the minimal required needs.
Implement as much features as possible with just Scss.
Use the new hotkeys system from Odoo v12.

@Tecnativa

nikul-serpentcs

Small Change

web_responsive/README.rst

web_responsive/__init__.py

web_responsive/views/inherited_view_users_form_simple_modif.xml

yajo · 2018-10-08T07:23:08Z

@nikul-serpentcs all done 😉

chienandalu

Very cool!

I found a small issue in Chrome:

When you open the apps box it's not possible to navigate with the keys. No response from the arrows and the tab kicks you out of the menu.

In the aesthetics side, wouldn't it be nice to have a colored background in the apps box?

yajo · 2018-10-09T08:37:05Z

When you open the apps box it's not possible to navigate with the keys. No response from the arrows and the tab kicks you out of the menu.

App navigation is not supported right now. Only navigating through results when you search. I'll add it to roadmap.

In the aesthetics side, wouldn't it be nice to have a colored background in the apps box?

I suppose, but I wanted to focus on getting it functional. It can be beautier later 😉. Adding to roadmap as well.

yajo · 2018-10-09T08:39:02Z

Roadmap updated.

chienandalu · 2018-10-09T08:41:28Z

@yajo I mean the search results. It's not possible to select them with the keys in Chrome. It works perfectly in Firefox though.

yajo · 2018-10-09T08:43:52Z

Oh sorry! Let me check that.

yajo · 2018-10-09T08:53:49Z

It should work now. Problem: https://stackoverflow.com/a/11031754/1468388

chienandalu

Great work! 👍 👍 👍

aitorbouzas

Love to see this module migrated! Nice work, thanks for your effort.
Just a small note.

web_responsive/models/__init__.py

tarteo

I love the search function because it searches on display_name.
I've also did a functional test. It seems some features are lost because there's no keyboard navigation to change the app selection anymore. I don't know if other features are lost too.

web_responsive/static/src/js/web_responsive.js

web_responsive/static/src/css/web_responsive.scss

pedrobaeza

Functional review. Great improvement on the search!

Several points to discuss/solve:

Arrows don't work on app switcher for selecting directly the app and press enter.
There are 2 solutions for this:
- Present the app icon also on the list of candidates, and remove all of them when you have typed anything
- when you press the arrows on the text box, you navigate on the apps icons.
Apps icons are moved down and top each time you type something on the search box. The first solution for the previous point will solve this also.
On Firefox, switching to mobile view, it's not possible to search, as I can't type in the textbox. It's curious, as I have been able to do it on a real mobile, so this is not critical.
As the search happens in another "screen", can you hide the searchbox on mobile view and let only the glass icon? This way, we gain a bit of space.
We have lost the improvements made on v11 for collapsing statusbar and buttons. Please restore it:

About the name of the button, I'm still not very convinced for calling it "Tasks". Enterprise responsive interface calls this "Action", but hides "Print" and "Action" dropdown that are when full. I consider this a loss, as you can't for example remove a record from mobiles. Is it feasible to join the 3 of them (Print dropdown, Action dropdown and buttons) in the same mobile dropdown, split by a separator? Enterprise also increases the space for tapping each option and put text in upper for better recognition.
On a notebook with pages that doesn't fit current width, full page appears side scrollable, which breaks mobile purpose. Enterprise makes scrollable in this case only the pages part instead of everything. Other technique can be to collapse extra pages that doesn't fit on mobile width (or put all of them as collapsable?)

EDIT: Looking to other form views, it's an incorrect size of the notebook container, as here we don't have too many pages and they fit on the width:
On mobile view, shadow and padding is preserved on forms with sheet attribute. We should gain this space:

@Tardo can you review this also?

Tardo

As said by others... good work with search feature!

Bad news:

Can't use shortcuts, browser interpret it as "accelerator key" (ALT+)
Settings pages doesn't display properly
Sticky feature has been lost
You can move out of the "search list bounds" when use arrow keys
Search-box dispatch events when press modifier keys
I see some app names "cutted":

web_responsive/models/res_users.py

pedrobaeza · 2018-10-23T08:41:16Z

Another pending thing is the inclusion of web_searchbar_full_width module in this one, which is a simply CSS rule.

rafaelbn · 2018-11-01T22:21:58Z

Maybe we can discard this module as has a high maintenance an start using

It is already done and supported by Openworx

pedrobaeza · 2018-11-01T22:55:47Z

AFAIK that one is not responsive. And IMO is ugly. It doesn't include menu search nor app switcher (only a variant of the navbar). And finally, it's not OCA.

mgielissen · 2018-11-02T07:39:56Z

AFAIK that one is not responsive. And IMO is ugly. It doesn't include menu search nor app switcher (only a variant of the navbar). And finally, it's not OCA.

The first version only has the app sidebar and more enterprise look'n'feel. The second version will using web_responsive when it's available.

Currently translated at 90.0% (9 of 10 strings) Translation: web-11.0/web-11.0-web_responsive Translate-URL: https://translation.odoo-community.org/projects/web-11-0/web-11-0-web_responsive/da/

* Add feature to search menus in the app drawer * Switch model to RPC

When doing menu search, some menus that the user didn't have permission to use were presented to him. Fix OCA#850.

pedrobaeza · 2018-12-11T15:01:13Z

@yajo what is the status of this?

yajo · 2018-12-12T08:21:52Z

Under a pile of work. 🙄

pedrobaeza · 2019-01-07T14:25:15Z

You might need to modify something when odoo/odoo#29994 is merged.

yajo · 2019-01-10T11:22:41Z

I fixed all concerns. Some new screenshots/gifs:

View type switcher on mobiles:
The control panel is hidden when scrolling, to save screen space, but the main top bar is always visible:
Form status bar action buttons are collapsed in a dropdown.
Other control panel buttons use icons to save space.
Breadcrumbs navigation is collapsed with a "back arrow" button.

All these gifs appear in the updated README now.

This is ready to review.

This migration includes a full refactoring to make this module more maintainable. Some things that have changed: - Removed external libraries. - Change Less for Scss. - Reduce ES and XML to the minimal required needs. - Implement as much features as possible with just Scss. - Remove copyright from `__init__.py` files. - Trigger the new hotkeys system from Odoo v12 with `Shift+Alt` instead of just `Alt`, and restore some good old hotkeys (`E` for "Edit", `D` for "Discard", and `A` for "Apps menu"). See odoo/odoo#30068 on the matter. - Control panel breadcrumbs are collapsed into a single backwards icon. - Add FA icons to most common buttons in control panel. - Hide text in XS for those buttons, to have a slicker phone experience. - Lots of gifs in the README!

pedrobaeza

All the comments have been attended, so I'm going to merge this after a long incubation phase.

@yajo full width searchbar is still missing, but we can add it later on a new PR.

steync027 · 2019-01-11T14:51:22Z

Great work!

mgielissen · 2019-01-24T18:29:15Z

When will it be published in the Odoo Apstore?

yajo added the needs review label Oct 5, 2018

yajo added this to the 12.0 milestone Oct 5, 2018

yajo self-assigned this Oct 5, 2018

OCA-git-bot mentioned this pull request Oct 5, 2018

Migration to version 12.0 #1048

Closed

40 tasks

nikul-serpentcs reviewed Oct 5, 2018

View reviewed changes

yajo force-pushed the 12.0-web_responsive branch from 9576585 to e6fbd84 Compare October 8, 2018 07:22

chienandalu suggested changes Oct 8, 2018

View reviewed changes

yajo force-pushed the 12.0-web_responsive branch from e6fbd84 to c7734d3 Compare October 9, 2018 08:38

chienandalu approved these changes Oct 9, 2018

View reviewed changes

aitorbouzas reviewed Oct 10, 2018

View reviewed changes

web_responsive/models/__init__.py Outdated Show resolved Hide resolved

tarteo requested changes Oct 11, 2018

View reviewed changes

web_responsive/static/src/js/web_responsive.js Outdated Show resolved Hide resolved

web_responsive/static/src/js/web_responsive.js Show resolved Hide resolved

web_responsive/static/src/css/web_responsive.scss Outdated Show resolved Hide resolved

pedrobaeza requested changes Oct 12, 2018

View reviewed changes

Tardo requested changes Oct 12, 2018

View reviewed changes

bealdav reviewed Oct 16, 2018

View reviewed changes

web_responsive/models/res_users.py Show resolved Hide resolved

yajo added work in progress and removed needs review labels Oct 23, 2018

This comment has been minimized.

Sign in to view

OCA-git-bot and others added 8 commits December 10, 2018 13:33

[UPD] README.rst

ac8fa9b

Added translation using Weblate (Danish)

ccb690f

Translated using Weblate (Danish)

9776ce3

Currently translated at 90.0% (9 of 10 strings) Translation: web-11.0/web-11.0-web_responsive Translate-URL: https://translation.odoo-community.org/projects/web-11-0/web-11-0-web_responsive/da/

[IMP] web_responsive: Add search feature (OCA#838)

924c874

* Add feature to search menus in the app drawer * Switch model to RPC

[FIX] web_responsive: Complete search feature forward-porting

68bc0eb

[FIX] web_responsive: Disable access to hidden menus

43e5a7b

When doing menu search, some menus that the user didn't have permission to use were presented to him. Fix OCA#850.

[UPD] Update web_responsive.pot

322b334

[UPD] README.rst

90586c2

yajo force-pushed the 12.0-web_responsive branch from a99f334 to cbcc2c2 Compare December 10, 2018 13:39

Yakulu mentioned this pull request Dec 14, 2018

web_responsive in v12 #1131

Closed

pedrobaeza mentioned this pull request Jan 8, 2019

MIG:12.0 web sheet full width module #1147

Closed

yajo force-pushed the 12.0-web_responsive branch 3 times, most recently from b8fb90c to 7c4da85 Compare January 10, 2019 11:22

yajo added needs review and removed work in progress labels Jan 10, 2019

yajo force-pushed the 12.0-web_responsive branch from 7c4da85 to f5b2069 Compare January 10, 2019 12:00

pedrobaeza mentioned this pull request Jan 10, 2019

[10.0][IMP] account_financial_report_qweb: color scheme OCA/account-financial-reporting#501

Closed

yajo force-pushed the 12.0-web_responsive branch from f5b2069 to 69a7491 Compare January 10, 2019 13:51

pedrobaeza approved these changes Jan 10, 2019

View reviewed changes

pedrobaeza merged commit 4d10311 into OCA:12.0 Jan 10, 2019

pedrobaeza deleted the 12.0-web_responsive branch January 10, 2019 15:32

yajo mentioned this pull request Aug 7, 2020

Design improvements for the backend user interface #1654

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[MIG] web_responsive: Migrate to v12 and refactor #1066

[MIG] web_responsive: Migrate to v12 and refactor #1066

yajo commented Oct 5, 2018 •

edited

nikul-serpentcs left a comment

yajo commented Oct 8, 2018

chienandalu left a comment

yajo commented Oct 9, 2018

yajo commented Oct 9, 2018 •

edited

chienandalu commented Oct 9, 2018

yajo commented Oct 9, 2018

yajo commented Oct 9, 2018

chienandalu left a comment

aitorbouzas left a comment

tarteo left a comment •

edited

pedrobaeza left a comment

Tardo left a comment •

edited

pedrobaeza commented Oct 23, 2018

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

rafaelbn commented Nov 1, 2018

pedrobaeza commented Nov 1, 2018

mgielissen commented Nov 2, 2018 •

edited

pedrobaeza commented Dec 11, 2018

yajo commented Dec 12, 2018

pedrobaeza commented Jan 7, 2019

yajo commented Jan 10, 2019

pedrobaeza left a comment

steync027 commented Jan 11, 2019

mgielissen commented Jan 24, 2019

[MIG] web_responsive: Migrate to v12 and refactor #1066

[MIG] web_responsive: Migrate to v12 and refactor #1066

Conversation

yajo commented Oct 5, 2018 • edited

nikul-serpentcs left a comment

Choose a reason for hiding this comment

yajo commented Oct 8, 2018

chienandalu left a comment

Choose a reason for hiding this comment

yajo commented Oct 9, 2018

yajo commented Oct 9, 2018 • edited

chienandalu commented Oct 9, 2018

yajo commented Oct 9, 2018

yajo commented Oct 9, 2018

chienandalu left a comment

Choose a reason for hiding this comment

aitorbouzas left a comment

Choose a reason for hiding this comment

tarteo left a comment • edited

Choose a reason for hiding this comment

pedrobaeza left a comment

Choose a reason for hiding this comment

Tardo left a comment • edited

Choose a reason for hiding this comment

pedrobaeza commented Oct 23, 2018

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

rafaelbn commented Nov 1, 2018

pedrobaeza commented Nov 1, 2018

mgielissen commented Nov 2, 2018 • edited

pedrobaeza commented Dec 11, 2018

yajo commented Dec 12, 2018

pedrobaeza commented Jan 7, 2019

yajo commented Jan 10, 2019

pedrobaeza left a comment

Choose a reason for hiding this comment

steync027 commented Jan 11, 2019

mgielissen commented Jan 24, 2019

yajo commented Oct 5, 2018 •

edited

yajo commented Oct 9, 2018 •

edited

tarteo left a comment •

edited

Tardo left a comment •

edited

mgielissen commented Nov 2, 2018 •

edited