in odps/static/ui/src/df-view.js [174:360]
_actual_render: function() {
var that = this;
var cell_obj = $(that.$el).closest('.cell');
var cell_data = cell_obj.data();
if (cell_data !== undefined) {
var last_msg = cell_data.cell.last_msg_id;
if (!last_msg) {
$(that.$el).closest('.widget-area').find('button.close').click();
return;
}
}
cell_obj.find('.widget-area .close').click(function() {
cell_obj.find('div.output_wrapper').show();
});
that._chart_bindings = {
bar: {
button: '.btn-bar-chart',
panel: '.show-bar-chart',
config: '_bar_chart_conf',
agg: true
},
pie: {
button: '.btn-pie-chart',
panel: '.show-pie-chart',
config: '_pie_chart_conf',
agg: true
},
line: {
button: '.btn-line-chart',
panel: '.show-line-chart',
config: '_line_chart_conf',
agg: false
},
scatter: {
button: '.btn-scatter-chart',
panel: '.show-scatter-chart',
config: '_scatter_chart_conf',
agg: false
},
};
var df_view_obj = $(df_view_html.replace(/\{counter\}/g, viewer_counter));
viewer_counter += 1;
df_view_obj.on('click', '.btn-refresh-popup', function() {
that._refresh_popover();
});
df_view_obj.on('click', '.btn-cancel-popup', function() {
$(that.$el.find(".btn-config-chart")).click();
});
df_view_obj.on('click', '.btn-df-table', function() {
that._clear_widget_spaces();
var cfg_chart_btn = that.$el.find('.btn-config-chart');
if (cfg_chart_btn.hasClass('active')) {
$(cfg_chart_btn).click();
}
that.$el.find('.df-graph-toolbar').hide();
});
df_view_obj.on('click', '.btn-bar-chart', function() {
that._clear_widget_spaces();
that.$el.find('.df-graph-toolbar').show();
if (!that._bar_chart_conf) {
that._gen_default_agg_fields('bar');
}
that.send({
action: 'aggregate_graph',
target: 'bar_chart_records',
values: that._bar_chart_conf.values,
keys: that._bar_chart_conf.keys,
groups: that._bar_chart_conf.groups
});
that._bind_popover('bar');
that._refresh_chart('bar');
});
df_view_obj.on('click', '.btn-pie-chart', function() {
that._clear_widget_spaces();
that.$el.find('.df-graph-toolbar').show();
if (!that._pie_chart_conf) {
that._gen_default_agg_fields('pie', 'count');
}
that.send({
action: 'aggregate_graph',
target: 'pie_chart_records',
values: that._pie_chart_conf.values,
keys: that._pie_chart_conf.keys
});
that._bind_popover('pie');
that._refresh_chart('pie');
});
df_view_obj.on('click', '.btn-line-chart', function() {
that._clear_widget_spaces();
that.$el.find('.df-graph-toolbar').show();
if (!that._line_chart_conf) {
that._gen_default_agg_fields('line');
}
that.send({
action: 'aggregate_graph',
target: 'line_chart_records',
values: that._line_chart_conf.values,
keys: that._line_chart_conf.keys,
groups: that._line_chart_conf.groups
});
that._bind_popover('line');
that._refresh_chart('line');
});
df_view_obj.on('click', '.btn-scatter-chart', function() {
that._clear_widget_spaces();
that.$el.find('.df-graph-toolbar').show();
if (!that._scatter_chart_conf) {
that._gen_default_agg_fields('scatter');
}
that.send({
action: 'aggregate_graph',
target: 'scatter_chart_records',
values: that._scatter_chart_conf.values,
keys: that._scatter_chart_conf.keys,
groups: that._scatter_chart_conf.groups
});
that._bind_popover('scatter');
that._refresh_chart('scatter');
});
df_view_obj.on('click', '.btn-config-chart', function() {
if (!that.$el.find('.btn-config-chart').hasClass('active')) {
that._render_popover();
that._bind_popover(':visible');
}
if (that.$el.find('.btn-config-chart').hasClass('active')) {
that.$el.find(".btn-config-caret").removeClass("fa-caret-up").addClass("fa-caret-down");
} else {
that.$el.find(".btn-config-caret").removeClass("fa-caret-down").addClass("fa-caret-up");
}
});
df_view_obj.on('click', '.df-pager', function() {
var page_id = parseInt($(this).data('page')) - 1;
that.send({action: 'fetch_table', page: page_id});
});
df_view_obj.on('click', '.df-pager-first', function() {
that.send({action: 'fetch_table', page: 0});
});
df_view_obj.on('click', '.df-pager-last', function() {
var pagenation_obj = that.$el.find('.show-table .pagination');
that.send({action: 'fetch_table', page: pagenation_obj.data('pages') - 1});
});
df_view_obj.on('click', '.btn-download-graph', function() {
var chart_container = $(that.$el).find('.show-body:visible');
var chart = chart_container.data('chart');
if (!chart) return;
var uri = chart.getDataURL({backgroundColor: '#ffffff'});
var binding_name = chart_container.closest('.show-pane').data('binding');
var downloadLink = document.createElement("a");
downloadLink.href = uri;
downloadLink.download = binding_name + '.png';
document.body.appendChild(downloadLink);
downloadLink.click();
document.body.removeChild(downloadLink);
});
var _resize_table_areas = function() {
$('.show-table .show-body').each(function() {
$(this).find('.show-table-body').width($(this).closest('.cell').find('.inner_cell').width());
});
};
$(window).click(function() {
that.$el.find('.df-popover-agg').each(function(idx, e) {
that._destroy_popover(e);
});
}).resize(function() {
$('.show-body').each(function() {
var chart = $(this).data('chart');
if (chart) chart.resize();
});
_resize_table_areas();
});
that.$el.append(df_view_obj);
that.$el.find('.df-graph-toolbar').hide();
that.send({action: 'fetch_table'});
_resize_table_areas();
},