Replace Bootstrap switch with Bootstrap4 toggle to improve the performance. Fixes #3051

This commit is contained in:
Khushboo Vashi
2019-02-04 11:31:48 +05:30
committed by Akshay Joshi
parent 93234c86b7
commit dae8186c2a
29 changed files with 1672 additions and 173 deletions

View File

@@ -234,7 +234,7 @@ define('pgadmin.node.cast', [
group: gettext('Definition'), disabled: true, mode:['properties','edit'],
},{
id: 'castcontext', label: gettext('Context'),
options:{'onText':'IMPLICIT','offText':'EXPLICIT'},
options:{'onText':'IMPLICIT','offText':'EXPLICIT', width: '90'},
editable: false, type: 'string', group: gettext('Definition'),
mode:['create'],
control: Backform.SwitchControl.extend({

View File

@@ -138,7 +138,6 @@ define('pgadmin.node.language', [
options: {
'onText': gettext('Yes'), 'offText': gettext('No'),
'onColor': 'success', 'offColor': 'primary',
'size': 'small',
},
group: gettext('Definition'), mode: ['edit', 'properties', 'create'], deps: ['name'],
disabled: function(m) {

View File

@@ -264,7 +264,6 @@ define('pgadmin.node.domain', [
options: {
'onText': gettext('Yes'), 'offText': gettext('No'),
'onColor': 'success', 'offColor': 'primary',
'size': 'small',
},
},{
id: 'collname', label: gettext('Collation'), cell: 'string',

View File

@@ -286,7 +286,6 @@ define('pgadmin.node.function', [
options: {
'onText': gettext('Yes'), 'offText': gettext('No'),
'onColor': 'success', 'offColor': 'primary',
'size': 'small',
},
},{
id: 'prosecdef', label: gettext('Security of definer?'),

View File

@@ -220,7 +220,6 @@ define('pgadmin.node.trigger_function', [
options: {
'onText': gettext('Yes'), 'offText': gettext('No'),
'onColor': 'success', 'offColor': 'primary',
'size': 'small',
},
},{
id: 'prosecdef', label: gettext('Security of definer?'),

View File

@@ -160,7 +160,6 @@ define('pgadmin.node.sequence', [
options: {
'onText': gettext('Yes'), 'offText': gettext('No'),
'onColor': 'success', 'offColor': 'primary',
'size': 'small',
},
}, pgBrowser.SecurityGroupSchema,{
id: 'acl', label: gettext('Privileges'), type: 'text',

View File

@@ -463,10 +463,10 @@ define('pgadmin.node.schema', [
is_editable = _.isFunction(editable) ? !!editable.apply(column, [model]) : !!editable;
if (is_editable) {
this.$el.addClass('editable');
input.bootstrapSwitch('disabled',false);
input.bootstrapToggle('disabled',false);
} else {
this.$el.removeClass('editable');
input.bootstrapSwitch('disabled',true);
input.bootstrapToggle('disabled',true);
// Set self value into model to false
setTimeout(function() { model.set(self_name, false); }, 10);
}

View File

@@ -771,6 +771,7 @@ define('pgadmin.node.foreign_key', [
options: {
onText: 'FULL',
offText: 'SIMPLE',
width: '80',
},disabled: function(m) {
// If we are in table edit mode then
if (_.has(m, 'handler') && !_.isUndefined(m.handler)) {

View File

@@ -18,21 +18,21 @@ define('pgadmin.node.trigger', [
SchemaChildTreeNode
) {
Backform.CustomSwitchControl = Backform.SwitchControl.extend({
template: _.template([
'<label class="control-label pg-el-sm-6 pg-el-12"><%=label%></label>',
'<div class="pgadmin-controls pg-el-sm-6 pg-el-12">',
' <div class="checkbox">',
' <label>',
' <input type="checkbox" class="<%=extraClasses.join(\' \')%>"',
' name="<%=name%>" <%=value ? "checked=\'checked\'" : ""%>',
' <%=disabled ? "disabled" : ""%> <%=required ? "required" : ""%> />',
' </label>',
' </div>',
'</div>',
'<% if (helpMessage && helpMessage.length) { %>',
' <span class="<%=Backform.helpMessageClassName%>"><%=helpMessage%></span>',
'<% } %>',
].join('\n')),
defaults: {
label: '',
options: {
onText: gettext('Yes'),
offText: gettext('No'),
onColor: 'success',
offColor: 'primary',
width: null,
height: null,
},
controlLabelClassName: 'control-label pg-el-sm-5 pg-el-12',
controlsClassName: 'pgadmin-controls pg-el-sm-7 pg-el-12',
extraClasses: [],
helpMessage: null,
},
className: 'pgadmin-control-group form-group col-6 row',
});

View File

@@ -388,7 +388,6 @@ define('pgadmin.node.database', [
options: {
'onText': gettext('Yes'), 'offText': gettext('No'),
'onColor': 'success', 'offColor': 'primary',
'size': 'small',
},
},{
id: 'datallowconn', label: gettext('Allow connections?'),
@@ -397,7 +396,6 @@ define('pgadmin.node.database', [
options: {
'onText': gettext('Yes'), 'offText': gettext('No'),
'onColor': 'success', 'offColor': 'primary',
'size': 'small',
},
},{
id: 'datacl', label: gettext('Privileges'), type: 'collection',

View File

@@ -72,23 +72,27 @@ define('pgadmin.node.role', [
var switchOptions = {
'onText': gettext('Yes'), 'offText': gettext('No'),
'size': 'mini',
'size': 'mini', onColor: 'success',
offColor: 'primary',
};
var RoleCustomSwitchControl = Backform.SwitchControl.extend({
template: _.template([
'<label class="control-label pg-el-sm-10 pg-el-12"><%=label%></label>',
'<div class="pgadmin-controls pg-el-sm-2 pg-el-12">',
' <div class="checkbox">',
' <label>',
' <input type="checkbox" class="<%=extraClasses.join(\' \')%>" name="<%=name%>" <%=value ? "checked=\'checked\'" : ""%> <%=disabled ? "disabled" : ""%> <%=required ? "required" : ""%> />',
' </label>',
' </div>',
'</div>',
'<% if (helpMessage && helpMessage.length) { %>',
' <span class="<%=Backform.helpMessageClassName%>"><%=helpMessage%></span>',
'<% } %>',
].join('\n')),
defaults: {
label: '',
options: {
onText: gettext('Yes'),
offText: gettext('No'),
onColor: 'success',
offColor: 'primary',
size: 'mini',
width: null,
height: null,
},
controlLabelClassName: 'control-label pg-el-sm-4 pg-el-12',
controlsClassName: 'pgadmin-controls pg-el-sm-8 pg-el-12',
extraClasses: [],
helpMessage: null,
},
className: 'pgadmin-control-group form-group pg-el-12 row',
});

View File

@@ -768,7 +768,7 @@ define('pgadmin.node.server', [
},{
id: 'connected', label: gettext('Connected?'), type: 'switch',
mode: ['properties'], group: gettext('Connection'), 'options': {
'onText': gettext('True'), 'offText': gettext('False'), 'size': 'small',
'onText': gettext('True'), 'offText': gettext('False'), 'size': 'mini',
},
},{
id: 'version', label: gettext('Version'), type: 'text', group: null,
@@ -857,7 +857,7 @@ define('pgadmin.node.server', [
},{
id: 'sslcompression', label: gettext('SSL compression?'), type: 'switch',
mode: ['edit', 'create'], group: gettext('SSL'),
'options': {'size': 'small'},
'options': {'size': 'mini'},
deps: ['sslmode'], disabled: 'isSSL',
},{
id: 'sslcert', label: gettext('Client certificate'), type: 'text',
@@ -894,7 +894,7 @@ define('pgadmin.node.server', [
},{
id: 'sslcompression', label: gettext('SSL compression?'), type: 'switch',
mode: ['properties'], group: gettext('SSL'),
'options': {'size': 'small'},
'options': {'size': 'mini'},
deps: ['sslmode'], visible: function(model) {
var sslmode = model.get('sslmode');
return _.indexOf(SSL_MODES, sslmode) != -1;
@@ -902,7 +902,7 @@ define('pgadmin.node.server', [
},{
id: 'use_ssh_tunnel', label: gettext('Use SSH tunneling'), type: 'switch',
mode: ['properties', 'edit', 'create'], group: gettext('SSH Tunnel'),
'options': {'size': 'small'},
'options': {'size': 'mini'},
disabled: function(model) {
if (!pgAdmin.Browser.utils.support_ssh_tunnel) {
setTimeout(function() {
@@ -936,7 +936,7 @@ define('pgadmin.node.server', [
id: 'tunnel_authentication', label: gettext('Authentication'), type: 'switch',
mode: ['properties', 'edit', 'create'], group: gettext('SSH Tunnel'),
'options': {'onText': gettext('Identity file'),
'offText': gettext('Password'), 'size': 'small'},
'offText': gettext('Password'), 'size': 'mini', width: '90'},
deps: ['use_ssh_tunnel'],
disabled: function(model) {
return !model.get('use_ssh_tunnel');