43 lines
2.7 KiB
ReStructuredText
43 lines
2.7 KiB
ReStructuredText
|
|
Presentation
|
|
============
|
|
|
|
Prerequisites
|
|
-------------
|
|
|
|
Prerequisites to code addons for the OpenERP Web Client:
|
|
|
|
- HTML5
|
|
- CSS
|
|
- Javascript (Ecmascript 5)
|
|
- jQuery
|
|
|
|
Once you know all this, that's only the beginning. Most usages of Javascript/jQuery are small hacks to make a web page nicer. The OpenERP Client Web is different: it's a web application, not a web site. It doesn't have multiple pages generated by a server side code. Only one unique empty page is loaded and all the html is generated by Javascript code, the page is never reloaded. If you never developed that kind of application you still have lot of good practices to learn.
|
|
|
|
Generic Guidelines
|
|
------------------
|
|
|
|
First, here are some generic recommandations about web 2.0 applications:
|
|
|
|
* **Do not use ids**. Html ids are evil, the key anti-feature that makes your components non-reusable. You want to identify a dom part? Save a jQuery object over that dom element. If you really need to use ids, use _.uniqueId(), but 99% of the time you don't need to, classes are sufficient.
|
|
* **Do not use predictable css class names** like "content" or "navigation", ten other developers will have the same idea than you and there will be clashes. A simple way to avoid this is to use prefixes. For example, if you need a css class for the button named "new" that is contained in the form view which is itself contained in the OpenERP application, name it "oe-form-view-new-button".
|
|
* **Do not use global selectors** like *$(".my-class")*, you never know if your component will be instantiated multiple times. Limit the selector with a context, like *$(".my-class", this.$el)*.
|
|
* As a general advice, **Never assume you own the page**. When you create a component, it is never unique and is always surrounded by a bunch of crazy html. You have to do with it.
|
|
* **Learn how to use jQuery's deferreds** [1]_. That concept may seem over-complicated, but the experience tell us that it is nearly impossible to create big-size javascript applications without that.
|
|
|
|
OpenERP guidelines
|
|
------------------
|
|
More recommendations related to the specific case of the OpenERP Web Client:
|
|
|
|
* The code should conform to EcmasScript 5 without the "use strict" mode as we support IE9.
|
|
|
|
* Your components should inherit from the *Widget* class. And use *Widget* 's methods (*appendTo*, *replace*,...) to insert your component and its content into the dom.
|
|
|
|
* Use QWeb templates for html rendering.
|
|
|
|
* All css classes should have the prefix *oe_* .
|
|
|
|
* Functions that call rpc() should return a deferred, even if it calls it indirectly. So a function that calls a function that calls a function that calls rpc() should return a deferred too.
|
|
|
|
.. [1] http://api.jquery.com/category/deferred-object/
|