IntenseWebs/pgadmin4
3
0
Fork 0
mirror of https://github.com/pgadmin-org/pgadmin4.git synced 2025-01-27 16:57:00 -06:00
Code Issues Packages Projects Releases Wiki Activity

Improvements in the form/properties dialog control generation, and data

Browse Source 
change events.

- In input & textarea control, call the change event on key up (but -
  not on every key up events, wait for sometime before trigger that
  event, so that - we do not overdo that).
- In unique/subnode control, whenever we create new model object, set
  all the required static fields used by pgAdmin form generation logic.
- In NodeAjaxListCell, we don't need to call the list generation
  operation (ajax operation) for each and every cell. They use the same
  shared column object.
This commit is contained in:
Ashesh Vashi 2016-03-15 18:58:16 +05:30
parent ff424850f8
commit b52a5736ff
2 changed files with 77 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
web/pgadmin/browser/static/js/node.ui.js
View File

@ -321,28 +321,25 @@ function($, _, pgAdmin, Backbone, Backform, Alertify, Node) {
initialize: function () {
Backgrid.Extension.Select2Cell.prototype.initialize.apply(this, arguments);
var col = _.defaults(this.column.toJSON(), this.defaults),
model = this.model, column = this.column,
editable = Backgrid.callByNeed(col.editable, column, model),
optionValues = _.clone(this.optionValues || this.column.get('options'));
var self = this,
url = self.column.get('url') || self.defaults.url,
m = self.model.handler || self.model;
var url = this.column.get('url') || this.defaults.url,
options_cached = this.column.get('options_cached');
// Hmm - we found the url option.
// That means - we needs to fetch the options from that node.
if (url) {
var node = this.column.get('schema_node'),
node_info = this.column.get('node_info'),
if (url && !options_cached) {
var self = this,
model = this.model, column = this.column,
eventHandler = model.top || model,
node = column.get('schema_node'),
node_info = column.get('node_info'),
full_url = node.generate_url.apply(
node, [
null, url, this.column.get('node_data'),
this.column.get('url_with_id') || false, node_info
null, url, column.get('node_data'),
column.get('url_with_id') || false, node_info
]),
cache_level = this.column.get('cache_level') || node.type,
cache_node = this.column.get('cache_node');
cache_level = column.get('cache_level') || node.type,
cache_node = column.get('cache_node');
cache_node = (cache_node && pgAdmin.Browser.Nodes['cache_node']) || node;
@ -353,9 +350,9 @@ function($, _, pgAdmin, Backbone, Backform, Alertify, Node) {
*/
var data = cache_node.cache(url, node_info, cache_level);
if (this.column.get('version_compatible') &&
if (column.get('version_compatible') &&
(_.isUndefined(data) || _.isNull(data))) {
m.trigger('pgadmin:view:fetching', m, self.column);
eventHandler.trigger('pgadmin:view:fetching', m, column);
$.ajax({
async: false,
url: full_url,
@ -367,10 +364,10 @@ function($, _, pgAdmin, Backbone, Backform, Alertify, Node) {
data = cache_node.cache(url, node_info, cache_level, res.data);
},
error: function() {
m.trigger('pgadmin:view:fetch:error', m, self.column);
eventHandler.trigger('pgadmin:view:fetch:error', m, column);
}
});
m.trigger('pgadmin:view:fetched', m, self.column);
eventHandler.trigger('pgadmin:view:fetched', m, column);
}
// To fetch only options from cache, we do not need time from 'at'
// attribute but only options.
@ -381,15 +378,16 @@ function($, _, pgAdmin, Backbone, Backform, Alertify, Node) {
/*
* Transform the data
*/
transform = this.column.get('transform') || self.defaults.transform;
transform = column.get('transform') || self.defaults.transform;
if (transform && _.isFunction(transform)) {
// We will transform the data later, when rendering.
// It will allow us to generate different data based on the
// dependencies.
self.column.set('options', transform.bind(self, data));
column.set('options', transform.bind(self, data));
} else {
self.column.set('options', data);
column.set('options', data);
}
column.set('options_cached', true);
}
},
render: function() {

89
web/pgadmin/static/js/backform.pgadmin.js
View File

@ -240,11 +240,24 @@
* Override the input control events in order to reslove the issue related to
* not updating the value sometimes in the input control.
*/
Backform.InputControl.prototype.events = {
"change input": "onChange",
"blur input": "onChange",
"focus input": "clearInvalid"
};
_.extend(
Backform.InputControl.prototype, {
events: {
"change input": "onChange",
"blur input": "onChange",
"keyup input": "onKeyUp",
"focus input": "clearInvalid"
},
onKeyUp: function(ev) {
if (this.key_timeout) {
clearTimeout(this.key_timeout);
}
this.keyup_timeout = setTimeout(function() {
this.onChange(ev);
}.bind(this), 400);
}
});
/*
* Override the textarea control events in order to resolve the issue related
@ -255,32 +268,40 @@
* http://stackoverflow.com/questions/11338592/how-can-i-bind-to-the-change-event-of-a-textarea-in-jquery
*/
_.extend(
Backform.TextareaControl.prototype, {
defaults: _.extend(
Backform.TextareaControl.prototype.defaults, {
rows: 5
}),
events : {
"change textarea": "onChange",
"keyup textarea": "onChange",
"paste textarea": "onChange",
"selectionchange textarea": "onChange",
"focus textarea": "clearInvalid"
},
template: _.template([
'<label class="<%=Backform.controlLabelClassName%>"><%=label%></label>',
'<div class="<%=Backform.controlsClassName%>">',
' <textarea ',
' class="<%=Backform.controlClassName%> <%=extraClasses.join(\' \')%>" name="<%=name%>"',
' maxlength="<%=maxlength%>" placeholder="<%-placeholder%>" <%=disabled ? "disabled" : ""%>',
' rows=<%=rows ? rows : ""%>',
' <%=required ? "required" : ""%>><%-value%></textarea>',
' <% if (helpMessage && helpMessage.length) { %>',
' <span class="<%=Backform.helpMessageClassName%>"><%=helpMessage%></span>',
' <% } %>',
'</div>'
].join("\n"))
});
Backform.TextareaControl.prototype, {
defaults: _.extend(
Backform.TextareaControl.prototype.defaults, {rows: 5}
),
events : {
"change textarea": "onChange",
"keyup textarea": "onKeyUp",
"paste textarea": "onChange",
"selectionchange textarea": "onChange",
"focus textarea": "clearInvalid"
},
template: _.template([
'<label class="<%=Backform.controlLabelClassName%>"><%=label%></label>',
'<div class="<%=Backform.controlsClassName%>">',
' <textarea ',
' class="<%=Backform.controlClassName%> <%=extraClasses.join(\' \')%>" name="<%=name%>"',
' maxlength="<%=maxlength%>" placeholder="<%-placeholder%>" <%=disabled ? "disabled" : ""%>',
' rows=<%=rows ? rows : ""%>',
' <%=required ? "required" : ""%>><%-value%></textarea>',
' <% if (helpMessage && helpMessage.length) { %>',
' <span class="<%=Backform.helpMessageClassName%>"><%=helpMessage%></span>',
' <% } %>',
'</div>'
].join("\n")),
onKeyUp: function(ev) {
if (this.key_timeout) {
clearTimeout(this.key_timeout);
}
this.keyup_timeout = setTimeout(function() {
this.onChange(ev);
}.bind(this), 400);
}
});
/*
* Overriding the render function of the select control to allow us to use
@ -748,7 +769,7 @@
// Check if unique columns provided are also in model attributes.
if (uniqueCol.length > _.intersection(columns, uniqueCol).length) {
errorMsg = "Developer: Unique column/s [ "+_.difference(uniqueCol, columns)+" ] not found in collection model [ " + columns +" ]."
errorMsg = "Developer: Unique columns [ "+_.difference(uniqueCol, columns)+" ] not found in collection model [ " + columns +" ]."
alert (errorMsg);
}
@ -1000,7 +1021,9 @@
var m = new (data.model) (null, {
silent: true,
handler: self.model.handler || self.model,
top: self.model.top || self.model
top: self.model.top || self.model,
node_info: self.model.node_info,
collection: collection
});
collection.add(m);