Commit Graph
1629 Commits
Author SHA1 Message Date
stefanorigano (SRI) cc41abf137 [IMP] web_editor: limit dropdown's thumbs size
Part of https://github.com/odoo/odoo/pull/56427
task-2264627

X-original-commit: 23b8ff9ab4e6609fcfb37da6975ad54315d3e701
2020-08-28 08:19:44 +00:00
e0011d883d [IMP] website: add footer "scroll-to-top" button option
Part of https://github.com/odoo/odoo/pull/56427
task-2264627

X-original-commit: b1ad74398d6f0ab7bc1795b9b80366b9fd2af66f
Co-authored-by: stefanorigano (SRI) <sri@odoo.com>
Co-authored-by: Cocographique <nmi@odoo.com>
2020-08-28 08:19:33 +00:00
Benjamin Vray e72b153fe0 [FIX] web_editor: fix snippet top options
Before this commit some top option buttons were badly positioned
(see Carousel options).

task-2312878

closes odoo/odoo#56353

X-original-commit: 196c2e72ba5b212eccd2bba7ad33c870e0a40c70
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2020-08-22 20:10:08 +00:00
qsm-odoo bbe117e107 [IMP] web_editor, website: introduce foldable zones in the editor UI
Now any set of widgets and rows can be placed in a we-collapse element
so that those elements can be foldable. The first element inside (or
the mentioned "string" on the we-collapse element itself) is used as the
always shown element (with a toggler on its left to toggle the
visibility of the other items).

we-collapse inside other we-collapse is supported as well.

Limitations / Other infos:

- The use of '⌙' and &emsp; characters is not automatic (yet?).
  Sometimes it actually make sense to use them without a we-collapse or
  to not use them in a we-collapse.

- The use of we-collapse is limited to widgets inside the same option.
  So unfortunately, there is no current way to add all bg image options
  in a folable section as those contain many different options. Maybe
  in the future.

Part of https://github.com/odoo/odoo/pull/56350

closes odoo/odoo#56352

X-original-commit: d9c450ac97de40c71aebd487cff725bfda6a577b
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2020-08-22 17:51:32 +00:00
qsm-odoo 9ab62a9bc6 [FIX] web_editor: allow we-title alone in an option
It was already working but not perfectly aligned.

Part of https://github.com/odoo/odoo/pull/56350

X-original-commit: 95239e523b194777b58e8dd9a409a93404b44c6d
2020-08-22 17:51:32 +00:00
Samuel Degueldre 809fefbe81 [FIX] web_editor: fix small gaps between shapes and their environments
Because of the way browsers render SVGs as background images, background
SVGs will sometimes not perfectly hug the top or bottom of their
containers because of rounding in the calculation of the width from the
height, or height from the width.

This commit fixes a number of the shapes displaying this behaviour, by
making their viewbox a perfect square, this means that whenever the
width or height of the SVG is determined by the brower, it will use the
same number for the height or width respectively because the aspect
ratio is exactly one, rather than using the closest integer
approximation of the aspect ratio, which causes those artifacts.

task-2319484

closes odoo/odoo#56200

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2020-08-22 07:59:59 +00:00
Samuel Degueldre 42abf8f496 [IMP] web_editor: add webgl image filters
This commit adds webgl image filter to the existing image options,
including a custom filter that lets the user access color-correction
options (saturation, brightness, contrast, sepia, ...) as well as
blending modes for color filters.

Part of https://github.com/odoo/odoo/pull/53114
task-2279190

closes odoo/odoo#53114

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2020-08-19 08:32:23 +00:00
Samuel Degueldre 4575c188c4 [IMP] web_editor: add amount parameter to colorMatrix
When compositing filters, it is often the case that you only want to
partially apply a filter. This commit adds an optional "amount"
parameter to the colorMatrix filter, and computes a weighted average
between the identity matrix and the passed in colorMatrix. This
parameter defaults to 1, meaning the effect is applied in full if no
amount is specified.

This is a change in the webgl-image-filter library, currently awaiting
merge into upstream at https://github.com/phoboslab/WebGLImageFilter/pull/25

Part of https://github.com/odoo/odoo/pull/53114
task-2279190
2020-08-19 08:30:41 +00:00
Samuel Degueldre 2b1764d879 [ADD] web_editor: add webgl-image-filter library for image filters
Part of https://github.com/odoo/odoo/pull/53114
task-2279190
2020-08-19 08:30:15 +00:00
qsm-odoo 7ef484377a [IMP] web_editor: add delete button on snippet overlay
This commit adds a trash icon on the snippet overlay to delete the
snippet without using the left panel button.

task-2314805

closes odoo/odoo#55612

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2020-08-17 09:31:58 +00:00
stefanorigano (SRI) 772c967abd [IMP] web_editor: review 'o_we_image_weight' design
Part of https://github.com/odoo/odoo/pull/55959
task-2157252

closes odoo/odoo#55959

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2020-08-14 19:19:48 +00:00
stefanorigano (SRI) 374ce7759e [IMP] web_editor, website, *: adjust general ui spacing/alignment
*: website_form

Part of https://github.com/odoo/odoo/pull/55959
task-2157252
2020-08-14 19:19:48 +00:00
stefanorigano (SRI) bc77998998 [IMP] web_editor: add 'shape' option svg icon
Part of https://github.com/odoo/odoo/pull/55959
task-2157252
2020-08-14 19:19:48 +00:00
qsm-odooandstefanorigano c8afa7f6bb [IMP] web_editor, *: add caret icon to dropdowns & colorpicker modal
*: website

Part of https://github.com/odoo/odoo/pull/55959
task-2157252

Co-authored-by: stefanorigano (SRI) <sri@odoo.com>
2020-08-14 19:19:48 +00:00
stefanorigano (SRI) 2143b8a6b7 [IMP] web_editor: refine overlay handlers design and behavior
Part of https://github.com/odoo/odoo/pull/55959
task-2157252
2020-08-14 19:19:48 +00:00
stefanorigano (SRI) 0431c49790 [IMP] web_editor: allow 'we-button-group' to increase its size
Allow 'we-button-group' to increase its size when it's the only option
inside an option field.

Part of https://github.com/odoo/odoo/pull/55959
task-2157252
2020-08-14 19:19:47 +00:00
stefanorigano (SRI) aa69ba54e8 [IMP] web_editor, *: make general adaptations of the editor UI
*: website

Part of https://github.com/odoo/odoo/pull/55959
task-2157252
2020-08-14 19:19:47 +00:00
stefanorigano (SRI) 5f48af4570 [IMP] web_editor: increase font-size/spacing of the editor UI
11px was set as default font-size when achieving 5 or 6 edition levels
in the sidebar was the norm. Thanks to the snippet's cleanup, resulting
in a reduced number of editable elements, we can now increase the
default fon-size and, consequentially, all general spacings.

Part of https://github.com/odoo/odoo/pull/55959
task-2157252
2020-08-14 19:19:47 +00:00
stefanorigano (SRI) ab3ebfb96d [IMP] web_editor, *: review 'options' tab specific components design
*: website

Part of https://github.com/odoo/odoo/pull/55959
task-2157252
2020-08-14 19:19:47 +00:00
stefanorigano (SRI) 4cfe66cebd [IMP] web_editor: review colorpicker selected color visibility
Part of https://github.com/odoo/odoo/pull/55959
task-2157252
2020-08-14 19:19:47 +00:00
stefanorigano (SRI)andqsm-odoo fdbcf87228 [IMP] web, web_editor: review colorpicker design
Part of https://github.com/odoo/odoo/pull/55959
task-2157252

Co-authored-by: qsm-odoo <qsm@odoo.com>
2020-08-14 19:19:47 +00:00
stefanorigano (SRI)andqsm-odoo 95cbf79325 [FIX] web_editor: properly toggle the disabled prop of the "Style" tab
Part of https://github.com/odoo/odoo/pull/55959
task-2157252

Co-authored-by: qsm-odoo <qsm@odoo.com>
2020-08-14 19:19:47 +00:00
stefanorigano (SRI) 93176bf3d7 [REF] web_editor, website: allow reusing tabs design
Part of https://github.com/odoo/odoo/pull/55959
task-2157252
2020-08-14 19:19:47 +00:00
stefanorigano (SRI)andqsm-odoo 5bcdcbceaa [IMP] web_editor, website: review snippets library design
Especially review disabled, hover, install and custom snippet states.

Part of https://github.com/odoo/odoo/pull/55959
task-2157252

Co-authored-by: qsm-odoo <qsm@odoo.com>
2020-08-14 19:19:47 +00:00
stefanorigano (SRI) f3e3e25938 [IMP] web_editor: review we-customizeblock-options border
Part of https://github.com/odoo/odoo/pull/55959
task-2157252
2020-08-14 19:19:47 +00:00
qsm-odoo c5fee9d009 [FIX] web_editor, *: restore custom snippets thumbnails
*: website

Since [1], the thumbnails of the saved snippets were not right anymore,
all fallbacking to the default image. This is because snippets thumbs
now use svg files instead of png and the snippet saving feature did not
allow it. This commit fixes that and makes the feature more robust.

- Allow to use any original thumbnail, and not only for website app.
- Remove useless defaut image, a fallback for when the feature is broken
  is useless.
- Identify snippets by key instead of by main class (possible since
  the new `data-snippet` attribute on snippets).

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

closes odoo/odoo#55896

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2020-08-13 15:44:48 +00:00
xO-Txandqsm-odoo 41527531b7 [IMP] web_editor, *: add snippets search filter
*: website

Add a search bar at the top of the "Blocks" tab to filter snippets.

Part of https://github.com/odoo/odoo/pull/55272
task-2309832

closes odoo/odoo#55272

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
Co-authored-by: qsm-odoo <qsm@odoo.com>
2020-08-13 14:29:20 +00:00
qsm-odoo 8a48e99e19 [IMP] web_editor: prevent removing data-oe attrs of snippets thumbs
Before this commit, all the data-oe-* attributes were removed from
the snippet panel on editor loading. Some were actually added then
removed by the same function... probably for historic reasons. All of
this is now useless, this commit takes also the opportunity to modernize
that all code section and removes other code which was there for
compatibility reasons too.

Now, the data-oe-* on snippets thumbs are kept (as some will actually
be used by upcoming commits). This commit just makes sure no data-oe-*
is left on the snippet bodies themselves.

Part of https://github.com/odoo/odoo/pull/55272
task-2309832
2020-08-13 14:25:06 +00:00
qsm-odoo f563b0c782 [IMP] web_editor: allow min, max and step param on range widget
Part of https://github.com/odoo/odoo/pull/47313
task-46147
2020-08-10 14:27:00 +00:00
qsm-odoo 42e1d4ca60 [IMP] website, *: enable the parallax option for all snippets
*: web_editor, website_blog

Unfortunately, this feature revealed a new batch of flaws in the
editor widgets system so some hacks were made to make it work. We will
always have the time to improve the pure technical side later.

This commit also separates the notion of color filter from the notion
of parallax. A color filter can now be applied independantly, when
there is either a background image or a background video. Applying a
color filter on top of a background video is actually a new feature.
Applying a color filter on top of a background image is actually now
achievable by two different ways: this new color filter layer or by
applying the color transformation on the image itself via the related
option. Depending on the user case, both could make sense at the same
time, but more importantly: having a CSS color filter is useful for
using those for default Odoo content (e.g. like the current contact us
page where we use a cover banner with an image with a black filter on
top of it: doing that without CSS color filter would mean to alter the
image directly which would not be ok when the user changes the image).
Also, sometimes you want the unfiltered image on a page and the exact
same one but filtered on another (for example: forum images).

Note: this commit also "fixes" an issue: the optimization feature for
images when parallax was enabled was not available before.

Part of https://github.com/odoo/odoo/pull/47313
task-46147
2020-08-10 14:27:00 +00:00
stefanorigano (SRI) 9830ee75e0 [IMP] web_editor: restore bootstrap's default monospace font-family
Part of https://github.com/odoo/odoo/pull/55645
task-2157252

closes odoo/odoo#55645

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2020-08-07 22:14:22 +00:00
stefanorigano (SRI) 4c6775ee6c [IMP] web_editor: review dropdown design
Part of https://github.com/odoo/odoo/pull/55645
task-2157252
2020-08-07 22:14:22 +00:00
stefanorigano (SRI) b7098ddf2c [IMP] web_editor, website: review color combination preview
Part of https://github.com/odoo/odoo/pull/55645
task-2157252
2020-08-07 22:13:18 +00:00
stefanorigano (SRI) b8717c5b72 [FIX] web_editor: use border-radius on we-button-group edge buttons only
Part of https://github.com/odoo/odoo/pull/55645
task-2157252
2020-08-07 22:13:18 +00:00
stefanorigano (SRI) 36a8e2a791 [REF] web_editor, *: allow reusing links and buttons design
*: website

Part of https://github.com/odoo/odoo/pull/55645
task-2157252
2020-08-07 22:13:18 +00:00
stefanorigano (SRI) 0838a211fa [FIX] web_editor: fix typos on variable definitions
Part of https://github.com/odoo/odoo/pull/55645
task-2157252
2020-08-07 22:13:17 +00:00
stefanorigano (SRI) eb98420c11 [REM] web_editor: remove <img/> tag support in snippets library
Since v13, snippet's thumbs are rendered as background images using the
't-snippet' instruction.
This code was kept for back-compatibility.

Part of https://github.com/odoo/odoo/pull/55645
task-2157252
2020-08-07 22:13:17 +00:00
stefanorigano (SRI) bc7d021946 [IMP] web_editor: review range widget dimensions
Part of https://github.com/odoo/odoo/pull/55645
task-2157252
2020-08-07 22:13:17 +00:00
stefanorigano (SRI) 25acf9b176 [IMP] web_editor: change editor panel default font-weight
Part of https://github.com/odoo/odoo/pull/55645
task-2157252
2020-08-07 22:13:17 +00:00
stefanorigano (SRI) a0c324ee7b [IMP] web_editor: reposition snippets' thumbs
Part of https://github.com/odoo/odoo/pull/55645
task-2157252
2020-08-07 22:13:17 +00:00
stefanorigano (SRI) 8d5003db99 [IMP] web_editor: make some color adjustments for editor panel
Part of https://github.com/odoo/odoo/pull/55645
task-2157252
2020-08-07 22:13:17 +00:00
Samuel Degueldre b84e0af742 [IMP] web_editor, website: add background shapes snippet option
This commit adds a new snippet option allowing the user to choose one of
a series of SVG shapes as their background, or to be overlaid over the
background image of a snippet and to customize the colors of those
shapes.

Part of https://github.com/odoo/odoo/pull/53017
task-2210790

closes odoo/odoo#53017

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2020-08-07 15:34:45 +00:00
Samuel Degueldre c3dacfea05 [IMP] web_editor, website, *: create background-type toggler option
*: website_blog

Previously, background colors, images, and videos could all be applied
on the same section, such that the image can be used as a fallback for
the video, and the color as a fallback for the image. However, if you
wanted to change the background color behind the background image, the
background image would be removed. The background image and background
video also shared the same widget to pick the image or video.

This commit adds a background-type toggler, where the user can toggle
the background color, image and video individually. It also makes the
video picker into its own UserValueWidget, such that the user can pick
both an image and video without overriding the other.

Part of https://github.com/odoo/odoo/pull/53017
task-2210790
2020-08-07 15:34:45 +00:00
qsm-odoo 5c05592032 [IMP] web_editor: remove check icon for default active buttons
Before this commit, the enabled state of we-button element was a
"pressed-like" background + a check icon. This check icon was then
explicitely removed for we-button extension such as checkboxes and
button groups' buttons. Now, the enabled state does not contains that
check icon by default and it is explicitely added for selects' buttons.

Part of https://github.com/odoo/odoo/pull/53017
task-2210790
2020-08-07 15:15:52 +00:00
Samuel Degueldre 995b20fd6a [REF] web_editor: move normalizeColor function to we-utils for reuse
Part of https://github.com/odoo/odoo/pull/53017
task-2210790
2020-08-07 15:15:52 +00:00
qsm-odoo 201e10b338 [FIX] web_editor: remove useless snippet preview notification
Before this commit, the 'snippet_option_update' event was triggered
whether or not it was a preview update. In the preview update case,
nothing was done, ever. This commit removes the preview notification.
If it ever becomes useful, it can be restored at that moment.

This commit actually solves a bug introduced by [1]: that snippet update
notification is now triggered after a setTimeout delay to allow events
to bubble before the UI update it will trigger (in non preview mode).
The side effect this had was that, between each preview, the execution
chain was deferred of a setTimeout delay between each step (even though
previews do not update the UI). This was enough to allow for a paint
refresh.
So before this commit, if option C was selected, then the user hovered
option A then option B, the option C was visually re-enabled between A
and B. This won't be the case anymore after this commit.

Long story short: restore no-flickering when previewing options.

[1]: https://github.com/odoo/odoo/commit/2616c8950fd615561e720660bcc39e018f4061e4

Part of https://github.com/odoo/odoo/pull/55588

closes odoo/odoo#55588

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2020-08-07 08:52:19 +00:00
qsm-odoo 315ba1cfeb [IMP] web_editor, *: simplify UserValueWidget updates
*: website

Before this commit, editor widgets were updated by 3 successive calls
to methods 'setValue', 'updateUI' and '_updateUI'. The last two were
in charge of updating the UI depending of the value that was set, only
in specific condition (like "if the widget is not focused", "or not
previewed", ...).

This is now in fact useless: 'setValue' can be in charge of the UI
update. Indeed, when a value is set on a widget there is no reason to
not update its UI anymore. This was useful when the UI was updated on
preview, which is not the case anymore. This could also be useful for
widget with multiple options attached to them... but in those rare cases
updating the UI multiple times (one time per option method) should not
be a problem.

Part of https://github.com/odoo/odoo/pull/55588
2020-08-07 08:51:23 +00:00
qsm-odoo 6a258db1e9 [IMP] website, *: review the 'options' tab of editor panel
*: web_editor

This will more probably change again in the future but this is a first
step towards a hierarchized 'options' tab for the editor panel.

Part of https://github.com/odoo/odoo/pull/55529
2020-08-06 09:42:48 +00:00
qsm-odoo 90033c95ea [FIX] website: prevent page flickering when modal is opened
Commit [1] introduced a flickering when any modal was opened on the
frontend. Indeed, it introduced the possibility to go into "fullscreen"
mode, which makes the Odoo UI navbar and sidebar disappear. This is
animated: the padding of the `<body/>` element is using a CSS
transition... but when a Bootstrap modal opens, the padding-right is
changed to compensate the scrollbar removal. This change now being
animated, it creates a flickering.

A generic solution was made: only animate what is animated for the
duration of the fullscreen mode switch.

[1]: https://github.com/odoo/odoo/commit/0b0690a3934cedcab0d5e34373e8d40c2ab25660

closes odoo/odoo#55210

X-original-commit: ccadb20c82a651e9ef87e818b898f3e9a081cacd
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2020-07-30 14:50:04 +00:00
DramixDwandqsm-odoo bdcc1ea9e7 [IMP] website_blog: add tag from frontend (editor left panel)
Previously, you could only add a tag on a blog post from the backend.
Here we're adding a way to add them from the left-panel so that it's
easier for the user to add them.

The long term goal will not be to reimplement complex view of the
backend. This is actually already past the limit: we will need a way
to instantiate views from the backend in the frontend in the future.

Part of https://github.com/odoo/odoo/pull/52759
task-2267693

closes odoo/odoo#52759

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
Co-authored-by: qsm-odoo <qsm@odoo.com>
2020-07-31 10:32:22 +00:00