diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-04-21 02:50:22 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-04-21 02:50:22 +0300 |
commit | 9dc93a4519d9d5d7be48ff274127136236a3adb3 (patch) | |
tree | 70467ae3692a0e35e5ea56bcb803eb512a10bedb /app/assets/javascripts/editor | |
parent | 4b0f34b6d759d6299322b3a54453e930c6121ff0 (diff) |
Add latest changes from gitlab-org/gitlab@13-11-stable-eev13.11.0-rc43
Diffstat (limited to 'app/assets/javascripts/editor')
-rw-r--r-- | app/assets/javascripts/editor/extensions/editor_lite_extension_base.js | 76 |
1 files changed, 75 insertions, 1 deletions
diff --git a/app/assets/javascripts/editor/extensions/editor_lite_extension_base.js b/app/assets/javascripts/editor/extensions/editor_lite_extension_base.js index 8d350068973..3d4f08131c1 100644 --- a/app/assets/javascripts/editor/extensions/editor_lite_extension_base.js +++ b/app/assets/javascripts/editor/extensions/editor_lite_extension_base.js @@ -1,11 +1,85 @@ -import { ERROR_INSTANCE_REQUIRED_FOR_EXTENSION } from '../constants'; +import { Range } from 'monaco-editor'; +import { ERROR_INSTANCE_REQUIRED_FOR_EXTENSION, EDITOR_TYPE_CODE } from '../constants'; + +const hashRegexp = new RegExp('#?L', 'g'); + +const createAnchor = (href) => { + const fragment = new DocumentFragment(); + const el = document.createElement('a'); + el.classList.add('link-anchor'); + el.href = href; + fragment.appendChild(el); + el.addEventListener('contextmenu', (e) => { + e.stopPropagation(); + }); + return fragment; +}; export class EditorLiteExtension { constructor({ instance, ...options } = {}) { if (instance) { Object.assign(instance, options); + EditorLiteExtension.highlightLines(instance); + if (instance.getEditorType && instance.getEditorType() === EDITOR_TYPE_CODE) { + EditorLiteExtension.setupLineLinking(instance); + } } else if (Object.entries(options).length) { throw new Error(ERROR_INSTANCE_REQUIRED_FOR_EXTENSION); } } + + static highlightLines(instance) { + const { hash } = window.location; + if (!hash) { + return; + } + const [start, end] = hash.replace(hashRegexp, '').split('-'); + let startLine = start ? parseInt(start, 10) : null; + let endLine = end ? parseInt(end, 10) : startLine; + if (endLine < startLine) { + [startLine, endLine] = [endLine, startLine]; + } + if (startLine) { + window.requestAnimationFrame(() => { + instance.revealLineInCenter(startLine); + Object.assign(instance, { + lineDecorations: instance.deltaDecorations( + [], + [ + { + range: new Range(startLine, 1, endLine, 1), + options: { isWholeLine: true, className: 'active-line-text' }, + }, + ], + ), + }); + }); + } + } + + static onMouseMoveHandler(e) { + const target = e.target.element; + if (target.classList.contains('line-numbers')) { + const lineNum = e.target.position.lineNumber; + const hrefAttr = `#L${lineNum}`; + let el = target.querySelector('a'); + if (!el) { + el = createAnchor(hrefAttr); + target.appendChild(el); + } + } + } + + static setupLineLinking(instance) { + instance.onMouseMove(EditorLiteExtension.onMouseMoveHandler); + instance.onMouseDown((e) => { + const isCorrectAnchor = e.target.element.classList.contains('link-anchor'); + if (!isCorrectAnchor) { + return; + } + if (instance.lineDecorations) { + instance.deltaDecorations(instance.lineDecorations, []); + } + }); + } } |