IntenseWebs/pgadmin4
3
0
Fork 0
mirror of https://github.com/pgadmin-org/pgadmin4.git synced 2025-02-25 18:55:31 -06:00
Code Issues Packages Projects Releases Wiki Activity

Fixed the warnings/errors reported by eslint for all the static

Browse Source 
javascripts.
This commit is contained in:
Ashesh Vashi
2018-01-12 12:59:51 +05:30
parent b78b97d89b
commit c32eb6bd37
102 changed files with 25830 additions and 24548 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2195
web/pgadmin/browser/static/js/browser.js
View File

File diff suppressed because it is too large Load Diff

272
web/pgadmin/browser/static/js/collection.js
View File

@@ -1,7 +1,7 @@
define([
'sources/gettext', 'jquery', 'underscore', 'underscore.string', 'sources/pgadmin',
'backbone', 'alertify', 'backform', 'backgrid', 'sources/browser/generate_url', 'pgadmin.backform', 'pgadmin.backgrid',
'pgadmin.browser.node'
'pgadmin.browser.node',
], function(gettext, $, _, S, pgAdmin, Backbone, Alertify, Backform, Backgrid, generateUrl) {
var pgBrowser = pgAdmin.Browser = pgAdmin.Browser || {};
@@ -13,145 +13,145 @@ define([
pgBrowser.Collection = function() {};
_.extend(
pgBrowser.Collection,
_.clone(pgBrowser.Node), {
///////
// Initialization function
// Generally - used to register the menus for this type of node.
//
// Also, look at pgAdmin.Browser.add_menus(...) function.
//
// Collection will not have 'Properties' menu.
//
// NOTE: Override this for each node for initialization purpose
Init: function() {
if (this.node_initialized)
return;
this.node_initialized = true;
pgAdmin.Browser.add_menus([{
name: 'refresh', node: this.type, module: this,
applies: ['object', 'context'], callback: 'refresh',
priority: 1, label: gettext('Refresh...'),
icon: 'fa fa-refresh'
}]);
// show query tool only in context menu of supported nodes.
if (pgAdmin.DataGrid && pgAdmin.unsupported_nodes) {
if (_.indexOf(pgAdmin.unsupported_nodes, this.type) == -1) {
pgAdmin.Browser.add_menus([{
name: 'show_query_tool', node: this.type, module: this,
applies: ['context'], callback: 'show_query_tool',
priority: 998, label: gettext('Query Tool...'),
icon: 'fa fa-bolt'
}]);
}
}
},
hasId: false,
is_collection: true,
collection_node: true,
// A collection will always have a collection of statistics, when the node
// it represent will have some statistics.
hasCollectiveStatistics: true,
showProperties: function(item, data, panel) {
var that = this,
j = panel.$container.find('.obj_properties').first(),
view = j.data('obj-view'),
content = $('<div></div>')
.addClass('pg-prop-content col-xs-12'),
node = pgBrowser.Nodes[that.node],
// This will be the URL, used for object manipulation.
urlBase = this.generate_url(item, 'properties', data),
collection = new (node.Collection.extend({
url: urlBase,
model: node.model
}))(),
info = this.getTreeNodeHierarchy.apply(this, [item]),
gridSchema = Backform.generateGridColumnsFromModel(
info, node.model, 'properties', that.columns
),
// Initialize a new Grid instance
grid = new Backgrid.Grid({
columns: gridSchema.columns,
collection: collection,
className: "backgrid table-bordered"
}),
gridView = {
'remove': function() {
if (this.grid) {
if (this.grid.collection) {
this.grid.collection.reset(null, {silent: true});
delete (this.grid.collection);
}
delete (this.grid);
this.grid = null;
}
},
grid: grid
};
if (view) {
// Avoid unnecessary reloads
if (_.isEqual($(panel).data('node-prop'), urlBase)) {
_.extend(
pgBrowser.Collection,
_.clone(pgBrowser.Node), {
///////
// Initialization function
// Generally - used to register the menus for this type of node.
//
// Also, look at pgAdmin.Browser.add_menus(...) function.
//
// Collection will not have 'Properties' menu.
//
// NOTE: Override this for each node for initialization purpose
Init: function() {
if (this.node_initialized)
return;
}
this.node_initialized = true;
pgAdmin.Browser.add_menus([{
name: 'refresh', node: this.type, module: this,
applies: ['object', 'context'], callback: 'refresh',
priority: 1, label: gettext('Refresh...'),
icon: 'fa fa-refresh',
}]);
// Cache the current IDs for next time
$(panel).data('node-prop', urlBase);
// Reset the data object
j.data('obj-view', null);
}
// Make sure the HTML element is empty.
j.empty();
j.data('obj-view', gridView);
// Render subNode grid
content.append(grid.render().$el);
j.append(content);
// Fetch Data
collection.fetch({
reset: true,
error: function(xhr, error, message) {
pgBrowser.Events.trigger(
'pgadmin:collection:retrieval:error', 'properties', xhr, error, message, item, that
);
if (
!Alertify.pgHandleItemError(xhr, error, message, {item: item, info: info})
) {
Alertify.pgNotifier(
error, xhr,
S(
gettext("Error retrieving properties - %s.")
).sprintf(message || that.label).value(),
function() {
console.log(arguments);
}
);
// show query tool only in context menu of supported nodes.
if (pgAdmin.DataGrid && pgAdmin.unsupported_nodes) {
if (_.indexOf(pgAdmin.unsupported_nodes, this.type) == -1) {
pgAdmin.Browser.add_menus([{
name: 'show_query_tool', node: this.type, module: this,
applies: ['context'], callback: 'show_query_tool',
priority: 998, label: gettext('Query Tool...'),
icon: 'fa fa-bolt',
}]);
}
}
})
},
generate_url: function(item, type) {
/*
* Using list, and collection functions of a node to get the nodes
* under the collection, and properties of the collection respectively.
*/
var opURL = {
'properties': 'obj', 'children': 'nodes',
},
self = this;
var collectionPickFunction = function (treeInfoValue, treeInfoKey) {
return (treeInfoKey != self.type);
};
var treeInfo = this.getTreeNodeHierarchy(item);
var actionType = type in opURL ? opURL[type] : type;
return generateUrl.generate_url(pgAdmin.Browser.URL, treeInfo, actionType, self.node, collectionPickFunction);
},
});
},
hasId: false,
is_collection: true,
collection_node: true,
// A collection will always have a collection of statistics, when the node
// it represent will have some statistics.
hasCollectiveStatistics: true,
showProperties: function(item, data, panel) {
var that = this,
j = panel.$container.find('.obj_properties').first(),
view = j.data('obj-view'),
content = $('<div></div>')
.addClass('pg-prop-content col-xs-12'),
node = pgBrowser.Nodes[that.node],
// This will be the URL, used for object manipulation.
urlBase = this.generate_url(item, 'properties', data),
collection = new (node.Collection.extend({
url: urlBase,
model: node.model,
}))(),
info = this.getTreeNodeHierarchy.apply(this, [item]),
gridSchema = Backform.generateGridColumnsFromModel(
info, node.model, 'properties', that.columns
),
// Initialize a new Grid instance
grid = new Backgrid.Grid({
columns: gridSchema.columns,
collection: collection,
className: 'backgrid table-bordered',
}),
gridView = {
'remove': function() {
if (this.grid) {
if (this.grid.collection) {
this.grid.collection.reset(null, {silent: true});
delete (this.grid.collection);
}
delete (this.grid);
this.grid = null;
}
},
grid: grid,
};
if (view) {
// Avoid unnecessary reloads
if (_.isEqual($(panel).data('node-prop'), urlBase)) {
return;
}
// Cache the current IDs for next time
$(panel).data('node-prop', urlBase);
// Reset the data object
j.data('obj-view', null);
}
// Make sure the HTML element is empty.
j.empty();
j.data('obj-view', gridView);
// Render subNode grid
content.append(grid.render().$el);
j.append(content);
// Fetch Data
collection.fetch({
reset: true,
error: function(xhr, error, message) {
pgBrowser.Events.trigger(
'pgadmin:collection:retrieval:error', 'properties', xhr, error,
message, item, that
);
if (!Alertify.pgHandleItemError(
xhr, error, message, {item: item, info: info}
)) {
Alertify.pgNotifier(error, xhr, S(
gettext('Error retrieving properties - %s.')
).sprintf(message || that.label).value(), function() {
console.warn(arguments);
});
}
},
});
},
generate_url: function(item, type) {
/*
* Using list, and collection functions of a node to get the nodes
* under the collection, and properties of the collection respectively.
*/
var opURL = {
'properties': 'obj', 'children': 'nodes',
},
self = this;
var collectionPickFunction = function (treeInfoValue, treeInfoKey) {
return (treeInfoKey != self.type);
};
var treeInfo = this.getTreeNodeHierarchy(item);
var actionType = type in opURL ? opURL[type] : type;
return generateUrl.generate_url(
pgAdmin.Browser.URL, treeInfo, actionType, self.node,
collectionPickFunction
);
},
});
return pgBrowser.Collection;
});

2385
web/pgadmin/browser/static/js/datamodel.js
View File

File diff suppressed because it is too large Load Diff

8
web/pgadmin/browser/static/js/error.js
View File

@@ -10,7 +10,7 @@ function(gettext, _, alertify, pgAdmin) {
<div class="panel-heading" role="tab" id="headingOne">\
<h4 class="panel-title">\
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">\
' + gettext("Error message") + '</a>\
' + gettext('Error message') + '</a>\
</h4>\
</div>\
<div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">\
@@ -23,21 +23,21 @@ function(gettext, _, alertify, pgAdmin) {
<div class="panel-heading" role="tab" id="headingTwo">\
<h4 class="panel-title">\
<a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">\
' + gettext("Additional info") + '</a>\
' + gettext('Additional info') + '</a>\
</h4>\
</div>\
<div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">\
<div class="panel-body" style="overflow: auto;">' + unescape(info) + '</div>\
</div>\
</div>\
</div>'
</div>';
}
text += '</div>';
alertify.alert(
title,
text
)
);
},
});

50
web/pgadmin/browser/static/js/frame.js
View File

@@ -1,18 +1,21 @@
define(
['underscore', 'sources/pgadmin', 'wcdocker'],
function(_, pgAdmin) {
define([
'underscore', 'sources/pgadmin', 'jquery', 'wcdocker',
], function(_, pgAdmin, $) {
var pgBrowser = pgAdmin.Browser = pgAdmin.Browser || {};
var pgBrowser = pgAdmin.Browser = pgAdmin.Browser || {},
wcDocker = window.wcDocker,
wcIFrame = window.wcIFrame;
pgAdmin.Browser.Frame = function(options) {
var defaults = [
'name', 'title', 'width', 'height', 'showTitle', 'isCloseable',
'isPrivate', 'url', 'icon', 'onCreate'];
'isPrivate', 'url', 'icon', 'onCreate',
];
_.extend(this, _.pick(options, defaults));
}
};
_.extend(pgAdmin.Browser.Frame.prototype, {
name:'',
name: '',
title: '',
width: 300,
height: 600,
@@ -37,7 +40,7 @@ function(_, pgAdmin) {
if (myPanel.showTitle == false)
myPanel.title(false);
myPanel.icon(that.icon)
myPanel.icon(that.icon);
myPanel.closeable(!!that.isCloseable);
@@ -75,22 +78,23 @@ function(_, pgAdmin) {
}
_.each([
wcDocker.EVENT.UPDATED, wcDocker.EVENT.VISIBILITY_CHANGED,
wcDocker.EVENT.BEGIN_DOCK, wcDocker.EVENT.END_DOCK,
wcDocker.EVENT.GAIN_FOCUS, wcDocker.EVENT.LOST_FOCUS,
wcDocker.EVENT.CLOSED, wcDocker.EVENT.BUTTON,
wcDocker.EVENT.ATTACHED, wcDocker.EVENT.DETACHED,
wcDocker.EVENT.MOVE_STARTED, wcDocker.EVENT.MOVE_ENDED,
wcDocker.EVENT.MOVED, wcDocker.EVENT.RESIZE_STARTED,
wcDocker.EVENT.RESIZE_ENDED, wcDocker.EVENT.RESIZED,
wcDocker.EVENT.SCROLLED], function(ev) {
myPanel.on(ev, that.eventFunc.bind(myPanel, ev));
});
wcDocker.EVENT.UPDATED, wcDocker.EVENT.VISIBILITY_CHANGED,
wcDocker.EVENT.BEGIN_DOCK, wcDocker.EVENT.END_DOCK,
wcDocker.EVENT.GAIN_FOCUS, wcDocker.EVENT.LOST_FOCUS,
wcDocker.EVENT.CLOSED, wcDocker.EVENT.BUTTON,
wcDocker.EVENT.ATTACHED, wcDocker.EVENT.DETACHED,
wcDocker.EVENT.MOVE_STARTED, wcDocker.EVENT.MOVE_ENDED,
wcDocker.EVENT.MOVED, wcDocker.EVENT.RESIZE_STARTED,
wcDocker.EVENT.RESIZE_ENDED, wcDocker.EVENT.RESIZED,
wcDocker.EVENT.SCROLLED,
], function(ev) {
myPanel.on(ev, that.eventFunc.bind(myPanel, ev));
});
if (that.onCreate && _.isFunction(that.onCreate)) {
that.onCreate.apply(that, [myPanel, frame, $container]);
that.onCreate.apply(that, [myPanel, frame]);
}
}
},
});
}
},
@@ -106,9 +110,9 @@ function(_, pgAdmin) {
pgBrowser.Events.trigger('pgadmin-browser:frame-' + name + ':' + eventName, this, arguments);
}
} catch (e) {
console.log(e);
console.warn(e.stack || e);
}
}
},
});
return pgAdmin.Browser.Frame;

272
web/pgadmin/browser/static/js/menu.js
View File

@@ -1,6 +1,6 @@
define(
['underscore', 'underscore.string', 'sources/pgadmin', 'jquery'],
function(_, S, pgAdmin, $) {
define([
'underscore', 'underscore.string', 'sources/pgadmin', 'jquery',
], function(_, S, pgAdmin, $) {
'use strict';
pgAdmin.Browser = pgAdmin.Browser || {};
@@ -8,14 +8,14 @@ function(_, S, pgAdmin, $) {
// Individual menu-item class
var MenuItem = pgAdmin.Browser.MenuItem = function(opts) {
var menu_opts = [
'name', 'label', 'priority', 'module', 'callback', 'data', 'enable',
'category', 'target', 'url'/* Do not show icon in the menus, 'icon' */, 'node'
],
defaults = {
url: '#',
target: '_self',
enable: true
};
'name', 'label', 'priority', 'module', 'callback', 'data', 'enable',
'category', 'target', 'url' /* Do not show icon in the menus, 'icon' */ , 'node',
],
defaults = {
url: '#',
target: '_self',
enable: true,
};
_.extend(this, defaults, _.pick(opts, menu_opts));
};
@@ -36,7 +36,7 @@ function(_, S, pgAdmin, $) {
name: this.label,
/* icon: this.icon || this.module && (this.module.type), */
disabled: this.is_disabled,
callback: this.context_menu_callback.bind(this, item)
callback: this.context_menu_callback.bind(this, item),
};
return this.$el;
@@ -47,19 +47,21 @@ function(_, S, pgAdmin, $) {
*/
create_el: function(node, item) {
var url = $('<a></a>', {
'id': this.name,
'href': this.url,
'target': this.target,
'data-toggle': 'pg-menu'
}).data('pgMenu', {
module: this.module || pgAdmin.Browser,
cb: this.callback,
data: this.data
}).addClass('menu-link');
'id': this.name,
'href': this.url,
'target': this.target,
'data-toggle': 'pg-menu',
}).data('pgMenu', {
module: this.module || pgAdmin.Browser,
cb: this.callback,
data: this.data,
}).addClass('menu-link');
this.is_disabled = this.disabled(node, item);
if (this.icon) {
url.append($('<i></i>', {'class': this.icon}));
url.append($('<i></i>', {
'class': this.icon,
}));
}
var textSpan = $('<span data-test="menu-item-text"></span>').text(' ' + this.label);
@@ -73,7 +75,7 @@ function(_, S, pgAdmin, $) {
this.applyStyle();
},
applyDisabledStyle: function () {
applyDisabledStyle: function() {
var span = this.$el.find('span');
var icon = this.$el.find('i');
@@ -84,7 +86,7 @@ function(_, S, pgAdmin, $) {
icon.removeClass('font-white');
},
applyEnabledStyle: function () {
applyEnabledStyle: function() {
var element = this.$el;
var span = this.$el.find('span');
@@ -93,11 +95,15 @@ function(_, S, pgAdmin, $) {
element.find('i').addClass('font-white');
element.find('i').removeClass('font-gray-4');
span.mouseover(function () { element.addClass('bg-gray-5'); });
span.mouseout(function () { element.removeClass('bg-gray-5'); });
span.mouseover(function() {
element.addClass('bg-gray-5');
});
span.mouseout(function() {
element.removeClass('bg-gray-5');
});
},
applyStyle: function () {
applyStyle: function() {
if (this.is_disabled) {
this.applyDisabledStyle();
} else {
@@ -121,7 +127,7 @@ function(_, S, pgAdmin, $) {
this.$el.removeClass('disabled');
}
if(this.$el) {
if (this.$el) {
this.applyStyle();
}
@@ -129,7 +135,7 @@ function(_, S, pgAdmin, $) {
name: this.label,
/* icon: this.icon || (this.module && this.module.type), */
disabled: this.is_disabled,
callback: this.context_menu_callback.bind(this, item)
callback: this.context_menu_callback.bind(this, item),
};
},
@@ -137,11 +143,12 @@ function(_, S, pgAdmin, $) {
* This will be called when context-menu is clicked.
*/
context_menu_callback: function(item) {
var o = this, cb;
var o = this,
cb;
if (o.module['callbacks'] && (
o.callback in o.module['callbacks']
)) {
o.callback in o.module['callbacks']
)) {
cb = o.module['callbacks'][o.callback];
} else if (o.callback in o.module) {
cb = o.module[o.callback];
@@ -150,8 +157,7 @@ function(_, S, pgAdmin, $) {
cb.apply(o.module, [o.data, item]);
} else {
pgAdmin.Browser.report_error(
S('Developer Warning: Callback - "%s" not found!').
sprintf(o.cb).value()
S('Developer Warning: Callback - "%s" not found!').sprintf(o.cb).value()
);
}
},
@@ -169,8 +175,8 @@ function(_, S, pgAdmin, $) {
return true;
}
if (_.isArray(this.node) ? (
_.indexOf(this.node, node) == -1
) : (this.node != node._type)) {
_.indexOf(this.node, node) == -1
) : (this.node != node._type)) {
return true;
}
}
@@ -181,7 +187,7 @@ function(_, S, pgAdmin, $) {
if (this.module && _.isFunction(this.module[this.enable])) return !(this.module[this.enable]).apply(this.module, [node, item, this.data]);
return false;
}
},
});
/*
@@ -202,59 +208,65 @@ function(_, S, pgAdmin, $) {
pgAdmin.Browser.MenuGroup = function(opts, items, prev, ctx) {
var template = _.template([
'<% if (above) { %><hr><% } %>',
'<li class="menu-item dropdown dropdown-submenu">',
' <a href="#" class="dropdown-toggle" data-toggle="dropdown">',
' <% if (icon) { %><i class="<%= icon %>"></i><% } %>',
' <span><%= label %></span>',
' </a>',
' <ul class="dropdown-menu navbar-inverse">',
' </ul>',
'</li>',
'<% if (below) { %><hr><% } %>',].join('\n')),
data = {
'label': opts.label,
'icon': opts.icon,
'above': opts.above && !prev,
'below': opts.below,
}, m,
$el = $(template(data)),
$menu = $el.find('.dropdown-menu'),
submenus = {},
ctxId = 1;
'<% if (above) { %><hr><% } %>',
'<li class="menu-item dropdown dropdown-submenu">',
' <a href="#" class="dropdown-toggle" data-toggle="dropdown">',
' <% if (icon) { %><i class="<%= icon %>"></i><% } %>',
' <span><%= label %></span>',
' </a>',
' <ul class="dropdown-menu navbar-inverse">',
' </ul>',
'</li>',
'<% if (below) { %><hr><% } %>',
].join('\n')),
data = {
'label': opts.label,
'icon': opts.icon,
'above': opts.above && !prev,
'below': opts.below,
},
m,
$el = $(template(data)),
$menu = $el.find('.dropdown-menu'),
submenus = {},
ctxId = 1;
ctx = _.uniqueId(ctx + '_sub_');
ctx = _.uniqueId(ctx + '_sub_');
// Sort by alphanumeric ordered first
items.sort(function(a, b) {return a.label.localeCompare(b.label);});
// Sort by priority
items.sort(function(a, b) {return a.priority - b.priority;});
// Sort by alphanumeric ordered first
items.sort(function(a, b) {
return a.label.localeCompare(b.label);
});
// Sort by priority
items.sort(function(a, b) {
return a.priority - b.priority;
});
for (var idx in items) {
m = items[idx];
$menu.append(m.$el);
if (!m.is_disabled) {
submenus[ctx + ctxId] = m.context;
}
ctxId++;
for (var idx in items) {
m = items[idx];
$menu.append(m.$el);
if (!m.is_disabled) {
submenus[ctx + ctxId] = m.context;
}
ctxId++;
}
var is_disabled = (_.size(submenus) == 0);
var is_disabled = (_.size(submenus) == 0);
return {
$el: $el,
priority: opts.priority || 10,
label: opts.label,
above: data['above'],
below: opts.below,
is_disabled: is_disabled,
context: {
name: opts.label,
icon: opts.icon,
items: submenus,
disabled: is_disabled
}
};
return {
$el: $el,
priority: opts.priority || 10,
label: opts.label,
above: data['above'],
below: opts.below,
is_disabled: is_disabled,
context: {
name: opts.label,
icon: opts.icon,
items: submenus,
disabled: is_disabled,
},
};
};
/*
@@ -274,26 +286,31 @@ function(_, S, pgAdmin, $) {
*
* Returns if any menu generated for the given input.
*/
pgAdmin.Browser.MenuCreator = function($mnu, menus, categories, d, item, menu_items) {
var groups = {'common': []},
common, idx = 0, j, item,
ctxId = _.uniqueId('ctx_'),
update_menuitem = function(m) {
if (m instanceof MenuItem) {
if (m.$el) {
m.$el.remove();
delete m.$el;
}
m.generate(d, item);
var group = groups[m.category || 'common'] =
groups[m.category || 'common'] || [];
group.push(m);
} else {
for (var key in m) {
update_menuitem(m[key]);
}
pgAdmin.Browser.MenuCreator = function(
$mnu, menus, categories, d, item, menu_items
) {
var groups = {
'common': [],
},
common, idx = 0,
ctxId = _.uniqueId('ctx_'),
update_menuitem = function(m) {
if (m instanceof MenuItem) {
if (m.$el) {
m.$el.remove();
delete m.$el;
}
}, ctxIdx = 1;
m.generate(d, item);
var group = groups[m.category || 'common'] =
groups[m.category || 'common'] || [];
group.push(m);
} else {
for (var key in m) {
update_menuitem(m[key]);
}
}
},
ctxIdx = 1;
for (idx in menus) {
update_menuitem(menus[idx]);
@@ -307,10 +324,13 @@ function(_, S, pgAdmin, $) {
var prev = true;
for (name in groups) {
for (var name in groups) {
var g = groups[name],
c = categories[name] || {'label': name, single: false},
menu_group = pgAdmin.Browser.MenuGroup(c, g, prev, ctxId);
c = categories[name] || {
'label': name,
single: false,
},
menu_group = pgAdmin.Browser.MenuGroup(c, g, prev, ctxId);
if (g.length <= 1 && !c.single) {
prev = false;
@@ -327,9 +347,13 @@ function(_, S, pgAdmin, $) {
// Menu with lowest value has the highest priority. If the priority is
// same, then - it will be ordered by label.
// Sort by alphanumeric ordered first
common.sort(function(a, b) {return a.label.localeCompare(b.label);});
common.sort(function(a, b) {
return a.label.localeCompare(b.label);
});
// Sort by priority
common.sort(function(a, b) {return a.priority - b.priority;});
common.sort(function(a, b) {
return a.priority - b.priority;
});
var len = _.size(common);
for (idx in common) {
@@ -360,15 +384,15 @@ function(_, S, pgAdmin, $) {
// MENU PUBLIC CLASS DEFINITION
// ==============================
var Menu = function (element, options) {
this.$element = $(element);
this.options = $.extend({}, Menu.DEFAULTS, options);
var Menu = function(element, options) {
this.$element = $(element);
this.options = $.extend({}, Menu.DEFAULTS, options);
this.isLoading = false;
}
};
Menu.DEFAULTS = {}
Menu.DEFAULTS = {};
Menu.prototype.toggle = function (ev) {
Menu.prototype.toggle = function(ev) {
var $parent = this.$element.closest('.menu-item');
if ($parent.hasClass('disabled')) {
ev.preventDefault();
@@ -384,43 +408,43 @@ function(_, S, pgAdmin, $) {
pgAdmin.Browser.report_error('Developer Warning: Callback - "' + d.cb + '" not found!');
}
}
}
};
// BUTTON PLUGIN DEFINITION
// ========================
function Plugin(option, ev) {
return this.each(function () {
var $this = $(this);
var data = $this.data('pg.menu');
return this.each(function() {
var $this = $(this);
var data = $this.data('pg.menu');
var options = typeof option == 'object' && option;
if (!data) $this.data('pg.menu', (data = new Menu(this, options)));
data.toggle(ev);
})
});
}
var old = $.fn.button;
$.fn.pgmenu = Plugin;
$.fn.pgmenu = Plugin;
$.fn.pgmenu.Constructor = Menu;
// BUTTON NO CONFLICT
// ==================
$.fn.pgmenu.noConflict = function () {
$.fn.pgmenu.noConflict = function() {
$.fn.pgmenu = old;
return this;
}
};
// MENU DATA-API
// =============
$(document)
.on('click.pg.menu.data-api', '[data-toggle^="pg-menu"]', function (ev) {
.on('click.pg.menu.data-api', '[data-toggle^="pg-menu"]', function(ev) {
var $menu = $(ev.target);
if (!$menu.hasClass('menu-link'))
$menu = $menu.closest('.menu-link');
@@ -429,7 +453,7 @@ function(_, S, pgAdmin, $) {
.on(
'focus.pg.menu.data-api blur.pg.menu.data-api',
'[data-toggle^="pg-menu"]',
function (e) {
function(e) {
$(e.target).closest('.menu').toggleClass(
'focus', /^focus(in)?$/.test(e.type)
);

894
web/pgadmin/browser/static/js/node.js
View File

File diff suppressed because it is too large Load Diff

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

@@ -1,10 +1,7 @@
define([
'sources/gettext', 'jquery', 'underscore', 'sources/pgadmin', 'backbone', 'backform',
'alertify', 'backgrid', 'select2', 'pgadmin.browser.node'
],
function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
var pgBrowser = pgAdmin.Browser;
'alertify', 'backgrid', 'select2', 'pgadmin.browser.node',
], function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
/*
* Define the selectAll adapter for select2.
@@ -15,11 +12,11 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
$.fn.select2.amd.define('select2/selectAllAdapter', [
'select2/utils',
'select2/dropdown',
'select2/dropdown/attachBody'
], function (Utils, Dropdown, AttachBody) {
'select2/dropdown/attachBody',
], function(Utils, Dropdown, AttachBody) {
function SelectAll() { }
SelectAll.prototype.render = function (decorated) {
function SelectAll() {}
SelectAll.prototype.render = function(decorated) {
var self = this,
$rendered = decorated.call(this),
$selectAll = $([
@@ -27,41 +24,43 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
' style="width: 49%;margin: 0 0.5%;">',
'<i class="fa fa-check-square-o"></i>',
'<span style="padding: 0px 5px;">',
gettext("Select All"),
'</span></button>'
gettext('Select All'),
'</span></button>',
].join('')),
$unselectAll = $([
'<button class="btn btn-xs btn-default" type="button"',
' style="width: 49%;margin: 0 0.5%;">',
'<i class="fa fa-square-o"></i><span style="padding: 0px 5px;">',
gettext("Unselect All"),
'</span></button>'
gettext('Unselect All'),
'</span></button>',
].join('')),
$btnContainer = $(
'<div style="padding: 3px 0px; background-color: #2C76B4; margin-bottom: 3px;">'
).append($selectAll).append($unselectAll);
if (!this.$element.prop("multiple")) {
if (!this.$element.prop('multiple')) {
// this isn't a multi-select -> don't add the buttons!
return $rendered;
}
$rendered.find('.select2-dropdown').prepend($btnContainer);
$selectAll.on('click', function (e) {
var $results = $rendered.find('.select2-results__option[aria-selected=false]');
$results.each(function () {
self.trigger('select', {
data: $(this).data('data')
});
});
$selectAll.on('click', function() {
$rendered.find('.select2-results__option[aria-selected=false]').each(
function() {
self.trigger('select', {
data: $(this).data('data'),
});
}
);
self.trigger('close');
});
$unselectAll.on('click', function (e) {
var $results = $rendered.find('.select2-results__option[aria-selected=true]');
$results.each(function () {
self.trigger('unselect', {
data: $(this).data('data')
});
});
$unselectAll.on('click', function() {
$rendered.find('.select2-results__option[aria-selected=true]').each(
function() {
self.trigger('unselect', {
data: $(this).data('data'),
});
}
);
self.trigger('close');
});
return $rendered;
@@ -89,98 +88,98 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
* data to proper 'label', 'value' format.
*/
var NodeAjaxOptionsControl = Backform.NodeAjaxOptionsControl =
Backform.Select2Control.extend({
defaults: _.extend(Backform.Select2Control.prototype.defaults, {
url: undefined,
transform: undefined,
url_with_id: false,
select2: {
allowClear: true,
placeholder: 'Select from the list',
width: 'style'
}
}),
initialize: function() {
/*
* Initialization from the original control.
*/
Backform.Select2Control.prototype.initialize.apply(this, arguments);
Backform.Select2Control.extend({
defaults: _.extend(Backform.Select2Control.prototype.defaults, {
url: undefined,
transform: undefined,
url_with_id: false,
select2: {
allowClear: true,
placeholder: 'Select from the list',
width: 'style',
},
}),
initialize: function() {
/*
* Initialization from the original control.
*/
Backform.Select2Control.prototype.initialize.apply(this, arguments);
/*
* We're about to fetch the options required for this control.
*/
var self = this,
/*
* We're about to fetch the options required for this control.
*/
var self = this,
url = self.field.get('url') || self.defaults.url,
m = self.model.top || self.model;
// Hmm - we found the url option.
// That means - we needs to fetch the options from that node.
if (url) {
var node = this.field.get('schema_node'),
// Hmm - we found the url option.
// That means - we needs to fetch the options from that node.
if (url) {
var node = this.field.get('schema_node'),
node_info = this.field.get('node_info'),
with_id = this.field.get('url_with_id') || false,
full_url = node.generate_url.apply(
node, [
null, url, this.field.get('node_data'), with_id, node_info
null, url, this.field.get('node_data'), with_id, node_info,
]),
cache_level,
cache_node = this.field.get('cache_node');
cache_node = (cache_node && pgAdmin.Browser.Nodes[cache_node]) || node;
cache_node = (cache_node && pgAdmin.Browser.Nodes[cache_node]) || node;
if (this.field.has('cache_level')) {
cache_level = this.field.get('cache_level');
} else {
cache_level = cache_node.cache_level(node_info, with_id);
}
if (this.field.has('cache_level')) {
cache_level = this.field.get('cache_level');
} else {
cache_level = cache_node.cache_level(node_info, with_id);
}
/*
* We needs to check, if we have already cached data for this url.
* If yes - use that, and do not bother about fetching it again,
* and use it.
*/
var data = cache_node.cache(node.type + '#' + url, node_info, cache_level);
/*
* We needs to check, if we have already cached data for this url.
* If yes - use that, and do not bother about fetching it again,
* and use it.
*/
var data = cache_node.cache(node.type + '#' + url, node_info, cache_level);
if (this.field.get('version_compatible') &&
if (this.field.get('version_compatible') &&
(_.isUndefined(data) || _.isNull(data))) {
m.trigger('pgadmin:view:fetching', m, self.field);
$.ajax({
async: false,
url: full_url,
success: function(res) {
/*
* We will cache this data for short period of time for avoiding
* same calls.
*/
data = cache_node.cache(node.type + '#' + url, node_info, cache_level, res.data);
},
error: function() {
m.trigger('pgadmin:view:fetch:error', m, self.field);
}
});
m.trigger('pgadmin:view:fetched', m, self.field);
}
// To fetch only options from cache, we do not need time from 'at'
// attribute but only options.
//
// It is feasible that the data may not have been fetched.
data = (data && data.data) || [];
m.trigger('pgadmin:view:fetching', m, self.field);
$.ajax({
async: false,
url: full_url,
success: function(res) {
/*
* We will cache this data for short period of time for avoiding
* same calls.
*/
data = cache_node.cache(node.type + '#' + url, node_info, cache_level, res.data);
},
error: function() {
m.trigger('pgadmin:view:fetch:error', m, self.field);
},
});
m.trigger('pgadmin:view:fetched', m, self.field);
}
// To fetch only options from cache, we do not need time from 'at'
// attribute but only options.
//
// It is feasible that the data may not have been fetched.
data = (data && data.data) || [];
/*
* Transform the data
*/
var transform = this.field.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.field.set('options', transform.bind(self, data));
} else {
self.field.set('options', data);
/*
* Transform the data
*/
var transform = this.field.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.field.set('options', transform.bind(self, data));
} else {
self.field.set('options', data);
}
}
}
}
});
},
});
var formatNode = function(opt) {
if (!opt.id) {
@@ -189,14 +188,14 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
var optimage = $(opt.element).data('image');
if(!optimage){
if (!optimage) {
return opt.text;
} else {
return $('<span></span>').append(
$('<span></span>', {class: "wcTabIcon " + optimage})
).append(
$('<span></span>').text(opt.text)
);
$('<span></span>', {
class: 'wcTabIcon ' + optimage,
})
).append($('<span></span>').text(opt.text));
}
};
@@ -207,27 +206,29 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
filter: undefined,
transform: function(rows) {
var self = this,
node = self.field.get('schema_node'),
res = [],
filter = self.field.get('filter') || function() { return true; };
node = self.field.get('schema_node'),
res = [],
filter = self.field.get('filter') || function() {
return true;
};
filter = filter.bind(self);
_.each(rows, function(r) {
if (filter(r)) {
var l = (_.isFunction(node['node_label']) ?
(node['node_label']).apply(node, [r, self.model, self]) :
r.label),
image= (_.isFunction(node['node_image']) ?
(node['node_image']).apply(
node, [r, self.model, self]
) :
(node['node_image'] || ('icon-' + node.type)));
(node['node_label']).apply(node, [r, self.model, self]) :
r.label),
image = (_.isFunction(node['node_image']) ?
(node['node_image']).apply(
node, [r, self.model, self]
) :
(node['node_image'] || ('icon-' + node.type)));
res.push({
'value': r._id,
'image': image,
'label': l
'label': l,
});
}
});
@@ -239,62 +240,64 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
placeholder: 'Select from the list',
width: 'style',
templateResult: formatNode,
templateSelection: formatNode
}
})
templateSelection: formatNode,
},
}),
});
var NodeListByNameControl = Backform.NodeListByNameControl = NodeListByIdControl.extend({
Backform.NodeListByNameControl = NodeListByIdControl.extend({
defaults: _.extend({}, NodeListByIdControl.prototype.defaults, {
transform: function(rows) {
var self = this,
node = self.field.get('schema_node'),
res = [],
filter = self.field.get('filter') || function() { return true; };
node = self.field.get('schema_node'),
res = [],
filter = self.field.get('filter') || function() {
return true;
};
filter = filter.bind(self);
_.each(rows, function(r) {
if (filter(r)) {
var l = (_.isFunction(node['node_label']) ?
(node['node_label']).apply(node, [r, self.model, self]) :
r.label),
image = (_.isFunction(node['node_image']) ?
(node['node_image']).apply(
node, [r, self.model, self]
) :
(node['node_image'] || ('icon-' + node.type)));
(node['node_label']).apply(node, [r, self.model, self]) :
r.label),
image = (_.isFunction(node['node_image']) ?
(node['node_image']).apply(
node, [r, self.model, self]
) :
(node['node_image'] || ('icon-' + node.type)));
res.push({
'value': r.label,
'image': image,
'label': l
'label': l,
});
}
});
return res;
}
})
},
}),
});
/*
* Global function to make visible particular dom element in it's parent
* with given class.
*/
$.fn.pgMakeVisible = function( cls ) {
$.fn.pgMakeVisible = function(cls) {
return this.each(function() {
if (!this || !$(this.length))
return;
var top, p = $(this), hasScrollbar = function(j) {
if (j && j.length > 0) {
return j.get(0).scrollHeight > j.height();
}
return false;
};
var top, p = $(this),
hasScrollbar = function(j) {
if (j && j.length > 0) {
return j.get(0).scrollHeight > j.height();
}
return false;
};
// check if p is not empty
while(p && p.length > 0) {
while (p && p.length > 0) {
top = p.get(0).offsetTop + p.height();
p = p.parent();
if (hasScrollbar(p)) {
@@ -327,40 +330,41 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
select2: {
allowClear: true,
placeholder: 'Select from the list',
width: 'style'
width: 'style',
},
opt: {
label: null,
value: null,
image: null,
selected: false
}
selected: false,
},
}),
template: _.template(
'<option <% if (image) { %> data-image=<%= image %> <% } %> value="<%- value %>" <%= selected ? \'selected="selected"\' : "" %>><%- label %></option>'
),
initialize: function () {
initialize: function() {
Backgrid.Extension.Select2Cell.prototype.initialize.apply(this, arguments);
var url = this.column.get('url') || this.defaults.url,
is_options_cached = _.has(this.column.attributes, 'options_cached'),
options_cached = is_options_cached && this.column.get('options_cached');
is_options_cached = _.has(this.column.attributes, 'options_cached'),
options_cached = is_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 && !options_cached) {
var self = this,
m = this.model, column = this.column,
eventHandler = m.top || m,
node = column.get('schema_node'),
node_info = column.get('node_info'),
with_id = column.get('url_with_id') || false,
full_url = node.generate_url.apply(
node, [
null, url, column.get('node_data'), with_id, node_info
]),
cache_level,
cache_node = column.get('cache_node');
m = this.model,
column = this.column,
eventHandler = m.top || m,
node = column.get('schema_node'),
node_info = column.get('node_info'),
with_id = column.get('url_with_id') || false,
full_url = node.generate_url.apply(
node, [
null, url, column.get('node_data'), with_id, node_info,
]),
cache_level,
cache_node = column.get('cache_node');
cache_node = (cache_node && pgAdmin.Browser.Nodes[cache_node]) || node;
@@ -378,7 +382,7 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
var data = cache_node.cache(node.type + '#' + url, node_info, cache_level);
if (column.get('version_compatible') &&
(_.isUndefined(data) || _.isNull(data))) {
(_.isUndefined(data) || _.isNull(data))) {
eventHandler.trigger('pgadmin:view:fetching', m, column);
$.ajax({
async: false,
@@ -392,7 +396,7 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
},
error: function() {
eventHandler.trigger('pgadmin:view:fetch:error', m, column);
}
},
});
eventHandler.trigger('pgadmin:view:fetched', m, column);
}
@@ -415,41 +419,43 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
column.set('options', data);
}
if(is_options_cached) {
if (is_options_cached) {
column.set('options_cached', true);
}
}
}
},
});
var NodeListByIdCell = Backgrid.Extension.NodeListByIdCell = NodeAjaxOptionsCell.extend({
Backgrid.Extension.NodeListByIdCell = NodeAjaxOptionsCell.extend({
controlClassName: 'pgadmin-node-select backgrid-cell',
defaults: _.extend({}, NodeAjaxOptionsCell.prototype.defaults, {
url: 'nodes',
filter: undefined,
transform: function(rows, control) {
var self = control || this,
node = self.column.get('schema_node'),
res = [],
filter = self.column.get('filter') || function() { return true; };
node = self.column.get('schema_node'),
res = [],
filter = self.column.get('filter') || function() {
return true;
};
filter = filter.bind(self);
_.each(rows, function(r) {
if (filter(r)) {
var l = (_.isFunction(node['node_label']) ?
(node['node_label']).apply(node, [r, self.model, self]) :
r.label),
image= (_.isFunction(node['node_image']) ?
(node['node_image']).apply(
node, [r, self.model, self]
) :
(node['node_image'] || ('icon-' + node.type)));
(node['node_label']).apply(node, [r, self.model, self]) :
r.label),
image = (_.isFunction(node['node_image']) ?
(node['node_image']).apply(
node, [r, self.model, self]
) :
(node['node_image'] || ('icon-' + node.type)));
res.push({
'value': r._id,
'image': image,
'label': l
'label': l,
});
}
});
@@ -460,40 +466,41 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
placeholder: 'Select from the list',
width: 'style',
templateResult: formatNode,
templateSelection: formatNode
}
})
templateSelection: formatNode,
},
}),
});
var NodeListByNameCell = Backgrid.Extension.NodeListByNameCell = NodeAjaxOptionsCell.extend({
Backgrid.Extension.NodeListByNameCell = NodeAjaxOptionsCell.extend({
controlClassName: 'pgadmin-node-select backgrid-cell',
defaults: _.extend({}, NodeAjaxOptionsCell.prototype.defaults, {
url: 'nodes',
filter: undefined,
transform: function(rows, control) {
var self = control || this,
node = self.column.get('schema_node'),
res = [],
filter = self.column.get('filter') || function() { return true; };
node = self.column.get('schema_node'),
res = [],
filter = self.column.get('filter') || function() {
return true;
};
filter = filter.bind(self);
_.each(rows, function(r) {
if (filter(r)) {
var l = (_.isFunction(node['node_label']) ?
(node['node_label']).apply(node, [r, self.model, self]) :
r.label),
image= (_.isFunction(node['node_image']) ?
(node['node_image']).apply(
node, [r, self.model, self]
) :
(node['node_image'] || ('icon-' + node.type)));
(node['node_label']).apply(node, [r, self.model, self]) :
r.label),
image = (_.isFunction(node['node_image']) ?
(node['node_image']).apply(
node, [r, self.model, self]
) :
(node['node_image'] || ('icon-' + node.type)));
res.push({
'value': r.label,
'image': image,
'label': l
'label': l,
});
}
});
@@ -504,13 +511,13 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
placeholder: 'Select from the list',
width: 'style',
templateResult: formatNode,
templateSelection: formatNode
}
})
templateSelection: formatNode,
},
}),
});
// Extend the browser's node model class to create a option/value pair
var MultiSelectAjaxCell = Backgrid.Extension.MultiSelectAjaxCell = Backgrid.Extension.NodeAjaxOptionsCell.extend({
// Extend the browser's node model class to create a option/value pair
Backgrid.Extension.MultiSelectAjaxCell = Backgrid.Extension.NodeAjaxOptionsCell.extend({
defaults: _.extend({}, NodeAjaxOptionsCell.prototype.defaults, {
transform: undefined,
url_with_id: false,
@@ -518,19 +525,19 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
allowClear: true,
placeholder: 'Select from the list',
width: 'style',
multiple: true
multiple: true,
},
opt: {
label: null,
value: null,
image: null,
selected: false
}
selected: false,
},
}),
getValueFromDOM: function() {
var res = [];
this.$el.find("select").find(':selected').each(function() {
this.$el.find('select').find(':selected').each(function() {
res.push($(this).attr('value'));
});
@@ -541,15 +548,15 @@ function(gettext, $, _, pgAdmin, Backbone, Backform, Alertify, Backgrid) {
/*
* Control to select multiple columns.
*/
var MultiSelectAjaxControl = Backform.MultiSelectAjaxControl = NodeAjaxOptionsControl.extend({
Backform.MultiSelectAjaxControl = NodeAjaxOptionsControl.extend({
defaults: _.extend({}, NodeAjaxOptionsControl.prototype.defaults, {
select2: {
multiple: true,
allowClear: true,
width: 'style'
}
})
width: 'style',
},
}),
});
return Backform;
});
});

305
web/pgadmin/browser/static/js/panel.js
View File

@@ -1,66 +1,67 @@
define(
['underscore', 'sources/pgadmin', 'wcdocker'],
function(_, pgAdmin) {
['underscore', 'sources/pgadmin', 'jquery', 'wcdocker'],
function(_, pgAdmin, $) {
var pgBrowser = pgAdmin.Browser = pgAdmin.Browser || {};
var pgBrowser = pgAdmin.Browser = pgAdmin.Browser || {},
wcDocker = window.wcDocker;
pgAdmin.Browser.Panel = function(options) {
var defaults = [
'name', 'title', 'width', 'height', 'showTitle', 'isCloseable',
'isPrivate', 'content', 'icon', 'events', 'onCreate', 'elContainer',
'canHide', 'limit'
];
_.extend(this, _.pick(options, defaults));
}
pgAdmin.Browser.Panel = function(options) {
var defaults = [
'name', 'title', 'width', 'height', 'showTitle', 'isCloseable',
'isPrivate', 'content', 'icon', 'events', 'onCreate', 'elContainer',
'canHide', 'limit',
];
_.extend(this, _.pick(options, defaults));
};
_.extend(pgAdmin.Browser.Panel.prototype, {
name:'',
title: '',
width: 300,
height: 600,
showTitle: true,
isCloseable: true,
isPrivate: false,
content: '',
icon: '',
panel: null,
onCreate: null,
elContainer: false,
limit: null,
load: function(docker, title) {
var that = this;
if (!that.panel) {
docker.registerPanelType(that.name, {
title: that.title,
isPrivate: that.isPrivate,
limit: that.limit,
onCreate: function(myPanel) {
$(myPanel).data('pgAdminName', that.name);
myPanel.initSize(that.width, that.height);
_.extend(pgAdmin.Browser.Panel.prototype, {
name: '',
title: '',
width: 300,
height: 600,
showTitle: true,
isCloseable: true,
isPrivate: false,
content: '',
icon: '',
panel: null,
onCreate: null,
elContainer: false,
limit: null,
load: function(docker, title) {
var that = this;
if (!that.panel) {
docker.registerPanelType(that.name, {
title: that.title,
isPrivate: that.isPrivate,
limit: that.limit,
onCreate: function(myPanel) {
$(myPanel).data('pgAdminName', that.name);
myPanel.initSize(that.width, that.height);
if (!that.showTitle)
myPanel.title(false);
else {
myPanel.title(title || that.title);
if (that.icon != '')
myPanel.icon(that.icon)
}
if (!that.showTitle)
myPanel.title(false);
else {
myPanel.title(title || that.title);
if (that.icon != '')
myPanel.icon(that.icon);
}
var $container = $('<div>', {
'class': 'pg-panel-content'
}).append($(that.content));
var $container = $('<div>', {
'class': 'pg-panel-content',
}).append($(that.content));
myPanel.closeable(!!that.isCloseable);
myPanel.layout().addItem($container);
that.panel = myPanel;
if (that.events && _.isObject(that.events)) {
_.each(that.events, function(v, k) {
if (v && _.isFunction(v)) {
myPanel.on(k, v);
}
});
}
_.each([
myPanel.closeable(!!that.isCloseable);
myPanel.layout().addItem($container);
that.panel = myPanel;
if (that.events && _.isObject(that.events)) {
_.each(that.events, function(v, k) {
if (v && _.isFunction(v)) {
myPanel.on(k, v);
}
});
}
_.each([
wcDocker.EVENT.UPDATED, wcDocker.EVENT.VISIBILITY_CHANGED,
wcDocker.EVENT.BEGIN_DOCK, wcDocker.EVENT.END_DOCK,
wcDocker.EVENT.GAIN_FOCUS, wcDocker.EVENT.LOST_FOCUS,
@@ -69,109 +70,117 @@ function(_, pgAdmin) {
wcDocker.EVENT.MOVE_STARTED, wcDocker.EVENT.MOVE_ENDED,
wcDocker.EVENT.MOVED, wcDocker.EVENT.RESIZE_STARTED,
wcDocker.EVENT.RESIZE_ENDED, wcDocker.EVENT.RESIZED,
wcDocker.EVENT.SCROLLED], function(ev) {
myPanel.on(ev, that.eventFunc.bind(myPanel, ev));
});
if (that.onCreate && _.isFunction(that.onCreate)) {
that.onCreate.apply(that, [myPanel, $container]);
}
if (that.elContainer) {
myPanel.pgElContainer = $container;
$container.addClass('pg-el-container');
_.each([
wcDocker.EVENT.RESIZED, wcDocker.EVENT.ATTACHED,
wcDocker.EVENT.DETACHED, wcDocker.EVENT.VISIBILITY_CHANGED
wcDocker.EVENT.SCROLLED,
], function(ev) {
myPanel.on(ev, that.resizedContainer.bind(myPanel));
myPanel.on(ev, that.eventFunc.bind(myPanel, ev));
});
that.resizedContainer.apply(myPanel);
}
// Bind events only if they are configurable
if (that.canHide) {
_.each([wcDocker.EVENT.CLOSED, wcDocker.EVENT.VISIBILITY_CHANGED],
function(ev) {
myPanel.on(ev, that.handleVisibility.bind(myPanel, ev));
if (that.onCreate && _.isFunction(that.onCreate)) {
that.onCreate.apply(that, [myPanel, $container]);
}
if (that.elContainer) {
myPanel.pgElContainer = $container;
$container.addClass('pg-el-container');
_.each([
wcDocker.EVENT.RESIZED, wcDocker.EVENT.ATTACHED,
wcDocker.EVENT.DETACHED, wcDocker.EVENT.VISIBILITY_CHANGED,
], function(ev) {
myPanel.on(ev, that.resizedContainer.bind(myPanel));
});
}
that.resizedContainer.apply(myPanel);
}
// Bind events only if they are configurable
if (that.canHide) {
_.each([wcDocker.EVENT.CLOSED, wcDocker.EVENT.VISIBILITY_CHANGED],
function(ev) {
myPanel.on(ev, that.handleVisibility.bind(myPanel, ev));
});
}
},
});
}
},
eventFunc: function(eventName) {
var name = $(this).data('pgAdminName');
try {
pgBrowser.Events.trigger(
'pgadmin-browser:panel', eventName, this, arguments
);
pgBrowser.Events.trigger(
'pgadmin-browser:panel:' + eventName, this, arguments
);
if (name) {
pgBrowser.Events.trigger(
'pgadmin-browser:panel-' + name, eventName, this, arguments
);
pgBrowser.Events.trigger(
'pgadmin-browser:panel-' + name + ':' + eventName, this, arguments
);
}
});
}
},
eventFunc: function(eventName) {
var name = $(this).data('pgAdminName');
try {
pgBrowser.Events.trigger('pgadmin-browser:panel', eventName, this, arguments);
pgBrowser.Events.trigger('pgadmin-browser:panel:' + eventName, this, arguments);
if (name) {
pgBrowser.Events.trigger('pgadmin-browser:panel-' + name, eventName, this, arguments);
pgBrowser.Events.trigger('pgadmin-browser:panel-' + name + ':' + eventName, this, arguments);
} catch (e) {
console.warn(e.stack || e);
}
} catch (e) {
console.log(e);
}
},
resizedContainer: function() {
var p = this;
},
resizedContainer: function() {
var p = this;
if (p.pgElContainer && !p.pgResizeTimeout) {
if (!p.isVisible()) {
clearTimeout(p.pgResizeTimeout);
p.pgResizeTimeout = null;
return;
}
p.pgResizeTimeout = setTimeout(
function() {
var w = p.width();
if (p.pgElContainer && !p.pgResizeTimeout) {
if (!p.isVisible()) {
clearTimeout(p.pgResizeTimeout);
p.pgResizeTimeout = null;
if (w <= 480) {
w = 'xs';
} else if (w < 600) {
w = 'sm';
} else if (w < 768) {
w = 'md';
} else {
w = 'lg';
}
return;
}
p.pgResizeTimeout = setTimeout(
function() {
var w = p.width();
p.pgResizeTimeout = null;
p.pgElContainer.attr('el', w);
},
100
);
}
},
handleVisibility: function(eventName) {
// Currently this function only works with dashboard panel but
// as per need it can be extended
if (this._type != 'dashboard' || _.isUndefined(pgAdmin.Dashboard))
return;
if (w <= 480) {
w = 'xs';
} else if (w < 600) {
w = 'sm';
} else if (w < 768) {
w = 'md';
} else {
w = 'lg';
}
if (eventName == 'panelClosed') {
pgBrowser.save_current_layout(pgBrowser);
pgAdmin.Dashboard.toggleVisibility(false);
}
else if (eventName == 'panelVisibilityChanged') {
if (pgBrowser.tree) {
pgBrowser.save_current_layout(pgBrowser);
var selectedNode = pgBrowser.tree.selected();
// Discontinue this event after first time visible
this.off(wcDocker.EVENT.VISIBILITY_CHANGED);
if (!_.isUndefined(pgAdmin.Dashboard))
pgAdmin.Dashboard.toggleVisibility(true);
// Explicitly trigger tree selected event when we add the tab.
pgBrowser.Events.trigger('pgadmin-browser:tree:selected', selectedNode,
pgBrowser.tree.itemData(selectedNode), pgBrowser.Node);
p.pgElContainer.attr('el', w);
},
100
);
}
}
}
},
handleVisibility: function(eventName) {
// Currently this function only works with dashboard panel but
// as per need it can be extended
if (this._type != 'dashboard' || _.isUndefined(pgAdmin.Dashboard))
return;
if (eventName == 'panelClosed') {
pgBrowser.save_current_layout(pgBrowser);
pgAdmin.Dashboard.toggleVisibility(false);
} else if (eventName == 'panelVisibilityChanged') {
if (pgBrowser.tree) {
pgBrowser.save_current_layout(pgBrowser);
var selectedNode = pgBrowser.tree.selected();
// Discontinue this event after first time visible
this.off(wcDocker.EVENT.VISIBILITY_CHANGED);
if (!_.isUndefined(pgAdmin.Dashboard))
pgAdmin.Dashboard.toggleVisibility(true);
// Explicitly trigger tree selected event when we add the tab.
pgBrowser.Events.trigger('pgadmin-browser:tree:selected', selectedNode,
pgBrowser.tree.itemData(selectedNode), pgBrowser.Node);
}
}
},
});
return pgAdmin.Browser.Panel;
});
return pgAdmin.Browser.Panel;
});

310
web/pgadmin/browser/static/js/wizard.js
View File

@@ -1,20 +1,29 @@
define(
['underscore', 'backbone', 'sources/pgadmin', 'pgadmin.browser', 'sources/gettext'],
function(_, Backbone, pgAdmin, pgBrowser, gettext) {
define([
'underscore', 'jquery', 'backbone', 'sources/pgadmin', 'pgadmin.browser',
'sources/gettext',
], function(_, $, Backbone, pgAdmin, pgBrowser, gettext) {
pgBrowser = pgBrowser || pgAdmin.Browser || {};
var wcDocker = window.wcDocker;
/* Wizard individual Page Model */
var WizardPage = pgBrowser.WizardPage = Backbone.Model.extend({
pgBrowser.WizardPage = Backbone.Model.extend({
defaults: {
id: undefined, /* Id */
page_title: undefined, /* Page Title */
view: undefined, /* A Backbone View */
html: undefined, /* HTML tags to be rendered */
image: undefined, /* Left hand side image */
disable_prev: false, /* Previous Button Flag */
disable_next: false, /* Next Button Flag */
disable_cancel: false, /* Cancel Button Flag */
id: undefined,
/* Id */
page_title: undefined,
/* Page Title */
view: undefined,
/* A Backbone View */
html: undefined,
/* HTML tags to be rendered */
image: undefined,
/* Left hand side image */
disable_prev: false,
/* Previous Button Flag */
disable_next: false,
/* Next Button Flag */
disable_cancel: false,
/* Cancel Button Flag */
show_progress_bar: '',
/* Callback for OnLoad */
onLoad: function() {
@@ -24,119 +33,124 @@ function(_, Backbone, pgAdmin, pgBrowser, gettext) {
beforeNext: function() {
return true;
},
onNext: function(){},
onNext: function() {},
onBefore: function() {},
/* Callback for before Previous */
beforePrev: function() {
return true;
}
}
},
},
});
var Wizard = pgBrowser.Wizard = Backbone.View.extend({
pgBrowser.Wizard = Backbone.View.extend({
options: {
title: 'Wizard', /* Main Wizard Title */
image: 'left_panel.png', /* TODO:: We can use default image here */
curr_page: 0, /* Current Page to Load */
title: 'Wizard',
/* Main Wizard Title */
image: 'left_panel.png',
/* TODO:: We can use default image here */
curr_page: 0,
/* Current Page to Load */
disable_next: false,
disable_prev: false,
disable_finish: false,
disable_cancel: false,
show_header_cancel_btn: false, /* show cancel button at wizard header */
show_header_maximize_btn: false, /* show maximize button at wizard header */
show_header_cancel_btn: false,
/* show cancel button at wizard header */
show_header_maximize_btn: false,
/* show maximize button at wizard header */
dialog_api: null,
height: 400,
width: 650,
show_left_panel: true,
wizard_help: ''
wizard_help: '',
},
tmpl: _.template(
" <div class='pgadmin-wizard' style='height: <%= this.options.height %>px;"
+ " width: <%= this.options.width %>px'>"
+ " <div class='wizard-header wizard-badge'>"
+ " <div class='row'>"
+ " <div class='col-sm-10'>"
+ " <h3><span id='main-title'><%= this.options.title %></span> -"
+ " <span id='step-title'><%= page_title %></span></h3>"
+ " </div>"
+ " <% if (this.options.show_header_cancel_btn) { %>"
+ " <div class='col-sm-2'>"
+ " <button class='ajs-close wizard-cancel-event pull-right'"
+ " title='" + gettext("Close") + "'></button>"
+ " <% if (this.options.show_header_maximize_btn) { %>"
+ " <button class='ajs-maximize wizard-maximize-event pull-right'"
+ " title='" + gettext("Maximize") + "'></button>"
+ " <% } %>"
+ " </div>"
+ " <% } %>"
+ " </div>"
+ " </div>"
+ " <div class='wizard-content col-sm-12'>"
+ " <% if (this.options.show_left_panel) { %>"
+ " <div class='col-sm-3 wizard-left-panel'>"
+ " <img src='<%= this.options.image %>'"
+ " alt='" + gettext("Left panel logo") + "'></div>"
+ " <% } %>"
+ " <div class='col-sm-<% if (this.options.show_left_panel) { %>9<% }"
+ " else { %>12<% } %> wizard-right-panel'>"
+ " <% if ( typeof show_description != 'undefined'){ %>"
+ " <div class='wizard-description'>"
+ " <%= show_description %>"
+ " </div>"
+ " <% } %>"
+ " <div class='wizard-progress-bar'><% if (show_progress_bar) { %>"
+ " <p class='alert alert-info col-sm-12'><%= show_progress_bar %></p><% } %>"
+ " </div>"
+ " <div class='wizard-right-panel_content col-xs-12'>"
+ " </div>"
+ " </div>"
+ " </div>"
+ " <div class='col-sm-12 pg-prop-status-bar' style='visibility:hidden'>"
+ " <div class='media error-in-footer bg-red-1 border-red-2 font-red-3 text-14'>"
+ " <div class='media-body media-middle'>"
+ " <div class='alert-icon error-icon'>"
+ " <i class='fa fa-exclamation-triangle' aria-hidden='true'></i>"
+ " </div>"
+ " <div class='alert-text'>"
+ " </div>"
+ " <div class='close-error-bar'>"
+ " <a class='close-error'>x</a>"
+ " </div>"
+ " </div>"
+ " </div>"
+ " </div>"
+ " <div class='footer col-sm-12'>"
+ " <div class='row'>"
+ " <div class='col-sm-4 wizard-buttons pull-left'>"
+ " <button title = '" + gettext("Help for this dialog.") + "'"
+ " class='btn btn-default pull-left wizard-help' <%=this.options.wizard_help ? '' : 'disabled' %>>"
+ " <span class='fa fa-lg fa-question'></span></button>"
+ " </div>"
+ " <div class='col-sm-8'>"
+ " <div class='wizard-buttons'>"
+ " <button class='btn btn-primary wizard-back' <%=this.options.disable_prev ? 'disabled' : ''%>>"
+ " <i class='fa fa-backward'></i>" + gettext("Back") + "</button>"
+ " <button class='btn btn-primary wizard-next' <%=this.options.disable_next ? 'disabled' : ''%>>"
+ gettext("Next")
+ " <i class='fa fa-forward'></i></button>"
+ " <button class='btn btn-danger wizard-cancel' <%=this.options.disable_cancel ? 'disabled' : ''%>>"
+ " <i class='fa fa-lg fa-close'></i>" + gettext("Cancel") + "</button>"
+ " <button class='btn btn-primary wizard-finish' <%=this.options.disable_finish ? 'disabled' : ''%>>"
+ gettext("Finish") + "</button>"
+ " </div>"
+ " </div>"
+ " </div>"
+ " </div>"
+ " </div>"),
' <div class="pgadmin-wizard" style="height: <%= this.options.height %>px;' +
' width: <%= this.options.width %>px">' +
' <div class="wizard-header wizard-badge">' +
' <div class="row">' +
' <div class="col-sm-10">' +
' <h3><span id="main-title"><%= this.options.title %></span> -' +
' <span id="step-title"><%= page_title %></span></h3>' +
' </div>' +
' <% if (this.options.show_header_cancel_btn) { %>' +
' <div class="col-sm-2">' +
' <button class="ajs-close wizard-cancel-event pull-right"' +
' title="' + gettext('Close') + '></button>' +
' <% if (this.options.show_header_maximize_btn) { %>' +
' <button class="ajs-maximize wizard-maximize-event pull-right' +
' title="' + gettext('Maximize') + '"></button>' +
' <% } %>' +
' </div>' +
' <% } %>' +
' </div>' +
' </div>' +
' <div class="wizard-content col-sm-12">' +
' <% if (this.options.show_left_panel) { %>' +
' <div class="col-sm-3 wizard-left-panel">' +
' <img src="<%= this.options.image %>"' +
' alt="' + gettext('Left panel logo') + '"></div>' +
' <% } %>' +
' <div class="col-sm-<% if (this.options.show_left_panel) { %>9<% }' +
' else { %>12<% } %> wizard-right-panel">' +
' <% if ( typeof show_description != "undefined"){ %>' +
' <div class="wizard-description">' +
' <%= show_description %>' +
' </div>' +
' <% } %>' +
' <div class="wizard-progress-bar"><% if (show_progress_bar) { %>' +
' <p class="alert alert-info col-sm-12"><%= show_progress_bar %></p><% } %>' +
' </div>' +
' <div class="wizard-right-panel_content col-xs-12">' +
' </div>' +
' </div>' +
' </div>' +
' <div class="col-sm-12 pg-prop-status-bar" style="visibility:hidden">' +
' <div class="media error-in-footer bg-red-1 border-red-2 font-red-3 text-14">' +
' <div class="media-body media-middle">' +
' <div class="alert-icon error-icon">' +
' <i class="fa fa-exclamation-triangle" aria-hidden="true"></i>' +
' </div>' +
' <div class="alert-text">' +
' </div>' +
' <div class="close-error-bar">' +
' <a class="close-error">x</a>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' <div class="footer col-sm-12">' +
' <div class="row">' +
' <div class="col-sm-4 wizard-buttons pull-left">' +
' <button title = "' + gettext('Help for this dialog.') + '"' +
' class="btn btn-default pull-left wizard-help" <%=this.options.wizard_help ? "" : "disabled" %>>' +
' <span class="fa fa-lg fa-question"></span></button>' +
' </div>' +
' <div class="col-sm-8">' +
' <div class="wizard-buttons">' +
' <button class="btn btn-primary wizard-back" <%=this.options.disable_prev ? "disabled" : ""%>>' +
' <i class="fa fa-backward"></i>' + gettext('Back') + '</button>' +
' <button class="btn btn-primary wizard-next" <%=this.options.disable_next ? "disabled" : ""%>>' +
' ' + gettext('Next') +
' <i class="fa fa-forward"></i></button>' +
' <button class="btn btn-danger wizard-cancel" <%=this.options.disable_cancel ? "disabled" : ""%>>' +
' <i class="fa fa-lg fa-close"></i>' + gettext('Cancel') + '</button>' +
' <button class="btn btn-primary wizard-finish" <%=this.options.disable_finish ? "disabled" : ""%>>' +
' ' + gettext('Finish') + '</button>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>'),
events: {
"click button.wizard-next" : "nextPage",
"click button.wizard-back" : "prevPage",
"click button.wizard-cancel" : "onCancel",
"click button.wizard-cancel-event" : "onCancel",
"click button.wizard-maximize-event" : "onMaximize",
"click button.wizard-finish" : "finishWizard",
"click button.wizard-help" : "onDialogHelp",
"click a.close-error" : "closeErrorMsg",
'click button.wizard-next': 'nextPage',
'click button.wizard-back': 'prevPage',
'click button.wizard-cancel': 'onCancel',
'click button.wizard-cancel-event': 'onCancel',
'click button.wizard-maximize-event': 'onMaximize',
'click button.wizard-finish': 'finishWizard',
'click button.wizard-help': 'onDialogHelp',
'click a.close-error': 'closeErrorMsg',
},
initialize: function(options) {
this.options = _.extend({}, this.options, options.options);
@@ -150,15 +164,17 @@ function(_, Backbone, pgAdmin, pgBrowser, gettext) {
this.options.disable_prev = (this.options.disable_prev ? true : this.evalASFunc(this.currPage.disable_prev));
this.options.disable_cancel = (this.currPage.canCancel ? true : this.evalASFunc(this.currPage.disable_cancel));
var that = this;
/* HTML Content */
if (data.html) { data.content = data.html; }
if (data.html) {
data.content = data.html;
}
/* Backbone View */
else if (data.view) { data.content = data.view.render().el;}
else if (data.view) {
data.content = data.view.render().el;
}
$(this.el).html(this.tmpl(data));
$(this.el).find(".wizard-right-panel_content").html(data.content);
$(this.el).find('.wizard-right-panel_content').html(data.content);
/* OnLoad Callback */
this.onLoad();
@@ -166,15 +182,16 @@ function(_, Backbone, pgAdmin, pgBrowser, gettext) {
return this;
},
nextPage: function() {
if (!this.beforeNext()) { return false; }
if (!this.beforeNext()) {
return false;
}
var page_id = this.onNext();
if (page_id ) {
if (page_id) {
this.currPage = this.collection.get(page_id).toJSON();
this.options.curr_page = this.collection.indexOf(this.collection.get(page_id));
}
else if (this.options.curr_page < (this.collection.length-1)) {
} else if (this.options.curr_page < (this.collection.length - 1)) {
this.options.curr_page = this.options.curr_page + 1;
this.currPage = this.collection.at(this.options.curr_page).toJSON();
}
@@ -185,15 +202,16 @@ function(_, Backbone, pgAdmin, pgBrowser, gettext) {
return this.render();
},
prevPage: function() {
if (!this.beforePrev()) { return false; }
if (!this.beforePrev()) {
return false;
}
var page_id = this.onPrev();
if (page_id){
if (page_id) {
this.currPage = this.collection.get(page_id).toJSON();
this.options.curr_page = this.collection.indexOf(this.collection.get(page_id));
}
else if (this.options.curr_page > 0) {
} else if (this.options.curr_page > 0) {
this.options.curr_page = this.options.curr_page - 1;
this.currPage = this.collection.at(this.options.curr_page).toJSON();
}
@@ -212,41 +230,37 @@ function(_, Backbone, pgAdmin, pgBrowser, gettext) {
return true;
},
enableDisableNext: function(disable) {
if (typeof(disable) != 'undefined') {
this.options.disable_next = disable;
}
else if (this.options.curr_page >= (this.collection.length-1)) {
this.options.disable_next = true;
}
else {
this.options.disable_next = false;
}
if (typeof(disable) != 'undefined') {
this.options.disable_next = disable;
} else if (this.options.curr_page >= (this.collection.length - 1)) {
this.options.disable_next = true;
} else {
this.options.disable_next = false;
}
},
enableDisablePrev: function(disable) {
if (typeof(disable) != 'undefined') {
this.options.disable_prev = disable;
}
else if (this.options.curr_page <= 0) {
this.options.disable_prev = true;
}
else {
this.options.disable_prev = false;
}
if (typeof(disable) != 'undefined') {
this.options.disable_prev = disable;
} else if (this.options.curr_page <= 0) {
this.options.disable_prev = true;
} else {
this.options.disable_prev = false;
}
},
closeErrorMsg: function() {
$(this.el).find('.pg-prop-status-bar .alert-text').empty();
$(this.el).find('.pg-prop-status-bar').css("visibility", "hidden");
$(this.el).find('.pg-prop-status-bar').css('visibility', 'hidden');
},
beforeNext: function(){
beforeNext: function() {
return this.evalASFunc(this.currPage.beforeNext);
},
beforePrev: function(){
beforePrev: function() {
return this.evalASFunc(this.currPage.beforePrev);
},
onPrev: function(){
onPrev: function() {
return this.evalASFunc(this.currPage.onPrev);
},
onNext: function(){
onNext: function() {
return this.evalASFunc(this.currPage.onNext);
},
onLoad: function() {
@@ -261,12 +275,12 @@ function(_, Backbone, pgAdmin, pgBrowser, gettext) {
},
onMaximize: function() {
var dialog_api = this.options.dialog_api,
old_classes, _el = this.$el.find('.wizard-maximize-event');
_el = this.$el.find('.wizard-maximize-event');
// If no dialog api found then return
if(!dialog_api) return;
if (!dialog_api) return;
if(dialog_api.isMaximized()) {
if (dialog_api.isMaximized()) {
// toggle the icon
_el.removeClass('ajs-maximized');
dialog_api.restore();
@@ -297,7 +311,7 @@ function(_, Backbone, pgAdmin, pgBrowser, gettext) {
pnlDialogHelp.focus();
iframe.openURL(this.options.wizard_help);
}
},
});
return pgBrowser;