mirror of
https://github.com/pgadmin-org/pgadmin4.git
synced 2025-02-25 18:55:31 -06:00
Remove usage of jQuery in pgAdmin.
Remove usage of Bootstrap in React components. #5701
This commit is contained in:
Aditya Toshniwal
GitHub
@@ -1,10 +1,4 @@
|
||||
@import 'node_modules/@fortawesome/fontawesome-free/css/all.css';
|
||||
@import 'node_modules/bootstrap-datepicker/dist/css/bootstrap-datepicker3.css';
|
||||
@import 'node_modules/tempusdominus-bootstrap-4/build/css/tempusdominus-bootstrap-4.css';
|
||||
@import 'node_modules/bootstrap4-toggle/css/bootstrap4-toggle.min.css';
|
||||
@import 'node_modules/jquery-contextmenu/dist/jquery.contextMenu.css';
|
||||
@import 'node_modules/webcabin-docker/Build/wcDocker.css';
|
||||
@import 'node_modules/select2/dist/css/select2.min.css';
|
||||
@import 'node_modules/leaflet/dist/leaflet.css';
|
||||
|
||||
@import 'node_modules/codemirror/lib/codemirror.css';
|
||||
@@ -20,3 +14,6 @@
|
||||
|
||||
@import 'node_modules/uplot/dist/uPlot.min.css';
|
||||
|
||||
/* wcDocker dependencies */
|
||||
@import 'node_modules/webcabin-docker/Build/wcDocker.css';
|
||||
@import 'node_modules/jquery-contextmenu/dist/jquery.contextMenu.css';
|
||||
|
||||
@@ -99,8 +99,7 @@ export function showServerPassword() {
|
||||
})
|
||||
.catch((err)=>{
|
||||
return onFailure(
|
||||
err.response.request, status, err, nodeObj, nodeData, treeNodeInfo,
|
||||
itemNodeData, status
|
||||
err, nodeObj, nodeData, treeNodeInfo, itemNodeData, status
|
||||
);
|
||||
});
|
||||
}}
|
||||
@@ -141,7 +140,7 @@ export function showSchemaDiffServerPassword() {
|
||||
})
|
||||
.catch((err)=>{
|
||||
return onFailure(
|
||||
err.response.request, status, err, serverID, successCallback
|
||||
err, serverID, successCallback
|
||||
);
|
||||
});
|
||||
}}
|
||||
@@ -165,8 +164,8 @@ export function checkMasterPassword(data, masterpass_callback_queue, cancel_call
|
||||
} else {
|
||||
masterPassCallbacks(masterpass_callback_queue);
|
||||
}
|
||||
}).catch(function(xhr, status, error) {
|
||||
Notify.pgRespErrorNotify(xhr, error);
|
||||
}).catch(function(error) {
|
||||
Notify.pgRespErrorNotify(error);
|
||||
});
|
||||
}
|
||||
|
||||
@@ -288,8 +287,8 @@ export function showNamedRestorePoint() {
|
||||
onClose();
|
||||
Notify.success(res.data.data.result);
|
||||
})
|
||||
.catch(function(xhr, status, error) {
|
||||
Notify.pgRespErrorNotify(xhr, error);
|
||||
.catch(function(error) {
|
||||
Notify.pgRespErrorNotify(error);
|
||||
});
|
||||
}}
|
||||
/>
|
||||
|
||||
@@ -20,6 +20,7 @@ import HelpIcon from '@material-ui/icons/HelpRounded';
|
||||
import EditIcon from '@material-ui/icons/Edit';
|
||||
import diffArray from 'diff-arrays-of-objects';
|
||||
import _ from 'lodash';
|
||||
import clsx from 'clsx';
|
||||
|
||||
import {FormFooterMessage, MESSAGE_TYPE } from 'sources/components/FormComponents';
|
||||
import { PrimaryButton, DefaultButton, PgIconButton } from 'sources/components/Buttons';
|
||||
@@ -52,6 +53,9 @@ const useDialogStyles = makeStyles((theme)=>({
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
},
|
||||
formProperties: {
|
||||
backgroundColor: theme.palette.grey[400],
|
||||
},
|
||||
footer: {
|
||||
padding: theme.spacing(1),
|
||||
background: theme.otherVars.headerBg,
|
||||
@@ -990,7 +994,7 @@ function SchemaPropertiesView({
|
||||
<PgIconButton data-test="edit"
|
||||
onClick={props.onEdit} icon={<EditIcon />} title="Edit the object" />
|
||||
</Box>
|
||||
<Box className={classes.form}>
|
||||
<Box className={clsx(classes.form, classes.formProperties)}>
|
||||
<Box>
|
||||
{Object.keys(finalTabs).map((tabName)=>{
|
||||
let id = tabName.replace(' ', '');
|
||||
|
||||
@@ -515,6 +515,7 @@ function getFinalTheme(baseTheme) {
|
||||
root: {
|
||||
padding: '4px 8px',
|
||||
backgroundColor: baseTheme.otherVars.cardHeaderBg,
|
||||
fontWeight: 'bold',
|
||||
...mixins.panelBorder.bottom,
|
||||
}
|
||||
},
|
||||
|
||||
@@ -86,7 +86,7 @@ PgMenu.propTypes = {
|
||||
className: CustomPropTypes.className,
|
||||
label: PropTypes.string,
|
||||
anchorRef: CustomPropTypes.ref,
|
||||
menuButton: PropTypes.oneOfType([React.ReactNode, undefined]),
|
||||
menuButton: PropTypes.element,
|
||||
};
|
||||
|
||||
export const PgSubMenu = applyStatics(SubMenu)(({label, ...props})=>{
|
||||
|
||||
@@ -7,7 +7,6 @@
|
||||
//
|
||||
//////////////////////////////////////////////////////////////
|
||||
|
||||
import $ from 'jquery';
|
||||
import axios from 'axios';
|
||||
|
||||
export function setPGCSRFToken(header, token) {
|
||||
@@ -16,14 +15,6 @@ export function setPGCSRFToken(header, token) {
|
||||
throw new Error('csrf-token meta tag has not been set');
|
||||
}
|
||||
|
||||
// Configure jquery.ajax to set 'X-CSRFToken' request header for
|
||||
// every requests.
|
||||
$.ajaxSetup({
|
||||
beforeSend: function(xhr) {
|
||||
xhr.setRequestHeader(header, token);
|
||||
},
|
||||
});
|
||||
|
||||
// Configure axios to set 'X-CSRFToken' request header for
|
||||
// every requests.
|
||||
axios.interceptors.request.use(function (config) {
|
||||
|
||||
@@ -1,154 +0,0 @@
|
||||
/////////////////////////////////////////////////////////////
|
||||
//
|
||||
// pgAdmin 4 - PostgreSQL Tools
|
||||
//
|
||||
// Copyright (C) 2013 - 2023, The pgAdmin Development Team
|
||||
// This software is released under the PostgreSQL Licence
|
||||
//
|
||||
//////////////////////////////////////////////////////////////
|
||||
|
||||
import $ from 'jquery';
|
||||
import Mousetrap from 'mousetrap';
|
||||
import { findAndSetFocus, parseShortcutValue } from './utils';
|
||||
|
||||
class dialogTabNavigator {
|
||||
constructor(dialogContainer, backwardShortcut, forwardShortcut) {
|
||||
|
||||
this.dialogContainer = dialogContainer;
|
||||
|
||||
this.tabSwitching = false;
|
||||
|
||||
this.tabs = this.dialogContainer.find('.nav-tabs:visible');
|
||||
|
||||
if (this.tabs.length > 0 ) {
|
||||
this.tabs = this.tabs[0];
|
||||
}
|
||||
|
||||
this.dialogTabBackward = parseShortcutValue(backwardShortcut);
|
||||
this.dialogTabForward = parseShortcutValue(forwardShortcut);
|
||||
|
||||
Mousetrap(this.dialogContainer[0]).bind(this.dialogTabBackward, this.onKeyboardEvent.bind(this));
|
||||
Mousetrap(this.dialogContainer[0]).bind(this.dialogTabForward, this.onKeyboardEvent.bind(this));
|
||||
|
||||
}
|
||||
|
||||
onKeyboardEvent(event, shortcut) {
|
||||
let currentTabPane = this.dialogContainer
|
||||
.find('.tab-content:first > .tab-pane.active:first:visible'),
|
||||
childTabData = this.isActivePaneHasChildTabs(currentTabPane);
|
||||
|
||||
if (this.tabSwitching) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.tabSwitching = true;
|
||||
|
||||
if(childTabData) {
|
||||
let res = this.navigate(shortcut, childTabData.childTab,
|
||||
childTabData.childTabPane, event);
|
||||
|
||||
if (!res) {
|
||||
this.navigate(shortcut, this.tabs, currentTabPane, event);
|
||||
}
|
||||
} else {
|
||||
this.navigate(shortcut, this.tabs, currentTabPane, event);
|
||||
}
|
||||
}
|
||||
|
||||
isActivePaneHasChildTabs(currentTabPane) {
|
||||
let childTab = currentTabPane.find('.nav-tabs:first:visible'),
|
||||
childTabPane;
|
||||
|
||||
if (childTab.length > 0) {
|
||||
childTabPane = currentTabPane
|
||||
.find('.tab-content:first > .tab-pane.active:first:visible');
|
||||
|
||||
return {
|
||||
'childTab': childTab,
|
||||
'childTabPane': childTabPane,
|
||||
};
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
navigate(shortcut, tabs, tab_pane, event) {
|
||||
if (shortcut == this.dialogTabBackward) {
|
||||
return this.navigateBackward(tabs, tab_pane, event);
|
||||
} else if (shortcut == this.dialogTabForward) {
|
||||
return this.navigateForward(tabs, tab_pane, event);
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
navigateBackward(tabs, tab_pane, event) {
|
||||
let self = this,
|
||||
nextTabPane,
|
||||
innerTabContainer,
|
||||
prevtab = $(tabs).find('li').has('a.active').prev('li');
|
||||
|
||||
if (prevtab.length > 0) {
|
||||
prevtab.find('a').tab('show');
|
||||
|
||||
nextTabPane = tab_pane.prev();
|
||||
innerTabContainer = nextTabPane
|
||||
.find('.tab-content:first > .tab-pane.active:first:visible');
|
||||
|
||||
if (innerTabContainer.length > 0) {
|
||||
findAndSetFocus(innerTabContainer);
|
||||
} else {
|
||||
findAndSetFocus(nextTabPane);
|
||||
}
|
||||
|
||||
setTimeout(function() {
|
||||
self.tabSwitching = false;
|
||||
}, 200);
|
||||
|
||||
event.stopPropagation();
|
||||
return true;
|
||||
}
|
||||
|
||||
this.tabSwitching = false;
|
||||
return false;
|
||||
}
|
||||
|
||||
navigateForward(tabs, tab_pane, event) {
|
||||
let self = this,
|
||||
nextTabPane,
|
||||
innerTabContainer,
|
||||
nexttab = $(tabs).find('li').has('a.active').next('li');
|
||||
|
||||
if(nexttab.length > 0) {
|
||||
nexttab.find('a').tab('show');
|
||||
|
||||
nextTabPane = tab_pane.next();
|
||||
innerTabContainer = nextTabPane
|
||||
.find('.tab-content:first > .tab-pane.active:first:visible');
|
||||
|
||||
if (innerTabContainer.length > 0) {
|
||||
findAndSetFocus(innerTabContainer);
|
||||
} else {
|
||||
findAndSetFocus(nextTabPane);
|
||||
}
|
||||
|
||||
setTimeout(function() {
|
||||
self.tabSwitching = false;
|
||||
}, 200);
|
||||
|
||||
event.stopPropagation();
|
||||
|
||||
return true;
|
||||
}
|
||||
this.tabSwitching = false;
|
||||
return false;
|
||||
}
|
||||
|
||||
detach() {
|
||||
Mousetrap(this.dialogContainer[0]).unbind(this.dialogTabBackward);
|
||||
Mousetrap(this.dialogContainer[0]).unbind(this.dialogTabForward);
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
dialogTabNavigator: dialogTabNavigator,
|
||||
};
|
||||
@@ -24,6 +24,7 @@ import gettext from 'sources/gettext';
|
||||
import _ from 'lodash';
|
||||
import pgWindow from 'sources/window';
|
||||
import ModalProvider, { useModal } from './ModalProvider';
|
||||
import { parseApiError } from '../api_instance';
|
||||
|
||||
const AUTO_HIDE_DURATION = 3000; // In milliseconds
|
||||
|
||||
@@ -150,76 +151,45 @@ let Notifier = {
|
||||
);
|
||||
},
|
||||
|
||||
pgRespErrorNotify(xhr, error, prefixMsg='') {
|
||||
let contentType = xhr.getResponseHeader('Content-Type');
|
||||
if (xhr.status === 410) {
|
||||
const pgBrowser = window.pgAdmin.Browser;
|
||||
pgBrowser.report_error(gettext('Error: Object not found - %s.', xhr.statusText), xhr.responseJSON.errormsg);
|
||||
pgRespErrorNotify(error, prefixMsg='') {
|
||||
if (error.response?.status === 410) {
|
||||
this.alert(gettext('Error: Object not found - %s.', error.response.statusText), parseApiError(error));
|
||||
} else {
|
||||
try {
|
||||
if (xhr.status === 0) {
|
||||
error = gettext('Connection to the server has been lost.');
|
||||
} else {
|
||||
if(contentType){
|
||||
if(contentType.indexOf('application/json') >= 0) {
|
||||
let resp = JSON.parse(xhr.responseText);
|
||||
error = _.escape(resp.result) || _.escape(resp.errormsg) || gettext('Unknown error');
|
||||
}
|
||||
}
|
||||
if (contentType.indexOf('text/html') >= 0) {
|
||||
error = gettext('INTERNAL SERVER ERROR');
|
||||
console.warn(xhr.responseText);
|
||||
}
|
||||
}
|
||||
}
|
||||
catch(e){
|
||||
error = e.message;
|
||||
}
|
||||
|
||||
this.error(prefixMsg + ' ' + error);
|
||||
this.error(prefixMsg + ' ' + parseApiError(error));
|
||||
}
|
||||
},
|
||||
|
||||
pgNotifier(type, xhr, promptmsg, onJSONResult) {
|
||||
let msg = xhr.responseText,
|
||||
contentType = xhr.getResponseHeader('Content-Type');
|
||||
pgNotifier(type, error, promptmsg, onJSONResult) {
|
||||
let msg;
|
||||
|
||||
if (xhr.status == 0) {
|
||||
msg = gettext('Connection to the server has been lost.');
|
||||
if(!error.response) {
|
||||
msg = parseApiError(error);
|
||||
promptmsg = gettext('Connection Lost');
|
||||
} else {
|
||||
if (contentType) {
|
||||
try {
|
||||
if (contentType.indexOf('application/json') == 0) {
|
||||
let resp = JSON.parse(msg);
|
||||
|
||||
if(resp.info == 'CRYPTKEY_MISSING') {
|
||||
let pgBrowser = window.pgAdmin.Browser;
|
||||
pgBrowser.set_master_password('', ()=> {
|
||||
if(onJSONResult && typeof(onJSONResult) == 'function') {
|
||||
onJSONResult('CRYPTKEY_SET');
|
||||
}
|
||||
}, ()=> {
|
||||
if(onJSONResult && typeof(onJSONResult) == 'function') {
|
||||
onJSONResult('CRYPTKEY_NOT_SET');
|
||||
}
|
||||
});
|
||||
return;
|
||||
} else if (resp.result != null && (!resp.errormsg || resp.errormsg == '') &&
|
||||
onJSONResult && typeof(onJSONResult) == 'function') {
|
||||
return onJSONResult(resp.result);
|
||||
if(error.response.headers['content-type'] == 'application/json') {
|
||||
let resp = error.response.data;
|
||||
if(resp.info == 'CRYPTKEY_MISSING') {
|
||||
let pgBrowser = window.pgAdmin.Browser;
|
||||
pgBrowser.set_master_password('', ()=> {
|
||||
if(onJSONResult && typeof(onJSONResult) == 'function') {
|
||||
onJSONResult('CRYPTKEY_SET');
|
||||
}
|
||||
msg = _.escape(resp.result) || _.escape(resp.errormsg) || 'Unknown error';
|
||||
}
|
||||
if (contentType.indexOf('text/html') == 0) {
|
||||
if (type === 'error') {
|
||||
this.alert('Error', promptmsg);
|
||||
}, ()=> {
|
||||
if(onJSONResult && typeof(onJSONResult) == 'function') {
|
||||
onJSONResult('CRYPTKEY_NOT_SET');
|
||||
}
|
||||
return;
|
||||
}
|
||||
} catch (e) {
|
||||
this.alert('Error', e.message);
|
||||
});
|
||||
return;
|
||||
} else if (resp.result != null && (!resp.errormsg || resp.errormsg == '') &&
|
||||
onJSONResult && typeof(onJSONResult) == 'function') {
|
||||
return onJSONResult(resp.result);
|
||||
}
|
||||
msg = _.escape(resp.result) || _.escape(resp.errormsg) || 'Unknown error';
|
||||
} else {
|
||||
if (type === 'error') {
|
||||
this.alert('Error', promptmsg);
|
||||
}
|
||||
return;
|
||||
}
|
||||
}
|
||||
this.alert(promptmsg, msg.replace(new RegExp(/\r?\n/, 'g'), '<br />'));
|
||||
|
||||
@@ -125,6 +125,9 @@ const useStyles = makeStyles((theme) =>
|
||||
padding: '8px',
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
},
|
||||
hidden: {
|
||||
display: 'none',
|
||||
}
|
||||
}),
|
||||
);
|
||||
@@ -198,7 +201,7 @@ function Wizard({ stepList, onStepChange, onSave, className, ...props }) {
|
||||
{
|
||||
React.Children.map(props.children, (child) => {
|
||||
return (
|
||||
<div hidden={child.props.stepId !== activeStep} className={clsx(classes.stepDefaultStyle, child.props.className)}>
|
||||
<div className={clsx(classes.stepDefaultStyle, child.props.className, (child.props.stepId !== activeStep ? classes.hidden : ''))}>
|
||||
{child}
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -7,19 +7,9 @@
|
||||
//
|
||||
//////////////////////////////////////////////////////////////////////////
|
||||
|
||||
import $ from 'jquery';
|
||||
import gettext from 'sources/gettext';
|
||||
import { getMod } from 'sources/utils';
|
||||
|
||||
const PERIOD_KEY = 190,
|
||||
FWD_SLASH_KEY = 191,
|
||||
ESC_KEY = 27,
|
||||
LEFT_KEY = 37,
|
||||
UP_KEY = 38,
|
||||
RIGHT_KEY = 39,
|
||||
DOWN_KEY = 40,
|
||||
K_KEY = 75;
|
||||
|
||||
function isMac() {
|
||||
return window.navigator.userAgentData?.platform === 'macOS'
|
||||
|| window.navigator.platform.search('Mac') != -1;
|
||||
@@ -154,211 +144,8 @@ function focusDockerPanel(docker, op) {
|
||||
return focus_panel._type;
|
||||
}
|
||||
|
||||
/* Debugger: Keyboard Shortcuts handling */
|
||||
function keyboardShortcutsDebugger($el, event, preferences, docker) {
|
||||
let panel_type = '', panel_content, $input;
|
||||
|
||||
if(this.validateShortcutKeys(preferences.edit_grid_values, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
panel_content = $el.find(
|
||||
'div.wcPanelTabContent:not(".wcPanelTabContentHidden")'
|
||||
);
|
||||
if(panel_content.length) {
|
||||
$input = $(panel_content).find('td.editable:first');
|
||||
if($input.length)
|
||||
$input.trigger('click');
|
||||
}
|
||||
} else if(this.validateShortcutKeys(preferences.move_next, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
panel_type = focusDockerPanel(docker, 'right');
|
||||
} else if(this.validateShortcutKeys(preferences.move_previous, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
panel_type = focusDockerPanel(docker, 'left');
|
||||
} else if(this.validateShortcutKeys(preferences.switch_panel, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
panel_type = focusDockerPanel(docker, 'switch');
|
||||
}
|
||||
return panel_type;
|
||||
}
|
||||
|
||||
/* Query tool: Keyboard Shortcuts handling */
|
||||
function keyboardShortcutsQueryTool(
|
||||
sqlEditorController, queryToolActions, event, docker
|
||||
) {
|
||||
if (sqlEditorController.isQueryRunning()) {
|
||||
return;
|
||||
}
|
||||
let keyCode = event.which || event.keyCode, panel_type = '';
|
||||
let executeKeys = sqlEditorController.preferences.execute_query;
|
||||
let explainKeys = sqlEditorController.preferences.explain_query;
|
||||
let explainAnalyzeKeys = sqlEditorController.preferences.explain_analyze_query;
|
||||
let downloadCsvKeys = sqlEditorController.preferences.download_results;
|
||||
let nextTabKeys = sqlEditorController.preferences.move_next;
|
||||
let previousTabKeys = sqlEditorController.preferences.move_previous;
|
||||
let switchPanelKeys = sqlEditorController.preferences.switch_panel;
|
||||
let toggleCaseKeys = sqlEditorController.preferences.toggle_case;
|
||||
let commitKeys = sqlEditorController.preferences.commit_transaction;
|
||||
let rollbackKeys = sqlEditorController.preferences.rollback_transaction;
|
||||
let saveDataKeys = sqlEditorController.preferences.save_data;
|
||||
let queryToolKeys = sqlEditorController.preferences.show_query_tool;
|
||||
|
||||
if (this.validateShortcutKeys(executeKeys, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.executeQuery(sqlEditorController);
|
||||
} else if (this.validateShortcutKeys(explainKeys, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.explain(sqlEditorController);
|
||||
} else if (this.validateShortcutKeys(explainAnalyzeKeys, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.explainAnalyze(sqlEditorController);
|
||||
} else if (this.validateShortcutKeys(downloadCsvKeys, event)) {
|
||||
if(!sqlEditorController.is_save_results_to_file_disabled) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.download(sqlEditorController);
|
||||
}
|
||||
} else if (this.validateShortcutKeys(toggleCaseKeys, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.toggleCaseOfSelectedText(sqlEditorController);
|
||||
} else if (this.validateShortcutKeys(commitKeys, event)) {
|
||||
// If transaction buttons are disabled then no need to execute commit.
|
||||
if (!sqlEditorController.is_transaction_buttons_disabled) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.executeCommit(sqlEditorController);
|
||||
}
|
||||
} else if (this.validateShortcutKeys(rollbackKeys, event)) {
|
||||
// If transaction buttons are disabled then no need to execute rollback.
|
||||
if (!sqlEditorController.is_transaction_buttons_disabled) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.executeRollback(sqlEditorController);
|
||||
}
|
||||
} else if (this.validateShortcutKeys(saveDataKeys, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.saveDataChanges(sqlEditorController);
|
||||
} else if (this.validateShortcutKeys(queryToolKeys, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.openQueryTool(sqlEditorController);
|
||||
} else if ((
|
||||
(this.isMac() && event.metaKey) ||
|
||||
(!this.isMac() && event.ctrlKey)
|
||||
) && !event.altKey && event.shiftKey && keyCode === FWD_SLASH_KEY) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.commentBlockCode(sqlEditorController);
|
||||
} else if ((
|
||||
(this.isMac() && !this.isKeyCtrlAltShift(event) && event.metaKey) ||
|
||||
(!this.isMac() && !this.isKeyAltShift(event) && event.ctrlKey)
|
||||
) && keyCode === FWD_SLASH_KEY) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.commentLineCode(sqlEditorController);
|
||||
} else if ((
|
||||
(this.isMac() && !this.isKeyCtrlAltShift(event) && event.metaKey) ||
|
||||
(!this.isMac() && !this.isKeyAltShift(event) && event.ctrlKey)
|
||||
) && keyCode === PERIOD_KEY) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.uncommentLineCode(sqlEditorController);
|
||||
} else if ((
|
||||
(this.isMac() && event.metaKey) ||
|
||||
(!this.isMac() && event.ctrlKey)
|
||||
) && !event.altKey && event.shiftKey && keyCode === K_KEY) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.formatSql(sqlEditorController);
|
||||
} else if (keyCode == ESC_KEY) {
|
||||
queryToolActions.focusOut(sqlEditorController);
|
||||
/*Apply only for sub-dropdown*/
|
||||
if($(event.target).hasClass('dropdown-item')
|
||||
&& $(event.target).closest('.dropdown-submenu').length > 0) {
|
||||
$(event.target).closest('.dropdown-submenu').find('.dropdown-menu').removeClass('show');
|
||||
}
|
||||
} else if(this.validateShortcutKeys(nextTabKeys, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
panel_type = focusDockerPanel(docker, 'right');
|
||||
} else if(this.validateShortcutKeys(previousTabKeys, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
panel_type = focusDockerPanel(docker, 'left');
|
||||
} else if(this.validateShortcutKeys(switchPanelKeys, event)) {
|
||||
this._stopEventPropagation(event);
|
||||
panel_type = focusDockerPanel(docker, 'switch');
|
||||
} else if(keyCode === UP_KEY || keyCode === DOWN_KEY) {
|
||||
/*Apply only for dropdown*/
|
||||
if($(event.target).closest('.dropdown-menu').length > 0) {
|
||||
this._stopEventPropagation(event);
|
||||
let currLi = $(event.target).closest('li');
|
||||
/*close all the submenus on movement*/
|
||||
$(event.target).closest('.dropdown-menu').find('.show').removeClass('show');
|
||||
|
||||
if(keyCode === UP_KEY) {
|
||||
currLi = currLi.prev();
|
||||
}
|
||||
else if(keyCode === DOWN_KEY){
|
||||
currLi = currLi.next();
|
||||
}
|
||||
|
||||
/*do not focus on divider, disabled and d-none */
|
||||
while(currLi.hasClass('dropdown-divider')
|
||||
|| currLi.hasClass('d-none')
|
||||
|| currLi.find('.dropdown-item').first().hasClass('disabled')) {
|
||||
if(keyCode === UP_KEY) {
|
||||
currLi = currLi.prev();
|
||||
}
|
||||
else if(keyCode === DOWN_KEY){
|
||||
currLi = currLi.next();
|
||||
}
|
||||
}
|
||||
currLi.find('.dropdown-item').trigger('focus');
|
||||
}
|
||||
} else if(keyCode === LEFT_KEY || keyCode === RIGHT_KEY) {
|
||||
/*Apply only for dropdown*/
|
||||
if($(event.target).closest('.dropdown-menu').length > 0) {
|
||||
this._stopEventPropagation(event);
|
||||
let currLi = $(event.target).closest('li');
|
||||
|
||||
if(keyCode === RIGHT_KEY) {
|
||||
/*open submenu if any*/
|
||||
if(currLi.hasClass('dropdown-submenu')){
|
||||
currLi.find('.dropdown-menu').addClass('show');
|
||||
currLi.find('.dropdown-menu .dropdown-item').first().trigger('focus');
|
||||
}
|
||||
} else if(keyCode === LEFT_KEY) {
|
||||
/*close submenu*/
|
||||
let currMenu = currLi.closest('.dropdown-menu');
|
||||
if(currMenu.closest('.dropdown-submenu').length > 0) {
|
||||
currMenu.removeClass('show');
|
||||
currLi = currMenu.closest('.dropdown-submenu');
|
||||
currLi.find('.dropdown-item').trigger('focus');
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// Macros
|
||||
let macroId = this.validateMacros(sqlEditorController, event);
|
||||
|
||||
if (macroId !== false) {
|
||||
this._stopEventPropagation(event);
|
||||
queryToolActions.executeMacro(sqlEditorController, macroId);
|
||||
}
|
||||
}
|
||||
|
||||
return panel_type;
|
||||
}
|
||||
|
||||
function validateMacros(sqlEditorController, event) {
|
||||
let keyCode = event.which || event.keyCode;
|
||||
|
||||
let macro = sqlEditorController.macros.filter(mc =>
|
||||
mc.alt == event.altKey &&
|
||||
mc.control == event.ctrlKey &&
|
||||
mc.key_code == keyCode);
|
||||
|
||||
if (macro.length == 1) {
|
||||
return macro[0].id;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
export {
|
||||
keyboardShortcutsDebugger as processEventDebugger,
|
||||
keyboardShortcutsQueryTool as processEventQueryTool,
|
||||
focusDockerPanel, validateShortcutKeys, validateMacros,
|
||||
focusDockerPanel, validateShortcutKeys,
|
||||
_stopEventPropagation, isMac, isKeyCtrlAlt, isKeyAltShift, isKeyCtrlShift,
|
||||
isKeyCtrlAltShift, isAltShiftBoth, isCtrlShiftBoth, isCtrlAltBoth,
|
||||
shortcut_key, shortcut_title, shortcut_accesskey_title,
|
||||
|
||||
@@ -8,10 +8,10 @@
|
||||
//////////////////////////////////////////////////////////////
|
||||
|
||||
import _ from 'lodash';
|
||||
import $ from 'jquery';
|
||||
import url_for from 'sources/url_for';
|
||||
import gettext from 'sources/gettext';
|
||||
import pgAdmin from 'sources/pgadmin';
|
||||
import getApiInstance from '../api_instance';
|
||||
|
||||
export const pgBrowser = pgAdmin.Browser = pgAdmin.Browser || {};
|
||||
|
||||
@@ -72,23 +72,10 @@ _.extend(pgBrowser.browserTreeState, {
|
||||
pgBrowser.Events.on('pgadmin:browser:tree:update-tree-state',
|
||||
this.update_cache.bind(this));
|
||||
} else if (!_.isUndefined(save_tree_state_period)) {
|
||||
$.ajax({
|
||||
url: url_for('settings.reset_tree_state'),
|
||||
type: 'DELETE',
|
||||
})
|
||||
.fail(function(jqx) {
|
||||
let msg = jqx.responseText;
|
||||
/* Error from the server */
|
||||
if (jqx.status == 417 || jqx.status == 410 || jqx.status == 500) {
|
||||
try {
|
||||
let data = JSON.parse(jqx.responseText);
|
||||
msg = data.errormsg;
|
||||
} catch (e) {
|
||||
console.warn(e.stack || e);
|
||||
}
|
||||
}
|
||||
getApiInstance().delete(url_for('settings.reset_tree_state'))
|
||||
.catch(function(error) {
|
||||
console.warn(
|
||||
gettext('Error resetting the tree saved state."'), msg);
|
||||
gettext('Error resetting the tree saved state."'), error);
|
||||
});
|
||||
}
|
||||
|
||||
@@ -99,58 +86,29 @@ _.extend(pgBrowser.browserTreeState, {
|
||||
if(self.last_state == JSON.stringify(self.current_state))
|
||||
return;
|
||||
|
||||
$.ajax({
|
||||
url: url_for('settings.save_tree_state'),
|
||||
type: 'POST',
|
||||
contentType: 'application/json',
|
||||
data: JSON.stringify(self.current_state),
|
||||
})
|
||||
.done(function() {
|
||||
self.last_state = JSON.stringify(self.current_state);
|
||||
self.fetch_state();
|
||||
})
|
||||
.fail(function(jqx) {
|
||||
let msg = jqx.responseText;
|
||||
/* Error from the server */
|
||||
if (jqx.status == 417 || jqx.status == 410 || jqx.status == 500) {
|
||||
try {
|
||||
let data = JSON.parse(jqx.responseText);
|
||||
msg = data.errormsg;
|
||||
} catch (e) {
|
||||
console.warn(e.stack || e);
|
||||
}
|
||||
}
|
||||
console.warn(
|
||||
gettext('Error saving the tree state."'), msg);
|
||||
});
|
||||
|
||||
getApiInstance().post(
|
||||
url_for('settings.save_tree_state'),
|
||||
JSON.stringify(self.current_state)
|
||||
).then(()=> {
|
||||
self.last_state = JSON.stringify(self.current_state);
|
||||
self.fetch_state();
|
||||
}).catch(function(error) {
|
||||
console.warn(
|
||||
gettext('Error resetting the tree saved state."'), error);
|
||||
});
|
||||
},
|
||||
fetch_state: function() {
|
||||
|
||||
let self = this;
|
||||
$.ajax({
|
||||
url: url_for('settings.get_tree_state'),
|
||||
type: 'GET',
|
||||
dataType: 'json',
|
||||
contentType: 'application/json',
|
||||
})
|
||||
.done(function(res) {
|
||||
self.stored_state = res;
|
||||
})
|
||||
.fail(function(jqx) {
|
||||
let msg = jqx.responseText;
|
||||
/* Error from the server */
|
||||
if (jqx.status == 417 || jqx.status == 410 || jqx.status == 500) {
|
||||
try {
|
||||
let data = JSON.parse(jqx.responseText);
|
||||
msg = data.errormsg;
|
||||
} catch (e) {
|
||||
console.warn(e.stack || e);
|
||||
}
|
||||
}
|
||||
console.warn(
|
||||
gettext('Error fetching the tree state.'), msg);
|
||||
});
|
||||
|
||||
getApiInstance().get(
|
||||
url_for('settings.get_tree_state'),
|
||||
).then((res)=> {
|
||||
self.stored_state = res.data;
|
||||
}).catch(function(error) {
|
||||
console.warn(
|
||||
gettext('Error resetting the tree saved state."'), error);
|
||||
});
|
||||
},
|
||||
update_cache: function(item) {
|
||||
let data = item && pgBrowser.tree.itemData(item),
|
||||
|
||||
@@ -8,7 +8,6 @@
|
||||
//////////////////////////////////////////////////////////////////////////
|
||||
|
||||
import _ from 'lodash';
|
||||
import $ from 'jquery';
|
||||
import pgAdmin from 'sources/pgadmin';
|
||||
|
||||
import { FileType } from 'react-aspen';
|
||||
@@ -533,17 +532,15 @@ export class Tree {
|
||||
}
|
||||
|
||||
/* setDragImage is not supported in IE. We leave it to
|
||||
* its default look and feel
|
||||
*/
|
||||
* its default look and feel
|
||||
*/
|
||||
if (e.dataTransfer.setDragImage) {
|
||||
let dragItem = $(`
|
||||
<div class="drag-tree-node">
|
||||
<span>${_.escape(dropDetails.text)}</span>
|
||||
</div>`
|
||||
);
|
||||
const dragItem = document.createElement('div');
|
||||
dragItem.setAttribute('drag-tree-node');
|
||||
dragItem.innerHTML = `<span>${_.escape(dropDetails.text)}</span>`;
|
||||
|
||||
$('body .drag-tree-node').remove();
|
||||
$('body').append(dragItem);
|
||||
document.querySelector('body .drag-tree-node').remove();
|
||||
document.body.appendChild(dragItem);
|
||||
|
||||
e.dataTransfer.setDragImage(dragItem[0], 0, 0);
|
||||
}
|
||||
|
||||
@@ -8,7 +8,6 @@
|
||||
//////////////////////////////////////////////////////////////////////////
|
||||
|
||||
import _ from 'lodash';
|
||||
import $ from 'jquery';
|
||||
import url_for from './url_for';
|
||||
import gettext from 'sources/gettext';
|
||||
import 'wcdocker';
|
||||
@@ -28,64 +27,6 @@ export function parseShortcutValue(obj) {
|
||||
return shortcut;
|
||||
}
|
||||
|
||||
export function handleKeyNavigation(event) {
|
||||
let wizardHeader = $(event.currentTarget).find('.wizard-header');
|
||||
let wizardFooter = $(event.currentTarget).find('.wizard-footer');
|
||||
let gridElement = $(event.currentTarget).find('.select-row-cell:first');
|
||||
let gridElementLast = $(event.currentTarget).find('.select-row-cell:last');
|
||||
|
||||
let firstWizardHeaderButton = $(wizardHeader).find('button:enabled:first');
|
||||
let lastWizardHeaderButton = $(wizardHeader).find('button:enabled:last');
|
||||
let lastWizardFooterBtn = $(wizardFooter).find('button:enabled:last');
|
||||
let firstWizardFooterBtn = $(wizardFooter).find('button:enabled:first');
|
||||
|
||||
|
||||
if (event.shiftKey && event.keyCode === 9) {
|
||||
// Move backwards
|
||||
if(firstWizardHeaderButton && $(firstWizardHeaderButton).is($(event.target))) {
|
||||
if (lastWizardFooterBtn) {
|
||||
$(lastWizardFooterBtn).focus();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}
|
||||
}
|
||||
else if ($(firstWizardFooterBtn).is($(event.target))){
|
||||
if ($(gridElement).find('.custom-control-input').is(':visible')){
|
||||
$(gridElementLast).find('.custom-control-input').focus();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}else if ($(event.currentTarget).find('.wizard-content').find('.CodeMirror-scroll').is(':visible')){
|
||||
$(lastWizardHeaderButton).focus();
|
||||
}
|
||||
}
|
||||
} else if (event.keyCode === 9) {
|
||||
// Move forwards
|
||||
// If taget is last button then goto first element
|
||||
if(lastWizardFooterBtn && $(lastWizardFooterBtn).is($(event.target))) {
|
||||
$(firstWizardHeaderButton).focus();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}else if (event.target.innerText == 'Name'){
|
||||
if ($(gridElement).find('.custom-control-input').is(':visible')){
|
||||
$(gridElement).find('.custom-control-input').focus();
|
||||
}else {
|
||||
$(firstWizardFooterBtn).focus();
|
||||
}
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
} else if(event.target.tagName == 'DIV') {
|
||||
$(event.currentTarget).find('.custom-control-input:first').trigger('focus');
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
} else if(event.target.tagName == 'TEXTAREA'){
|
||||
$(firstWizardFooterBtn).focus();
|
||||
}
|
||||
} else if (event.keyCode === 27){
|
||||
//close the wizard when esc key is pressed
|
||||
$(wizardHeader).find('button.ajs-close').click();
|
||||
}
|
||||
}
|
||||
|
||||
export function findAndSetFocus(container) {
|
||||
if (container.length == 0) {
|
||||
return;
|
||||
@@ -425,25 +366,28 @@ export function evalFunc(obj, func, param) {
|
||||
}
|
||||
|
||||
export function registerDetachEvent(panel){
|
||||
panel.on(wcDocker.EVENT.DETACHED, function() {
|
||||
$((this.$container)[0].ownerDocument).find('.wcIFrameFloating').attr({
|
||||
style: 'z-index: 1200'
|
||||
});
|
||||
});
|
||||
panel.on(wcDocker.EVENT.ORDER_CHANGED, function() {
|
||||
function updateIframePosition() {
|
||||
let docker = this.docker(this._panel);
|
||||
let dockerPos = docker.$container.offset();
|
||||
let pos = this.$container.offset();
|
||||
let width = this.$container.width();
|
||||
let height = this.$container.height();
|
||||
let zIndex = window.getComputedStyle(this._parent.$frame[0]).getPropertyValue('z-index');
|
||||
|
||||
$((this.$container)[0].ownerDocument).find('.wcIFrameFloating').css('top', pos.top - dockerPos.top);
|
||||
$((this.$container)[0].ownerDocument).find('.wcIFrameFloating').css('left', pos.left - dockerPos.left);
|
||||
$((this.$container)[0].ownerDocument).find('.wcIFrameFloating').css('width', width);
|
||||
$((this.$container)[0].ownerDocument).find('.wcIFrameFloating').find('.wcIFrameFloating').css('height', height);
|
||||
$((this.$container)[0].ownerDocument).find('.wcIFrameFloating').attr({
|
||||
style: 'z-index: 1200'
|
||||
});
|
||||
let ele = this.$container[0].ownerDocument.querySelector('.wcIFrameFloating');
|
||||
if(ele) {
|
||||
ele.style.top = pos.top - dockerPos.top;
|
||||
ele.style.left = pos.left - dockerPos.left;
|
||||
ele.style.width = width;
|
||||
ele.style.height = height;
|
||||
ele.style.zIndex = parseInt(zIndex)+1;
|
||||
}
|
||||
}
|
||||
panel.on(wcDocker.EVENT.DETACHED, function() {
|
||||
updateIframePosition.call(this);
|
||||
});
|
||||
panel.on(wcDocker.EVENT.ORDER_CHANGED, function() {
|
||||
updateIframePosition.call(this);
|
||||
});
|
||||
}
|
||||
|
||||
@@ -537,127 +481,123 @@ export function calcFontSize(fontSize) {
|
||||
return '1em';
|
||||
}
|
||||
|
||||
export function pgHandleItemError(xhr, args) {
|
||||
export function pgHandleItemError(error, args) {
|
||||
let pgBrowser = window.pgAdmin.Browser;
|
||||
|
||||
if (!xhr || !pgBrowser) {
|
||||
if (!error || !pgBrowser) {
|
||||
return;
|
||||
}
|
||||
|
||||
let contentType = xhr.getResponseHeader('Content-Type'),
|
||||
jsonResp = contentType &&
|
||||
contentType.indexOf('application/json') == 0 &&
|
||||
JSON.parse(xhr.responseText);
|
||||
|
||||
if (
|
||||
jsonResp && (
|
||||
xhr.status == 503 ? (
|
||||
jsonResp.info == 'CONNECTION_LOST' &&
|
||||
'server' in args.info && jsonResp.data.sid >= 0 &&
|
||||
jsonResp.data.sid == args.info.server._id
|
||||
) : (
|
||||
xhr.status == 428 &&
|
||||
jsonResp.errormsg &&
|
||||
jsonResp.errormsg == gettext('Connection to the server has been lost.')
|
||||
)
|
||||
)
|
||||
) {
|
||||
if(error.response.headers['content-type'] == 'application/json') {
|
||||
let jsonResp = error.response.data;
|
||||
if (
|
||||
args.preHandleConnectionLost &&
|
||||
typeof(args.preHandleConnectionLost) == 'function'
|
||||
jsonResp && (
|
||||
error.response.status == 503 ? (
|
||||
jsonResp.info == 'CONNECTION_LOST' &&
|
||||
'server' in args.info && jsonResp.data.sid >= 0 &&
|
||||
jsonResp.data.sid == args.info.server._id
|
||||
) : (
|
||||
error.response.status == 428 &&
|
||||
jsonResp.errormsg &&
|
||||
jsonResp.errormsg == gettext('Connection to the server has been lost.')
|
||||
)
|
||||
)
|
||||
) {
|
||||
args.preHandleConnectionLost.apply(this, arguments);
|
||||
}
|
||||
if (
|
||||
args.preHandleConnectionLost &&
|
||||
typeof(args.preHandleConnectionLost) == 'function'
|
||||
) {
|
||||
args.preHandleConnectionLost.apply(this, arguments);
|
||||
}
|
||||
|
||||
// Check the status of the maintenance server connection.
|
||||
let server = pgBrowser.Nodes['server'],
|
||||
ctx = {
|
||||
resp: jsonResp,
|
||||
xhr: xhr,
|
||||
args: args,
|
||||
},
|
||||
reconnectServer = function() {
|
||||
let ctx_local = this,
|
||||
onServerConnect = function(_sid, _i, _d) {
|
||||
// Yay - server is reconnected.
|
||||
if (this.args.info.server._id == _sid) {
|
||||
pgBrowser.Events.off(
|
||||
'pgadmin:server:connected', onServerConnect
|
||||
);
|
||||
pgBrowser.Events.off(
|
||||
'pgadmin:server:connect:cancelled', onConnectCancel
|
||||
);
|
||||
// Check the status of the maintenance server connection.
|
||||
let server = pgBrowser.Nodes['server'],
|
||||
ctx = {
|
||||
resp: jsonResp,
|
||||
error: error,
|
||||
args: args,
|
||||
},
|
||||
reconnectServer = function() {
|
||||
let ctx_local = this,
|
||||
onServerConnect = function(_sid, _i, _d) {
|
||||
// Yay - server is reconnected.
|
||||
if (this.args.info.server._id == _sid) {
|
||||
pgBrowser.Events.off(
|
||||
'pgadmin:server:connected', onServerConnect
|
||||
);
|
||||
pgBrowser.Events.off(
|
||||
'pgadmin:server:connect:cancelled', onConnectCancel
|
||||
);
|
||||
|
||||
// Do we need to connect the disconnected server now?
|
||||
if (
|
||||
this.resp.data.database &&
|
||||
this.resp.data.database != _d.db
|
||||
) {
|
||||
// Server is connected now, we will need to inform the
|
||||
// database to connect it now.
|
||||
// Do we need to connect the disconnected server now?
|
||||
if (
|
||||
this.resp.data.database &&
|
||||
this.resp.data.database != _d.db
|
||||
) {
|
||||
// Server is connected now, we will need to inform the
|
||||
// database to connect it now.
|
||||
pgBrowser.Events.trigger(
|
||||
'pgadmin:database:connection:lost', this.args.item,
|
||||
this.resp, true
|
||||
);
|
||||
}
|
||||
}
|
||||
}.bind(ctx_local),
|
||||
onConnectCancel = function(_sid, _item, _data) {
|
||||
// User has cancelled the operation in between.
|
||||
if (_sid == this.args.info.server.id) {
|
||||
pgBrowser.Events.off('pgadmin:server:connected', onServerConnect);
|
||||
pgBrowser.Events.off('pgadmin:server:connect:cancelled', onConnectCancel);
|
||||
|
||||
// Connection to the database will also be cancelled
|
||||
pgBrowser.Events.trigger(
|
||||
'pgadmin:database:connection:lost', this.args.item,
|
||||
this.resp, true
|
||||
'pgadmin:database:connect:cancelled', _sid,
|
||||
this.resp.data.database || _data.db, _item, _data
|
||||
);
|
||||
}
|
||||
}
|
||||
}.bind(ctx_local),
|
||||
onConnectCancel = function(_sid, _item, _data) {
|
||||
// User has cancelled the operation in between.
|
||||
if (_sid == this.args.info.server.id) {
|
||||
pgBrowser.Events.off('pgadmin:server:connected', onServerConnect);
|
||||
pgBrowser.Events.off('pgadmin:server:connect:cancelled', onConnectCancel);
|
||||
}.bind(ctx_local);
|
||||
|
||||
// Connection to the database will also be cancelled
|
||||
pgBrowser.Events.trigger(
|
||||
'pgadmin:database:connect:cancelled', _sid,
|
||||
this.resp.data.database || _data.db, _item, _data
|
||||
);
|
||||
}
|
||||
}.bind(ctx_local);
|
||||
pgBrowser.Events.on('pgadmin:server:connected', onServerConnect);
|
||||
pgBrowser.Events.on('pgadmin:server:connect:cancelled', onConnectCancel);
|
||||
|
||||
pgBrowser.Events.on('pgadmin:server:connected', onServerConnect);
|
||||
pgBrowser.Events.on('pgadmin:server:connect:cancelled', onConnectCancel);
|
||||
// Connection to the server has been lost, we need to inform the
|
||||
// server first to take the action first.
|
||||
pgBrowser.Events.trigger(
|
||||
'pgadmin:server:connection:lost', this.args.item, this.resp
|
||||
);
|
||||
}.bind(ctx);
|
||||
|
||||
// Connection to the server has been lost, we need to inform the
|
||||
// server first to take the action first.
|
||||
pgBrowser.Events.trigger(
|
||||
'pgadmin:server:connection:lost', this.args.item, this.resp
|
||||
);
|
||||
}.bind(ctx);
|
||||
|
||||
$.ajax({
|
||||
url: server.generate_url(
|
||||
getApiInstance().get(server.generate_url(
|
||||
null, 'connect', args.info.server, true, args.info
|
||||
),
|
||||
dataType: 'json',
|
||||
})
|
||||
.done(function(res) {
|
||||
if (res.success && 'connected' in res.data) {
|
||||
if (res.data.connected) {
|
||||
// Server is connected, but - the connection with the
|
||||
// particular database has been lost.
|
||||
pgBrowser.Events.trigger(
|
||||
'pgadmin:database:connection:lost', args.item, jsonResp
|
||||
);
|
||||
return;
|
||||
))
|
||||
.then(({data: res})=>{
|
||||
if (res.success && 'connected' in res.data) {
|
||||
if (res.data.connected) {
|
||||
// Server is connected, but - the connection with the
|
||||
// particular database has been lost.
|
||||
pgBrowser.Events.trigger(
|
||||
'pgadmin:database:connection:lost', args.item, jsonResp
|
||||
);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Server was not connected, we should first try to connect
|
||||
// the server.
|
||||
reconnectServer();
|
||||
})
|
||||
.fail(function() {
|
||||
reconnectServer();
|
||||
});
|
||||
return true;
|
||||
} else if (jsonResp && jsonResp.info == 'CRYPTKEY_MISSING' && xhr.status == 503) {
|
||||
/* Suppress the error here and handle in pgNotifier wherever
|
||||
* required, as it has callback option
|
||||
*/
|
||||
return false;
|
||||
// Server was not connected, we should first try to connect
|
||||
// the server.
|
||||
reconnectServer();
|
||||
})
|
||||
.catch(()=>{
|
||||
reconnectServer();
|
||||
});
|
||||
return true;
|
||||
} else if (jsonResp && jsonResp.info == 'CRYPTKEY_MISSING' && error.response.status == 503) {
|
||||
/* Suppress the error here and handle in pgNotifier wherever
|
||||
* required, as it has callback option
|
||||
*/
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
@@ -701,4 +641,4 @@ function openWindow(toolForm, title) {
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,182 +0,0 @@
|
||||
.alert-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: $alert-icon-color;
|
||||
padding: 15px 15px 15px 17px;
|
||||
width: 50px;
|
||||
min-height: 50px;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
align-self: stretch;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.alert-row {
|
||||
display: block;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.alert-box {
|
||||
padding: 0px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.alert.alert-info,
|
||||
.alert.alert-danger {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.success-icon {
|
||||
background: $color-success;
|
||||
}
|
||||
|
||||
.error-icon {
|
||||
background: $color-danger;
|
||||
}
|
||||
|
||||
.info-icon {
|
||||
background: $color-primary;
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
display: inline-block;
|
||||
padding: 0 12px 0 10px;
|
||||
align-self: center;
|
||||
// To make sure IE picks up the correct font
|
||||
font-family: $font-family-primary;
|
||||
color: $alert-color-fg;
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
border-color: $color-primary;
|
||||
background-color: $color-primary-light;
|
||||
color : $color-fg;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
.alert-danger {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
.grid-error, .graph-error {
|
||||
.alert-row {
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.ajs-message {
|
||||
.media {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.alert, .ajs-message {
|
||||
.media {
|
||||
.media-body {
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
.alert-icon {
|
||||
display: inline-block;
|
||||
}
|
||||
.alert-text {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.error-in-grid {
|
||||
border-radius: $border-radius !important;
|
||||
background: $alert-danger-bg !important;
|
||||
color: $alert-danger-color !important;
|
||||
}
|
||||
|
||||
.pg-prop-status-bar {
|
||||
padding: 5px;
|
||||
|
||||
.media-body {
|
||||
display: flex;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.alert-icon {
|
||||
padding: 8px 8px 8px 10.5px;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
border-top-left-radius: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
min-height: auto;
|
||||
}
|
||||
|
||||
.alert-text {
|
||||
-moz-user-select: text;
|
||||
-khtml-user-select: text;
|
||||
-webkit-user-select: text;
|
||||
-ms-user-select: text;
|
||||
user-select: text;
|
||||
}
|
||||
|
||||
.error-in-footer {
|
||||
border-radius: $border-radius;
|
||||
background: $alert-danger-bg;
|
||||
border: $border-width solid $alert-danger-color;
|
||||
color: $alert-danger-color;
|
||||
}
|
||||
|
||||
.success-in-footer {
|
||||
border-radius: $border-radius;
|
||||
background: $alert-success-bg;
|
||||
border: $border-width solid $alert-success-color;
|
||||
color: $alert-success-color;
|
||||
}
|
||||
|
||||
.info-in-footer {
|
||||
border-radius: $border-radius;
|
||||
background: $alert-primary-bg;
|
||||
border: $border-width solid $alert-primary-color;
|
||||
color: $alert-primary-color;
|
||||
|
||||
.fa {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//Internet Explorer specific CSS
|
||||
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
||||
.styleguide {
|
||||
.alert-danger {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.alert-danger {
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
|
||||
/* To align 'X' in alert on login page */
|
||||
.alert-dismissable, .alert-dismissible {
|
||||
padding-right: 35px !important;
|
||||
}
|
||||
|
||||
.alert-info-panel {
|
||||
border: 2px solid $color-gray-light;
|
||||
margin-top: 2em;
|
||||
padding: 5px 5px;
|
||||
background: $color-gray-lighter;
|
||||
border-radius: 5px;
|
||||
height: 8em;
|
||||
overflow: scroll;
|
||||
}
|
||||
@@ -1,29 +0,0 @@
|
||||
.toggle.btn-xs {
|
||||
min-width: 3rem; min-height: 1.5rem;
|
||||
}
|
||||
.toggle-on.btn-xs {
|
||||
padding-right: .8rem;
|
||||
}
|
||||
.toggle-off.btn-xs {
|
||||
padding-left: .8rem;
|
||||
}
|
||||
|
||||
.btn-xs, .btn-group-xs > .btn, .btn-xs-sq {
|
||||
padding: 0.05rem 0.4rem;
|
||||
font-size: 0.76562rem;
|
||||
line-height: 1.5;
|
||||
border-radius: 0.2rem;
|
||||
}
|
||||
|
||||
.toggle input[type="checkbox"] {
|
||||
display: block;
|
||||
opacity: 0;
|
||||
margin-top: 0px !important;
|
||||
}
|
||||
|
||||
.toggle:focus-within {
|
||||
border-color: $input-focus-border-color !important;
|
||||
outline: 0;
|
||||
-webkit-box-shadow: $input-focus-box-shadow;
|
||||
box-shadow: $input-focus-box-shadow;
|
||||
}
|
||||
@@ -1,92 +0,0 @@
|
||||
/* The Bootstrap default grid layout is based on @media - window size
|
||||
* But in pgadmin4, we need to resize/make responsive elements based on panel size
|
||||
* which can be changed by wcDocker. Below code will generate pg-el-* classes
|
||||
* using the bootstrap grid classes generator. Based on el attribute of pg-el-container div,
|
||||
* the classes will apply.el attribute is set in /pgadmin4/web/pgadmin/browser/static/js/panel.js
|
||||
*
|
||||
* Code reused and customized from : bootstrap/scss/mixins/_grid-framework.scss
|
||||
*/
|
||||
|
||||
@mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) {
|
||||
// Common properties for all breakpoints
|
||||
%grid-column {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding-right: math.div($gutter, 2);
|
||||
padding-left: math.div($gutter, 2);
|
||||
}
|
||||
|
||||
@each $breakpoint in map-keys($breakpoints) {
|
||||
$infix: breakpoint-infix($breakpoint, $breakpoints);
|
||||
|
||||
// Allow columns to stretch full width below their breakpoints
|
||||
@for $i from 1 through $columns {
|
||||
.pg-el#{$infix}-#{$i} {
|
||||
@extend %grid-column;
|
||||
}
|
||||
}
|
||||
|
||||
.pg-el-container[el=xs]
|
||||
.pg-el#{$infix},
|
||||
.pg-el-container[el=xs]
|
||||
.pg-el#{$infix}-auto {
|
||||
@extend %grid-column;
|
||||
}
|
||||
|
||||
|
||||
// Provide basic `.pg-el-{bp}` classes for equal-width flexbox columns
|
||||
.pg-el-container[el=xs]
|
||||
.pg-el#{$infix} {
|
||||
flex-basis: 0;
|
||||
flex-grow: 1;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@for $i from 1 through $columns {
|
||||
.pg-el-container[el=xl] {
|
||||
.pg-el-sm-#{$i} {
|
||||
@include make-col($i, $columns);
|
||||
}
|
||||
.pg-el-md-#{$i} {
|
||||
@include make-col($i, $columns);
|
||||
}
|
||||
.pg-el-lg-#{$i} {
|
||||
@include make-col($i, $columns);
|
||||
}
|
||||
.pg-el-xl-#{$i} {
|
||||
@include make-col($i, $columns);
|
||||
}
|
||||
}
|
||||
|
||||
.pg-el-container[el=lg] {
|
||||
.pg-el-sm-#{$i} {
|
||||
@include make-col($i, $columns);
|
||||
}
|
||||
.pg-el-md-#{$i} {
|
||||
@include make-col($i, $columns);
|
||||
}
|
||||
.pg-el-lg-#{$i} {
|
||||
@include make-col($i, $columns);
|
||||
}
|
||||
}
|
||||
|
||||
.pg-el-container[el=md] {
|
||||
.pg-el-md-#{$i} {
|
||||
@include make-col($i, $columns);
|
||||
}
|
||||
.pg-el-sm-#{$i} {
|
||||
@include make-col($i, $columns);
|
||||
}
|
||||
}
|
||||
|
||||
.pg-el-container[el=sm] {
|
||||
.pg-el-sm-#{$i} {
|
||||
@include make-col($i, $columns);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@include make-grid-columns();
|
||||
@@ -221,45 +221,18 @@
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.obj_properties .backform-tab {
|
||||
position: absolute;
|
||||
margin: 0px 0px;
|
||||
padding: 0px;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
.obj_properties .backform-tab > .tab-content {
|
||||
padding: 0px;
|
||||
overflow-y: auto;
|
||||
background-color: $color-gray-light;
|
||||
}
|
||||
|
||||
.obj_properties {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.obj_properties .pgadmin-control .uneditable-input {
|
||||
border: 0px !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
-webkit-transition: none !important;
|
||||
-o-transition: none !important;
|
||||
transition: none !important;
|
||||
background-color: transparent !important;
|
||||
height: 20px;
|
||||
padding: 0px;
|
||||
margin-top: 2px;
|
||||
vertical-align: middle;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background-color: $color-gray-light;
|
||||
}
|
||||
|
||||
/* Message panel shown on browser tabs */
|
||||
.pg-panel-message {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
margin-top: 25px !important;
|
||||
padding-top: 25px !important;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
font-size: $font-size-base;
|
||||
@@ -330,78 +303,6 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.obj_properties fieldset > div > .pgadmin-control-group > label {
|
||||
min-height: 28px;
|
||||
}
|
||||
|
||||
.obj_properties fieldset > .fieldset-content {
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.obj_properties .accordian-group > .accordian-content {
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
.obj_properties .badge {
|
||||
display: block;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
background-color: $badge-header-bg;
|
||||
padding: 7px;
|
||||
font-size: inherit;
|
||||
border-bottom: $panel-border;
|
||||
border-radius: 0rem;
|
||||
border-top-left-radius: $card-border-radius;
|
||||
border-top-right-radius: $card-border-radius;
|
||||
|
||||
&.collapsed {
|
||||
border-bottom: none !important;
|
||||
border-radius: $card-border-radius;
|
||||
}
|
||||
}
|
||||
.obj_properties .badge .caret {
|
||||
display: inline-block;
|
||||
margin-left: 2px;
|
||||
margin-right: 4px;
|
||||
width: 0.7rem;
|
||||
}
|
||||
|
||||
.obj_properties .badge .caret::before {
|
||||
font-family: $font-family-icon;
|
||||
content: "\f078";
|
||||
font-size: 0.7rem;
|
||||
margin-left: 0rem;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.obj_properties .collapsed .caret::before {
|
||||
font-family: $font-family-icon;
|
||||
content: "\f054";
|
||||
font-size: 0.7rem;
|
||||
border: none;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.obj_properties table td {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.obj_properties .set-group {
|
||||
margin: 0.5rem 0rem;
|
||||
padding: 0rem;
|
||||
}
|
||||
|
||||
.obj_properties .accordian-group {
|
||||
margin: 0.5rem 0rem;
|
||||
padding: 0rem;
|
||||
border: $panel-border;
|
||||
border-radius: $card-border-radius;
|
||||
background-color: $color-bg;
|
||||
fieldset.inline-fieldset {
|
||||
background: $color-bg;
|
||||
}
|
||||
}
|
||||
|
||||
fieldset.inline-fieldset {
|
||||
padding: 10px;
|
||||
border-radius: $card-border-radius;
|
||||
@@ -797,6 +698,7 @@ body {
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
/* Security label's label column font size */
|
||||
@@ -823,10 +725,6 @@ body {
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.pg-el-container {
|
||||
background-color: $negative-bg;
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
background-color: $header-bg;
|
||||
}
|
||||
|
||||
@@ -1,127 +0,0 @@
|
||||
.select2-dropdown {
|
||||
background-color: $input-bg;
|
||||
color: $input-color;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option[aria-selected=true] {
|
||||
background-color: $select2-container-bg-selected;
|
||||
color: $select2-container-fg-selected;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option--highlighted {
|
||||
background-color: $select2-container-hover-bg !important;
|
||||
color: $select2-container-hover-fg !important;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--multiple {
|
||||
background-color: $input-bg;
|
||||
color: $input-color;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--multiple .select2-selection__choice {
|
||||
background-color: $tree-bg-selected;
|
||||
color: $tree-fg-selected;
|
||||
border: $input-border-width solid $dropdown-link-hover-bg;
|
||||
line-height: 2;
|
||||
|
||||
& .select2-selection__choice__remove {
|
||||
color: $dropdown-link-remove-color;
|
||||
margin-right: 0.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container--default .select2-search--inline .select2-search__field {
|
||||
background: transparent none repeat scroll 0% 0%;
|
||||
border: medium none;
|
||||
outline: 0px none;
|
||||
box-shadow: none;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.select2-container--default .select2-search__field {
|
||||
background-color: $input-bg;
|
||||
color: $input-color;
|
||||
}
|
||||
|
||||
.renderable > .select2-container {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.select2-container .select2-selection--single {
|
||||
height: auto;
|
||||
min-height: 28px;
|
||||
background-color: $input-bg;
|
||||
& .select2-selection__rendered{
|
||||
line-height: inherit;
|
||||
padding: $input-padding-y $input-padding-x;
|
||||
padding-right: 1.5rem;
|
||||
color: $input-color;
|
||||
}
|
||||
}
|
||||
|
||||
.select2-container--default .select2-selection--single .select2-selection__arrow {
|
||||
top: 0px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.select2-container--default.select2-container--focus {
|
||||
& .select2-selection--single,
|
||||
& .select2-selection--multiple {
|
||||
border-color: $input-focus-border-color !important;
|
||||
outline: 0;
|
||||
-webkit-box-shadow: $input-focus-box-shadow;
|
||||
box-shadow: $input-focus-box-shadow;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.select2-results span.wcTabIcon {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.select2-selection {
|
||||
color: $input-color;
|
||||
background-color: $input-bg;
|
||||
background-clip: padding-box;
|
||||
border: $input-border-width solid $input-border-color !important;
|
||||
}
|
||||
|
||||
.select2-container--default.select2-container--disabled .select2-selection--multiple {
|
||||
background-color: $input-disabled-bg !important;
|
||||
opacity: 1;
|
||||
color: $text-muted;
|
||||
}
|
||||
|
||||
.select2-container--default.select2-container--disabled .select2-selection--single {
|
||||
background-color: $input-disabled-bg !important;
|
||||
opacity: 1;
|
||||
color: $text-muted;
|
||||
}
|
||||
|
||||
.select2-container--default.select2-container--disabled .select2-selection__rendered {
|
||||
color: $text-muted;
|
||||
}
|
||||
|
||||
.select2-select-all-adapter-container {
|
||||
padding: 3px 0px;
|
||||
background-color: $color-primary;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
/* select2 readonly */
|
||||
select[readonly].select2-hidden-accessible + .select2-container {
|
||||
pointer-events: none;
|
||||
touch-action: none;
|
||||
}
|
||||
|
||||
select[readonly].select2-hidden-accessible + .select2-container .select2-selection {
|
||||
background: $select2-readonly;
|
||||
color: $text-muted;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
select[readonly].select2-hidden-accessible + .select2-container .select2-selection__arrow, select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear {
|
||||
display: none;
|
||||
}
|
||||
@@ -1,174 +0,0 @@
|
||||
.tree-icon-right:before {
|
||||
font-family: $font-family-icon;
|
||||
content: "\f054" !important;
|
||||
right: 15px;
|
||||
top: 3px;
|
||||
font-size: 0.6rem;
|
||||
line-height: 2;
|
||||
border-style: none;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.aciTree, .aciTree.aciTreeFullRow {
|
||||
& .aciTreeButton, & .aciTreePush, & .aciTreeItem, & .aciTreeIcon, & .aciTreeText, & .aciTreeColumn {
|
||||
color: $tree-text-fg;
|
||||
}
|
||||
|
||||
.aciTreeLi {
|
||||
display: grid !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.aciTreeText {
|
||||
font-family: $font-family-primary !important;
|
||||
font-size: $tree-font-size !important;
|
||||
}
|
||||
|
||||
.aciTreeUl {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.aciTreeLine {
|
||||
margin: unset !important;
|
||||
border: unset !important;
|
||||
}
|
||||
|
||||
.aciTreeSelected > .aciTreeLine {
|
||||
background: unset !important;
|
||||
background-color: $tree-bg-selected !important;
|
||||
border-color: $color-primary-light;
|
||||
border-right: $active-border !important;
|
||||
border-left: none !important;
|
||||
border-top: none !important;
|
||||
border-bottom: none !important;
|
||||
-webkit-border-radius: none !important;
|
||||
-moz-border-radius: none !important;
|
||||
border-radius: none !important;
|
||||
|
||||
& .aciTreeItem {
|
||||
background-color: $tree-bg-selected;
|
||||
border: 1px solid transparent;
|
||||
-webkit-border-radius: none !important;
|
||||
-moz-border-radius: none !important;
|
||||
border-radius: none !important;
|
||||
color: $tree-fg-selected;
|
||||
}
|
||||
|
||||
& .aciTreeText {
|
||||
color: $tree-text-hover-fg;
|
||||
}
|
||||
|
||||
& .aciTreePush {
|
||||
color: $tree-text-hover-fg;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.aciTreeItem {
|
||||
white-space: nowrap !important;
|
||||
}
|
||||
|
||||
&.aciTreeLoad {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.aciTreeLine.aciTreeHover {
|
||||
background: unset !important;
|
||||
background-color: $tree-bg-hover !important;
|
||||
-webkit-border-radius: none !important;
|
||||
-moz-border-radius: none !important;
|
||||
border-radius: none !important;
|
||||
& .aciTreeItem {
|
||||
background-color: inherit;
|
||||
border: 1px solid transparent;
|
||||
-webkit-border-radius: none !important;
|
||||
-moz-border-radius: none !important;
|
||||
border-radius: none !important;
|
||||
color: $tree-fg-hover;
|
||||
}
|
||||
|
||||
& .aciTreeText {
|
||||
color: $tree-text-hover-fg;
|
||||
}
|
||||
|
||||
& .aciTreePush {
|
||||
color: $tree-text-hover-fg;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&.aciTreeFocus {
|
||||
|
||||
& .aciTreeFocus > .aciTreeLine {
|
||||
background-color: $tree-bg-selected !important;
|
||||
border-right: $active-border !important;
|
||||
}
|
||||
|
||||
& .aciTreeSelected >.aciTreeLine .aciTreeItem {
|
||||
background-color: $tree-bg-selected;
|
||||
}
|
||||
|
||||
& .aciTreeFocus >.aciTreeLine .aciTreeItem,
|
||||
& .aciTreeSelected.aciTreeFocus >.aciTreeLine .aciTreeItem {
|
||||
border: 1px solid transparent;
|
||||
color: $tree-fg-selected;
|
||||
}
|
||||
}
|
||||
|
||||
.aciTreeButton {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.aciTreePush {
|
||||
background: none;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
font-size: 0.85em;
|
||||
}
|
||||
|
||||
.aciTreeEntry, .aciTreeBranch, &[dir=rtl] .aciTreeBranch {
|
||||
overflow:hidden;
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
.aciTreeInode>.aciTreeLine .aciTreePush {
|
||||
&:before,
|
||||
&.aciTreeHover:before {
|
||||
background-position: 6px center !important;
|
||||
font-family: $font-family-icon;
|
||||
content: "\f054" !important;
|
||||
border-style: none;
|
||||
margin-left: 5px;
|
||||
font-weight: 900;
|
||||
}
|
||||
}
|
||||
|
||||
.aciTreeLoad>.aciTreeLine .aciTreePush {
|
||||
&:before,
|
||||
&.aciTreeHover:before {
|
||||
content: " " !important;
|
||||
font-weight: 900;
|
||||
}
|
||||
}
|
||||
|
||||
.aciTreeOpen >.aciTreeLine .aciTreePush {
|
||||
&:before,
|
||||
&.aciTreeHover:before {
|
||||
background-position: -14px center !important;
|
||||
font-family: $font-family-icon;
|
||||
content: "\f078" !important;
|
||||
border-style: none;
|
||||
margin-left: 5px;
|
||||
font-weight: 900;
|
||||
}
|
||||
}
|
||||
|
||||
.aciTreePush>span {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
left: 2px;
|
||||
background: $loader-icon-small 0 0 no-repeat;
|
||||
background-color: inherit!important;
|
||||
}
|
||||
}
|
||||
@@ -40,7 +40,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* darken % taken from bootstrap - button_variant */
|
||||
.wcFrameButton:hover, .wcFrameButtonHover, .wcFrameButton:focus {
|
||||
background-color: $btn-frame-close-bg;
|
||||
}
|
||||
|
||||
@@ -20,13 +20,8 @@ $theme-colors: (
|
||||
@import "bootstrap/scss/bootstrap";
|
||||
@import 'webcabin.pgadmin';
|
||||
@import 'bootstrap.overrides';
|
||||
@import 'tree.overrides';
|
||||
@import 'select2.overrides';
|
||||
@import 'codemirror.overrides';
|
||||
@import 'alert';
|
||||
@import 'pgadmin.grid';
|
||||
@import 'pgadmin.style';
|
||||
@import 'bootstrap4-toggle.overrides';
|
||||
@import 'jsoneditor.overrides';
|
||||
@import 'rc-dock/dist/rc-dock.css';
|
||||
@import '@szhsin/react-menu/dist/index.css';
|
||||
|
||||
@@ -327,17 +327,6 @@ $schemadiff-source-row-color: #ffebee !default;
|
||||
$schemadiff-target-row-color: #fbe3bf !default;
|
||||
$schema-diff-color-fg: $input-color !default;
|
||||
|
||||
/* Custom controls bootstrap changes */
|
||||
$custom-forms-transition: none, none, none;
|
||||
$custom-control-indicator-focus-border-color: $input-focus-border-color !default;
|
||||
$custom-control-indicator-border-color: $input-border-color !default;
|
||||
|
||||
$select2-container-hover-bg: $tree-bg-hover !default;
|
||||
$select2-container-hover-fg: $tree-fg-hover !default;
|
||||
$select2-container-bg-selected: $tree-bg-selected !default;
|
||||
$select2-container-fg-selected: $tree-fg-selected !default;
|
||||
$select2-placeholder: #575757 !default;
|
||||
|
||||
$btn-primary-icon-bg: $color-bg !default;
|
||||
$btn-primary-icon-fg: $color-fg !default;
|
||||
$btn-primary-icon-hover-fg: $color-fg !default;
|
||||
@@ -372,11 +361,13 @@ $login-page-background: $color-primary !default;
|
||||
}
|
||||
$erd-bg-grid: url("data:image/svg+xml, %3Csvg width='100%25' viewBox='0 0 45 45' style='background-color:#{url-friendly-colour($erd-canvas-bg)}' height='100%25' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3Cpattern id='smallGrid' width='15' height='15' patternUnits='userSpaceOnUse'%3E%3Cpath d='M 15 0 L 0 0 0 15' fill='none' stroke='#{url-friendly-colour($erd-canvas-grid)}' stroke-width='0.5'/%3E%3C/pattern%3E%3Cpattern id='grid' width='45' height='45' patternUnits='userSpaceOnUse'%3E%3Crect width='100' height='100' fill='url(%23smallGrid)'/%3E%3Cpath d='M 100 0 L 0 0 0 100' fill='none' stroke='#{url-friendly-colour($erd-canvas-grid)}' stroke-width='1'/%3E%3C/pattern%3E%3C/defs%3E%3Crect width='100%25' height='100%25' fill='url(%23grid)' /%3E%3C/svg%3E%0A");
|
||||
|
||||
$select2-readonly: $color-gray-lighter !default;
|
||||
|
||||
// psql tool variables
|
||||
$psql-background: $color-bg !default;
|
||||
$psql-foreground: $color-fg !default;
|
||||
$psql-cursor: $color-fg !default;
|
||||
$psql-cursorAccent: $color-fg !default;
|
||||
$psql-selection: #326690 !default;
|
||||
|
||||
|
||||
/* After removing bootstrap */
|
||||
$dropdown-border-radius: 4px;
|
||||
|
||||
@@ -126,8 +126,6 @@ $color-success-hover-fg: $color-fg;
|
||||
|
||||
$datagrid-selected-color: $color-primary-fg;
|
||||
|
||||
$select2-placeholder: #999;
|
||||
|
||||
$span-text-color: #9D9FA1 !default;
|
||||
$span-text-color-hover: $white !default;
|
||||
$quick-search-a-text-color: $white !default;
|
||||
@@ -141,8 +139,6 @@ $erd-canvas-grid: #444952;
|
||||
$erd-link-color: $color-fg;
|
||||
$erd-link-selected-color: $color-fg;
|
||||
|
||||
$select2-readonly: $color-bg;
|
||||
|
||||
// psql tool variables
|
||||
$psql-background: $color-bg;
|
||||
$psql-foreground: $color-fg;
|
||||
|
||||
@@ -137,12 +137,6 @@ $tree-bg-hover: $color-fg;
|
||||
$tree-fg-selected: $color-fg;
|
||||
$tree-bg-selected: $color-primary-light;
|
||||
|
||||
$select2-container-hover-bg: $color-primary;
|
||||
$select2-container-hover-fg: $color-bg;
|
||||
$select2-container-bg-selected: $color-fg;
|
||||
$select2-container-fg-selected: $color-bg;
|
||||
$select2-placeholder: #999;
|
||||
|
||||
$sql-hint-active-fg: $color-bg;
|
||||
|
||||
$btn-primary-hover-bg: $color-fg;
|
||||
@@ -181,9 +175,6 @@ $card-header-border-color: $card-header-bg;
|
||||
$card-border-color: transparent;
|
||||
$card-bg: $color-gray;
|
||||
|
||||
$custom-control-indicator-focus-border-color: #FFFFFF !important;
|
||||
$custom-control-indicator-border-color: $color-gray-lighter;
|
||||
|
||||
$panel-color-fg: $color-ternary;
|
||||
$panel-border-color: $color-gray;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user