Commit Graph
4003 Commits
Author SHA1 Message Date
Benoit Socias f9c342374c [FIX] web_editor: allow aligning pictograms to the right in cards
When replacing an image by a pictogram inside columns, the pictogram
right-alignment is neutralised by the fact that the section of the card
inside the column spans over 100% width.

This commit makes pictograms in those sections rely on their auto width
instead - thus letting the right-alignment happen as expected.

Steps to reproduce:
- Drop a "Columns" block.
- Replace an image by a pictogram.
- Select the pictogram.
- Click on the "Float Right" icon in the toolbar.
=> Pictogram remained aligned to the left.

task-2841127

closes odoo/odoo#118684

X-original-commit: c3eae07259cb38656aa910ad98d0da04f4fc7edb
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
Signed-off-by: Benoit Socias (bso) <bso@odoo.com>
2023-04-17 10:34:32 +02:00
Benoit Socias 14bcdbc6f5 [FIX] web_editor: align image to the right
Align images to the right by using an auto left margin.

Steps to reproduce:
- Drop a "Columns" block.
- Select an image.
- Resize image to 50%.
- Align image to the right.
=> Image did not get aligned to the right.

task-2841127

X-original-commit: d2364278371828fa353c17d53fd266350aa2446b
Part-of: odoo/odoo#118684
2023-04-17 10:34:32 +02:00
Benoit Socias 95bb8dc0f8 [FIX] web_editor, website, *: make snippets name translatable
*: mass_mailing, website_blog, website_event, website_mail_group,
   website_mass_mailing, website_payment, website_sale, website_twitter

The names of snippet blocks are not translatable because their name is
obtained from a their template name which is not a translatable item.
For markets that use a non-latin alphabet this is a no go.

This commit makes it possible to specify a `string` attribute in the
`t-snippet` blocks that makes their name inventoried by the translation
process.

closes odoo/odoo#118530

X-original-commit: a501d226d8674ed0c9b183c69a9e754c79682237
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
Signed-off-by: Benoit Socias (bso) <bso@odoo.com>
2023-04-17 08:24:47 +02:00
Benoit Socias f9435feb39 [FIX] web_editor, web_unsplash: use preset colors on illustrations
Since [1] when the media dialog was rewritten, the illustrations
thumbnails were not using the preset colors.

[2] did partially implement the solution: the updated images with the
right colors were not replaced in the DOM.

This commit continues what [2] started and displays the illustration
thumbnails with the preset colors.
It also assigns a media type to all fetched images.

[1]: https://github.com/odoo/odoo/commit/7fd0698cf765a79959566b51e33cb76bff83d344
[2]: https://github.com/odoo/odoo/commit/f2111cb37a572fe1ffd9b303c4abcbb7fe1d67cd

task-3060679

closes odoo/odoo#118556

X-original-commit: 75cc46c4f784edb1fb7404956e1cfdf6fae6a83c
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2023-04-14 11:49:25 +02:00
Younn Olivier 23b2486666 [FIX] web_editor, web_unsplash: scroll to "load more" button upon search
[1] refactored the Media Dialog using owl and the backend Dialog
component.
Doing so, the width of the dialog was reduced (using the standard
.modal-xl class). With that change, the "load more" button was not
always visible for the user.

It is acknowledged that the current Media Dialog needs a deeper UI
review. In the meantime, it was decided to scroll to the bottom after a
search/click on the load more button.

This commit implements that solution with a ref on the "load more" div.
It is used in a scrollToLoadMoreButton, that is called each time after
loading a new attachment/illustration/unsplash record. As we do not want
a jump in the UI each time an image is loaded, the function is
debounced.
It is simpler to use a debounced function that we call each time an
element is loaded, than keeping track of each loaded element to call
the function only once, when they are loaded.

[1]: https://github.com/odoo/odoo/commit/31cc10b91dc7762e23b4bde9b945be0c4ce3fe3b

task-3060679

X-original-commit: 4921442690e6f5b587441a653f73c3368155422e
Part-of: odoo/odoo#118556
2023-04-14 11:49:24 +02:00
Younn Olivier 12c9d85ba2 [IMP] web_editor: load more illustrations only when filter is set
Before this commit, clicking on the 'load more' button of the media
dialog after a search (with no filter set) would load more
attachments/illustrations/unsplash records.

As illustrations are considered less relevant than attachments/unsplash
records, it was decided to load more of them only when the filter is set
to "illustrations".

When the filter is not set, the 'load more' button will be visible only
if there are more attachments or more unsplash images to load (and not
visible otherwise, even if there are more illustrations to load).
Also, the loadMore override will only perform the query to load more
illustrations if the filter is set.

A deeper review of the Media Dialog UI will be conducted later. For now,
this commit avoids loading too many illustrations, for users that are
most of the time more interested in the unsplash results.

task-3060679

X-original-commit: 6aaca71a4b2a11ffa80578904bc7c79c1fa0339d
Part-of: odoo/odoo#118556
2023-04-14 11:49:24 +02:00
Younn Olivier 883f2e2519 [FIX] web_editor, web_unsplash: do not display too many undraw images
Before this commit, typing a query in the search input of the media
dialog would output a lot of undraw images (15), making some noise and
making the unsplash results (that are fetched 10 by 10) less visible.

First, the number of fetched attachments was reduced from 30 to 10 when
converted to owl in [1], for no valid reason. This commit adds a new
NUMBER_OF_RECORDS_TO_DISPLAY value for better control over the loaded
images, and reverts it to 30.

Then, the /web_editor/media_library_search endpoint does not take any
limit param. Therefore, it was loaded with all the results as they were
returned. Now, a new NUMBER_OF_MEDIA_TO_DISPLAY variable is introduced
to load the 10 first results instead of all of them.

This way, the search results are organised as following:
- NUMBER_OF_ATTACHMENTS_TO_DISPLAY (30 for now) attachments,
- NUMBER_OF_MEDIA_TO_DISPLAY (10 for now) media (undraw, ...),
- NUMBER_OF_RECORDS_TO_DISPLAY (30 for now) unsplash images.

These values can be changed to adjust the search (it may be better to
have more unsplash images than undraw images).

[1]: https://github.com/odoo/odoo/commit/31cc10b91dc7762e23b4bde9b945be0c4ce3fe3b

task-3060679

X-original-commit: bc4fe60bcebd3e47f206c911526784a88fd520d9
Part-of: odoo/odoo#118556
2023-04-14 11:49:24 +02:00
Soukéina Bojabza 1a5a14268d [FIX] web_editor: make image options start more robust
This commit makes the image options initialization more robust, by

- checking at the beginning if the specified `src` and `data-original-
src` attributes match with existing files.
- checking if there is a `data-original-src` attribute before applying
the ImageTools options (shape, filter,...).

This is needed because in the case of wrongly hardcoded templates (e.g.
in customizations), it is sometimes not possible to drop any snippet
after dropping an incorrect one. This happens because the image
`SnippetEditor` is not correctly created. Indeed, the start of the image
options is never completed because the promise rejections when a file
does not exist are not properly caught, interrupting the initialization.
Therefore, ensuring that the files exist beforehand prevents these
issues from happening.

opw-3137732

closes odoo/odoo#118546

X-original-commit: 93ddaac87a76d6d1775e0b3e30bb66ca85147503
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2023-04-14 11:49:20 +02:00
Stanislas Gueniffey b49823be4c [IMP] web_editor: powerbox search from description
This commit changes web_editor's powerbox search feature to also look
for matches in a command's `description`, in addition to its `groupName`
and `title`.

For example, typing /track will suggest the Checklist command among the
suggestions as its description is "Track tasks with a checklist".

Note that only exact matches are considered for the description, while
fuzzy matches (with missing chars) work for other attributes.

Also fixes a typo in a local variable name because it was hazardous to
some people's eyesight.

task-3188758

closes odoo/odoo#118486

X-original-commit: 7fa6d48f1b69e4d4806db29310223d326b0e0ed5
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-04-13 17:57:51 +02:00
Benjamin Vray fccac358da [FIX] web_editor: prevents enabling options that are not visible
This commit prevents the activation of options when no option section is
visible, and disables overlay if there are no options to enable.

Steps to reproduce the bug:

- Go to website edit mode (homepage).
- Click on the white area (the <main> element) below the "drag building
blocks here" block.
- Bug: The customize tab is activated in the editor panel, even though
there are no options.

task-3199281

closes odoo/odoo#118461

X-original-commit: af49b1aba1454f80663c4e88e8c4915eb75bd0ff
Signed-off-by: loco-odoo <loco@odoo.com>
2023-04-13 17:57:32 +02:00
Rodolpho Lima d9b1d8f32f [FIX] web_editor: fix mobile toolbar list button
Before this commit, the toolbar, when in mobile mode, had a BUTTON element
containing:
- an icon with a non-unique and unnecessary id,
- a wrong/misleading title.

This commit fixes such issues.

task-3263984

closes odoo/odoo#118446

X-original-commit: d42be84de09ae65d6e8061ce6fb5b8994bc78798
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-04-13 16:40:46 +02:00
Pulinckx Pierre (PIPU) 614de86989 [REF] *: Replace underscore function by native JS
Replace _.isNumber(), _.filter(), _.reject(), _.unique(), _.indexOf(), _.lastIndexOf(), _.findIndex(), _.range()
_.keys(), _.values(), _.str.sprintf() and some _.each()

closes odoo/odoo#118003

Signed-off-by: Géry Debongnie <ged@odoo.com>
2023-04-13 16:40:11 +02:00
Rodolpho Lima 4153c33fc9 [FIX] web_editor: remove non-connected nodes in applyColor command
Before this commit, the `applyColor` command returned non-connected nodes
(nodes with no parent) in some not well-defined situations, leading to a Warning
when `selection.addRange()` was called by `_processAndApplyColor` with
such non-connected node as argument.

This commit properly removes such non-connected nodes from the array returned
by `applyColor`.

closes odoo/odoo#117166

Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-04-13 16:40:08 +02:00
Rodolpho Lima 164df578fc [FIX] mass_mailing, web_editor: add missing toolbar in basic theme
Short read version:

This commit gives the Wysiwyg class the attribution of switching between
the two types of text editor toolbar (floating or part of the sidebar),
instead of the SnippetsMenu class, as Wysiwyg owns the Toolbar instance
and has the methods to configure it.

The switching between toolbars is now done by having one instance of each
type (and properly displaying/hiding them), rather than moving the toolbar
element of place in the DOM and reconfiguring it (button handlers, CSS
classes, displayed/hidded buttons, etc), so that the configuration steps
of each toolbar can be done only once.

The floating toolbar is needed for mailings based on the "basic" theme,
where no sidebar/SnippetsMenu is available. Note that it will be only
instantiated if needed.

Long read version:

The 'basic' theme in mass_mailing has no sidebar (SnippetsMenu), so the
floating toolbar should be available instead, in order to give users access
to the text editor's features.

Commit [1] added the `setFolded` method to the SnippetsMenu class, which folds
(hides) the snippets menu and recovers the floating toolbar from the
sidebar container and vice-versa. While the recovered toolbar works well when
`isMobile` is `true` (although with some minor issues described
below), the one for the non-mobile case does not (as it must be properly
reconfigured using the document's Jquery, and not the iframe's, among other
details).

This commit proposes a different approach to the toolbar recovery issue:
if the floating toolbar is needed (mobile or basic theme), a new Toolbar
instance is instantiated and properly configured. That way the Wysiwyg
instance will hold two instances of the toolbar: the one embedded in the
sidebar (snippets menu) and the floating one. This allows for easy
switching between the two types of toolbar, without the need to run the
configuration steps for the toolbar on every switch.

Such toolbar switching is needed in mass_mailing, where a single instance of
the wysiwyg is kept while the user can switch between different records of
mailings. Some of these records could be based on the 'basic' theme
(thus, no sidebar), and other ones based on other themes that do offer
the snippets menu.

After this commit, the toolbar switching is handled by the Wysiwyg class
instead of SnippetsMenu, as Wysiwyg owns the Toolbar instance(s) and has
the methods to configure it.
The `folded` property of SnippetsMenu and the `setFolded` method are
leveraged by this commit, keeping its original purpose and meaning (except
for the toolbar handling).

Before this commit the floating toolbar for the mobile case had the
following issues, that are fixed by this commit:
- The "table" button was (incorrectly) displayed;
- The default colors of the color picker (the top row) were undefined;
- The 'Link' powerbox command and the toolbar icon should open the Dialog,
and not the LinkTools (part of the sidebar).

Finally, this commit removes the SCSS rules that hide the SnippetsMenu
when the theme in "basic", as its display is already handled by
SnippetsMenu's `setFolded` method, introduced by [1].

[1] https://github.com/odoo/odoo/pull/105472/commits/c589939eeaff928997bf6f9735b19710036f9ad6

task-3133259
opw-3165111

Part-of: odoo/odoo#117166
2023-04-13 16:40:08 +02:00
Deependra Solanki fceffd238b [FIX] web_editor: should not remove tag on backspace in nested li
Before this commit:

When we create a nested list and change a tag of the one of
the list item in nested list and press backspace from start it removes the tag.

After this commit:

Now pressing backspace from the start tag, the tag is not removed.

task - 3147461

closes odoo/odoo#118353

X-original-commit: 7504dc1adc50916b9a408c3307832ab45ed5174b
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-04-13 15:26:57 +02:00
Rodolpho Lima 5190870a7c [FIX] web_editor: remove link when pasting over its content
This commit prevents pasting content inside a link when it is
empty (ZeroWidthSpace only) or its text content is fully selected,
making the pasted content replace the link.

task-3081254

closes odoo/odoo#118204

X-original-commit: 7d0da7f56904927f93ef3d678083f3219fadfdc9
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-04-12 12:26:09 +02:00
Rodolpho Lima 302f279c86 [FIX] web_editor: add missing tests for pasting URLs
This commit adds the following test cases that were missing in the
unit tests suite:

-Paste an image URL or a youtube URL as link

-Paste text containing a valid URL among other text fragments

-Paste text containing multiple URLs

-Test if the selection is properly restored after pasting content on a
non-collapsed range followed by an UNDO.

task-3099012

X-original-commit: 0167b031bc9238893c5b4f09bbda996ed0ee914f
Part-of: odoo/odoo#118204
2023-04-12 12:26:08 +02:00
Rodolpho Lima 267bce176f [FIX] web_editor: fix issues when pasting media URL
Issue # 1: pasting image/video URL as text

This commit removes this command, because it was considered to be useless.

The category names "Embed" and "Paste" for the other two commands
("Paste as URL" and "Embed Image/Video") were ommited as it is no longer
relevant to group commands, as this would result into two categories with
one command each (the powerbox does not display the category name when all
the commands are under the same one - undefined in this case).

Issue # 2: pasting image/video URL + other text fragments

The powerbox commands are not compatible with an image/video URL + text
or multiple URLs. Choosing one of its commands will lead to loss of all
text fragments but the last valid URL.

This commit ensures the powerbox options are only offered when a single
image/video URL is pasted.

Issue # 3: pasting image URL inside an exisiting link

Even though the Editor's specs do not allow a URL to be transformed into
a link when pasting it inside an exisiting link, before this commit,
pasting an image URL inside a link would open the powerbox with 3 commands,
one of them allowing to transform the URL into a link.

This commit ensures the powerbox with the "Paste as URL" command is not
opened in such case. When pasting an image URL inside an existing link, the
image is directly embedded, and other URLs are pasted as text.

Issue # 4: unnecessary regex matching

Before this commit, every text fragment in "text URL text" was being
prepended with "https://" and a match with the URL regex was attempted.
Every fragment (text or URL) was also probed for a match with the
youtube video URL regex, but such matches would be discarded anyway in
modules like note and mass_mailing where the allowCommandVideo option
is set to false.

This commit avoids unnecessary searching with regular expressions by treating
pasting of a single URL (possibly an image or video URL that would lead
to powerbox commands) differently than URLs pasted among other text fragments
or other URLs (see issue # 2 above).

Issue # 5: `historyPauseSteps` with argument

This function takes no arguments. Yet, it was called with the string 'onPaste'
as argument. This commit removes it.

task-3099012

X-original-commit: 3fb93d7e9047a73a8e84f165e2ff52b9887d34a4
Part-of: odoo/odoo#118204
2023-04-12 12:26:08 +02:00
Rodolpho Lima dcd93a6685 [FIX] web_editor: hide powerbox category name when single one
Powerbox commands are grouped under categories.
But this is not very usefull when:
- All commands are under of the same category
- Each command is under a different category

This commit hides the category name when all the commands passed to the
powebox are under the same category.

In order to avoid the second scenario, the commands array should be passed
to `Powerbox.open()` with all commands having the same category name (the name
 does not matter), or even with `category` undefined.

X-original-commit: 93d632861996c78502b33538cc7ff06d8419602c
Part-of: odoo/odoo#118204
2023-04-12 12:26:07 +02:00
Rodolpho Lima d49da8aae4 [FIX] web_editor: restore selection after paste and undo
Before this commit, after pasting a valid URL on a non-collapsed selection
followed by UNDO, the selection was not restored to the original range.
This was due to not recording the selection in the current history step
before creating the link.
After pasting text composed of a valid URL between text fragments on a
non-collapsed selection followed by UNDO, the selection was again not
properly restored. This time, because each text fragment insertion was
done via execCommand, which calls _computeHistorySelection and thus
overwrites the current step's selection.

This commit:
- refactors code for link creation into a single function;
- wraps the link creation at `_onPaste` in a 'insertHTML' command called
via `_applyCommand`, which records the selection properly in the history
step;
- replaces `execCommand` by `_applyCommand` for text fragments
insertion.

task-3099012

X-original-commit: 20bb1a2090c90f87a819fdc1c3bbb332cae3720e
Part-of: odoo/odoo#118204
2023-04-12 12:26:07 +02:00
03dd2513b5 [FIX] web_editor, website: fix website editor as restricted editor
When assigned the role of restricted editor, there are many ways to
break the web_editor when trying to do actions that should be
unavailable. There is a traceback for the following scenarios under
some circumstances (mainly because of pages without editable areas or
features without the proper access rights):

- Drag and dropping snippet when Restricted Editor.
- Clicking on product when Restricted Editor in /shop.
- Clicking on product image on specific product page.
- Clicking on user name (e.g. Marc Demo).
- Clicking on menu items or logo.
- Clicking on a blog's image in /blog.
- Clicking on a blog's image on specific blog page.
- Clicking on calendar's image in /calendar.

There is now no longer a traceback which makes the editor crash or
freeze. This mimics the behavior in other cases where the editor does
not show a traceback, but there is no message indicating that the action
is unauthorized.

When accessing a menu that cannot be edited, the "Edit the menu" button
is not shown to the restricted editor.

task-2747895
opw-3164176

closes odoo/odoo#118116

X-original-commit: 15c85e4f9f967ee04af3cdeb766d280a2c00731e
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
Co-authored-by: Benjamin Vray <bvr@odoo.com>
Co-authored-by: qsm-odoo <qsm@odoo.com>
2023-04-11 16:53:47 +02:00
Soukéina Bojabza 1ef31c2822 [FIX] web_editor: fix history of a drag and drop after a resize
Steps to reproduce:
​- In a snippet in grid mode, resize a column.
- Drag and drop this column in a non-grid dropzone. 
​- Undo.
​=> The column is back in the grid but is still a normal column. The same
happens when doing these steps with a normal column to a grid. 

This happens because the class changes are not observed in these cases.
When fixing the drag and drop history in [1], only the style changes
were observed because the class changes are automatically recorded. But
it is not the case after a resize.

This commit fixes that by also observing the class changes.

[1]: https://github.com/odoo/odoo/commit/1dfb127f70832aa9e9022ac337af343b7dc17729

task-3151207

closes odoo/odoo#117854

X-original-commit: 48b3683c4753f1e385ea1692db9c1a15d32cae30
Signed-off-by: Arthur Detroux (ard) <ard@odoo.com>
2023-04-07 10:32:54 +02:00
Soukéina Bojabza 33dd221b45 [FIX] web_editor: fix some grid layout mistakes/oversights
This commit fixes some mistakes that were found in the code of the grid
layout option. More precisely:

- When a column was dropped near a grid dropzone (so not inside it), and
if its height was bigger than the grid, the `rowCount` attribute of the
row was not updated to the correct number of rows => there was one extra
row.

- When we start dragging a grid item, if we do not go over the starting
grid at all (it happens if the move handle is placed outside of the
row), the `rowCount` of the starting grid was never updated. This is
because the resize is done at the "out" of the dropzone so if there was
no "over", it cannot be done.
=> As a fix, the starting grid is now always resized when we drop the
column.

- When dropping a grid item inside a non-grid dropzone, its `z-index`
CSS property was not removed.

- When a grid item becomes a normal column, when dropping it in a non-
grid dropzone or when toggling the normal mode, the resize classes
(`g-col-lg-*` and `g-height-*`) were not removed from it.

- When a normal column becomes a grid item, the padding and offset
classes were not removed and the `col-` class was not systematically
synchronized with the `g-col-lg-*` class.

=> The two previous points need to be fixed because after doing multiple
drag and drops, the classes could become inconsistent. This happened
especially with columns whose width changes a lot between snippets (like
with Masonry columns, because of the padding).

- When going back to normal mode, the `--grid-item-padding-*` CSS
variables were not removed from the row.

- In commit [1], a comment that should have been modified has been
forgotten.

[1]: https://github.com/odoo/odoo/commit/67d1b078329600efce414974307d74e9fa9ba9fe

task-3151207

X-original-commit: 4afd418e1a1d4231369aab08dfa5c2d10ca9a310
Part-of: odoo/odoo#117854
2023-04-07 10:32:54 +02:00
Pulinckx Pierre (PIPU) 29d55e4403 [REF] *: Replace underscore functions by native JS
Replace _.last, _find, _.extend, _.some, _.every

Taskid 3246238

closes odoo/odoo#117319

Signed-off-by: Bruno Boi (boi) <boi@odoo.com>
2023-04-05 12:50:43 +02:00
Benjamin Vray 0edd492dcb [FIX] web_editor: fix lost rgba colors after shape flipping
In some themes, RGBA colors were used to define the colors of shapes.
However, adding this color in the parameters of the background image URL
of a "shape" element was not valid. This caused several bugs, such as
the colorpicker not finding the colors of the shape used, as well as the
colors of the shape being lost after the application of a "flip".

Steps to reproduce the bug:

- In website edit mode, open the homepage page of the Nano theme.
- Drag and drop a Banner snippet onto the page.
- Bug: The colorpicker does not recognize the four colors used by the
shape.
- Click on one of the two "Flip" buttons.
- Bug: The colors of the shape are lost.

task-2824607

closes odoo/odoo#117652

X-original-commit: 0661aa0bbb4751866cfcc9a320a8eff473ba0442
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2023-04-04 17:03:35 +02:00
Michael (mcm) ff0d6dd580 [REF] *: replace odoo module by native one
This commit converts almost all odoo module by native module.
The goal is to deprecate odoo.define in favor of native module and then
simplify boot.js by removing the regexp that finds module dependencies.

task id: 3162300

closes odoo/odoo#117305

Related: odoo/enterprise#39118
Signed-off-by: Géry Debongnie <ged@odoo.com>
2023-04-03 17:07:24 +02:00
bve-odoo 6c2b889a28 [FIX] *: prevent warnings on runbot and sentry noisy tracebacks
As we have a team dedicated to work on analysing tracebacks
with sentry, and to takedown all tracebacks occuring on the saas,
we do an effort to avoid unecessary warnings and tracebacks
for both sentry and the runbot.

closes odoo/odoo#112101

Signed-off-by: Rémy Voet <ryv@odoo.com>
2023-02-27 17:45:35 +01:00
David Monjoie 416c579bee [FIX] web_editor: fix font size dropdown not closing after select
The title attribute for font size used to be on the first child of
the button. This was simplified in [1] to be on the button instead.
However, having the title on the child rather than the button was
actually intential because Bootstrap 5 only allows to instantiate
one component by node, as specified by [2] which did move the title
attribute from the button to the child in the first place.

task-3253081

[1]: https://github.com/odoo/odoo/commit/e095e62f4af96d14943ebbe5f0da57c897bd44
[2]: https://github.com/odoo/odoo/commit/09b720eff1a7378351e04661d3df1c3be31ee965

closes odoo/odoo#117263

X-original-commit: 9bd380da016db949eaa0f6453a14a24ffaf61928
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
Signed-off-by: Antoine Guenet (age) <age@odoo.com>
2023-04-03 08:37:49 +02:00
Benjamin Vray 1b6354fc06 [FIX] web_editor, *: hide 'column' options in dynamic snippets
*: website_blog, website

Before this commit, when clicking on a column in the "Blog Posts"
snippet (only with the "Big picture layout" template), the options for
that column were displayed in the editor panel, even if options should
never be displayed for the columns of dynamic snippets.

We had already prevented the appearance of options for elements in a
dynamic snippet in this commit [1] and also in this one [2], using a
'pointer-events: none' to prevent clicking on the elements. However, as
this also removed the mouse hover effect, the 'pointer-events: none' was
changed to 'pointer-events: auto', in this other commit [3], for the
"Big picture layout" template of the "Blog Posts" snippet, so that the
user could see the hover effects in edit mode. And by doing so, we
inadvertently allowed the options to appear again.

In the end, this 'pointer-events: none' was not the right solution, as
for example, for the dynamic "Products" snippet, it may be useful in
edit mode to be able to switch between slides by clicking on arrow
buttons, or to see the mouse hover effects on images (slight zoom).

In this commit, we proceeded differently by hiding the options for
elements that are inside an 'o_not_editable' element (unless they have
the attribute and value 'contenteditable="true"'), excluding them when
generating options so that they don't have associated options.

Steps to reproduce the bug:

- In edit mode, drop a "Blog Posts" snippet in the page.
- Click on the first blog image ("Sierra Tarahumara").
- Bug => Resize options are visible when they shouldn't. The options in
the "column" part of the right panel should also not be visible.

[1]: https://github.com/odoo/odoo/commit/64b663fb42ddca67a06cb067c897abb5a3c4dd70
[2]: https://github.com/odoo/odoo/commit/1345e879d809f811641ea3ad388b5d2c0b16f005
[3]: https://github.com/odoo/odoo/commit/3c0d98bcd8adf9325ee3497eb8d25ec7f904d6a5

task-3054763

closes odoo/odoo#117407

X-original-commit: 80f841e5e33f4694361730d3e015a6a813261685
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2023-04-02 20:55:50 +02:00
Jinjiu Liu 51179c706f [FIX] web_editor: translate and add translations for placeholders
Reproduction:
1. Switch to French, create a /heading 1, and input nothing
2. The placeholder “Heading 1” is not translated

Fix: add translate function around the terms and manually add the
translations in pot

Note: since OdooEditor.js is under web_editor/static/lib/web-editor,
only the js code under /static/src/ is considered for translation export
The translation is manually added with specific path. In Odoo 16, the
path is changed to /static/src/ and translations can be exported
correctly. The translation code paths added here should be changed in
Odoo 16

Related PR adding translations: https://github.com/odoo/odoo/pull/93272

opw-3224482

closes odoo/odoo#117142

X-original-commit: 5f297854348e073a3915bca5cec13066f6abe90e
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-03-30 15:09:44 +02:00
Louis (loco) a7363381cb [FIX] web_editor, website: correctly remove the image gallery snippet
Steps to reproduce the bug:
- Add an Image Gallery (IG) snippet on the page.
- Click on "Remove all" to remove all the images of the IG snippet.
- Add 2 new images in the IG.
- Click on the first image of the IG to load its data.
- Click on the trash button to remove the snippet.
- Bug => The snippet is not removed (an image is removed instead).

When a snippet is removed, the `removeSnippet` function is called. The
problem is that the `call_for_each_child_snippet` will never resolve.
Two mechanisms are of interest to understand why: the first one is the
`updateCurrentSnippetEditorOverlay` function. Its goal is to destroy a
snippet each time its target is not in the DOM anymore. The second
mechanism is specific to the IG snippet: when an image of this snippet
is destroyed, the `slideshow` function goes through the remaining
images to update parameters. To do it, the function uses the
`_replaceContent` function that empties the content of the carousel and
then fills it with new data.

When a snippet is removed, a `SnippetEditor` is created for each
element of it. In the case of the IG, a `SnippetEditor` is created for
each image of the the snippet. Because the first image already has a
`SnippetEditor` (because it has been clicked), the callback of
`call_for_each_child_snippet` is called to remove this image from the
IG snippet. The second mechanism explained before will then be called.
Meanwhile, a `SnippetEditor` will be created for the second image.
However, because the `_replaceContent` function emptied the content of
the carousel, the `updateCurrentSnippetEditorOverlay` function will
destroy the `SnippetEditor` of the second image as its target is not
considered present in the DOM anymore. Unfortunately, the
`call_for_each_child_snippet` still needed this `SnippetEditor` and
will never entirely resolve.

To solve this problem, the `removeSnippet` function is executed inside
a mutex. Because the mutex is also used by
`updateCurrentSnippetEditorOverlay`, we are sure that this function
will not destroy the snippetEditor while the `removeSnippet` is still
running.

task-3147271

closes odoo/odoo#116352

X-original-commit: 1c99ab2bc04f65999098f70d062d24ed1ac4a9c3
Signed-off-by: Arthur Detroux (ard) <ard@odoo.com>
Signed-off-by: loco-odoo <loco@odoo.com>
2023-03-27 16:05:05 +02:00
Antoine Guenet c3085b0011 [REF] web_editor: remove clearEmpty
This removes the `clearEmpty` util which was only used in the `enter`
command.

closes odoo/odoo#114178

Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-03-27 13:48:04 +02:00
Antoine Guenet cd114a225c [REF] web_editor: refactor getDeepestPosition
This commit refactors the `getDeepestPosition` function to make it more
concise and easier to maintain and understand.

Part-of: odoo/odoo#114178
2023-03-27 13:48:04 +02:00
Antoine Guenet f7bfc21db9 [REF] web_editor: remove confusing parameter in isVisible
This removes a parameter in `isVisible` that made it consider (wrongly)
all blocks as visible. This made it confusing to use because it was
effectively returning fake news by default.

Part-of: odoo/odoo#114178
2023-03-27 13:48:03 +02:00
Antoine Guenet 989e9165af [REF] web_editor: rename isVisibleEmpty
This commit renames `isVisibleEmpty` to `isSelfClosingElement` to better
reflect what it does.

Part-of: odoo/odoo#114178
2023-03-27 13:48:03 +02:00
Antoine Guenet c109c8ac1d [REF] web_editor: clarify whitespace handling
This refactors the management of whitespace and visibility for clarity
since several concepts were mixed up together.

Part-of: odoo/odoo#114178
2023-03-27 13:48:03 +02:00
Antoine Guenet 7af191db78 [FIX] web_editor: insert empty paragraph on enter at end of heading
When pressing enter at the end of a heading, we want to insert an empty
paragraph instead of a new heading. This failed when the paragraph had
a zero-width space in it because we didn't recognize it as empty.

closes odoo/odoo#116558

X-original-commit: 228e7937f818f5606601e575b1d9a2bb87cda99d
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-03-25 02:46:58 +01:00
Antoine Guenet 68e09ca92d [FIX] web_editor: prevent changing blocks on correct arrow nav near zws
If a block ends with a zero-width space, the mechanism that skips these
characters when using the arrow keys should not skip all the way to the
next block. This is because this mechanism happens before the browser
applies its own behavior for the arrow key so we want to let it skip to
the next block instead (or we'll end up navigating too far).

X-original-commit: acae237410e43e1cf97fc023568f49cc2e974db4
Part-of: odoo/odoo#116558
2023-03-25 02:46:58 +01:00
Antoine Guenet 3d89a2ff91 [FIX] web_editor: preserve style on empty element
Make sure not to remove inline styles when emptying an element.

task-3102841

X-original-commit: 8d0397c99798f05a41276d62a66f47c41f255ef8
Part-of: odoo/odoo#116558
2023-03-25 02:46:58 +01:00
vishal padhiyar 105dd6e4dd [FIX] web_editor: page crash on colour selection
Before this commit:

When we select text and take the selection to the hex input box and then try
again to add a solid color, it gives us a traceback.

After this commit:

Now it did not give traceback.

Task-2965091

closes odoo/odoo#116539

X-original-commit: 981713bd024a98f5d9099bfec8458224dac32a32
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-03-24 19:21:43 +01:00
Louis Wicket (wil) 0c53d28133 [IMP] *: remove "French spacing"
According to Wiktionary, French spacing is "the archaic practice (though
still current in French) of inserting a space around colons, semicolons,
question marks, and exclamation marks". This is not standard practice in
English and most languages of the world.

The purpose of this commit is to start purging the code from this typo,
as it may reflect poorly on the software for some people.

closes odoo/odoo#116167

Related: odoo/enterprise#38542
Signed-off-by: Louis Wicket (wil) <wil@odoo.com>
2023-03-24 12:50:13 +01:00
dhba-odoo 477e4af96d [FIX] web_editor: traceback on empty selection.
Before this commit:

Applying color on empty selection generate traceback.

After this commit:

Now, able to apply color on empty selection.

Task-3089214

closes odoo/odoo#116435

X-original-commit: b4793caddc52b7f4a6a3510a04604b88387e767e
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-03-24 11:08:35 +01:00
FrancoisGe 2ecfed335d [REF] *: extractProps receive dynamicInfo
Before this commit, the use of multiple <field> with the same name in a
view was not well supported.

Why was this?
Some Field components need to know information related to the <field>
such as context, domain, required and readonly. The solution used before
this commit to access this information is to use the getFieldContext,
getFieldDomain, isReadonly, isRequired functions of the model.
Unfortunately, these only take into account the last occurrence of the
<field> because the model is not aware that the same field is present
several times on the view. The information must therefore not come from
the model. For example, it was not possible to have the same field
twice with 2 different domains. It will use the domain of the last
field for both.

Solution:
We will add the object "dynamicInfo" to the fieldInfo passed to the Fields
extractProps function. This object will contain a getter to get the value
of required, readonly, domain and context for the current <field>.
If a Field needs one of its information, it will just have to get it
from extractProps.

Part of Task: 3179751

closes odoo/odoo#115197

Related: odoo/enterprise#38151
Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
2023-03-24 01:24:48 +01:00
Tom De Caluwé 41e3411776 [FIX] website, *: keep table of contents title and menu entries in sync
*: web_editor

The table of contents menu entries are generated automatically which
poses a problem in translation mode. The menu translation entries
are not be editable separately, but the users might be trying to.

This commit shows a notification when the user clicks on the menu
entries while in translation mode, explaining that they are generated
from the title entries.
It was initially intended to use a tooltip - but the amount of code
needed to display a tooltip without marking the DOM as modified is
needlessly complex.

To avoid that styles applied on a plain text during translation were
also appearing in the navigation menu, an attempt at adding a span
around them to make sure that their translation was distinct from the
one inside the main content. But this led to the risk of losing
existing translations.
Because of this, and because that situation seems unlikely, any
remaining style in the navigation menu is instead stripped when the
table of content is started to maintain consistency with what is shown
during translation.

An `o_translation_without_style` class has been introduced to indicate
to the synchronization mechanism that only the text must be replicated
for those elements.
For labels that have a different `data-oe-translation-initial-sha` than
their related header, that value is temporarily kept in another
variable, the value is replaced by the one from the header, which make
the synchronization mechanism properly associate them, then on save
the initial value is restored so that the translation is saved for the
right slot.

task-2752391

closes odoo/odoo#116270

X-original-commit: 5776a358e1b42186d2c26c9bc25010a12811f416
Signed-off-by: Outagant Mehdi (mou) <mou@odoo.com>
2023-03-23 12:14:54 +01:00
vishal padhiyar 78b7e9cca9 [FIX] web_editor: image cropping gives traceback
Before this commit:

The traceback appears after cropping an image and then trying to crop it again.

After this commit:

Cropping an image and then cropping it again won't give us tracebacks anymore.

Task-3134764

closes odoo/odoo#116262

X-original-commit: 83cf218b131c47b711327a224b0a0fd81406e8c3
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-03-23 10:05:50 +01:00
Guillaume (gdi) 4b37b608f2 [FIX] web_editor: prevent saving a non-supported video
Before this commit, error messages appeared when a user tried to put an
unsupported video on a page of his website, but the user could still add
this bad video on his page, which broke it.

Steps to reproduce the bug fixed by this commit:
- On a page of a website in edit mode, double-click on an image.
- Go to the video tab and type an unsupported URL like google.com.

=> An error message appears but the user can still add the media on his
page which will break it.

opw-3167707

X-original-commit: 32cd18895ffcf40e4fec4c5674fa97f6663c7f0d
Part-of: odoo/odoo#116128
2023-03-22 13:42:54 +01:00
Antoine Guenet 6fddef5572 [FIX] web_editor: restore mass_mailing's Mail Debug tab's embedded style
An error during the conversion of the html field to Owl caused the
embedded style of the Mail Debug tab to be lost because they were inside
a `<link>` element rather than in a `<style>` element.

closes odoo/odoo#115863

X-original-commit: 218909a339b2f3937e6d6f72fd0c6ff62aa305ce
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
2023-03-20 16:51:44 +01:00
Martin Trigaux 1be5eae8ef [I18N] *: remove nl_BE files
They dates from < 2027 and are quite outdated. Favour the nl
translation instead.
n_BE is not on Transifex so it was not possible to correct bad
translations.

closes odoo/odoo#115845

X-original-commit: d04c8b7e484db8306d858c891a7a2b11885fdcd9
Signed-off-by: Martin Trigaux (mat) <mat@odoo.com>
2023-03-20 16:51:30 +01:00
Jeremy Kersten 81a875fcaa [FIX] web_editor: adapt color of svg support rgba with space
Before this commit, we only support rgba(xxx,yyy,zzz,v.www)
Now we support also rgba(xxx, yyy, zzz, v.www)

How to reproduce:
Edit theme color secondary, chose a color with transparency.
Go to a 404 page and the pinky will be not loaded.

closes odoo/odoo#114486

X-original-commit: e418c912509999e44bcfc5325f3df6844af9bfe6
Signed-off-by: Jérémy Kersten <jke@odoo.com>
2023-03-19 15:49:04 +01:00
Mathieu (mano) 934069f834 [IMP] web_editor, mass_mailing: add and sort shapes
This commit is the first step towards the addition of various SVG shapes
for the website app.

The purpose of this commit is to add the new shapes SVGs and to sort the
current shape menu into new categories.

The avoid duplicating the shapes added in mass_mailing, the 3 shapes:
   - Circle
   - Slanted
   - Triangle (corner)

Are now in the web_editor, their existing reference in mass_mailing
template have have been changed to their new locations. To adapt to
`b1a3a3b18370ad76280726298602815769dce1c2` the paths have been changed
and a new record for `s_tech_default_image.jpg` have been created in
the new file `mass_mailing_themes/data/ir_attachment_data.xml` since 
it's an image only used in themes. (Also removing  `noupdate=0` from
the data element in `mass_mailing/data/ir_attachment_data.xml` 
since it is the default value).

I also removed the .png and old .jpg of this image since now the shape 
is applied directly on the image. 

Since the shapes + their image are converted in a base64 img+svg on
save, we can move the assets of the current website shapes in use 
without compatibility issue. Therefore these shapes were renamed and 
moved their new folder category.

The SVG width and height of the new and previous shapes was set to
600x600 since they are mostly squarish and are going to be rendered in a
square preview in the future.

To simulate the future preview of the shape selection menu, the
`we-button img` width was set to
`$o-we-sidebar-content-field-dropdown-grid-item-height` and the
`we-button` width to `1/4` in the file `wysiwyg_snippets.scss`.

It makes the preview 60x60 and displayed in a four tiles layout.

Note : 

- If later on the SVG are rendered as inline-svg rather than base64
the current IDs inside the .svg might conflict if multiple svg are
on the same page.

- The previous shapes might look a bit weird with the squarish ratio
in preview, alternatives solutions should be explored during the 
implementation of the new UI. 

task-3094258

closes odoo/odoo#110673

Signed-off-by: Romain Derie (rde) <rde@odoo.com>
2023-03-17 23:24:06 +01:00