Using different strategy to render different type of data based on the
type for the Variable control, instead of using the complex DynamicCell.pull/3/head
parent
01d020ed95
commit
a0648ed54b
|
@ -31,6 +31,53 @@
|
|||
}
|
||||
} (this, function(root, _, $, Backbone, Backform, Alertify, pgAdmin, pgNode) {
|
||||
|
||||
/*
|
||||
* cellFunction for variable control.
|
||||
* This function returns cell class depending on vartype.
|
||||
*/
|
||||
var cellFunction = function(model) {
|
||||
var self = this,
|
||||
name = model.get("name"),
|
||||
availVariables = self.get('availVariables'),
|
||||
variable = availVariables[name];
|
||||
|
||||
switch(variable && variable.vartype) {
|
||||
case "bool":
|
||||
/*
|
||||
* bool cell and variable can not be stateless (i.e undefined).
|
||||
* It should be either true or false.
|
||||
*/
|
||||
if (_.isUndefined(model.get("value"))) {
|
||||
model.set("value", false);
|
||||
}
|
||||
|
||||
return Backgrid.Extension.SwitchCell;
|
||||
break;
|
||||
case "enum":
|
||||
var options = [],
|
||||
enumVals = variable.enumvals;
|
||||
|
||||
_.each(enumVals, function(enumVal) {
|
||||
options.push([enumVal, enumVal]);
|
||||
});
|
||||
|
||||
return Backgrid.Extension.Select2Cell.extend({optionValues: options});
|
||||
break;
|
||||
case "integer":
|
||||
return Backgrid.IntegerCell;
|
||||
break;
|
||||
case "real":
|
||||
return Backgrid.NumberCell.extend({decimals: 0});
|
||||
break;
|
||||
case "string":
|
||||
return Backgrid.StringCell;
|
||||
break;
|
||||
default:
|
||||
return Backgrid.Cell;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* VariableModel used to represent configuration parameters (variables tab)
|
||||
* for database objects.
|
||||
|
@ -46,8 +93,8 @@
|
|||
schema: [
|
||||
{id: 'name', label:'Name', type:'text', editable: false, cellHeaderClasses: 'width_percent_30'},
|
||||
{
|
||||
id: 'value', label:'Value', type: 'text', cell: 'dynamic-variable',
|
||||
editable: true, cellHeaderClasses: 'width_percent_50'
|
||||
id: 'value', label:'Value', type: 'text', editable: true,
|
||||
cellFunction: cellFunction, cellHeaderClasses: 'width_percent_50'
|
||||
},
|
||||
{id: 'database', label:'Database', type: 'text', editable: false},
|
||||
{id: 'role', label:'Role', type: 'text', editable: false}
|
||||
|
@ -85,102 +132,6 @@
|
|||
}
|
||||
});
|
||||
|
||||
/*
|
||||
* Dynamic Variable cell. Used for variable data type column in Variables tab.
|
||||
* Behaviour of cell depends on variable data type.
|
||||
*/
|
||||
var DynamicVariableCell = Backgrid.Extension.DynamicVariableCell = Backgrid.Cell.extend({
|
||||
/*
|
||||
* Mapping of postgres data type to backgrid cell type.
|
||||
*/
|
||||
variableCellMapper: {
|
||||
"bool":Backgrid.Extension.SwitchCell,
|
||||
"enum":Backgrid.Extension.Select2Cell,
|
||||
"string":Backgrid.Cell,
|
||||
"integer":Backgrid.IntegerCell,
|
||||
"real":Backgrid.NumberCell
|
||||
},
|
||||
initialize: function (opts) {
|
||||
|
||||
var self = this,
|
||||
name = opts.model.get("name");
|
||||
self.availVariables = opts.column.get('availVariables');
|
||||
|
||||
var variable = (self.availVariables[name]),
|
||||
cell = self.variableCellMapper[variable && variable.vartype] || Backgrid.Cell;
|
||||
|
||||
/*
|
||||
* Set properties for dynamic cell.
|
||||
*/
|
||||
_.each(cell.prototype, function(v,k) {
|
||||
self[k] = v;
|
||||
});
|
||||
|
||||
DynamicVariableCell.__super__.initialize.apply(self, arguments);
|
||||
|
||||
switch(variable && variable.vartype) {
|
||||
case "bool":
|
||||
// There are no specific properties for BooleanCell.
|
||||
break;
|
||||
|
||||
case "enum":
|
||||
var options = [],
|
||||
name = self.model.get("name"),
|
||||
enumVals = variable.enumvals;
|
||||
|
||||
_.each(enumVals, function(enumVal) {
|
||||
options.push([enumVal, enumVal]);
|
||||
});
|
||||
|
||||
self.optionValues = options;
|
||||
self.multiple = cell.prototype.multiple;
|
||||
self.delimiter = cell.prototype.delimiter;
|
||||
|
||||
self.listenTo(
|
||||
self.model, "backgrid:edit",
|
||||
function (model, column, cell, editor) {
|
||||
if (column.get("name") == self.column.get("name")) {
|
||||
editor.setOptionValues(self.optionValues);
|
||||
editor.setMultiple(self.multiple);
|
||||
}
|
||||
});
|
||||
break;
|
||||
|
||||
case "integer":
|
||||
|
||||
self.decimals = 0;
|
||||
self.decimalSeparator = cell.prototype.decimalSeparator;
|
||||
self.orderSeparator = cell.prototype.orderSeparator;
|
||||
var formatter = self.formatter;
|
||||
|
||||
formatter.decimals = self.decimals;
|
||||
formatter.decimalSeparator = self.decimalSeparator;
|
||||
formatter.orderSeparator = self.orderSeparator;
|
||||
|
||||
break;
|
||||
|
||||
case "real":
|
||||
|
||||
self.decimals = cell.prototype.decimals;
|
||||
self.decimalSeparator = cell.prototype.decimalSeparator;
|
||||
self.orderSeparator = cell.prototype.orderSeparator;
|
||||
|
||||
var formatter = self.formatter;
|
||||
|
||||
formatter.decimals = 0;
|
||||
formatter.decimalSeparator = self.decimalSeparator;
|
||||
formatter.orderSeparator = self.orderSeparator;
|
||||
|
||||
break;
|
||||
|
||||
case "string":
|
||||
default:
|
||||
// There are no specific properties for StringCell and Cell.
|
||||
break;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Variable Tab Control to set/update configuration values for database object.
|
||||
*
|
||||
|
|
|
@ -22,6 +22,49 @@
|
|||
factory(root, root._, (root.jQuery || root.Zepto || root.ender || root.$), root.Backbone, root.Backform);
|
||||
}
|
||||
} (this, function(root, _, $, Backbone, Backform, Alertify) {
|
||||
|
||||
/*
|
||||
* Add mechanism in backgrid to render different types of cells in
|
||||
* same column;
|
||||
*/
|
||||
|
||||
// Add new property cellFunction in Backgrid.Column.
|
||||
_.extend(Backgrid.Column.prototype.defaults, { cellFunction: undefined });
|
||||
|
||||
_.extend(Backgrid.Row.prototype, {
|
||||
makeCell: function (column) {
|
||||
return new (this.getCell(column))({
|
||||
column: column,
|
||||
model: this.model
|
||||
});
|
||||
},
|
||||
/*
|
||||
* getCell function will check and execute user given cellFunction to get
|
||||
* appropriate cell class for current cell being rendered.
|
||||
* User provided cellFunction must return valid cell class.
|
||||
* cellFunction will be called with context (this) as column and model as
|
||||
* argument.
|
||||
*/
|
||||
getCell: function (column) {
|
||||
var cf = column.get("cellFunction");
|
||||
if (_.isFunction(cf)){
|
||||
var cell = cf.apply(column, [this.model]);
|
||||
try {
|
||||
return Backgrid.resolveNameToClass(cell, "Cell");
|
||||
} catch (e) {
|
||||
if (e instanceof ReferenceError) {
|
||||
// Fallback to column cell.
|
||||
return column.get("cell");
|
||||
} else {
|
||||
throw e; // Let other exceptions bubble up
|
||||
}
|
||||
}
|
||||
} else {
|
||||
return column.get("cell");
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var ObjectCellEditor = Backgrid.Extension.ObjectCellEditor = Backgrid.CellEditor.extend({
|
||||
modalTemplate: _.template([
|
||||
'<div class="subnode-dialog" tabindex="1">',
|
||||
|
|
Loading…
Reference in New Issue