kui-shell
Version:
This is the monorepo for Kui, the hybrid command-line/GUI electron-based Kubernetes tool
197 lines • 8.78 kB
JavaScript
;
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
Object.defineProperty(exports, "__esModule", { value: true });
const debug_1 = require("debug");
const path_1 = require("path");
const events_1 = require("events");
const ui_1 = require("@kui-shell/core/api/ui");
const models_1 = require("@kui-shell/core/api/models");
const capabilities_1 = require("@kui-shell/core/api/capabilities");
const strings_1 = require("./strings");
const file_types_1 = require("./file-types");
const debug = debug_1.default('plugins/editor/open');
const setText = (editor, options, execOptions) => ({ code, kind }) => {
const lang = (options && options.language) || file_types_1.language(kind);
debug('setText language', kind, lang);
debug('setText code', code.substring(0, 20));
const oldModel = editor.getModel();
const newModel = global['monaco'].editor.createModel(code, lang);
editor.setModel(newModel);
if (!execOptions || !execOptions.cursorPosition || execOptions.cursorPosition === 'end') {
editor.setPosition(editor.getModel().getPositionAt((code && code.length) || 0));
}
if (oldModel) {
oldModel.dispose();
}
return code;
};
let pre = false;
let pre2 = false;
const injectTheme = () => {
if (pre) {
debug('skipping injectTheme', pre);
return;
}
debug('injectTheme');
const key = `kui.editor.theme`;
try {
ui_1.default.injectCSS({
css: require('@kui-shell/plugin-editor/web/css/theme-alignment.css').toString(),
key
});
}
catch (err) {
const ourRoot = path_1.dirname(require.resolve('@kui-shell/plugin-editor/package.json'));
ui_1.default.injectCSS({ key, path: path_1.join(ourRoot, 'web/css/theme-alignment.css') });
}
};
exports.preload = () => {
setTimeout(() => {
injectTheme();
pre = true;
}, 0);
};
exports.openEditor = (tab, name, options, execOptions) => __awaiter(void 0, void 0, void 0, function* () {
debug('openEditor');
const custom = execOptions.custom;
const getEntityFn = (custom && custom.getEntity) || models_1.default.Selection.current;
let currentEntity = getEntityFn(tab);
const getEntity = () => currentEntity;
const entityRightNow = currentEntity;
const kind = entityRightNow && ((entityRightNow.exec && entityRightNow.exec.kind) || entityRightNow.contentType);
if (kind === 'yaml' || kind === 'json') {
options.showFoldingControls = 'always';
}
if (!pre2) {
if (!capabilities_1.default.inBrowser()) {
const monacoRoot = path_1.dirname(require.resolve('monaco-editor/package.json'));
ui_1.default.injectScript(path_1.join(monacoRoot, 'min/vs/loader.js'));
}
try {
ui_1.default.injectCSS({
css: require('@kui-shell/plugin-editor/web/css/editor.css').toString(),
key: 'editor.editor'
});
}
catch (err) {
const ourRoot = path_1.dirname(require.resolve('@kui-shell/plugin-editor/package.json'));
ui_1.default.injectCSS(path_1.join(ourRoot, 'web/css/editor.css'));
}
pre2 = true;
}
const content = document.createElement('div');
const editorWrapper = document.createElement('div');
editorWrapper.className = 'monaco-editor-wrapper';
content.appendChild(editorWrapper);
if (!options.readOnly) {
editorWrapper.focus();
}
const theme = getComputedStyle(document.body);
editorWrapper['baseFontSize'] = parseInt(theme.getPropertyValue('font-size').replace(/px$/, ''), 10) * 0.875;
content.onclick = evt => {
evt.stopPropagation();
};
injectTheme();
const makeUpdater = (editor) => {
editor.updateText = (entity) => {
return setText(editor, options)(entity.exec);
};
editor['clearDecorations'] = () => {
const none = [{ range: new global['monaco'].Range(1, 1, 1, 1), options: {} }];
editor['__cloudshell_decorations'] = editor.deltaDecorations(editor['__cloudshell_decorations'] || [], none);
};
editorWrapper['editor'] = editor;
return (entity) => {
debug('updater', entity);
const eventBus = new events_1.EventEmitter();
setText(editor, options, execOptions)(entity['exec']);
content.classList.add('code-highlighting');
currentEntity = entity;
const status = document.createElement('div');
const isNew = document.createElement('div');
const isNewReadOnly = document.createElement('div');
const upToDate = document.createElement('div');
const modified = document.createElement('div');
status.appendChild(isNew);
status.appendChild(isNewReadOnly);
status.appendChild(upToDate);
status.appendChild(modified);
isNew.innerHTML = strings_1.default.isNew;
isNewReadOnly.innerHTML = strings_1.default.isNewReadOnly;
upToDate.innerHTML = strings_1.default.isUpToDate;
modified.innerHTML = strings_1.default.isModified;
status.className = 'editor-status';
if (options.readOnly) {
debug('status:is-read-only');
status.classList.add('is-read-only');
}
if (entity['isNew']) {
debug('status:is-new');
status.classList.add('is-new');
}
else {
debug('status:is-up-to-date');
status.classList.add('is-up-to-date');
}
isNew.className = 'is-new';
isNewReadOnly.className = 'is-new-read-only';
upToDate.className = 'is-up-to-date';
modified.className = 'is-modified';
const toolbarText = new ui_1.default.ToolbarText('info', status);
const updateHeader = (isModified) => {
if (!execOptions.noSidecarHeader) {
debug('updateHeader', isModified, currentEntity);
toolbarText.type = isModified ? 'warning' : 'info';
status.classList.remove('is-modified');
status.classList.remove('is-up-to-date');
status.classList.remove('is-new');
if (currentEntity.isNew) {
status.classList.add('is-new');
}
else if (isModified) {
status.classList.add('is-modified');
}
else {
status.classList.add('is-up-to-date');
}
toolbarText.refresh();
}
};
const editsInProgress = () => {
debug('editsInProgress');
editor['clearDecorations']();
eventBus.emit('/editor/change', {});
updateHeader(true);
};
const editsCommitted = (entity, opts) => {
debug('editsCommited', opts, entity);
status.classList.remove('is-new');
entity.persister = currentEntity.persister;
currentEntity = entity;
debug('status:is-up-to-date');
updateHeader(false);
if (opts.event === 'revert') {
editor.getModel().onDidChangeContent(editsInProgress);
}
};
eventBus.on('/editor/save', editsCommitted);
editor.getModel().onDidChangeContent(editsInProgress);
updateHeader(false);
return Promise.resolve({ getEntity, editor, content, eventBus, toolbarText });
};
};
const initEditor = capabilities_1.default.inBrowser()
? (yield Promise.resolve().then(() => require('./init/esm'))).default
: (yield Promise.resolve().then(() => require('./init/amd'))).default;
return initEditor(editorWrapper, options).then(makeUpdater);
});
exports.default = exports.openEditor;
//# sourceMappingURL=open.js.map