pgadmin-org
/
pgadmin4
mirror of https://github.com/pgadmin-org/pgadmin4.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Using bootstrap-swtich for creating a custom backform control for 

boolean values. (Modified quite a lot by Ashesh, before committing).

This patch also allow to set the header class in the backgrid through
setting  'cellHeaderClass' property of the schema object for any of the
node. It will allow us to set the different behaviour of the cell in the
list. One of the test case for it is: this will allow us to set the
different width of each column in the list using CSS class(es).
pull/3/head
Murtuza Zabuawala 2015-12-04 15:49:08 +05:30 committed by Ashesh Vashi
parent a04ef2de43
commit c3b517cb91
12 changed files with 1122 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
libraries.txt
View File

@ -20,3 +20,4 @@ font-Awesome 4.3 SIL OFL http://fortawesome.github.io/Font-Awe
font-mfizz 1.2 MIT http://fizzed.com/oss/font-mfizz
backgrid.js 0.3.5 MIT http://backgridjs.com/
backbone.undo 0.2 MIT http://backbone.undojs.com/
bootstrap-switch 3.3.2 MIT http://www.bootstrap-switch.org/

15
web/pgadmin/browser/server_groups/servers/templates/servers/servers.js
View File

@ -90,8 +90,7 @@ function($, _, S, pgAdmin, pgBrowser, alertify) {
d.connected = false;
d.icon = 'icon-server-not-connected';
t.addIcon(i, {icon: d.icon});
t.unload(i);
t.setInode(i);
obj.callbacks.refresh.apply(obj, [i]);
if (pgBrowser.serverInfo && d._id in pgBrowser.serverInfo) {
delete pgBrowser.serverInfo[d._id]
}
@ -152,13 +151,19 @@ function($, _, S, pgAdmin, pgBrowser, alertify) {
id: 'name', label:'{{ _('Name') }}', type: 'text', group: null,
mode: ['properties', 'edit', 'create']
},{
id: 'connected', label:'{{ _('Connected') }}', type: 'text', group: null,
mode: ['properties']
id: 'connected', label:'{{ _('Connected') }}', type: 'switch', group: null,
mode: ['properties'], 'options': {
'onText': 'True',
'offText': 'False',
'onColor': 'success',
'offColor': 'default',
'size': 'normal'
}
},{
id: 'version', label:'{{ _('Version') }}', type: 'text', group: null,
mode: ['properties'], show: 'isConnected'
},{
id: 'comment', label:'{{ _('Comments:') }}', type: 'multiline', group: null,
id: 'comment', label:'{{ _('Comments') }}', type: 'multiline', group: null,
mode: ['properties', 'edit', 'create'], disabled: 'notEditMode'
},{
id: 'host', label:'{{ _('Host Name/Address') }}', type: 'text', group: "Connection",

2
web/pgadmin/browser/templates/browser/js/collection.js
View File

@ -28,7 +28,7 @@ function($, _, S, pgAdmin, Backbone, Alertify, Backform) {
this.node_initialized = true;
pgAdmin.Browser.add_menus([{
name: 'refresh', node: this.type, module: this,
applies: ['object', 'context'], callback: 'refresh_node',
applies: ['object', 'context'], callback: 'refresh',
priority: 1, label: '{{ _("Refresh...") }}',
icon: 'fa fa-refresh'
}]);

16
web/pgadmin/browser/templates/browser/js/node.js
View File

@ -74,7 +74,7 @@ function($, _, S, pgAdmin, Menu, Backbone, Alertify, Backform) {
data: {'action': 'edit'}, icon: 'fa fa-pencil-square-o'
}, {
name: 'refresh', node: this.type, module: this,
applies: ['object', 'context'], callback: 'refresh_node',
applies: ['object', 'context'], callback: 'refresh',
priority: 2, label: '{{ _("Refresh...") }}',
icon: 'fa fa-refresh'
}]);
@ -458,8 +458,18 @@ function($, _, S, pgAdmin, Menu, Backbone, Alertify, Backform) {
}
}
},
refresh_node: function(item) {
this.callbacks.selected.apply(this, null, item);
refresh: function(i) {
var self = this,
t = pgBrowser.tree,
d = t.itemData(i);
t.unload(i);
t.setInode((d && d.inode) || false);
t.deselect(i);
setTimeout(function() {
t.select(i);
}, 10);
}
},
/**********************************************************************

195
web/pgadmin/static/css/bootstrap-switch.css Normal file
View File

@ -0,0 +1,195 @@
/* ========================================================================
* bootstrap-switch - v3.3.2
* http://www.bootstrap-switch.org
* ========================================================================
* Copyright 2012-2013 Mattia Larentis
*
* ========================================================================
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ========================================================================
*/
.bootstrap-switch {
display: inline-block;
direction: ltr;
cursor: pointer;
border-radius: 4px;
border: 1px solid;
border-color: #cccccc;
position: relative;
text-align: left;
overflow: hidden;
line-height: 8px;
z-index: 0;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
vertical-align: middle;
-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.bootstrap-switch .bootstrap-switch-container {
display: inline-block;
top: 0;
border-radius: 4px;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.bootstrap-switch .bootstrap-switch-handle-on,
.bootstrap-switch .bootstrap-switch-handle-off,
.bootstrap-switch .bootstrap-switch-label {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
cursor: pointer;
display: inline-block !important;
height: 100%;
padding: 6px 12px;
font-size: 14px;
line-height: 20px;
}
.bootstrap-switch .bootstrap-switch-handle-on,
.bootstrap-switch .bootstrap-switch-handle-off {
text-align: center;
z-index: 1;
}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary {
color: #fff;
background: #337ab7;
}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info {
color: #fff;
background: #5bc0de;
}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success {
color: #fff;
background: #5cb85c;
}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning {
background: #f0ad4e;
color: #fff;
}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger {
color: #fff;
background: #d9534f;
}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default {
color: #000;
background: #eeeeee;
}
.bootstrap-switch .bootstrap-switch-label {
text-align: center;
margin-top: -1px;
margin-bottom: -1px;
z-index: 100;
color: #333333;
background: #ffffff;
}
.bootstrap-switch .bootstrap-switch-handle-on {
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
}
.bootstrap-switch .bootstrap-switch-handle-off {
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
}
.bootstrap-switch input[type='radio'],
.bootstrap-switch input[type='checkbox'] {
position: absolute !important;
top: 0;
left: 0;
margin: 0;
z-index: -1;
opacity: 0;
filter: alpha(opacity=0);
}
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-label {
padding: 1px 5px;
font-size: 12px;
line-height: 1.5;
}
.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-small .bootstrap-switch-label {
padding: 5px 10px;
font-size: 12px;
line-height: 1.5;
}
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-large .bootstrap-switch-label {
padding: 6px 16px;
font-size: 18px;
line-height: 1.3333333;
}
.bootstrap-switch.bootstrap-switch-disabled,
.bootstrap-switch.bootstrap-switch-readonly,
.bootstrap-switch.bootstrap-switch-indeterminate {
cursor: default !important;
}
.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-disabled .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-readonly .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-indeterminate .bootstrap-switch-label {
opacity: 0.5;
filter: alpha(opacity=50);
cursor: default !important;
}
.bootstrap-switch.bootstrap-switch-animate .bootstrap-switch-container {
-webkit-transition: margin-left 0.5s;
-o-transition: margin-left 0.5s;
transition: margin-left 0.5s;
}
.bootstrap-switch.bootstrap-switch-inverse .bootstrap-switch-handle-on {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
}
.bootstrap-switch.bootstrap-switch-inverse .bootstrap-switch-handle-off {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
}
.bootstrap-switch.bootstrap-switch-focused {
border-color: #66afe9;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.bootstrap-switch.bootstrap-switch-on .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-off .bootstrap-switch-label {
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
}
.bootstrap-switch.bootstrap-switch-off .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-on .bootstrap-switch-label {
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
}

22
web/pgadmin/static/css/bootstrap-switch.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

18
web/pgadmin/static/css/overrides.css
View File

@ -561,3 +561,21 @@ table.backgrid tr.new {
outline: 1px solid rgba(82, 168, 236, 0.8);
outline-offset: -1px;
}
/* Remove default left padding from checkbox for bootstrap-switch */
.checkbox {
margin-top: 0px !important;
margin-bottom: 0px !important;
}
.checkbox label {
padding-left: 0px !important;
}
.bootstrap-switch > .bootstrap-switch-container > input {
height: 0px;
width: 0px;
margin: 0px;
padding: 0px;
border: 0px solid black;
}

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

@ -66,7 +66,8 @@
'boolean': 'boolean',
'options': ['readonly-option', 'select', Backgrid.Extension.PGSelectCell],
'multiline': ['textarea', 'textarea', 'string'],
'collection': ['sub-node-collection', 'sub-node-collection', 'string']
'collection': ['sub-node-collection', 'sub-node-collection', 'string'],
'switch' : 'switch'
};
var getMappedControl = Backform.getMappedControl = function(type, mode) {
@ -172,6 +173,57 @@
}
});
// Requires the Bootstrap Switch to work.
var SwitchControl = Backform.SwitchControl = Backform.InputControl.extend({
defaults: {
type: "checkbox",
label: "",
options: {},
extraClasses: [],
onText: 'True',
offText: 'False',
onColor: 'success',
offColor: 'default',
size: 'small'
},
template: _.template([
'<label class="<%=Backform.controlLabelClassName%>"><%=label%></label>',
'<div class="<%=Backform.controlsClassName%>">',
' <div class="checkbox">',
' <label>',
' <input type="<%=type%>" class="<%=extraClasses.join(\' \')%>" name="<%=name%>" <%=value ? "checked=\'checked\'" : ""%> <%=disabled ? "disabled" : ""%> <%=required ? "required" : ""%> />',
' </label>',
' </div>',
'</div>'
].join("\n")),
getValueFromDOM: function() {
return this.formatter.toRaw(
this.$el.find(".input").data('switch-get'),
this.model
);
},
render: function() {
var field = _.defaults(this.field.toJSON(), this.defaults),
attributes = this.model.toJSON(),
attrArr = field.name.split('.'),
name = attrArr.shift(),
path = attrArr.join('.'),
rawValue = this.keyPathAccessor(attributes[name], path);
Backform.InputControl.prototype.render.apply(this, arguments);
//Check & set additional properties
this.$el.find("input").bootstrapSwitch({
'onText': field.onText,
'offText': field.offText,
'onColor': field.onColor,
'offColor': field.offColor,
'size': field.size,
'state': rawValue
});
return this;
}
});
// Backform Dialog view (in bootstrap tabbular form)
// A collection of field models.
@ -327,15 +379,39 @@
var groups = Backform.generateViewSchema(node_info, m, type),
schema = [],
columns = [],
tblCols = [],
addAll = _.isUndefined(cols) || _.isNull(cols);
// Create another array if cols is of type object & store its keys in that array,
// If cols is object then chances that we have custom width class attached with in.
if(_.isObject(cols)) {
tblCols = Object.keys(cols);
}
// Prepare columns for backgrid
_.each(groups, function(fields, key) {
_.each(fields, function(f) {
if (!f.control && !f.cell) {
return;
}
f.cell_priority = _.indexOf(cols, f.name);
// Check custom property in cols & if it is present then attach it to current cell
if (tblCols.length > 0 && _.isString(cols[f.name])) {
f.headerCell = Backgrid.Extension.CustomHeaderCell;
f.cellHeaderClasses = cols[f.name];
f.cell_priority = _.indexOf(tblCols, f.name);
} else if(tblCols.length > 0) {
f.cell_priority = _.indexOf(tblCols, f.name);
} else {
f.cell_priority = _.indexOf(cols, f.name);
}
// We can also provide custom header cell class in schema itself,
// But we will give priority to extraClass attached in cols
// If headerCell property is already set by cols then skip extraClass property from schema
if (!(f.headerCell) && f.cellHeaderClasses) {
f.headerCell = Backgrid.Extension.CustomHeaderCell;
}
if (addAll || f.cell_priority != -1) {
columns.push(f);
}

11
web/pgadmin/static/js/backgrid/backgrid.pgadmin.js
View File

@ -223,6 +223,17 @@
}
});
var CustomHeaderCell = Backgrid.Extension.CustomHeaderCell = Backgrid.HeaderCell.extend({
initialize: function () {
// Here, we will add custom classes to header cell
Backgrid.HeaderCell.prototype.initialize.apply(this, arguments);
var getClassName = this.column.get('cellHeaderClasses');
if (getClassName) {
this.$el.addClass(getClassName);
}
}
});
return Backgrid;
}));

744
web/pgadmin/static/js/bootstrap-switch.js Normal file
View File

@ -0,0 +1,744 @@
/* ========================================================================
* bootstrap-switch - v3.3.2
* http://www.bootstrap-switch.org
* ========================================================================
* Copyright 2012-2013 Mattia Larentis
*
* ========================================================================
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ========================================================================
*/
(function() {
var slice = [].slice;
(function($, window) {
"use strict";
var BootstrapSwitch;
BootstrapSwitch = (function() {
function BootstrapSwitch(element, options) {
if (options == null) {
options = {};
}
this.$element = $(element);
this.options = $.extend({}, $.fn.bootstrapSwitch.defaults, {
state: this.$element.is(":checked"),
size: this.$element.data("size"),
animate: this.$element.data("animate"),
disabled: this.$element.is(":disabled"),
readonly: this.$element.is("[readonly]"),
indeterminate: this.$element.data("indeterminate"),
inverse: this.$element.data("inverse"),
radioAllOff: this.$element.data("radio-all-off"),
onColor: this.$element.data("on-color"),
offColor: this.$element.data("off-color"),
onText: this.$element.data("on-text"),
offText: this.$element.data("off-text"),
labelText: this.$element.data("label-text"),
handleWidth: this.$element.data("handle-width"),
labelWidth: this.$element.data("label-width"),
baseClass: this.$element.data("base-class"),
wrapperClass: this.$element.data("wrapper-class")
}, options);
this.prevOptions = {};
this.$wrapper = $("<div>", {
"class": (function(_this) {
return function() {
var classes;
classes = ["" + _this.options.baseClass].concat(_this._getClasses(_this.options.wrapperClass));
classes.push(_this.options.state ? _this.options.baseClass + "-on" : _this.options.baseClass + "-off");
if (_this.options.size != null) {
classes.push(_this.options.baseClass + "-" + _this.options.size);
}
if (_this.options.disabled) {
classes.push(_this.options.baseClass + "-disabled");
}
if (_this.options.readonly) {
classes.push(_this.options.baseClass + "-readonly");
}
if (_this.options.indeterminate) {
classes.push(_this.options.baseClass + "-indeterminate");
}
if (_this.options.inverse) {
classes.push(_this.options.baseClass + "-inverse");
}
if (_this.$element.attr("id")) {
classes.push(_this.options.baseClass + "-id-" + (_this.$element.attr("id")));
}
return classes.join(" ");
};
})(this)()
});
this.$container = $("<div>", {
"class": this.options.baseClass + "-container"
});
this.$on = $("<span>", {
html: this.options.onText,
"class": this.options.baseClass + "-handle-on " + this.options.baseClass + "-" + this.options.onColor
});
this.$off = $("<span>", {
html: this.options.offText,
"class": this.options.baseClass + "-handle-off " + this.options.baseClass + "-" + this.options.offColor
});
this.$label = $("<span>", {
html: this.options.labelText,
"class": this.options.baseClass + "-label"
});
this.$element.on("init.bootstrapSwitch", (function(_this) {
return function() {
return _this.options.onInit.apply(element, arguments);
};
})(this));
this.$element.on("switchChange.bootstrapSwitch", (function(_this) {
return function(e) {
if (false === _this.options.onSwitchChange.apply(element, arguments)) {
if (_this.$element.is(":radio")) {
return $("[name='" + (_this.$element.attr('name')) + "']").trigger("previousState.bootstrapSwitch", true);
} else {
return _this.$element.trigger("previousState.bootstrapSwitch", true);
}
}
};
})(this));
this.$container = this.$element.wrap(this.$container).parent();
this.$wrapper = this.$container.wrap(this.$wrapper).parent();
this.$element.before(this.options.inverse ? this.$off : this.$on).before(this.$label).before(this.options.inverse ? this.$on : this.$off);
if (this.options.indeterminate) {
this.$element.prop("indeterminate", true);
}
this._init();
this._elementHandlers();
this._handleHandlers();
this._labelHandlers();
this._formHandler();
this._externalLabelHandler();
this.$element.trigger("init.bootstrapSwitch", this.options.state);
}
BootstrapSwitch.prototype._constructor = BootstrapSwitch;
BootstrapSwitch.prototype.setPrevOptions = function() {
return this.prevOptions = $.extend(true, {}, this.options);
};
BootstrapSwitch.prototype.state = function(value, skip) {
if (typeof value === "undefined") {
return this.options.state;
}
if (this.options.disabled || this.options.readonly) {
return this.$element;
}
if (this.options.state && !this.options.radioAllOff && this.$element.is(":radio")) {
return this.$element;
}
if (this.$element.is(":radio")) {
$("[name='" + (this.$element.attr('name')) + "']").trigger("setPreviousOptions.bootstrapSwitch");
} else {
this.$element.trigger("setPreviousOptions.bootstrapSwitch");
}
if (this.options.indeterminate) {
this.indeterminate(false);
}
value = !!value;
this.$element.prop("checked", value).trigger("change.bootstrapSwitch", skip);
return this.$element;
};
BootstrapSwitch.prototype.toggleState = function(skip) {
if (this.options.disabled || this.options.readonly) {
return this.$element;
}
if (this.options.indeterminate) {
this.indeterminate(false);
return this.state(true);
} else {
return this.$element.prop("checked", !this.options.state).trigger("change.bootstrapSwitch", skip);
}
};
BootstrapSwitch.prototype.size = function(value) {
if (typeof value === "undefined") {
return this.options.size;
}
if (this.options.size != null) {
this.$wrapper.removeClass(this.options.baseClass + "-" + this.options.size);
}
if (value) {
this.$wrapper.addClass(this.options.baseClass + "-" + value);
}
this._width();
this._containerPosition();
this.options.size = value;
return this.$element;
};
BootstrapSwitch.prototype.animate = function(value) {
if (typeof value === "undefined") {
return this.options.animate;
}
value = !!value;
if (value === this.options.animate) {
return this.$element;
}
return this.toggleAnimate();
};
BootstrapSwitch.prototype.toggleAnimate = function() {
this.options.animate = !this.options.animate;
this.$wrapper.toggleClass(this.options.baseClass + "-animate");
return this.$element;
};
BootstrapSwitch.prototype.disabled = function(value) {
if (typeof value === "undefined") {
return this.options.disabled;
}
value = !!value;
if (value === this.options.disabled) {
return this.$element;
}
return this.toggleDisabled();
};
BootstrapSwitch.prototype.toggleDisabled = function() {
this.options.disabled = !this.options.disabled;
this.$element.prop("disabled", this.options.disabled);
this.$wrapper.toggleClass(this.options.baseClass + "-disabled");
return this.$element;
};
BootstrapSwitch.prototype.readonly = function(value) {
if (typeof value === "undefined") {
return this.options.readonly;
}
value = !!value;
if (value === this.options.readonly) {
return this.$element;
}
return this.toggleReadonly();
};
BootstrapSwitch.prototype.toggleReadonly = function() {
this.options.readonly = !this.options.readonly;
this.$element.prop("readonly", this.options.readonly);
this.$wrapper.toggleClass(this.options.baseClass + "-readonly");
return this.$element;
};
BootstrapSwitch.prototype.indeterminate = function(value) {
if (typeof value === "undefined") {
return this.options.indeterminate;
}
value = !!value;
if (value === this.options.indeterminate) {
return this.$element;
}
return this.toggleIndeterminate();
};
BootstrapSwitch.prototype.toggleIndeterminate = function() {
this.options.indeterminate = !this.options.indeterminate;
this.$element.prop("indeterminate", this.options.indeterminate);
this.$wrapper.toggleClass(this.options.baseClass + "-indeterminate");
this._containerPosition();
return this.$element;
};
BootstrapSwitch.prototype.inverse = function(value) {
if (typeof value === "undefined") {
return this.options.inverse;
}
value = !!value;
if (value === this.options.inverse) {
return this.$element;
}
return this.toggleInverse();
};
BootstrapSwitch.prototype.toggleInverse = function() {
var $off, $on;
this.$wrapper.toggleClass(this.options.baseClass + "-inverse");
$on = this.$on.clone(true);
$off = this.$off.clone(true);
this.$on.replaceWith($off);
this.$off.replaceWith($on);
this.$on = $off;
this.$off = $on;
this.options.inverse = !this.options.inverse;
return this.$element;
};
BootstrapSwitch.prototype.onColor = function(value) {
var color;
color = this.options.onColor;
if (typeof value === "undefined") {
return color;
}
if (color != null) {
this.$on.removeClass(this.options.baseClass + "-" + color);
}
this.$on.addClass(this.options.baseClass + "-" + value);
this.options.onColor = value;
return this.$element;
};
BootstrapSwitch.prototype.offColor = function(value) {
var color;
color = this.options.offColor;
if (typeof value === "undefined") {
return color;
}
if (color != null) {
this.$off.removeClass(this.options.baseClass + "-" + color);
}
this.$off.addClass(this.options.baseClass + "-" + value);
this.options.offColor = value;
return this.$element;
};
BootstrapSwitch.prototype.onText = function(value) {
if (typeof value === "undefined") {
return this.options.onText;
}
this.$on.html(value);
this._width();
this._containerPosition();
this.options.onText = value;
return this.$element;
};
BootstrapSwitch.prototype.offText = function(value) {
if (typeof value === "undefined") {
return this.options.offText;
}
this.$off.html(value);
this._width();
this._containerPosition();
this.options.offText = value;
return this.$element;
};
BootstrapSwitch.prototype.labelText = function(value) {
if (typeof value === "undefined") {
return this.options.labelText;
}
this.$label.html(value);
this._width();
this.options.labelText = value;
return this.$element;
};
BootstrapSwitch.prototype.handleWidth = function(value) {
if (typeof value === "undefined") {
return this.options.handleWidth;
}
this.options.handleWidth = value;
this._width();
this._containerPosition();
return this.$element;
};
BootstrapSwitch.prototype.labelWidth = function(value) {
if (typeof value === "undefined") {
return this.options.labelWidth;
}
this.options.labelWidth = value;
this._width();
this._containerPosition();
return this.$element;
};
BootstrapSwitch.prototype.baseClass = function(value) {
return this.options.baseClass;
};
BootstrapSwitch.prototype.wrapperClass = function(value) {
if (typeof value === "undefined") {
return this.options.wrapperClass;
}
if (!value) {
value = $.fn.bootstrapSwitch.defaults.wrapperClass;
}
this.$wrapper.removeClass(this._getClasses(this.options.wrapperClass).join(" "));
this.$wrapper.addClass(this._getClasses(value).join(" "));
this.options.wrapperClass = value;
return this.$element;
};
BootstrapSwitch.prototype.radioAllOff = function(value) {
if (typeof value === "undefined") {
return this.options.radioAllOff;
}
value = !!value;
if (value === this.options.radioAllOff) {
return this.$element;
}
this.options.radioAllOff = value;
return this.$element;
};
BootstrapSwitch.prototype.onInit = function(value) {
if (typeof value === "undefined") {
return this.options.onInit;
}
if (!value) {
value = $.fn.bootstrapSwitch.defaults.onInit;
}
this.options.onInit = value;
return this.$element;
};
BootstrapSwitch.prototype.onSwitchChange = function(value) {
if (typeof value === "undefined") {
return this.options.onSwitchChange;
}
if (!value) {
value = $.fn.bootstrapSwitch.defaults.onSwitchChange;
}
this.options.onSwitchChange = value;
return this.$element;
};
BootstrapSwitch.prototype.destroy = function() {
var $form;
$form = this.$element.closest("form");
if ($form.length) {
$form.off("reset.bootstrapSwitch").removeData("bootstrap-switch");
}
this.$container.children().not(this.$element).remove();
this.$element.unwrap().unwrap().off(".bootstrapSwitch").removeData("bootstrap-switch");
return this.$element;
};
BootstrapSwitch.prototype._width = function() {
var $handles, handleWidth;
$handles = this.$on.add(this.$off);
$handles.add(this.$label).css("width", "");
handleWidth = this.options.handleWidth === "auto" ? Math.max(this.$on.width(), this.$off.width()) : this.options.handleWidth;
$handles.width(handleWidth);
this.$label.width((function(_this) {
return function(index, width) {
if (_this.options.labelWidth !== "auto") {
return _this.options.labelWidth;
}
if (width < handleWidth) {
return handleWidth;
} else {
return width;
}
};
})(this));
this._handleWidth = this.$on.outerWidth();
this._labelWidth = this.$label.outerWidth();
this.$container.width((this._handleWidth * 2) + this._labelWidth);
return this.$wrapper.width(this._handleWidth + this._labelWidth);
};
BootstrapSwitch.prototype._containerPosition = function(state, callback) {
if (state == null) {
state = this.options.state;
}
this.$container.css("margin-left", (function(_this) {
return function() {
var values;
values = [0, "-" + _this._handleWidth + "px"];
if (_this.options.indeterminate) {
return "-" + (_this._handleWidth / 2) + "px";
}
if (state) {
if (_this.options.inverse) {
return values[1];
} else {
return values[0];
}
} else {
if (_this.options.inverse) {
return values[0];
} else {
return values[1];
}
}
};
})(this));
if (!callback) {
return;
}
return setTimeout(function() {
return callback();
}, 50);
};
BootstrapSwitch.prototype._init = function() {
var init, initInterval;
init = (function(_this) {
return function() {
_this.setPrevOptions();
_this._width();
return _this._containerPosition(null, function() {
if (_this.options.animate) {
return _this.$wrapper.addClass(_this.options.baseClass + "-animate");
}
});
};
})(this);
if (this.$wrapper.is(":visible")) {
return init();
}
return initInterval = window.setInterval((function(_this) {
return function() {
if (_this.$wrapper.is(":visible")) {
init();
return window.clearInterval(initInterval);
}
};
})(this), 50);
};
BootstrapSwitch.prototype._elementHandlers = function() {
return this.$element.on({
"setPreviousOptions.bootstrapSwitch": (function(_this) {
return function(e) {
return _this.setPrevOptions();
};
})(this),
"previousState.bootstrapSwitch": (function(_this) {
return function(e) {
_this.options = _this.prevOptions;
if (_this.options.indeterminate) {
_this.$wrapper.addClass(_this.options.baseClass + "-indeterminate");
}
return _this.$element.prop("checked", _this.options.state).trigger("change.bootstrapSwitch", true);
};
})(this),
"change.bootstrapSwitch": (function(_this) {
return function(e, skip) {
var state;
e.preventDefault();
e.stopImmediatePropagation();
state = _this.$element.is(":checked");
_this._containerPosition(state);
if (state === _this.options.state) {
return;
}
_this.options.state = state;
_this.$wrapper.toggleClass(_this.options.baseClass + "-off").toggleClass(_this.options.baseClass + "-on");
if (!skip) {
if (_this.$element.is(":radio")) {
$("[name='" + (_this.$element.attr('name')) + "']").not(_this.$element).prop("checked", false).trigger("change.bootstrapSwitch", true);
}
return _this.$element.trigger("switchChange.bootstrapSwitch", [state]);
}
};
})(this),
"focus.bootstrapSwitch": (function(_this) {
return function(e) {
e.preventDefault();
return _this.$wrapper.addClass(_this.options.baseClass + "-focused");
};
})(this),
"blur.bootstrapSwitch": (function(_this) {
return function(e) {
e.preventDefault();
return _this.$wrapper.removeClass(_this.options.baseClass + "-focused");
};
})(this),
"keydown.bootstrapSwitch": (function(_this) {
return function(e) {
if (!e.which || _this.options.disabled || _this.options.readonly) {
return;
}
switch (e.which) {
case 37:
e.preventDefault();
e.stopImmediatePropagation();
return _this.state(false);
case 39:
e.preventDefault();
e.stopImmediatePropagation();
return _this.state(true);
}
};
})(this)
});
};
BootstrapSwitch.prototype._handleHandlers = function() {
this.$on.on("click.bootstrapSwitch", (function(_this) {
return function(event) {
event.preventDefault();
event.stopPropagation();
_this.state(false);
return _this.$element.trigger("focus.bootstrapSwitch");
};
})(this));
return this.$off.on("click.bootstrapSwitch", (function(_this) {
return function(event) {
event.preventDefault();
event.stopPropagation();
_this.state(true);
return _this.$element.trigger("focus.bootstrapSwitch");
};
})(this));
};
BootstrapSwitch.prototype._labelHandlers = function() {
return this.$label.on({
"click": function(e) {
return e.stopPropagation();
},
"mousedown.bootstrapSwitch touchstart.bootstrapSwitch": (function(_this) {
return function(e) {
if (_this._dragStart || _this.options.disabled || _this.options.readonly) {
return;
}
e.preventDefault();
e.stopPropagation();
_this._dragStart = (e.pageX || e.originalEvent.touches[0].pageX) - parseInt(_this.$container.css("margin-left"), 10);
if (_this.options.animate) {
_this.$wrapper.removeClass(_this.options.baseClass + "-animate");
}
return _this.$element.trigger("focus.bootstrapSwitch");
};
})(this),
"mousemove.bootstrapSwitch touchmove.bootstrapSwitch": (function(_this) {
return function(e) {
var difference;
if (_this._dragStart == null) {
return;
}
e.preventDefault();
difference = (e.pageX || e.originalEvent.touches[0].pageX) - _this._dragStart;
if (difference < -_this._handleWidth || difference > 0) {
return;
}
_this._dragEnd = difference;
return _this.$container.css("margin-left", _this._dragEnd + "px");
};
})(this),
"mouseup.bootstrapSwitch touchend.bootstrapSwitch": (function(_this) {
return function(e) {
var state;
if (!_this._dragStart) {
return;
}
e.preventDefault();
if (_this.options.animate) {
_this.$wrapper.addClass(_this.options.baseClass + "-animate");
}
if (_this._dragEnd) {
state = _this._dragEnd > -(_this._handleWidth / 2);
_this._dragEnd = false;
_this.state(_this.options.inverse ? !state : state);
} else {
_this.state(!_this.options.state);
}
return _this._dragStart = false;
};
})(this),
"mouseleave.bootstrapSwitch": (function(_this) {
return function(e) {
return _this.$label.trigger("mouseup.bootstrapSwitch");
};
})(this)
});
};
BootstrapSwitch.prototype._externalLabelHandler = function() {
var $externalLabel;
$externalLabel = this.$element.closest("label");
return $externalLabel.on("click", (function(_this) {
return function(event) {
event.preventDefault();
event.stopImmediatePropagation();
if (event.target === $externalLabel[0]) {
return _this.toggleState();
}
};
})(this));
};
BootstrapSwitch.prototype._formHandler = function() {
var $form;
$form = this.$element.closest("form");
if ($form.data("bootstrap-switch")) {
return;
}
return $form.on("reset.bootstrapSwitch", function() {
return window.setTimeout(function() {
return $form.find("input").filter(function() {
return $(this).data("bootstrap-switch");
}).each(function() {
return $(this).bootstrapSwitch("state", this.checked);
});
}, 1);
}).data("bootstrap-switch", true);
};
BootstrapSwitch.prototype._getClasses = function(classes) {
var c, cls, i, len;
if (!$.isArray(classes)) {
return [this.options.baseClass + "-" + classes];
}
cls = [];
for (i = 0, len = classes.length; i < len; i++) {
c = classes[i];
cls.push(this.options.baseClass + "-" + c);
}
return cls;
};
return BootstrapSwitch;
})();
$.fn.bootstrapSwitch = function() {
var args, option, ret;
option = arguments[0], args = 2 <= arguments.length ? slice.call(arguments, 1) : [];
ret = this;
this.each(function() {
var $this, data;
$this = $(this);
data = $this.data("bootstrap-switch");
if (!data) {
$this.data("bootstrap-switch", data = new BootstrapSwitch(this, option));
}
if (typeof option === "string") {
return ret = data[option].apply(data, args);
}
});
return ret;
};
$.fn.bootstrapSwitch.Constructor = BootstrapSwitch;
return $.fn.bootstrapSwitch.defaults = {
state: true,
size: null,
animate: true,
disabled: false,
readonly: false,
indeterminate: false,
inverse: false,
radioAllOff: false,
onColor: "primary",
offColor: "default",
onText: "ON",
offText: "OFF",
labelText: "&nbsp;",
handleWidth: "auto",
labelWidth: "auto",
baseClass: "bootstrap-switch",
wrapperClass: "wrapper",
onInit: function() {},
onSwitchChange: function() {}
};
})(window.jQuery, window);
}).call(this);

22
web/pgadmin/static/js/bootstrap-switch.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

8
web/pgadmin/templates/base.html
View File

@ -22,6 +22,7 @@
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/font-awesome.css' if config.DEBUG else 'css/font-awesome.min.css') }}"/>
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/font-mfizz.css') }}"/>
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap-datepicker3.css')}}"/>
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap-switch.css')}}"/>
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/backgrid/backgrid.css')}}"/>
<!-- View specified stylesheets -->
@ -49,12 +50,16 @@
"deps": ['backform'],
"exports": 'Backgrid',
},
"bootstrap.switch": {
"deps": ['jquery', 'bootstrap'],
"exports": 'jQuery.fn.bootstrapSwitch'
},
"bootstrap.datepicker": {
"deps": ['jquery', 'bootstrap'],
"exports": 'jQuery.fn.datepicker'
},
"pgadmin.backgrid": {
"deps": ["backgrid", "bootstrap.datepicker"],
"deps": ["backgrid", "bootstrap.datepicker","bootstrap.switch"],
},
"pgadmin.backform": {
"deps": ['backform', "pgadmin.backgrid"],
@ -75,6 +80,7 @@
'pgadmin.alertifyjs': "{{ url_for('static', filename='js/alertifyjs/pgadmin.defaults') }}",
backbone: "{{ url_for('static', filename='js/' + ('backbone' if config.DEBUG else 'backbone-min')) }}",
"bootstrap.datepicker": "{{ url_for('static', filename='js/' + ('bootstrap-datepicker' if config.DEBUG else 'bootstrap-datepicker.min')) }}",
"bootstrap.switch": "{{ url_for('static', filename='js/' + ('bootstrap-switch' if config.DEBUG else 'bootstrap-switch.min')) }}",
backform: "{{ url_for('static', filename='js/backform') }}",
backgrid: "{{ url_for('static', filename='js/backgrid/' + ('backgrid' if config.DEBUG else 'backgrid.min')) }}",
"backbone.undo": "{{ url_for('static', filename='js/' + ('backbone.undo' if config.DEBUG else 'backbone.undo.min')) }}",