pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[REF] web_diagram: various tweaks

Browse Source 
- Ensure compatibility with both editions of web
- Use the Pager widget instead of re-implementing it
- Fix the use of Dialogs which was broken (wrong type of Dialog was used)
- Convert css into less
- Some js linting
This commit is contained in:
Aaron Bohy
2015-08-07 14:05:07 +02:00
parent 1587647dcd
commit bffa8f37f1
6 changed files with 54 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web_diagram/static/src/css/base_diagram.css
-46
View File
@@ -1,46 +0,0 @@
.openerp .oe_diagram_header h3.oe_diagram_title {
font-weight: normal;
color: #252424;
margin: 0 0 0 2px;
}
.openerp .oe_diagram_buttons {
float: left;
}
.openerp .clear{
clear:both;
}
/* We use a resizable diagram-container. The problem with a
* resizable diagram is that the diagram catches the mouse events
* and the diagram is then impossible to resize. That's why the
* diagram has a height of 98.5%, so that the bottom part of the
* diagram can be used for resize
*/
.openerp .diagram-container{
margin:0;
padding:0;
width:100%;
height:500px;
resize:vertical;
background-color:#FFF;
border:1px solid #DCDCDC;
overflow:hidden;
}
.openerp .oe_diagram_diagram{
margin:0;
padding:0;
background-color:#FFF;
width:100%;
height:98.5%;
}
/* prevent accidental selection of the text in the svg nodes */
.openerp .oe_diagram_diagram *{
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}
addons/web_diagram/static/src/js/diagram.js
+35 -66
View File
@@ -7,6 +7,7 @@ odoo.define('web_diagram.DiagramView', function (require) {
var core = require('web.core');
var data = require('web.data');
var form_common = require('web.form_common');
var Pager = require('web.Pager');
var View = require('web.View');
var _t = core._t;
@@ -20,7 +21,6 @@ var DiagramView = View.extend({
searchable: false,
multi_record: false,
init: function(parent, dataset, view_id, options) {
var self = this;
this._super(parent);
this.set_default_options(options);
this.view_manager = parent;
@@ -30,7 +30,6 @@ var DiagramView = View.extend({
this.domain = this.dataset._domain || [];
this.context = {};
this.ids = this.dataset.ids;
this.on('pager_action_executed', self, self.pager_action_trigger);
},
view_loading: function(r) {
@@ -55,15 +54,14 @@ var DiagramView = View.extend({
this.node = this.nodes.attrs.object;
this.connector = this.connectors.attrs.object;
this.labels = _.filter(this.fields_view.arch.children, function(label) {
return label.tag == "label";
return label.tag === "label";
});
this.$el.html(QWeb.render("DiagramView", {'widget': self}));
this.$el.addClass(this.fields_view.arch.attrs['class']);
this.$el.addClass('o_diagram_view').addClass(this.fields_view.arch.attrs['class']);
_.each(self.labels,function(label){
var html_label = '<p style="padding: 4px;">' + label.attrs.string + "</p>";
self.$el.find('.oe_diagram_header').append(html_label);
self.$('.o_diagram_header').append($('<span>').html(label.attrs.string));
});
@@ -93,7 +91,7 @@ var DiagramView = View.extend({
};
_.each(this.nodes.children, function(child) {
if(child.attrs.invisible == '1')
if(child.attrs.invisible === '1')
params.invisible_nodes.push(child.attrs.name);
else {
params.visible_nodes.push(child.attrs.name);
@@ -178,8 +176,7 @@ var DiagramView = View.extend({
};
// remove previous diagram
var canvas = self.$el.find('div.oe_diagram_diagram')
.empty().get(0);
var canvas = self.$('.o_diagram').empty().get(0);
var r = new Raphael(canvas, '100%','100%');
@@ -210,7 +207,6 @@ var DiagramView = View.extend({
CuteNode.double_click_callback = function(cutenode){
self.edit_node(cutenode.id);
};
var i = 0;
CuteNode.destruction_callback = function(cutenode){
if(!confirm(_t("Deleting this node cannot be undone.\nIt will also delete all connected transitions.\n\nAre you sure ?"))){
return $.Deferred().reject().promise();
@@ -270,12 +266,11 @@ var DiagramView = View.extend({
add_node: function(){
var self = this;
var title = _t('Activity');
var pop = new form_common.SelectCreateDialog(self, {
var pop = new form_common.FormViewDialog(self, {
res_model: self.node,
domain: self.dataset.domain,
context: self.context || self.dataset.context,
title: _t("Create:") + title,
initial_view: 'form',
disable_multiple_selection: true,
on_selected: function(element_ids) {
self.dataset.read_index(_.keys(self.fields_view.fields)).then(self.on_diagram_loaded);
@@ -315,12 +310,11 @@ var DiagramView = View.extend({
add_connector: function(node_source_id, node_dest_id, dummy_cuteedge){
var self = this;
var title = _t('Transition');
var pop = new form_common.SelectCreateDialog(self, {
var pop = new form_common.FormViewDialog(self, {
res_model: self.connector,
domain: this.dataset.domain,
context: this.context || this.dataset.context,
title: _t("Create:") + title,
initial_view: 'form',
disable_multiple_selection: true,
on_selected: function(element_ids) {
self.dataset.read_index(_.keys(self.fields_view.fields)).then(self.on_diagram_loaded);
@@ -354,78 +348,53 @@ var DiagramView = View.extend({
var self = this;
this.$buttons = $(QWeb.render("DiagramView.buttons", {'widget': this}));
this.$buttons.on('click', '.oe_diagram_button_new', function() {
this.$buttons.on('click', '.o_diagram_new_button', function() {
self.add_node();
});
$node = $node || this.options.$buttons;
this.$buttons.appendTo($node);
},
/**
* Render the pager according to the DiagramView.pager template and add listeners on it.
* Set this.$pager with the produced jQuery element
* @param {jQuery} [$node] a jQuery node where the rendered pager should be inserted
* $node may be undefined, in which case the DiagramView inserts the pager into this.options.$pager
* or into a div of its template
* Instantiate and render the pager and add listeners on it.
* Set this.pager
* @param {jQuery} [$node] a jQuery node where the pager should be inserted
* $node may be undefined, in which case the FormView inserts the pager into this.options.$pager
*/
render_pager: function($node) {
var self = this;
this.$pager = $(QWeb.render("DiagramView.pager", {'widget': self}));
this.$pager.find('a[data-pager-action]').click(function() {
var action = $(this).data('pager-action');
self.execute_pager_action(action);
this.pager = new Pager(this, this.dataset.ids.length, this.dataset.index + 1, 1);
this.pager.appendTo($node || this.options.$pager);
this.pager.on('pager_changed', this, function (new_state) {
this.pager.disable();
this.dataset.index = new_state.current_min - 1;
$.when(this.reload()).then(function () {
self.pager.enable();
});
});
this.execute_pager_action('reload');
$node = $node || this.options.$pager;
if ($node) {
this.$pager.appendTo($node);
} else {
this.$('.oe_diagram_pager').replaceWith(this.$pager);
}
},
pager_action_trigger: function(){
var loaded = this.dataset.read_index(_.keys(this.fields_view.fields))
.then(this.on_diagram_loaded);
this.do_update_pager();
return loaded;
},
execute_pager_action: function(action) {
switch (action) {
case 'first':
this.dataset.index = 0;
break;
case 'previous':
this.dataset.previous();
break;
case 'next':
this.dataset.next();
break;
case 'last':
this.dataset.index = this.dataset.ids.length - 1;
break;
}
this.trigger('pager_action_executed');
update_pager: function() {
if (this.pager) {
this.pager.update_state({
size: this.dataset.ids.length,
current_min: this.dataset.index + 1,
});
}
},
do_update_pager: function(hide_index) {
if (this.$pager) {
this.$pager.toggle(this.dataset.ids.length > 1);
if (hide_index) {
this.$pager.find(".oe_diagram_pager_state").html("");
} else {
this.$pager.find(".oe_diagram_pager_state").html(_.str.sprintf(_t("%d / %d"), this.dataset.index + 1, this.dataset.ids.length));
}
}
reload: function() {
return this.dataset.read_index(_.keys(this.fields_view.fields))
.then(this.on_diagram_loaded)
.then(this.proxy('update_pager'));
},
do_show: function() {
this.do_push_state({});
return $.when(this._super(), this.execute_pager_action('reload'));
return $.when(this._super(), this.reload());
}
});
addons/web_diagram/static/src/js/graph.js
-2
View File
@@ -88,12 +88,10 @@
if(entity_type == "node"){
$.when(GraphNode.destruction_callback(entity)).done(function () {
//console.log("remove node",entity);
entity.remove();
});
}else if(entity_type == "edge"){
$.when(GraphEdge.destruction_callback(entity)).done(function () {
//console.log("remove edge",entity);
entity.remove();
});
}
addons/web_diagram/static/src/less/diagram_view.less
+12
View File
@@ -0,0 +1,12 @@
.o_diagram_view, .o_diagram {
height: 100%;
background-color: white;
.o_diagram_header {
.o-webclient-padding(@top: 16px, @bottom: 16px);
> span {
display: block;
text-align: justify;
}
}
}
addons/web_diagram/static/src/xml/base_diagram.xml
+6 -11
View File
@@ -1,21 +1,16 @@
<template>
<t t-name="DiagramView.pager" t-if="widget.options.pager !== false" t-call="ViewPager">
<span class="oe_diagram_pager_state"></span>
</t>
<t t-name="DiagramView.buttons">
<div t-if="widget.is_action_enabled('create')" class="oe_diagram_buttons">
<button type="button" id="new_node" class="oe_diagram_button_new btn btn-default btn-sm">New Node</button>
<div t-if="widget.is_action_enabled('create')">
<button type="button" class="btn btn-primary btn-sm o_diagram_new_button">
New Node
</button>
</div>
</t>
<t t-name="DiagramView">
<div class="oe_diagram_header" t-att-id="widget.element_id + '_header'">
</div>
<div class="diagram-container">
<div class="oe_diagram_diagram"/>
</div>
<div class="o_diagram_header" t-att-id="widget.element_id + '_header'"/>
<div class="o_diagram"/>
</t>
</template>
addons/web_diagram/views/web_diagram.xml
+1 -1
View File
@@ -3,7 +3,7 @@
<data>
<template id="assets_backend" name="web_diagram assets" inherit_id="web.assets_backend">
<xpath expr="." position="inside">
<link rel="stylesheet" href="/web_diagram/static/src/css/base_diagram.css"/>
<link rel="stylesheet" href="/web_diagram/static/src/less/diagram_view.less"/>
<script type="text/javascript" src="/web_diagram/static/lib/js/jquery.mousewheel.js"></script>
<script type="text/javascript" src="/web_diagram/static/lib/js/raphael.js"></script>