From 6b9d3a4e8351e662c4586b24bb152de78ae9e3bf Mon Sep 17 00:00:00 2001 From: GitLab Bot Date: Wed, 29 Jan 2020 18:08:47 +0000 Subject: Add latest changes from gitlab-org/gitlab@master --- app/assets/javascripts/editor/editor_lite.js | 68 ++++++++++++++++++++++++++++ app/assets/javascripts/editor/utils.js | 11 +++++ 2 files changed, 79 insertions(+) create mode 100644 app/assets/javascripts/editor/editor_lite.js create mode 100644 app/assets/javascripts/editor/utils.js (limited to 'app/assets/javascripts/editor') diff --git a/app/assets/javascripts/editor/editor_lite.js b/app/assets/javascripts/editor/editor_lite.js new file mode 100644 index 00000000000..bdfbcf71267 --- /dev/null +++ b/app/assets/javascripts/editor/editor_lite.js @@ -0,0 +1,68 @@ +import { editor as monacoEditor, languages as monacoLanguages, Uri } from 'monaco-editor'; +import gitlabTheme from '~/ide/lib/themes/gl_theme'; +import { defaultEditorOptions } from '~/ide/lib/editor_options'; +import { clearDomElement } from './utils'; + +export default class Editor { + constructor(options = {}) { + this.editorEl = null; + this.blobContent = ''; + this.blobPath = ''; + this.instance = null; + this.model = null; + this.options = { + ...defaultEditorOptions, + ...options, + }; + + Editor.setupMonacoTheme(); + } + + static setupMonacoTheme() { + monacoEditor.defineTheme(gitlabTheme.themeName, gitlabTheme.monacoTheme); + monacoEditor.setTheme('gitlab'); + } + + createInstance({ el = undefined, blobPath = '', blobContent = '' } = {}) { + if (!el) return; + this.editorEl = el; + this.blobContent = blobContent; + this.blobPath = blobPath; + + clearDomElement(this.editorEl); + + this.model = monacoEditor.createModel( + this.blobContent, + undefined, + new Uri('gitlab', false, this.blobPath), + ); + + monacoEditor.onDidCreateEditor(this.renderEditor.bind(this)); + + this.instance = monacoEditor.create(this.editorEl, this.options); + this.instance.setModel(this.model); + } + + dispose() { + return this.instance && this.instance.dispose(); + } + + renderEditor() { + delete this.editorEl.dataset.editorLoading; + } + + updateModelLanguage(path) { + if (path === this.blobPath) return; + this.blobPath = path; + const ext = `.${path.split('.').pop()}`; + const language = monacoLanguages + .getLanguages() + .find(lang => lang.extensions.indexOf(ext) !== -1); + const id = language ? language.id : 'plaintext'; + monacoEditor.setModelLanguage(this.model, id); + } + + getValue() { + return this.model.getValue(); + } +} diff --git a/app/assets/javascripts/editor/utils.js b/app/assets/javascripts/editor/utils.js new file mode 100644 index 00000000000..d8b6396b671 --- /dev/null +++ b/app/assets/javascripts/editor/utils.js @@ -0,0 +1,11 @@ +export const clearDomElement = el => { + if (!el || !el.firstChild) return; + + while (el.firstChild) { + el.removeChild(el.firstChild); + } +}; + +export default () => ({ + clearDomElement, +}); -- cgit v1.2.3