Add latest changes from gitlab-org/gitlab@master

2 files changed, 79 insertions, 0 deletions

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,
+});