Removed inline JS in shared HAML files

app/assets/javascripts/dispatcher.js

@@ -27,6 +27,10 @@
 /* global Shortcuts */
 /* global Sidebar */
 /* global ShortcutsWiki */
+/* global IssuableContext */
+/* global IssueStatusSelect */
+/* global SubscriptionSelect */
+/* global Notes */
 import Issue from './issue';
 import BindInOut from './behaviors/bind_in_out';
@@ -126,6 +130,42 @@ import PerformanceBar from './performance_bar';
           .init();
       }
+      function initIssuableSidebar() {
+        new MilestoneSelect({
+          full_path: gl.sidebarOptions.fullPath,
+        });
+        new LabelsSelect();
+        new IssuableContext(gl.sidebarOptions.currentUser);
+        gl.Subscription.bindAll('.subscription');
+        new gl.DueDateSelectors();
+        window.sidebar = new Sidebar();
+      }
+
+      function initLegacyFilters() {
+        new UsersSelect();
+        new LabelsSelect();
+        new MilestoneSelect();
+        new IssueStatusSelect();
+        new SubscriptionSelect();
+        $('form.filter-form').on('submit', function (event) {
+          event.preventDefault();
+          gl.utils.visitUrl(`${this.action}&${$(this).serialize()}`);
+        });
+      }
+
+      function initNotes() {
+        const dataEl = document.querySelector('.js-notes-data');
+        const {
+          notesUrl,
+          notesIds,
+          now,
+          diffView,
+          autocomplete,
+        } = JSON.parse(dataEl.innerHTML);
+
+        window.notes = new Notes(notesUrl, notesIds, now, diffView, autocomplete);
+      }
+
       switch (page) {
         case 'profiles:preferences:show':
           initExperimentalFlags();
@@ -156,6 +196,8 @@ import PerformanceBar from './performance_bar';
           new Issue();
           shortcut_handler = new ShortcutsIssuable();
           new ZenMode();
+          initIssuableSidebar();
+          initNotes();
           break;
         case 'dashboard:milestones:index':
           new ProjectSelect();
@@ -166,10 +208,12 @@ import PerformanceBar from './performance_bar';
           new Milestone();
           new Sidebar();
           break;
+        case 'dashboard:issues':
+        case 'dashboard:merge_requests':
         case 'groups:issues':
         case 'groups:merge_requests':
-          new UsersSelect();
           new ProjectSelect();
+          initLegacyFilters();
           break;
         case 'dashboard:todos:index':
           new Todos();
@@ -237,6 +281,9 @@ import PerformanceBar from './performance_bar';
           new gl.GLForm($('.tag-form'), true);
           new RefSelectDropdown($('.js-branch-select'), window.gl.availableRefs);
           break;
+        case 'projects:snippets:show':
+          initNotes();
+          break;
         case 'projects:snippets:new':
         case 'projects:snippets:edit':
         case 'projects:snippets:create':
@@ -253,19 +300,17 @@ import PerformanceBar from './performance_bar';
           new ZenMode();
           new gl.GLForm($('.release-form'), true);
           break;
+        case 'projects:merge_requests:conflicts:show':
         case 'projects:merge_requests:show':
           new gl.Diff();
           shortcut_handler = new ShortcutsIssuable(true);
           new ZenMode();
+          initIssuableSidebar();
+          initNotes();
           break;
         case 'dashboard:activity':
           new gl.Activities();
           break;
-        case 'dashboard:issues':
-        case 'dashboard:merge_requests':
-          new ProjectSelect();
-          new UsersSelect();
-          break;
         case 'projects:commit:show':
           new Commit();
           new gl.Diff();
@@ -274,6 +319,7 @@ import PerformanceBar from './performance_bar';
           new MiniPipelineGraph({
             container: '.js-commit-pipeline-graph',
           }).bindEvents();
+          initNotes();
           break;
         case 'projects:commit:pipelines':
           new MiniPipelineGraph({
@@ -367,10 +413,12 @@ import PerformanceBar from './performance_bar';
         case 'projects:labels:edit':
           new Labels();
           break;
+        case 'groups:labels:index':
         case 'projects:labels:index':
           if ($('.prioritized-labels').length) {
             new gl.LabelManager();
           }
+          new gl.ProjectLabelSubscription('.label-subscription');
           break;
         case 'projects:network:show':
           // Ensure we don't create a particular shortcut handler here. This is
@@ -415,10 +463,15 @@ import PerformanceBar from './performance_bar';
         case 'snippets:show':
           new LineHighlighter();
           new BlobViewer();
+          initNotes();
           break;
         case 'import:fogbugz:new_user_map':
           new UsersSelect();
           break;
+        case 'profiles:personal_access_tokens:index':
+        case 'admin:impersonation_tokens:index':
+          new gl.DueDateSelectors();
+          break;
       }
       switch (path.first()) {
         case 'sessions':

app/assets/javascripts/issuable_context.js

@@ -50,11 +50,9 @@ import UsersSelect from './users_select';
     }
     IssuableContext.prototype.initParticipants = function() {
-      var _this;
-      _this = this;
       $(document).on("click", ".js-participants-more", this.toggleHiddenParticipants);
       return $(".js-participants-author").each(function(i) {
-        if (i >= _this.PARTICIPANTS_ROW_COUNT) {
+        if (i >= 7) {
           return $(this).addClass("js-participants-hidden").hide();
         }
       });

app/assets/javascripts/main.js

@@ -145,7 +145,6 @@ import './right_sidebar';
 import './search';
 import './search_autocomplete';
 import './smart_interval';
-import './snippets_list';
 import './star';
 import './subscription';
 import './subscription_select';

app/assets/javascripts/milestone_select.js

@@ -8,7 +8,7 @@
       var _this, $els;
       if (currentProject != null) {
         _this = this;
-        this.currentProject = JSON.parse(currentProject);
+        this.currentProject = typeof currentProject === 'string' ? JSON.parse(currentProject) : currentProject;
       }
       $els = $(els);

app/assets/javascripts/project.js

@@ -6,21 +6,22 @@ import Cookies from 'js-cookie';
 (function() {
   this.Project = (function() {
     function Project() {
-      $('ul.clone-options-dropdown a').click(function() {
-        var url;
-        if ($(this).hasClass('active')) {
-          return;
-        }
-        $('.active').not($(this)).removeClass('active');
-        $(this).toggleClass('active');
-        url = $("#project_clone").val();
-        $('#project_clone').val(url);
+      const $cloneOptions = $('ul.clone-options-dropdown');
+      const $projectCloneField = $('#project_clone');
+      const $cloneBtnText = $('a.clone-dropdown-btn span');
+
+      $('a', $cloneOptions).on('click', (e) => {
+        const $this = $(e.currentTarget);
+        const url = $this.attr('href');
+
+        e.preventDefault();
+
+        $('.active', $cloneOptions).not($this).removeClass('active');
+        $this.toggleClass('active');
+        $projectCloneField.val(url);
+        $cloneBtnText.text($this.text());
+
         return $('.clone').text(url);
-      // Git protocol switcher
-      // Remove the active class for all buttons (ssh, http, kerberos if shown)
-      // Add the active class for the clicked button
-      // Update the input field
-      // Update the command line instructions
       });
       // Ref switcher
       this.initRefSwitcher();

app/assets/javascripts/snippets_list.js

-function SnippetsList() {
-  const $holder = $('.snippets-list-holder');
-
-  $holder.find('.pagination').on('ajax:success', (e, data) => {
-    $holder.replaceWith(data.html);
-  });
-}
-
-window.gl.SnippetsList = SnippetsList;

app/helpers/notes_helper.rb

@@ -130,4 +130,14 @@ module NotesHelper
       can?(current_user, :create_note, @project)
     end
   end
+
+  def initial_notes_data(autocomplete)
+    {
+      notesUrl: notes_url,
+      notesIds: @notes.map(&:id),
+      now: Time.now.to_i,
+      diffView: diff_view,
+      autocomplete: autocomplete
+    }
+  end
 end

app/views/shared/_clone_panel.html.haml

@@ -20,11 +20,3 @@
   = text_field_tag :project_clone, default_url_to_repo(project), class: "js-select-on-focus form-control", readonly: true, aria: { label: 'Project clone URL' }
   .input-group-btn
     = clipboard_button(target: '#project_clone', title: _("Copy URL to clipboard"), class: "btn-default btn-clipboard")
-
-:javascript
-  $('ul.clone-options-dropdown a').on('click',function(e){
-    e.preventDefault();
-    var $this = $(this);
-    $('a.clone-dropdown-btn span').text($this.text());
-    $('#project_clone').val($this.attr('href'));
-  });

app/views/shared/_label.html.haml

@@ -76,11 +76,3 @@
       = link_to destroy_label_path(label), title: "Delete", class: 'btn btn-transparent btn-action remove-row', method: :delete, data: {confirm: label_deletion_confirm_text(label), toggle: "tooltip"} do
         %span.sr-only Delete
         = icon('trash-o')
-
-  - if current_user
-    - if can_subscribe_to_label_in_different_levels?(label)
-      :javascript
-        new gl.GroupLabelSubscription('##{dom_id(label)} .label-subscription');
-    - else
-      :javascript
-        new gl.ProjectLabelSubscription('##{dom_id(label)} .label-subscription');

app/views/shared/_personal_access_tokens_form.html.haml

@@ -23,18 +23,3 @@
   .prepend-top-default
     = f.submit "Create #{type} token", class: "btn btn-create"
-
-:javascript
-  var $dateField = $('.datepicker');
-  var date = $dateField.val();
-
-  new Pikaday({
-    field: $dateField.get(0),
-    theme: 'gitlab-theme animate-picker',
-    format: 'yyyy-mm-dd',
-    minDate: new Date(),
-    container: $dateField.parent().get(0),
-    onSelect: function(dateText) {
-      $dateField.val(dateFormat(new Date(dateText), 'yyyy-mm-dd'));
-    }
-  });

app/views/shared/issuable/_filter.html.haml

@@ -36,13 +36,3 @@
   .row-content-block.second-block.filtered-labels{ class: ("hidden" unless has_labels) }
     - if has_labels
       = render 'shared/labels_row', labels: @labels
-
-:javascript
-  new LabelsSelect();
-  new MilestoneSelect();
-  new IssueStatusSelect();
-  new SubscriptionSelect();
-  $('form.filter-form').on('submit', function (event) {
-    event.preventDefault();
-    gl.utils.visitUrl(this.action + '&' + $(this).serialize());
-  });

app/views/shared/issuable/_participants.html.haml

@@ -16,5 +16,3 @@
     .hide-collapsed.participants-more
       %a.js-participants-more{ href: "#", data: { original_text: "+ #{participants_size - 7} more", less_text: "- show less" } }
         + #{participants_extra} more
-:javascript
-  IssuableContext.prototype.PARTICIPANTS_ROW_COUNT = #{participants_row};

app/views/shared/issuable/_search_bar.html.haml

@@ -108,12 +108,3 @@
               #js-add-issues-btn.prepend-left-10
           - elsif type != :boards_modal
             = render 'shared/sort_dropdown'
-
-- unless type === :boards_modal
-  :javascript
-    $(document).off('page:restore').on('page:restore', function (event) {
-      if (gl.FilteredSearchManager) {
-        const filteredSearchManager = new gl.FilteredSearchManager();
-        filteredSearchManager.setup();
-      }
-    });

app/views/shared/issuable/_sidebar.html.haml

@@ -143,12 +143,6 @@
         endpoint: "#{issuable_json_path(issuable)}?basic=true",
         editable: #{can_edit_issuable ? true : false},
         currentUser: #{current_user.to_json(only: [:username, :id, :name], methods: :avatar_url)},
-        rootPath: "#{root_path}"
+        rootPath: "#{root_path}",
+        fullPath: "#{@project.full_path}",
       };
-
-      new MilestoneSelect('{"full_path":"#{@project.full_path}"}');
-      new LabelsSelect();
-      new IssuableContext('#{escape_javascript(current_user.to_json(only: [:username, :id, :name]))}');
-      gl.Subscription.bindAll('.subscription');
-      new gl.DueDateSelectors();
-      window.sidebar = new Sidebar();

app/views/shared/notes/_notes_with_form.html.haml

@@ -22,5 +22,4 @@
     = link_to "sign in", new_session_path(:user, redirect_to_referer: 'yes')
     to comment
-:javascript
-  var notes = new Notes("#{notes_url}", #{@notes.map(&:id).to_json}, #{Time.now.to_i}, "#{diff_view}", #{autocomplete})
+%script.js-notes-data{ type: "application/json" }= initial_notes_data(autocomplete).to_json.html_safe

app/views/snippets/_snippets.html.haml

-- remote = local_assigns.fetch(:remote, false)
 - link_project = local_assigns.fetch(:link_project, false)
 .snippets-list-holder
@@ -8,7 +7,4 @@
       %li
         .nothing-here-block Nothing here.
-  = paginate @snippets, theme: 'gitlab', remote: remote
-
-:javascript
-  gl.SnippetsList();
+  = paginate @snippets, theme: 'gitlab'