[IMP] reorganizes all options in graph views (puts them in 4 dropdown menus) (addon web_graph)

bzr revid: ged@openerp.com-20131127091053-ydbo89dj027ndm3o
This commit is contained in:
Gery Debongnie 2013-11-27 10:10:53 +01:00
parent 8ef078acb3
commit 0b5ff7efff
2 changed files with 89 additions and 41 deletions

View File

@ -30,6 +30,43 @@ instance.web_graph.GraphView = instance.web.View.extend({
this.switch_mode(mode);
},
'click .graph_expand_selection li' : function (event) {
event.preventDefault();
switch (event.target.attributes['data-choice'].nodeValue) {
case 'fold_columns':
this.pivot_table.fold_cols();
this.draw_table();
break;
case 'fold_rows':
this.pivot_table.fold_rows();
this.draw_table();
break;
case 'fold_all':
this.pivot_table.fold_all();
this.draw_table();
break;
case 'expand_all':
this.pivot_table.expand_all().then(this.proxy('draw_table'));
break;
}
},
'click .graph_options_selection li' : function (event) {
event.preventDefault();
switch (event.target.attributes['data-choice'].nodeValue) {
case 'swap_axis':
this.pivot_table.swap_axis();
this.draw_table();
break;
case 'update_values':
this.pivot_table.update_values().then(this.proxy('draw_table'));
break;
case 'export_data':
// Export code... To do...
break;
}
},
'click .web_graph_click' : function (event) {
event.preventDefault();
var id = event.target.attributes['data-id'].nodeValue;
@ -45,38 +82,11 @@ instance.web_graph.GraphView = instance.web.View.extend({
.then(this.proxy('draw_table'));
},
'click label.graph_swap_axis' : function (event) {
this.pivot_table.swap_axis();
this.draw_table();
},
'click label.graph_fold_all' : function (event) {
this.pivot_table.fold_all();
this.draw_table();
},
'click label.graph_fold_rows' : function (event) {
this.pivot_table.fold_rows();
this.draw_table();
},
'click label.graph_fold_cols' : function (event) {
this.pivot_table.fold_cols();
this.draw_table();
},
'click label.graph_heat_map' : function (event) {
this.heat_map_mode = !this.heat_map_mode;
this.draw_table();
},
'click label.graph_expand_all' : function (event) {
this.pivot_table.expand_all().then(this.proxy('draw_table'));
},
'click label.graph_update_values' : function (event) {
this.pivot_table.update_values().then(this.proxy('draw_table'));
},
},
view_loading: function (fields_view_get) {
@ -91,6 +101,7 @@ instance.web_graph.GraphView = instance.web.View.extend({
this.pivot_table = null;
this.heat_map_mode = false;
this.mode = 'pivot';
// get the default groupbys and measure defined in the field view
_.each(fields_view_get.arch.children, function (field) {
@ -175,7 +186,9 @@ instance.web_graph.GraphView = instance.web.View.extend({
switch_mode: function (mode) {
this.mode = mode;
if (mode === 'pivot') {
var table_modes = ['pivot', 'heatmap', 'row_heatmap', 'col_heatmap'];
if (_.contains(table_modes, mode)) {
this.draw_table();
this.table.css('display', 'block');
this.svg.css('display','none');
} else {
@ -317,7 +330,9 @@ instance.web_graph.GraphView = instance.web.View.extend({
cell = $('<td></td>');
cell.append((value === undefined) ? '' : value);
if ((self.heat_map_mode) && (value !== undefined)) {
console.log("self.mode",self.mode);
if ((self.mode == 'heatmap') && (value !== undefined)) {
console.log("yop");
var color = Math.floor(50 + 205*(pivot.total - value)/pivot.total);
cell.css("background-color", "rgb(255," + color + "," + color + ")");
}

View File

@ -1,25 +1,58 @@
<templates>
<t t-name="GraphView">
<div class="graph_header">
<div class="btn-group">
<label type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
Mode <span class="caret"></span>
</label>
<ul class="dropdown-menu graph_mode_selection" role="menu">
<li><a data-mode="pivot" href="#">Pivot table</a></li>
<div class="btn-group">
<label type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
Mode <span class="caret"></span>
</label>
<ul class="dropdown-menu graph_mode_selection" role="menu">
<li><a data-mode="pivot" href="#">Table</a></li>
<li><a data-mode="heatmap" href="#">Heatmap</a></li>
<li><a data-mode="row_heatmap" href="#">Row Heatmap</a></li>
<li><a data-mode="col_heatmap" href="#">Col Heatmap</a></li>
<li role="presentation" class="divider"></li>
<li><a data-mode="bar_chart" href="#">Bar chart</a></li>
<li><a data-mode="line_chart" href="#">Line Chart</a></li>
<li><a data-mode="pie_chart" href="#">Pie chart</a></li>
</ul>
<label type="button" class="btn btn-default graph_swap_axis">Swap Axis</label>
<li><a data-mode="bar_chart" href="#">Bar chart</a></li>
<li><a data-mode="line_chart" href="#">Line Chart</a></li>
<li><a data-mode="pie_chart" href="#">Pie chart</a></li>
</ul>
</div>
<div class="btn-group">
<label type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
Measure <span class="caret"></span>
</label>
<ul class="dropdown-menu graph_measure_selection" role="menu">
<li><a data-choice="count" href="#">Count</a></li>
</ul>
</div>
<div class="btn-group">
<label type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
Fold/Expand <span class="caret"></span>
</label>
<ul class="dropdown-menu graph_expand_selection" role="menu">
<li><a data-choice="fold_columns" href="#">Fold Columns</a></li>
<li><a data-choice="fold_rows" href="#">Fold Rows</a></li>
<li><a data-choice="fold_all" href="#">Fold All</a></li>
<li role="presentation" class="divider"></li>
<li><a data-choice="expand_all" href="#">Expand All</a></li>
</ul>
<!-- <label type="button" class="btn btn-default graph_swap_axis">Swap Axis</label>
<label type="button" class="btn btn-default graph_fold_rows">Fold Rows</label>
<label type="button" class="btn btn-default graph_fold_cols">Fold Cols</label>
<label type="button" class="btn btn-default graph_fold_all">Fold All</label>
<label type="button" class="btn btn-default graph_heat_map">Heat Map</label>
<label type="button" class="btn btn-default graph_expand_all">Expand All</label>
<label type="button" class="btn btn-default graph_update_values">Update Values</label>
</div>
--> </div>
<div class="btn-group">
<label type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
Options <span class="caret"></span>
</label>
<ul class="dropdown-menu graph_options_selection" role="menu">
<li><a data-choice="swap_axis" href="#">Swap Axis</a></li>
<li><a data-choice="update_values" href="#">Update all values</a></li>
<li><a data-choice="export_data" href="#">Export data</a></li>
</ul>
</div>
</div>
<div class="graph_main_content"></div>
</t>