diff options
Diffstat (limited to 'app/assets/javascripts/snippet')
-rw-r--r-- | app/assets/javascripts/snippet/snippet_bundle.js | 30 | ||||
-rw-r--r-- | app/assets/javascripts/snippet/snippet_edit.js | 35 | ||||
-rw-r--r-- | app/assets/javascripts/snippet/snippet_embed.js | 37 | ||||
-rw-r--r-- | app/assets/javascripts/snippet/snippet_show.js | 28 |
4 files changed, 14 insertions, 116 deletions
diff --git a/app/assets/javascripts/snippet/snippet_bundle.js b/app/assets/javascripts/snippet/snippet_bundle.js deleted file mode 100644 index 76a1f6d1458..00000000000 --- a/app/assets/javascripts/snippet/snippet_bundle.js +++ /dev/null @@ -1,30 +0,0 @@ -import { initEditorLite } from '~/blob/utils'; -import setupCollapsibleInputs from './collapsible_input'; - -let editor; - -const initMonaco = () => { - const editorEl = document.getElementById('editor'); - const contentEl = document.querySelector('.snippet-file-content'); - const fileNameEl = document.querySelector('.js-snippet-file-name'); - const form = document.querySelector('.snippet-form-holder form'); - - editor = initEditorLite({ - el: editorEl, - blobPath: fileNameEl.value, - blobContent: contentEl.value, - }); - - fileNameEl.addEventListener('change', () => { - editor.updateModelLanguage(fileNameEl.value); - }); - - form.addEventListener('submit', () => { - contentEl.value = editor.getValue(); - }); -}; - -export default () => { - initMonaco(); - setupCollapsibleInputs(); -}; diff --git a/app/assets/javascripts/snippet/snippet_edit.js b/app/assets/javascripts/snippet/snippet_edit.js index 3dc74922a77..88677ddd15f 100644 --- a/app/assets/javascripts/snippet/snippet_edit.js +++ b/app/assets/javascripts/snippet/snippet_edit.js @@ -1,33 +1,6 @@ -import $ from 'jquery'; -import initSnippet from '~/snippet/snippet_bundle'; import ZenMode from '~/zen_mode'; -import GLForm from '~/gl_form'; -import { SnippetEditInit } from '~/snippets'; +import SnippetsEdit from '~/snippets/components/edit.vue'; +import SnippetsAppFactory from '~/snippets'; -document.addEventListener('DOMContentLoaded', () => { - const form = document.querySelector('.snippet-form'); - const personalSnippetOptions = { - members: false, - issues: false, - mergeRequests: false, - epics: false, - milestones: false, - labels: false, - snippets: false, - vulnerabilities: false, - }; - const projectSnippetOptions = {}; - - const options = - form.dataset.snippetType === 'project' || form.dataset.projectPath - ? projectSnippetOptions - : personalSnippetOptions; - - if (gon?.features?.snippetsEditVue) { - SnippetEditInit(); - } else { - initSnippet(); - new GLForm($(form), options); // eslint-disable-line no-new - } - new ZenMode(); // eslint-disable-line no-new -}); +SnippetsAppFactory(document.getElementById('js-snippet-edit'), SnippetsEdit); +new ZenMode(); // eslint-disable-line no-new diff --git a/app/assets/javascripts/snippet/snippet_embed.js b/app/assets/javascripts/snippet/snippet_embed.js deleted file mode 100644 index 65dd62f6af9..00000000000 --- a/app/assets/javascripts/snippet/snippet_embed.js +++ /dev/null @@ -1,37 +0,0 @@ -import { __ } from '~/locale'; -import { parseUrlPathname, parseUrl } from '../lib/utils/common_utils'; - -function swapActiveState(activateBtn, deactivateBtn) { - activateBtn.classList.add('is-active'); - deactivateBtn.classList.remove('is-active'); -} - -export default () => { - const shareBtn = document.querySelector('.js-share-btn'); - - if (shareBtn) { - const embedBtn = document.querySelector('.js-embed-btn'); - const snippetUrlArea = document.querySelector('.js-snippet-url-area'); - const embedAction = document.querySelector('.js-embed-action'); - const dataUrl = snippetUrlArea.getAttribute('data-url'); - - snippetUrlArea.addEventListener('click', () => snippetUrlArea.select()); - - shareBtn.addEventListener('click', () => { - swapActiveState(shareBtn, embedBtn); - snippetUrlArea.value = dataUrl; - embedAction.innerText = __('Share'); - }); - - embedBtn.addEventListener('click', () => { - const parser = parseUrl(dataUrl); - const url = `${parser.origin + parseUrlPathname(dataUrl)}`; - const params = parser.search; - const scriptTag = `<script src="${url}.js${params}"></script>`; - - swapActiveState(embedBtn, shareBtn); - snippetUrlArea.value = scriptTag; - embedAction.innerText = __('Embed'); - }); - } -}; diff --git a/app/assets/javascripts/snippet/snippet_show.js b/app/assets/javascripts/snippet/snippet_show.js index bbddfc579c5..caa76fc9988 100644 --- a/app/assets/javascripts/snippet/snippet_show.js +++ b/app/assets/javascripts/snippet/snippet_show.js @@ -1,21 +1,13 @@ -import LineHighlighter from '~/line_highlighter'; -import BlobViewer from '~/blob/viewer'; -import ZenMode from '~/zen_mode'; import initNotes from '~/init_notes'; -import snippetEmbed from '~/snippet/snippet_embed'; -import { SnippetShowInit } from '~/snippets'; import loadAwardsHandler from '~/awards_handler'; +import SnippetsShow from '~/snippets/components/show.vue'; +import SnippetsAppFactory from '~/snippets'; +import ZenMode from '~/zen_mode'; + +SnippetsAppFactory(document.getElementById('js-snippet-view'), SnippetsShow); + +initNotes(); +loadAwardsHandler(); -document.addEventListener('DOMContentLoaded', () => { - if (!gon.features.snippetsVue) { - new LineHighlighter(); // eslint-disable-line no-new - new BlobViewer(); // eslint-disable-line no-new - initNotes(); - new ZenMode(); // eslint-disable-line no-new - snippetEmbed(); - } else { - SnippetShowInit(); - initNotes(); - } - loadAwardsHandler(); -}); +// eslint-disable-next-line no-new +new ZenMode(); |