summaryrefslogtreecommitdiff
path: root/addons/web_editor/static/src/js/iframe.js
AgeCommit message (Collapse)Author
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>
2018-02-12[FIX] web{_site,_editor}: transparent root instance 'root widget'Alexandre Kühn
With this commit, any component that needs an instance of the root widget can simply require the module 'root.widget'. Based on the context (backend, frontend, iframe), the real root.widget will resolve to either the webclient, the website root instance, or the iframe root instance. This is desirable in order for the tour_manager to become a child of the root widget, as tours are enabled in any of the above contexts. This commit is a requirement in order to solve an issue with JS services, in which there should be only one service provider at any given time.
2017-10-12[FIX] web_editor: restore iframe editor code view modeqsm-odoo
Broken since https://github.com/odoo/odoo/commit/2972976962617d4b8a0113bae58c640ab41cdff8
2017-08-16[REF] web_editor, website, *: complete refactoringqsm-odoo
* mass_mailing, payment, point_of_sale, portal, survey, web, web_tour, website_blog, website_crm_partner_assign, website_event, website_event_questions, website_form, website_forum, website_gengo, website_hr_recruitment, website_links, website_mail, website_mail_channel, website_mass_mailing, website_quote, website_sale, website_sale_options, website_slides, website_twitter This commit reviews the whole "JS side" of the web_editor and website apps. This is a first step to be able to improve them with new and better functionnalities; this commit is not supposed to change any visual behavior. The main goal was to achieve a structure similar to the backend one. Now, the frontend side also has a root widget (like the WebClient) and all other widgets are attached to it one way or another. This allows the benefits of using the 'trigger_up' functionnality for example. As RPC are now mainly done with the `this._rpc` functionnality (being possible thanks to the parent hierarchy), the frontend will also be possible to test thanks to QUnit in a future update (besides the "text" editor side which still requires a refactoring to be able to do that). --- Here are some of the changes: (-) conventions and documentation The code has been updated to follow JS conventions and a lot of code has been commented (around +2000 lines of comment). This also means that lots of functions have been renamed to use camelCase or simply to make their name understandable. See https://github.com/odoo/odoo/wiki/Javascript-coding-guidelines. (-) deprecated: web_editor.base The "web_editor.base" module has been split and does not force the modules which require it to wait for DOM ready anymore. This was indeed slowing loading times, but also prevented to use some modules in some contexts (see the LESS editor use in web_studio which is the subject of another task). Now the "editor context" can be got thanks to the "web_editor.context" JS module with its "get" function. The "web_editor.base" module should probably not be used anymore (see its code and recent updates). (-) new: web.dom_ready If a JS module should wait for the DOM to be ready to be executed, a new JS module has been created: "web.dom_ready". This should always be used in a module which only want to instantiate stuff. Do not extend (or worst, include) classes after DOM ready. (-) website.website The "website.website" module has been split. "website.website" does not return anything useful anymore, it just initialize some miscellaneous stuff, without waiting for the DOM to be ready. You might want to check "website.utils", "website.content.compatibility" or `WebsiteRoot`. Also `website.form` has been deleted (use `this._rpc`), so has been `website.error`. `website.prompt` will be removed in a future update to be replaced by `Dialog.prompt`. (-) widgets are great Many classes which were not widgets are now widgets. This allows them to use the 'events', the 'xmlDependencies' and the 'this._rpc' features for example. Here are some of the main ones: - Snippet options: these were classes with a `$el` for the menu element and `$target` for the customized element. This is still the case but following standard `Widget` structure (one exception: using `this.$(...)` searches in the `$target` as before this update). - Snippet animations: instead of class instances with a `$target` element which can be `start` and `stop`, these are now standard widgets which can be `start` and `destroy`. `this.$target` is an alias to `this.$el` for ease of compatibility. - Snippet editors: instead of class instances in charge of an editor overlay, these are now widgets. Each "child" snippet editor is properly attached as a "child", which allows editors to communicate and to be properly destroyed. (-) root widgets and website navbar The frontend is different of the backend. In the backend, the page has an empty <body/> element and all the components are instantiated from parent to children (i.e. the `WebClient` is instantiated and is in charge of instantiating the `ControlPanel`, etc). The frontend cannot work like that on page loadings as they are way more frequent than in the backend and we do not want them to flicker. A frontend page is loaded as a <body/> element which already contains the website navbar and its menus and the whole content page. JS code has to be "attached" to these existing elements. This is possible thanks to the `RootWidget` instances and the specialized `WebsiteRoot`, `IframeRoot` and `WebsiteNavbar` (see code for details). (-) lazy loading No more (or at least a lot less) XML/JS has to be loaded on page loading, thanks to the use of the `Widget.xmlDependencies` feature. XML which have to be lazy loaded is loaded only on related Widget instantiation if necessary, which allows to execute a lot of JS code before the DOM is ready and to start many widgets on DOM ready (not later). A visual benefit of this is clicking on the 'edit' button as soon as it is possible: before this commit, this was sometimes not doing anything as event handlers were not binded yet. Still a possible exception: loading the session and locales. This may be asynchronous stuff which is still required before widget instantiations but this will be the subject of another task. (-) deprecated code and code location More than reviewing code and organizing it, many apparent dead code was removed. More importantly, mislocated code was put in the right app. This is the case for snippet animations which is a concept for website apps but was defined in the web_editor app, or some translation concepts which were part of website but should have been part of web_editor. --- There are probably more things to say about this commit but I will let the comments speak for those.
2017-07-24[IMP] web, *: lazy load dialog xml templateqsm-odoo
* web_editor, web_planner, website The 'Dialog' class is used in both backend and frontend. Also, lots of actions can be done without the use of any modal. It thus makes sense to lazy load its related xml only when a first modal is opened. This change also allows to get rid of the "base_common.xml" file as the dialog template is the only remaining one in there and, in the future website update, it will allow to not load any static XML file on website page loadings.
2016-09-30[FIX] mass_mailing, web_editor: set up correct iframe communicationqsm-odoo
Previous commit tried to handle iframe assets in a more standard way but instead broke the order followed to install iframe communication. While waiting for a more clean way to handle iframe assets and communication, revert to old set up.
2016-07-04[REF] web_editor: code refactoring and simplificationqsm-odoo
* Remove dead code + optimization * Use Dialog API from web module * Reorganize files * Correct buggy $() function for snippet option class * Add comments * Fix the snippet parent navigation : If a page contained a three level snippet structure (i.e A contains B contains C), when editing the following bug occured : If B or C was selected first, parenting buttons were correctly set. But if selecting A then C, clicking on the parent lead to going back on A instead of going on B. * Fix snippet thumbnail layout * Better isolate ui css from themes * MediaDialog image list : prevent displaying empty attachments * ...
2015-12-08[FIX] web_editor: add code view in debug mode to allow jinja insertionChristophe Matthieu
2015-08-21[FIX] web_editor: can't save backend translation with field htmlChristophe Matthieu
2015-07-22[IMP] web: web modules return readable logs and phantomjs logsChristophe Matthieu
boot.js log: * ``Missing dependencies``: These modules do not appear in the page. It is possible that the JavaScript file is not in the page or that the module name is wrong * ``Failed modules``: A javascript error is detected * ``Rejected modules``: The module returns a rejected deferred. It (and its dependent modules) is not loaded. * ``Rejected linked modules``: Modules who depend on a rejected module * ``Non loaded modules``: Modules who depend on a missing or a failed module
2015-07-22[IMP] web: module can be asynchronous loaded if it return a deferredChristophe Matthieu
Each module can return a deferred. In that case, the module is marked as loaded only when the deferred is resolved, and its value is equal to the resolved value. The module can be rejected (unloaded). This will be logged in the console as info. Remove if_dom_contains from the website, the modules return a rejected deferred if the DOM doesn't contains the seleted values.
2015-07-10[IMP] web_editor: split website into web_editor (to use editor in backend ↵Christophe Matthieu
for html field) and website