diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-03-09 09:07:45 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-03-09 09:07:45 +0000 |
commit | f4186a753b86625a83e8499af14b5badd63a2ac2 (patch) | |
tree | b960dd9f4255e9eee9f87d28e853f163836aa4c5 /app/assets/javascripts/blob | |
parent | 0221116862ee66024a03492b4fbbe4e069d84303 (diff) | |
download | gitlab-ce-f4186a753b86625a83e8499af14b5badd63a2ac2.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/blob')
-rw-r--r-- | app/assets/javascripts/blob/components/blob_edit_content.vue | 49 | ||||
-rw-r--r-- | app/assets/javascripts/blob/utils.js | 24 |
2 files changed, 73 insertions, 0 deletions
diff --git a/app/assets/javascripts/blob/components/blob_edit_content.vue b/app/assets/javascripts/blob/components/blob_edit_content.vue new file mode 100644 index 00000000000..83303a373f3 --- /dev/null +++ b/app/assets/javascripts/blob/components/blob_edit_content.vue @@ -0,0 +1,49 @@ +<script> +import { initEditorLite } from '~/blob/utils'; + +export default { + props: { + value: { + type: String, + required: true, + }, + fileName: { + type: String, + required: false, + default: '', + }, + }, + data() { + return { + content: this.value, + editor: null, + }; + }, + watch: { + fileName(newVal) { + this.editor.updateModelLanguage(newVal); + }, + }, + mounted() { + this.editor = initEditorLite({ + el: this.$refs.editor, + blobPath: this.fileName, + blobContent: this.content, + }); + }, + methods: { + triggerFileChange() { + const val = this.editor.getValue(); + this.content = val; + this.$emit('input', val); + }, + }, +}; +</script> +<template> + <div class="file-content code"> + <pre id="editor" ref="editor" data-editor-loading @focusout="triggerFileChange">{{ + content + }}</pre> + </div> +</template> diff --git a/app/assets/javascripts/blob/utils.js b/app/assets/javascripts/blob/utils.js new file mode 100644 index 00000000000..dc2ec642e59 --- /dev/null +++ b/app/assets/javascripts/blob/utils.js @@ -0,0 +1,24 @@ +/* global ace */ +import Editor from '~/editor/editor_lite'; + +export function initEditorLite({ el, blobPath, blobContent }) { + if (!el) { + throw new Error(`"el" parameter is required to initialize Editor`); + } + let editor; + + if (window?.gon?.features?.monacoSnippets) { + editor = new Editor(); + editor.createInstance({ + el, + blobPath, + blobContent, + }); + } else { + editor = ace.edit(el); + } + + return editor; +} + +export default () => ({}); |