The media dialog was refactored using owl.
It can be displayed via the dialogs service.
The (Image/Document/Icon/Video)Selector components are controlled by the
state of their parent, the MediaDialog: this.selectedMedia.
Some things differ from the original implementation: the dialog still
takes (optionally) a media as a parameter, but it does not directly
modify it anymore.
It will pass the selected media as a parameter to a callback, save, that
it gets as a prop. That save prop should be responsible to make the
appropriate modification to the original media, given the new selected
media.
The code opens up for an easy multiSelect of other tabs than the images
(multiIcons, multiDocuments), but that use case is not currently tackled
and maybe it would be better to simplify the code.
See merge commit for more information.
task-2687506
Use a BlockIframe component when the iframe is being reloaded,
use the new loading spinner in the web_editor.
Scroll the snippet into view when reloading the editor.
See merge commit for more information.
task-2687506
SmoothScrollOnDrag and jquery-ui, the libraries used to handle the drag
and drop of the snippets, are using the HTMLElement
getBoundingClientRect method on the draggable/droppable elements to get
their position, listen to mouseover events and trigger scroll while
dragging.
With the WebsiteEditorClientAction's iframe, the getBoundingClientRect
method of elements inside the iframe was not taking into account a
possible offset of the iframe. For example, in the "mobile preview"
edition mode, the iframe was reduced in size and centered in the screen.
This commit adds this offset to these libraries:
- in SmoothScrollOnDrag, when the drag is started, to correctly trigger
the scroll inside the iframe.
- the insertion zones' getBoundingClientRect (used for the jquery-ui
droppable) is patched.
- the SnippetEditor.cover method is adapted to correctly display the
handles over the snippets.
See merge commit for more information.
task-2687506
On website, the edition is done in an iframe while the SnippetsMenu
resides outside of said iframe. This means that the SnippetsMenu no
longer has frontend styles. Therefore, colors aren't accurate.
This commit aims at patching web_editor widgets, such as color_palette,
so that the color displayed is always accurate. To do so, it computes
the color inside the iframe and adds style attributes to color_palette
preview elements.
See merge commit for more information.
task-2687506
The redirect helper js script can now redirect directly to the backend
in edit mode if it has the ?enable_editor.
See merge commit for more information.
task-2687506
*: website_blog, website_event, website_forum, website_links,
website_livechat, website_slides, survey, web_editor
This commit removes the website navbar root widget, as the edition is
now handled in the backend through the client action and custom menus.
It removes associated widgets and their css.
See merge commit for more information.
task-2687506
*: mass_mailing, web, web_editor, website_blog, website_event,
website_event_meet, website_livechat, website_sale, website_twitter,
base
This commit does 3 things:
- Adapt existing code so that the editor can be run outside of its
editing element. Prior to this commit, it was expected that the
editor would be attached to the element it was currently editing.
This needs to change however as the editable is now inside an
iframe for the website edition. mass_mailing already had a similar
approach but the editor was started within the iframe.
With these changes, the editor is alongside the iframe, editing
the content that's inside it. This allows multiple features
such as reloading the iframe while keeping the editor visible and
resizing the iframe for a mobile preview.
- Adds logic to the wysiwyg_adapter so that it can undertake
the duty of the previous widget sytem. The wysiwyg existed not only
in the legacy widget system, but most importantly in the frontend.
One of the duties of this adapter is to send events inside the
iframe when it is necessary to reach the frontend public widget
(i.e. widgets_start_request)
- Removes existing SCSS that is no longer used.
See merge commit for more information.
task-2687506
This commit takes previously existing code and moves it to the new
location where it will be currently used by the new website editor.
Some SCSS rules were now necessary in both the frontend and the backend
(i.e SCSS for o_we_shapes). Optimizations about assets will follow this
merge.
Some code were moved to new components (i.e reloadBundle moved from
snippets.options to wysiwyg_adapter)
And some code was taken away from widgets that will be removed
(i.e edit.js).
See merge commit for more information.
task-2687506
This commit adds 2 components essential to website edition.
- WysiwygAdapterComponent: Allows the legacy @web_editor/wysiwyg widget
to work in an OWL context. It will be further expanded in the next
commit to fully replace the previous edit.js which was the initial
widget that started the edition prior to this commit / branch.
- WebsiteEditorComponent: This component is in between WebsitePreview
and the adapter. It allows some tricks described below.
The reason this is split in two component is because, for now, when
the page needs reloading, the editor component will clone the content
of the widget, destroy the Wysiwyg, and restart it. This ensure that
every event is properly bound and gives the illusion that the wysiwyg is
never destroyed.
See merge commit for more information.
task-2687506
After this commit, the customize_show views are automatically added in
the editor panel as page options in the "customize" tab.
Most of the customize_show views have been replaced by snippets options
but for some it was better to keep an auto population system so as not
to have to create too many bridge modules when it's not worth it
(e.g. My Portal page).
See merge commit for more information.
task-2710582
Since this commit [1], we don't want to display the "List View of
Variants" option on the product page if option "Variants" in settings
was disabled. Now that the customize show menu options have become
snippet options in edit mode, the code to do this has been adapted.
[1]: https://github.com/odoo/odoo/commit/1cd63d81908511ee136f0ca2600d85eab48f258f
task-2710582
*: website_crm, website_crm_partner_assign, website_customer,
website_forum, website_hr_recruitment, website_membership,
website_slides, website_slides_forum
This commit adapts "customize show" options from several website modules
by creating new options available in edit mode.
See merge commit for more information.
task-2710582
*: website_event_meet
This commit adapts "customize show" options from website event modules
by creating new options available in edit mode. These "customize show"
options used custo JS code which was adapted to work with the global
options system.
See merge commit for more information.
task-2710582
As the first commit of the merge of this work at [1], this moves files
without modifying them to preserve code history and ease forward-ports.
As this was about static XML being converted into python XML, it was
not done in the first commit but just before the relevant commit.
See merge commit for more information.
task-2687506
*: website_event_exhibitor, website_event_track
This commit adapts "customize show" options from website event modules
by creating new options available in edit mode.
See merge commit for more information.
task-2710582
This commit adapts "customize show" options from the website blog module
by creating new options available in edit mode.
See merge commit for more information.
task-2710582
*: website, website_sale_comparison, website_sale_loyalty,
website_sale_slides, website_sale_wishlist
This commit adapts "customize show" options from website sale modules by
creating new options available in edit mode.
See merge commit for more information.
task-2710582
With this commit, clicking on the "customize" tab automatically
activates the page options (if there are any). This commit also replaces
the name of the "style" tab by naming it "customize".
task-2710582
This commit introduces a new way to set the title of an option section
in the customize panel. The title can now be filled in a new "string"
attribute in the template of an option.
See merge commit for more information.
task-2710582
Before this commit, clicking on the breadcrumb item "Website Editor"
after an "Edit in backend" systray item click would not redirect to the
edited object path. It would redo the website_editor action with the
initial params (most often path is undefined, and the component will by
default redirect to '/').
Now, when clicking on the "Edit in backend" systray, the frontend path
of the edited object is saved in the service. The client action
component takes it as the default path for the iframe if there is one.
See merge commit for more information.
task-2687506
Before that commit, after the OWL2 rebase, the website systray items
were shuffled following those steps:
- Install website_blog
- Go to the posts list
- Click on a post
-> Until now, the systray items are correctly sorted
- Go back to the posts list, clicking on the blog navbar menu
-> Items are shuffled
For now, a temporary fix is to add an empty div with the index of the
item as the data-attribute to somehow force the rerender of the systray
items. That bug should be investigated further.
See merge commit for more information.
task-2687506
*: website_blog, website_event, website_forum, website_livechat,
website_sale, website_sale_slides, website_slides,
website_slides_forum
The goal of this commit is to add dialogs to create new website content
using a 'target:new' action on the form view and an overridable
"website" form controller.
See merge commit for more information.
task-2687506
*: website_event, website_forum, website_slides
As the first commit of the merge of this work at [1], this moves files
without modifying them to preserve code history and ease forward-ports.
This part is about moving static XML to non-static files where the
XML will be changed into view definitions (as some UI now become normal
backend views). This cannot be a standalone working move of course.
So it was not done in the first commit but here, just before the
relevant commits of the merge.
[1]: https://github.com/odoo/odoo/pull/89223
See merge commit for more information.
task-2687506
*: website_blog, website_customer, website_event_exhibitor,
website_event_track, website_hr_recruitment, website_sale,
website_slides
See merge commit for more information.
task-2687506
After OWL next was merged, an error popped up while patching the Navbar
currentAppSections getter, coming from the Enterprise NavBar render.
A setter was added on the Navbar component to allow for the patch.
See merge commit for more information.
task-2687506
This commit also suggests a way to conditionnaly display menus. Here the
website edit menu should only be visible when the website is displayed.
There may be a better way to filter out some menus. That feature will
be reviewed anyway as part of a `patch` the framework team would like to
avoid.
See merge commit for more information.
task-2687506
This commit adds a generic Dialog component, for the website.
It has a default footer with two buttons.
See merge commit for more information.
task-2687506
*: website_blog, website_event, website_forum, website_hr_recruitment,
website_livechat, website_sale, website_slides
The NewContentModal component is added. It displays tiles, which will
install a module if not already installed, or perform an action defined
by the module otherwise. So that modules can patch that component to
define an action when installed (for example, website_sale will handle
the logic of creating a new product), the elements to displayed and
their state (NOT_INSTALLED, INSTALLING, INSTALLED) are listed in the
state of the component.
A key 'isDisplayed' is added on the new content elements that should not
be displayed to the user, depended on his security groups.
By default, the new content elements are displayed to the system user.
See merge commit for more information.
task-2687506
After OWL next was merged, an error popped up while patching the Navbar
systrayItems getter, coming from the Enterprise NavBar render. A setter
was added on the NavBar component to allow the patch.
task-2687506
This commit adds a new website_systray registry, that the patched navbar
will use when the user is editing the website through the WebsitePreview
client action.
This patch is subject to debate with the framework team, it will be
discussed further post-merge.
See merge commit for more information.
task-2687506
Co-authored-by: Arthur Detroux <ard@odoo.com>
This commit adds an underlying iframe, below the main one used to
display the website.
This iframe, used as a fallback inbetween the events 'beforeunload' and
'load' of the main iframe, will host its replicated content to avoid
seeing white flashes.
These white flashes can happen on Chrome Linux and Windows - even on a
regular navigation - but are even more visible in the context of an
iframe.
See merge commit for more information.
task-2687506
*: auth_signup, portal, web, website_knowledge
When navigating in the iframe, only same origin redirections should be
open in the iframe contentWindow. External redirections should be done
in the top window.
Some internal pages had to be served with X-Frame-Options header set to
SAMEORIGIN, and Content-Security-Policy to "frame-ancestors 'self'" (see
[1]).
All the links that are redirecting to another host, and the client
actions, are opened in the top window.
Exemples that will be opened in the iframe's top window:
- Clicking on a link google.be that should not open in a new tab
- Clicking on the language selector and adding a new one, or
clicking on "logout".
[1]: https://github.com/odoo/odoo/pull/78298#discussion_r898853383
See merge commit for more information.
task-2687506
Co-authored-by: Arthur Detroux <ard@odoo.com>
Co-authored-by: qsm-odoo <qsm@odoo.com>
*: portal
The user dropdown (containing link to /my and a link to logout) now also
contains two other links (provided the user has the access rights):
- Link to the backend (app switcher for enterprise)
- Link to the website client action to configure the current page
See merge commit for more information.
task-2687506
The browser's url is replaced when navigating inside the website from
the client action's iframe.
Exemple:
"/web#action=website.website_preview&path=/shop" becomes "/shop".
See merge commit for more information.
task-2687506
This commit adds a new client action, that will display the frontend
website in an iframe, inside the backend.
Besides that iframe will be instantiated the edition components (the
snippets menu, or the translate menu).
This allows for a better integration with the other odoo apps, an easier
mobile edition. It also avoid reloading the edition components when
navigating inside the website.
See merge commit for more information.
task-2687506
*: web_editor, web_unsplash, website_event, website_blog,
website_event_meet, website_forum, website_links, website_livechat,
website_sale_slides, website_slides
With [1], many files will move as the website UI is moved in the
backend. This commit moves all the static files (JS/CSS/XML) to their
final destination without modifying them, in an attempt to preserve
some history and ease some forward-ports.
After this commit, everything works as before as the files are simply
renamed and the references to them adapted.
However, technically, many files will actually be split into multiple
files by the work made with [1]. While it is theoretically possible to
preserve history over multiples files, this would require inner merge
commits, which does not go well with robodoo. In those cases, the "main"
file of the split was chosen. Mainly, 4 worth-noticing splits were
detected (and so the history moved only to the first file):
move: addons/web_editor/static/src/js/wysiwyg/widgets/media.js
to: addons/web_editor/static/src/components/media_dialog/file_selector.js
- addons/web_editor/static/src/components/media_dialog/search_media.js
- addons/web_editor/static/src/components/media_dialog/image_selector.js
- addons/web_editor/static/src/components/media_dialog/document_selector.js
- addons/web_editor/static/src/components/media_dialog/icon_selector.js
- addons/web_editor/static/src/components/media_dialog/video_selector.js
move: addons/web_editor/static/src/js/wysiwyg/widgets/upload_progress_toast.js
to: addons/web_editor/static/src/components/upload_progress_toast/upload_progress_toast.js
- addons/web_editor/static/src/components/upload_progress_toast/upload_service.js
move: addons/website/static/src/js/menu/content.js
to: addons/website/static/src/components/dialog/edit_menu.js
- addons/website/static/src/components/dialog/page_properties.js
- addons/website/static/src/components/wysiwyg_adapter/page_options.js
- addons/website/static/src/js/website_page_list.js
move: addons/website/static/src/js/menu/edit.js
to: addons/website/static/src/components/wysiwyg_adapter/wysiwyg_adapter.js
- addons/website/static/src/systray_items/edit_website.js
- addons/website/static/src/components/editor/editor.js
Notice that as those moves were made post-work and the rest of the work
(80+ commits) rebased on top of it, some commits may remove more than
they should in a moved file to then reimplement some of what was
removed in a later commit... ideally this should have been avoided of
course but keep in mind that the final files are just entirely rewritten
and split as converted to OWL. It seemed however worth it to keep most
of the inner history of the work made here to see step by step what was
done. [1] will obviously be merged with a merge commit, binding the
whole work together.
[1]: https://github.com/odoo/odoo/pull/89223
task-2687506
The string concatenation would fail on False help_message.
Closes#93036closesodoo/odoo#94505
X-original-commit: 97e066b4cfda8ac34208f84753a40c10524ae989
Signed-off-by: Kevin Baptiste <kba@odoo.com>
Younn Olivier