summaryrefslogtreecommitdiff
path: root/addons/website/static/src/js/widgets
AgeCommit message (Collapse)Author
2020-09-16[IMP] web_editor, *: make media-dialog search odoo media-librarySamuel Degueldre
*: website, web_unsplash, website_blog We have recently created an odoo media library that exposes a public API for searching for open-source media, including dynamic SVGs that can be used with the dynamic background-shape system to create illustrations whose colors can be changed by the user. This commit adds the corresponding client-side functionalty: search for the images in the media-library, creating a corresponding attachment when selected, as well as an option to customize the colors of the dynamic SVGs. In the process, adaptations have been made in the web_unsplash module to avoid duplicating code and to adapt code that was making assumptions that are no longer valid. To make new users more aware of this feature, all default images have been hidden from the media-dialog, so that the user is prompted so search for images. Some tests and tours that were relying on having default images in the media-dialog (eg in website_blog) have been adapted to match. task-2316651 Linked to: odoo/iap-apps#235 closes odoo/odoo#56479 Signed-off-by: Jérémy Kersten (jke) <jke@openerp.com>
2020-02-05[IMP] website, *: make theme custo options act as simple snippet optionsqsm-odoo
* web_editor, theme_bootswatch Instead of having an entirely dedicated system for theme options in a third tab of the left panel, those theme options are now simple snippet options. See the customizeWebsite generic method. This allows to make any option available in the third tab or on any meaningful element like the header or the footer. This also allows to take advantage of all the features of the left panel: dependencies, visibility update, etc. Note: same as before, those changes do apply the color/size/layout immediately on the website, even if not saved. Changing that behavior is complex and might be the job of another task. Part of https://github.com/odoo/odoo/pull/41166 task-2088298
2020-02-05[REF] website, web_editor: move theme customization to edit modeSamuel Degueldre
Previously, theme customization was done through a modal dialog in the website module, this was not very user friendly since the rest of the customization for the website design was done from edit mode, meaning the user had to exit edit mode to customize things such as theme colors or fonts. It was also rather confusing to have these seemingly related things in completely unrelated places. This commit moves all of the options that used to be in the theme customization modal into a new tab in the editor's left panel. This commit is mainly just about rendering the old modal as a third left panel content. See next commit for deeper changes. Note: same as before, those changes do apply the color/size/layout immediately on the website, even if not saved. Changing that behavior is complex and might be the job of another task. Part of https://github.com/odoo/odoo/pull/41166 task-2088298
2019-12-09[REV] web: reverts update to fontawesome 5.11.2Kevin Baptiste
This reverts commit ff1c35513aecef5fbc30f7c2f3834450e719714e. closes odoo/odoo#41480 X-original-commit: 116057b26e71db4692280463669f3e80d813ddcc Related: odoo/enterprise#7110 Signed-off-by: Yannick Tivisse (yti) <yti@odoo.com>
2019-12-01[IMP] web_editor, *: add new user value colorpicker widgetqsm-odoo
* web, mass_mailing, website Introduced a new sub-widget for snippet options: we-colorpicker. This allows to retrieve a color value (either a normalized css color or a theme color name) to be used for a snippet option method. This commit replaces the old 'colorpicker' snippet option whose behavior is now simply achieved by defining an xml option using a we-colorpicker widget in combination with the 'selectStyle' standard method. This commit also adds the possibility to control the border-color of elements alongside their border-width. Again, just a we-colorpicker widget in combination with the 'selectStyle' standard method. Note: this commit reviewed what the colorpalette palette widget notifies. This is not a cssColor and a 'isClass' flag to say if it is a css class or not. The colorpalette always returns a color string which can be the name of a color like 'alpha'. This is up to the caller to check if the color string is a css color or not with isCSSColor. In the case it is not, the related code can read the actual color by reading the related css variable. Part of https://github.com/odoo/odoo/pull/40282 In preparation of task-2122935 and other tasks
2019-12-01[REF] web, web_editor, *: review normalization of colorsqsm-odoo
* website Review colorpicker methods to always allow to use normalized colors. Also factorize some code in the color palette widget. Part of https://github.com/odoo/odoo/pull/40282 In preparation of task-2122935 and other tasks
2019-11-28[IMP] web: update to fontawesome 4.7.0 to 5.11.2Kevin Baptiste
FontAwesome 5 introduced new names for some icons as described on https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4#name-changes This commit replaces the old names to the new ones. closes odoo/odoo#35826 Taskid: 2050241 Related: odoo/enterprise#5180 Signed-off-by: Yannick Tivisse (yti) <yti@odoo.com>
2019-11-18[FIX] website, *: no theme color suggestions during theme colors editionqsm-odoo
* web_editor Part of https://github.com/odoo/odoo/pull/38959 task-2066614
2019-11-18[IMP] web_editor, website: generalize colorpickerfja-odoo
Currently we have: - a colorpicker for background color of snippets - a colorpicker for foreground and background text (topbar) - a colorpicker for menu/footer/navbar/etc These 3 are separate colorpickers with different options. After this Commit All 3 will use the same color palette wich allow you to select theme color, common colors, custom color and transparent filter. Part of https://github.com/odoo/odoo/pull/38959 maintask-2066614 task-2087383
2019-11-12[REF] website, *: merge website_theme_install into websiteqsm-odoo
* theme_bootswatch, theme_default, website_theme_install
2019-08-14[MERGE] forward port branch saas-12.4 up to 98a55917a60Christophe Simonis
2019-08-08[MERGE] forward port branch saas-12.3 up to 752b2553c6fChristophe Simonis
2019-08-06[MERGE] forward port branch saas-12.2 up to 9e74730a26bChristophe Simonis
2019-08-06[MERGE] forward port branch 12.0 up to ff9ddfdacc9Christophe Simonis
2019-08-05[FIX] website: prevent multi checked options in the same groupqsm-odoo
In the customize theme modal, if one option enabled views which were a subset of the views which are enabled by another option, both options would be checked on modal opening if all the related views were active. This is the case for the "choose an image" and the "choose a pattern" options: the first one enables a view which adds an image on the body and the second one enables the same view but also another which enables the fact that the image must be repeated. This commit solves the issue by always selecting the option enabling the most views among the checked options in a same set. opw-1958395 closes odoo/odoo#35465 Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2019-06-05[IMP] *: use new helper config.isDebug()Romain Derie
Before this commit, both config and session were aliases to odoo.debug. Now, config.isDebug() should be call, with possibility to pass a parameter to check if we are in a specific debug mode such as 'tests' or 'assets'. task-1934445 Coming with https://github.com/odoo/enterprise/pull/4281 Closes https://github.com/odoo/odoo/pull/33213
2019-06-04[IMP] web, web_editor, *: add media image optimize dialogSébastien Theys
* = website, website_blog The goal is to give the user an opportunity to optimize his images before using them. For this we introduce a preview/configuration dialog after every image upload, where appropriate default values are filled for the quality and resolution, based on where the image is going to be used. Since this is not going to be perfect all the time, we still allow the user to configure them, and we display a preview to ease this process. Indeed it is important for SEO and for usability in general that the images are as light as possible in size. Technically the original image is uploaded and saved first, and then it can be optimized. This way the upload only happens once, and the preview can be computed from the already saved image. task-1930726 PR: #31208
2019-07-30[IMP] website: allow adding fonts from Google FontsAndrea Ulliana
It is now possible to add very easily a font from Google Fonts under Customize Theme > Fonts > Add Google Font. Part of https://github.com/odoo/odoo/pull/33442 task-1974659 Co-authored-by: qsm-odoo <qsm@odoo.com>
2019-07-30[IMP] website: auto-discover all available fonts in the theme modalAndrea Ulliana
Before this commit, if a theme had more fonts that the default number (6), it had to override the customize dialog. Now, the number of fonts to add in the list is found automatically. To do so, instead of defining a <selection/> tag with 6+ <opt/> tag, we are now able to define an unique new tag: <fontselection/> which will do automatically the job. Part of https://github.com/odoo/odoo/pull/33442 task-1974659
2019-07-30[IMP] website: introduce "auto" widget for theme modalAndrea Ulliana
The theme customize dialog implements its own system of widgets. For example: data-widget="color" and data-widget="input". Now, a new type of widget data-widget="auto" exists. The goal is the same as the data-widget="input" but with a predefined value that the user cannot choose. Also, as "data-value" was badly chosen during its implementation, it is now renamed to "data-variable" and "data-value" is now used with the new widget. Example of the new widget "auto": <opt data-widget="auto" data-variable="logo-height" data-value="3rem" string="Logo Height"/> -> Allows to create a button forcing the logo height to 3rem. Part of https://github.com/odoo/odoo/pull/33442 task-1974659
2019-07-29[REF] web,web_editor: moved ColorpickerDialog to webJulien Mougenot
The reason this widget was moved is that the next improvement ([IMP] base: Configure document layout) defines a new field (FieldColor) which needs to call the colorpicker dialog inside of the base module. This couldn't be done while the dialog was located in the wysiwyg assets.
2019-06-11[IMP] website, *: improve customize dialog no-reload updatesqsm-odoo
* base Before this commit, if an option was customized thanks to the customize dialog, the page was not reloaded, only the new scss <link/> elements were retrieved and replaced in the DOM. There were two problems with this: - The <script/> and <style/> tags were also retrieved for no reason (as the whole result of t-call-assets was returned) - This made use of a deprecated ir.qweb method that we want to remove (see https://github.com/odoo/odoo/pull/33432) This commit removes the use of the deprecated method by improving the system: only the <link/>'s new URLs are returned on customization. closes odoo/odoo#34040 Signed-off-by: Romain Derie (rde) <rde@odoo.com>
2019-04-30[IMP] website: improve customize dialog UI for font selectionKaushalya Mandaliya
Replace the font selection UI by a dropdown. Make the system generic so that a dropdown can be used for any set of options. task-1942241 closes odoo/odoo#32437 Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com> Co-authored-by: qsm-odoo <qsm@odoo.com>
2019-03-15[FIX] website: restore broken promises in websiteqsm-odoo
Since the switch to jQuery 3, Odoo uses native promises in its JS. Some mistakes were made in the website app during conversion from old jQuery deferred to native promises. - `this` -> `self` when wrapping in a promise - `.always(fct)` -> `.then(fct).guardedCatch(fct)` - a function returned sometimes a jQuery deferred, sometimes a native promise. This made the caller fail when using `always` or fail when using `guardedCatch` closes odoo/odoo#31887 Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2019-03-06[REF] website: adapt code after jQuery updateVincent Schippefilt
Part of task 1896658 Co-authored-by: Aaron Bohy <aab@odoo.com> Co-authored-by: Christophe Matthieu <chm@odoo.com> Co-authored-by: Mathieu Duckerts-Antoine <dam@odoo.com> Co-authored-by: David Monjoie <dmo@odoo.com> Co-authored-by: Martin Geubelle <mge@odoo.com> Co-authored-by: svs-odoo <svs@odoo.com> Co-authored-by: Vincent Schippefilt <vsc@odoo.com>
2019-02-11[MERGE] forward port branch saas-12.1 up to 93d736e905eChristophe Simonis
2019-02-08[IMP] website: allow negative dependencies in theme customize dialogqsm-odoo
Options and option sets can declare a data-depends attribute to specify which options need to be enabled for them to be displayed. With this commit, we allow specifying which options need to be *disabled* for the same purpose (we can now do that by prefixing the options IDs with '!'). PR https://github.com/odoo/odoo/pull/29624 task-1904244
2019-02-08[IMP] website, *: optimize scss customizationsqsm-odoo
* web_editor This commit's goal is to optimize the delay to make a scss customization thanks to the website customize dialog. Before this commit, the JS code took advantage of existing web_editor routes but this was far from efficient as this was done: 1) PY: Load all scss files used in the page 2) JS: Find the one we want to customize and adapt the scss content 3) PY: Create the scss customization with the new content (So two RPC (including one very slow) and content building in javascript) After this commit, this is done: 1) PY: Load the scss file being customized, adapt its content according to the new values and save the customization (So the whole logic is in python, requiring only one small RPC) This commit also take the opportunity to review the web_editor ace editor loading code (the logic is shared with website customizations). PR https://github.com/odoo/odoo/pull/29624 task-1904244
2019-02-08[IMP] website, *: add new logo sizing optionqsm-odoo
* portal, web This commit introduces the first of many-to-come non-color website user values: the logo height. Now, the user can choose it in the customize dialog. PR https://github.com/odoo/odoo/pull/29624 task-1904244
2019-02-08[IMP] website: allow customize option to be conditionally visibleqsm-odoo
Before this commit, in the theme customize modal, only lists were able to be visible under the condition of a subset of options being enabled. Now options can too. PR https://github.com/odoo/odoo/pull/29624 task-1904244
2019-02-08[IMP] website: review customize loadingqsm-odoo
Before this commit, the loading was shown during colorpicker choice or body image choice too, which makes no sense. This commit also make a new loading visual which is less intrusive and flicker less. PR https://github.com/odoo/odoo/pull/29624 task-1904244
2019-02-08[REF] website: unify the theme customize dialog color optionsqsm-odoo
Before this commit, color options in the theme customize were treated as big exception in the system. The whole color panel XML was defined client-side and used custom design. Now, all colors are defined as options in the "server-side" template, allowing for more customizations and better maintenance. This commit also makes the color saving system generic to allow for more new options in the future (like customizing the logo height or the font size, which is the next task). PR https://github.com/odoo/odoo/pull/29624 task-1904244
2019-02-08[IMP] website: improve theme customize dialogqsm-odoo
- Make the controller part more readable and more efficient (O(1) ORM operations instead of O(n)) and remove deprecated code. - Add the possibility to have a toggle standalone option. This is used as soon as an `<opt/>` is alone in its container (note that now, the container can be any tag and will be ignored during rendering). - If an option has no specified 'string' to attach to it, the name of the first view it toggles will be used. PR https://github.com/odoo/odoo/pull/29624 task-1904244
2019-02-07[MERGE] forward port branch 12.0 up to a46138cb019Christophe Simonis
2019-02-26[REF] website, *: stop using 'animation' confusing nameqsm-odoo
* web, website_blog, website_sale, website_twitter Before this PR, all website widgets were named 'Animation'. Now that they are 'Public Widgets', we can at last stop using the confusing 'animation' name. Part of https://github.com/odoo/odoo/pull/29442 task-1932066
2019-02-06[FIX] website: specific view ID might also change on saveRomain Derie
Commit https://github.com/odoo/odoo/commit/29075a8e2c734624cec4f6009185616634f70dea was written while there was an incorrect behavior related to multi-website, oe_structure_ID and edit mode in a rare specific case (see the second commit from this PR for detailed explanation https://github.com/odoo/odoo/pull/30834). That rare case was detected in 12.0 since the tour did not work on master with the new editor (that fixed the incorrect behavior). Basically, it was COWing the edited view even if only an oe_structure_ID was touched. Indeed, when saving a specific view in the HTML editor, we should also search for its possible new ID as it could change if we also edited its generic parent. In that case, the view will be copied and then unlinked to preserve inherit order on the new specific tree.
2019-01-31[MERGE] forward port branch 12.0 up to cb8fefa8999Christophe Simonis
2019-02-05[IMP] website, *: improve CSS edition usability + add JS editionAndrea Ulliana
* web_editor Currently, when an user wants to edit the css of its website, he has access to lots of files and, in debug mode, to even more files. While the feature is nice for people who know what they are doing, a lambda person can easily break its website by changing the wrong files. Also, nothing warns the user that the files that are edited will never receive updates anymore (unless if they are reset). The goal is to prevent those behavior while still allowing the add custom css. Another goal is to be able to *add* custom javascript. Custom files created for the user: SCSS: user_custom_rules.scss, user_custom_bootstrap_overridden.scss JS: user_custom_javascript.js See https://github.com/odoo/odoo/pull/29999 task-1919350
2019-02-05[REF] website, *: remove 'website.context' moduleqsm-odoo
* website_forum, website_gengo, website_mail_channel, website_sale Retrieving the global context is now the root's job, this will prevent problems when trying to extend the values the context has. See upcoming improvements with https://github.com/odoo/odoo/pull/29442 closes odoo/odoo#30816
2019-02-05[FIX] website: correct module importChristophe Simonis
Oversight of previous forward-port
2019-02-04[MERGE] forward port branch saas-12.1 up to 4524ad06a8aChristophe Simonis
2019-01-29[FIX] web_editor, website: consider COW view when loading viewRomain Derie
Before this commit: 1. If we were editing a template with no xml_id, typically the case when editing a specific view (COW'd), the 'Template ID' label would be left empty as the view does not have an xml_id but only a key. 2. If we were editing a generic view, the template would be COW'd and replaced by the specific one created during the save. After the save, the page would be reload and will try to reopen the edited template (stored in url `res=123`). But as this template would be replaced by the COW'd view, the JS would crash trying to access an inexisting view. The HTML editor would then open in a very thin modal, barely editable. Now: 1. Display the template's key instead of its xml_id. The key is basically a duplicate of the xml_id, mainly used in website. 2. If we are saving a generic view, we search for its newly created specific view to upload the URL hash before reloading. task-1934279 Fix #30447
2019-01-29[IMP] qweb: stop requiring t-name-flagged sub-nodeXavier Morel
QWeb's rendering currently *requires* that when loading a document instead of rendering the document itself it will render a sub-node with a properly labeled t-name. If a view is invoked by id, ir.qweb will look for a child with a t-name and fix up that t-name such that the base qweb object will find and render it. This feature mostly exists for JS compatibility (because a single document can contain multiple cross-linkable templates, and it was useful for cross-implementation tests though I'm not sue they're even checked anymore), and the <template> tag kinda took care of it, however with a more proper qweb view it becomes more of a liability / pain in the ass. Note: turns out there are bits of javascript which read server templates (???) and need to be altered to correctly handle the lack of <templates> wrapping.
2019-01-21[FIX] website, *: restore media dialog usesqsm-odoo
* web_editor, website_blog Following the new editor's merge at https://github.com/odoo/odoo/pull/29775, the media dialog was refactored but the code which used it outside of the editor was not adapted at all. Also, the selected image was not saved correctly anymore, making the media dialog useless outside the editor in the current implementation. - Adapted SEO image uploading and body image background choice which were not working anymore - Adapted blog cover choice and gallery snippet which were strangely still working even though there were sending wrong parameters during media dialog initialization closes odoo/odoo#30416
2019-01-18[FIX] website: restore choosing opacity in website colorsqsm-odoo
Following the new editor's merge at https://github.com/odoo/odoo/pull/29775, the colorpicker still allowed to choose an opacity for website colors but this was ignored when saving. Somehow lost the website part of https://github.com/odoo/odoo/commit/5ba0216b746a16b4609bc9c147fcacad109e969a closes odoo/odoo#30370
2019-01-18[FIX] website: restore customize dialog openingqsm-odoo
Following the new editor's merge at https://github.com/odoo/odoo/pull/29775, the customize theme dialog was not opening anymore. This was due because, somehow, the editor's merge changed the theme dialog code for no reason. closes odoo/odoo#30365
2019-01-17[IMP] web_editor,*: Refactoring the wysiwyg editor and 'html' fieldChristophe Matthieu
* Creating a new structure by transforming all the plugins in the library using the odoo inheritance system. Plugins are easier to implement with the AbstractPlugin to add Odoo behaviors. * From now on, the methods of the library (in this case Summernote) can no longer be called by other modules or files. Only the wysiwyg widgets can access it, to simplify the updating process. The wysiwyg object serves as an interface. * Depending on the options the snippets will be loaded or not, the editor will be in an iframe or not... all of this is transparent from the outside. * Regarding iframes, all controllers related to editing have been removed: the new API no longer needs them. This speeds up loading, eases testing and removes complexity for the same features. PUBLIC FEATURES There are several public methods on the Wysiwyg class: * Wysiwyg.prepare (WidgetParent): returns a deferred resolved when the library (xml, lazy, assets...) is loaded. * Wysiwyg.getRange (DOM): returns the range (selection in the dom) * Wysiwyg.setRange (startNode, startOffset, endNode, endOffset): creates a range (selection in the dom) * Wysiwyg.setRangeFromNode (DOM, options) that creates a range from an element (option available to select all, start or end) A jQuery selector was added: :o_editable, which indicates whether the current element is editable. That is, if it is contained in a tag with the attribute 'contentEditable = "true"' or in a tag with the class o_editable. Several methods are also present: * focusIn: makes a focus and places the cursor at the beginning of the element * focusInEnd: makes a focus and places the cursor at the end of the element * selectContent: makes a focus and selects the content HTML FIELD The HTML field can receive different options: * style-inline: {boolean} transforms a class into an inline style when saving and vice versa when reading. * no-attachment: {boolean} prevents the use of attachments (in media dialog) * cssEdit: {xml_id} to use a template containing the css to loaded in an iframe when editing * cssReadonly: {xml_id} to use a template containing the css to load into an iframe when viewing in readonly * snippets: {xml_id} snippets template (can be used with or without cssEdit) * wrapper: {template} qweb static template (containing a tag: id = "wrapper") that will include the content during editing (removed on save) MASS MAILING A widget was created for mass mailing. There are now two fields: body_html and body_arch. body_arch contains the code with the class without conversion into inline style, useful when editing and one with the inline style that is visible in readonly mode and sent by email. Advantage: no spreading errors, able to update css/theme, able to do more changes when converting to inline style so that a maximum of mail clients have an impeccable rendering. Co-authored-by: Antoine Guenet <age@odoo.com>
2019-01-16[IMP] website: improve onboarding flowAnshuman Sharma
- Improve the website tour (typo, tip positions, etc) and added new steps to publish a new page - Make close button of 'Mobile Preview' more visible - Fix the overflow for long menu names in menu editor dialog - Change the menu string from 'Affix Top Menu' to 'Fixed Top Menu' - Change theme customization dialog's title to 'Customize Theme' from 'Customize this theme' - Improve strings for Google Analytics task-1895287 closes odoo/odoo#28199
2019-04-16[IMP] website: improve UX for logo/font size changingjpr-odoo
This removes the 'V' box and it now validates the entered value when the user clicks outside the box. task-1952964 closes odoo/odoo#32291 Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
2018-11-06[MERGE] forward port branch 12.0 up to dd70c684268Christophe Simonis