Charts: Improve form field handling

This commit is contained in:
Aysam Guerler
2014-05-24 01:16:14 -04:00
parent fd96ce12cd
commit e77488c1a1
6 changed files with 68 additions and 48 deletions
@@ -26,42 +26,42 @@ return {
{
label : '-- Do not show values --',
value : 'hide',
hide : 'x_axis_tick'
hide : ['x_axis_tick']
},
{
label : 'Auto',
value : 'auto',
hide : 'x_axis_tick'
hide : ['x_axis_tick']
},
{
label : 'Float',
value : 'f',
show : 'x_axis_tick'
show : ['x_axis_tick']
},
{
label : 'Exponent',
value : 'e',
show : 'x_axis_tick'
show : ['x_axis_tick']
},
{
label : 'Integer',
value : 'd',
hide : 'x_axis_tick'
hide : ['x_axis_tick']
},
{
label : 'Percentage',
value : 'p',
show : 'x_axis_tick'
show : ['x_axis_tick']
},
{
label : 'Rounded',
value : 'r',
show : 'x_axis_tick'
show : ['x_axis_tick']
},
{
label : 'SI-prefix',
value : 's',
show : 'x_axis_tick'
show : ['x_axis_tick']
}
]
},
@@ -118,42 +118,42 @@ return {
{
label : '-- Do not show values --',
value : 'hide',
hide : 'y_axis_tick'
hide : ['y_axis_tick']
},
{
label : 'Auto',
value : 'auto',
hide : 'y_axis_tick'
hide : ['y_axis_tick']
},
{
label : 'Float',
value : 'f',
show : 'y_axis_tick'
show : ['y_axis_tick']
},
{
label : 'Exponent',
value : 'e',
show : 'y_axis_tick'
show : ['y_axis_tick']
},
{
label : 'Integer',
value : 'd',
hide : 'y_axis_tick'
hide : ['y_axis_tick']
},
{
label : 'Percentage',
value : 'p',
show : 'y_axis_tick'
show : ['y_axis_tick']
},
{
label : 'Rounded',
value : 'r',
show : 'y_axis_tick'
show : ['y_axis_tick']
},
{
label : 'SI-prefix',
value : 's',
show : 'y_axis_tick'
show : ['y_axis_tick']
}
]
},
@@ -37,6 +37,13 @@ var View = Backbone.View.extend(
self.value(self.$select.val());
});
// add change event. fires on trigger
this.on('change', function() {
if (self.options.onchange) {
self.options.onchange(self.value());
}
});
// refresh
this._refresh();
@@ -31,7 +31,7 @@ var View = Backbone.View.extend(
// update
update: function(settings, model) {
// reset table
this.table.removeAll();
this.table.delAll();
// reset list
this.list = [];
@@ -40,6 +40,11 @@ var View = Backbone.View.extend(
for (var id in settings) {
this._add(id, settings[id], model);
}
// trigger change
for (var id in this.list) {
this.list[id].trigger('change');
}
},
// add table row
@@ -56,36 +61,38 @@ var View = Backbone.View.extend(
// text input field
case 'text' :
field = new Ui.Input({
id : id,
placeholder : settings_def.placeholder,
value : model.get(id),
onchange : function(value) {
model.set(id, value);
}
});
id : 'field_' + id,
placeholder : settings_def.placeholder,
value : model.get(id),
onchange : function(value) {
model.set(id, value);
}
});
break;
// select field
case 'select' :
field = new Ui.Select.View({
id : id,
data : settings_def.data,
value : model.get(id),
onchange : function(value) {
// set new value
model.set(id, value);
// find selected dictionary
var dict = _.findWhere(settings_def.data, {value: value});
if (dict) {
if (dict.show) {
self.$el.find('#' + dict.show).fadeIn('fast');
}
if (dict.hide) {
self.$el.find('#' + dict.hide).fadeOut('fast');
}
}
id : 'field_' + id,
data : settings_def.data,
value : model.get(id),
onchange : function(value) {
// set new value
model.set(id, value);
// find selected dictionary
var dict = _.findWhere(settings_def.data, {value: value});
if (dict) {
for (var i in dict.show) {
var target = dict.show[i];
self.table.get(target).show();
}
});
for (var i in dict.hide) {
var target = dict.hide[i];
self.table.get(target).hide();
}
}
}
});
break;
// slider input field
case 'separator' :
@@ -81,8 +81,13 @@ var View = Backbone.View.extend(
this._commit(id, true);
},
// remove
remove: function(id) {
// get element
get: function(id) {
return this.$el.find('#' + id);
},
// delete
del: function(id) {
var item = this.$tbody.find('#' + id);
if (item.length > 0) {
item.remove();
@@ -91,8 +96,8 @@ var View = Backbone.View.extend(
}
},
// remove
removeAll: function() {
// delete all
delAll: function() {
this.$tbody.html('');
this.row_count = 0;
this._refresh();
@@ -134,7 +139,7 @@ var View = Backbone.View.extend(
// commit
_commit: function(id, prepend) {
// remove previous item with same id
this.remove(id);
this.del(id);
// add
this.row.attr('id', id);
@@ -77,7 +77,7 @@ return Backbone.View.extend(
var chart_settings = this.app.types.get(chart_type);
// reset table
this.table.removeAll();
this.table.delAll();
// load list
var list = {};
@@ -40,6 +40,7 @@ return Backbone.View.extend(
if (!chart_type) {
return;
}
// get settings
var chart_definition = this.app.types.get(chart_type);