jquery and webpack changed

4 files changed, 26 insertions, 23 deletions

diff --git a/app/assets/javascripts/pages/projects/snippets/show/index.js b/app/assets/javascripts/pages/projects/snippets/show/index.js
index a134599cb04..d85cb6439ee 100644
--- a/app/assets/javascripts/pages/projects/snippets/show/index.js
+++ b/app/assets/javascripts/pages/projects/snippets/show/index.js
@@ -2,10 +2,12 @@ import initNotes from '~/init_notes';
 import ZenMode from '~/zen_mode';
 import LineHighlighter from '../../../../line_highlighter';
 import BlobViewer from '../../../../blob/viewer';
+import snippetEmbed from '../../../../snippet/snippet_embed';
 
 document.addEventListener('DOMContentLoaded', () => {
   new LineHighlighter(); // eslint-disable-line no-new
   new BlobViewer(); // eslint-disable-line no-new
   initNotes();
   new ZenMode(); // eslint-disable-line no-new
+  snippetEmbed();
 });
diff --git a/app/assets/javascripts/pages/snippets/show/index.js b/app/assets/javascripts/pages/snippets/show/index.js
index f548b9fad65..e3eded8ab9d 100644
--- a/app/assets/javascripts/pages/snippets/show/index.js
+++ b/app/assets/javascripts/pages/snippets/show/index.js
@@ -2,10 +2,12 @@ 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';
 
 document.addEventListener('DOMContentLoaded', () => {
   new LineHighlighter(); // eslint-disable-line no-new
   new BlobViewer(); // eslint-disable-line no-new
   initNotes();
   new ZenMode(); // eslint-disable-line no-new
+  snippetEmbed();
 });
diff --git a/app/assets/javascripts/snippet/snippet_embed.js b/app/assets/javascripts/snippet/snippet_embed.js
index dc808b68123..872a04555a9 100644
--- a/app/assets/javascripts/snippet/snippet_embed.js
+++ b/app/assets/javascripts/snippet/snippet_embed.js
@@ -1,22 +1,24 @@
-(() => {
-  $(() => {
-    const { protocol, host, pathname } = location;
+export default () => {
+  const { protocol, host, pathname } = location;
+  const shareBtn = document.querySelector('#share-btn');
+  const embedBtn = document.querySelector('#embed-btn');
+  const snippetUrlArea = document.querySelector('#snippet-url-area');
+  const embedAction = document.querySelector('#embed-action');
 
-    $('#share-btn').click((event) => {
-      event.preventDefault();
-      $('#share-btn').addClass('is-active');
-      $('#embed-btn').removeClass('is-active');
-      $('#snippet-url-area').val(`${protocol}//${host + pathname}`);
-      $('#embed-action').html('Share');
-    });
+  shareBtn.addEventListener('click', (event) => {
+    event.preventDefault();
+    shareBtn.classList.add('is-active');
+    embedBtn.classList.remove('is-active');
+    snippetUrlArea.value = `${protocol}//${host + pathname}`;
+    embedAction.innerHTML = 'Share';
+  });
 
-    $('#embed-btn').click((event) => {
-      event.preventDefault();
-      $('#embed-btn').addClass('is-active');
-      $('#share-btn').removeClass('is-active');
-      const scriptTag = `<script src="${protocol}//${host + pathname}.js"></script>`;
-      $('#snippet-url-area').val(scriptTag);
-      $('#embed-action').html('Embed');
-    });
+  embedBtn.addEventListener('click', (event) => {
+    event.preventDefault();
+    embedBtn.classList.add('is-active');
+    shareBtn.classList.remove('is-active');
+    const scriptTag = `<script src="${protocol}//${host + pathname}.js"></script>`;
+    snippetUrlArea.value = scriptTag;
+    embedAction.innerHTML = 'Embed';
   });
-}).call(window);
+};
diff --git a/app/views/shared/snippets/_header.html.haml b/app/views/shared/snippets/_header.html.haml
index b5ce5fec04d..53d5416d120 100644
--- a/app/views/shared/snippets/_header.html.haml
+++ b/app/views/shared/snippets/_header.html.haml
@@ -1,6 +1,3 @@
-- content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('snippet_embed')
-
 .detail-page-header
   .detail-page-header-body
     .snippet-box.has-tooltip.inline.append-right-5{ title: snippet_visibility_level_description(@snippet.visibility_level, @snippet), data: { container: "body" } }
@@ -36,7 +33,7 @@
     .embed-snippet
       .input-group
         .input-group-btn
-          %a.btn.embed-toggle{ 'data-toggle': 'dropdown' }
+          %button.btn.embed-toggle{ 'data-toggle': 'dropdown' }
             %span#embed-action Embed
             = sprite_icon('angle-down', size: 12)
           %ul.dropdown-menu.dropdown-menu-selectable.embed-toggle-list