Inline script cleanup globals and easy

10 files changed, 42 insertions, 137 deletions

diff --git a/app/views/projects/_activity.html.haml b/app/views/projects/_activity.html.haml
index ecc966ed453..ad63f5e73ae 100644
--- a/app/views/projects/_activity.html.haml
+++ b/app/views/projects/_activity.html.haml
@@ -8,9 +8,3 @@
 
   .content_list.project-activity{ :"data-href" => activity_project_path(@project) }
   = spinner
-
-:javascript
-  var activity = new gl.Activities();
-  $(document).on('page:restore', function (event) {
-    activity.reloadActivities()
-  })
diff --git a/app/views/projects/blob/_new_dir.html.haml b/app/views/projects/blob/_new_dir.html.haml
index b2959ef6d31..03ab1bb59e4 100644
--- a/app/views/projects/blob/_new_dir.html.haml
+++ b/app/views/projects/blob/_new_dir.html.haml
@@ -20,6 +20,3 @@
             - unless can?(current_user, :push_code, @project)
               .inline.prepend-left-10
                 = commit_in_fork_help
-
-:javascript
-  new NewCommitForm($('.js-create-dir-form'))
diff --git a/app/views/projects/blob/_remove.html.haml b/app/views/projects/blob/_remove.html.haml
index 6a4a657fa8c..750bdef3308 100644
--- a/app/views/projects/blob/_remove.html.haml
+++ b/app/views/projects/blob/_remove.html.haml
@@ -13,6 +13,3 @@
             .col-sm-offset-2.col-sm-10
               = button_tag 'Delete file', class: 'btn btn-remove btn-remove-file'
               = link_to "Cancel", '#', class: "btn btn-cancel", "data-dismiss" => "modal"
-
-:javascript
-  new NewCommitForm($('.js-delete-blob-form'))
diff --git a/app/views/projects/branches/new.html.haml b/app/views/projects/branches/new.html.haml
index 03eefcc2b4d..2baaaf6ac5b 100644
--- a/app/views/projects/branches/new.html.haml
+++ b/app/views/projects/branches/new.html.haml
@@ -28,8 +28,4 @@
   .form-actions
     = button_tag 'Create branch', class: 'btn btn-create', tabindex: 3
     = link_to 'Cancel', project_branches_path(@project), class: 'btn btn-cancel'
-
-:javascript
-  var availableRefs = #{@project.repository.ref_names.to_json};
-
-  new NewBranchForm($('.js-create-branch-form'), availableRefs)
+%script#availableRefs{ type: "application/json" }= @project.repository.ref_names.to_json.html_safe
diff --git a/app/views/projects/commit/_commit_box.html.haml b/app/views/projects/commit/_commit_box.html.haml
index 419fbe99af8..09bcd187e59 100644
--- a/app/views/projects/commit/_commit_box.html.haml
+++ b/app/views/projects/commit/_commit_box.html.haml
@@ -1,4 +1,4 @@
-.page-content-header
+.page-content-header.js-commit-box{ 'data-commit-path' => branches_project_commit_path(@project, @commit.id) }
   .header-main-content
     = render partial: 'signature', object: @commit.signature
     %strong
@@ -79,6 +79,3 @@
           = render 'shared/mini_pipeline_graph', pipeline: last_pipeline, klass: 'js-commit-pipeline-graph'
       in
       = time_interval_in_words last_pipeline.duration
-
-:javascript
-  $(".commit-info.branches").load("#{branches_project_commit_path(@project, @commit.id)}");
diff --git a/app/views/projects/commits/show.html.haml b/app/views/projects/commits/show.html.haml
index bd2d900997e..7ae56086177 100644
--- a/app/views/projects/commits/show.html.haml
+++ b/app/views/projects/commits/show.html.haml
@@ -11,34 +11,32 @@
 = content_for :sub_nav do
   = render "head"
 
-%div{ class: container_class }
-  .tree-holder
-    .nav-block
-      .tree-ref-container
-        .tree-ref-holder
-          = render 'shared/ref_switcher', destination: 'commits'
+.js-project-commits-show{ 'data-commits-limit' => @limit }
+  %div{ class: container_class }
+    .tree-holder
+      .nav-block
+        .tree-ref-container
+          .tree-ref-holder
+            = render 'shared/ref_switcher', destination: 'commits'
+
+          %ul.breadcrumb.repo-breadcrumb
+            = commits_breadcrumbs
+        .tree-controls.hidden-xs.hidden-sm
+          - if @merge_request.present?
+            .control
+              = link_to _("View open merge request"), project_merge_request_path(@project, @merge_request), class: 'btn'
+          - elsif create_mr_button?(@repository.root_ref, @ref)
+            .control
+              = link_to _("Create merge request"), create_mr_path(@repository.root_ref, @ref), class: 'btn btn-success'
 
-        %ul.breadcrumb.repo-breadcrumb
-          = commits_breadcrumbs
-      .tree-controls.hidden-xs.hidden-sm
-        - if @merge_request.present?
           .control
-            = link_to _("View open merge request"), project_merge_request_path(@project, @merge_request), class: 'btn'
-        - elsif create_mr_button?(@repository.root_ref, @ref)
+            = form_tag(project_commits_path(@project, @id), method: :get, class: 'commits-search-form', data: { 'signatures-path' => namespace_project_signatures_path }) do
+              = search_field_tag :search, params[:search], { placeholder: _('Filter by commit message'), id: 'commits-search', class: 'form-control search-text-input input-short', spellcheck: false }
           .control
-            = link_to _("Create merge request"), create_mr_path(@repository.root_ref, @ref), class: 'btn btn-success'
+            = link_to project_commits_path(@project, @ref, rss_url_options), title: _("Commits feed"), class: 'btn' do
+              = icon("rss")
 
-        .control
-          = form_tag(project_commits_path(@project, @id), method: :get, class: 'commits-search-form', data: { 'signatures-path' => namespace_project_signatures_path }) do
-            = search_field_tag :search, params[:search], { placeholder: _('Filter by commit message'), id: 'commits-search', class: 'form-control search-text-input input-short', spellcheck: false }
-        .control
-          = link_to project_commits_path(@project, @ref, rss_url_options), title: _("Commits feed"), class: 'btn' do
-            = icon("rss")
-
-  %div{ id: dom_id(@project) }
-    %ol#commits-list.list-unstyled.content_list
-      = render 'commits', project: @project, ref: @ref
-  = spinner
-
-:javascript
-  CommitsList.init(#{@limit});
+    %div{ id: dom_id(@project) }
+      %ol#commits-list.list-unstyled.content_list
+        = render 'commits', project: @project, ref: @ref
+    = spinner
diff --git a/app/views/projects/find_file/show.html.haml b/app/views/projects/find_file/show.html.haml
index e3bf48ee47f..021575160ea 100644
--- a/app/views/projects/find_file/show.html.haml
+++ b/app/views/projects/find_file/show.html.haml
@@ -1,7 +1,7 @@
 - page_title "Find File", @ref
 = render "projects/commits/head"
 
-.file-finder-holder.tree-holder.clearfix
+.file-finder-holder.tree-holder.clearfix.js-file-finder{ 'data-file-find-url': "#{escape_javascript(project_files_path(@project, @ref, @options.merge(format: :json)))}", 'data-find-tree-url': escape_javascript(project_tree_path(@project, @ref)), 'data-blob-url-template': escape_javascript(project_blob_path(@project, @id || @commit.id)) }
   .nav-block
     .tree-ref-holder
       = render 'shared/ref_switcher', destination: 'find_file', path: @path
@@ -17,11 +17,3 @@
       %table.table.files-slider{ class: "table_#{@hex_path} tree-table table-striped" }
         %tbody
       = spinner nil, true
-
-:javascript
-  var projectFindFile = new ProjectFindFile($(".file-finder-holder"), {
-    url: "#{escape_javascript(project_files_path(@project, @ref, @options.merge(format: :json)))}",
-    treeUrl: "#{escape_javascript(project_tree_path(@project, @ref))}",
-    blobUrlTemplate: "#{escape_javascript(project_blob_path(@project, @id || @commit.id))}"
-  });
-  new ShortcutsFindFile(projectFindFile);
diff --git a/app/views/projects/graphs/charts.html.haml b/app/views/projects/graphs/charts.html.haml
index 249b9d82ad9..228c8c84792 100644
--- a/app/views/projects/graphs/charts.html.haml
+++ b/app/views/projects/graphs/charts.html.haml
@@ -3,8 +3,9 @@
 - if show_new_nav?
   - add_to_breadcrumbs("Repository", project_tree_path(@project))
 - content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('common_d3')
-  = page_specific_javascript_bundle_tag('graphs')
+  = webpack_bundle_tag('common_d3')
+  = webpack_bundle_tag('graphs')
+  = webpack_bundle_tag('graphs_charts')
 = render "projects/commits/head"
 
 .repo-charts{ class: container_class }
@@ -75,55 +76,10 @@
           Commits per day hour (UTC)
         %canvas#hour-chart
 
-:javascript
-  var responsiveChart = function (selector, data) {
-    var options = { "scaleOverlay": true, responsive: true, pointHitDetectionRadius: 2, maintainAspectRatio: false };
-    // get selector by context
-    var ctx = selector.get(0).getContext("2d");
-    // pointing parent container to make chart.js inherit its width
-    var container = $(selector).parent();
-    var generateChart = function() {
-      selector.attr('width', $(container).width());
-      if (window.innerWidth < 768) {
-        // Scale fonts if window width lower than 768px (iPad portrait)
-        options.scaleFontSize = 8
-      }
-      return new Chart(ctx).Bar(data, options);
-    };
-    // enabling auto-resizing
-    $(window).resize(generateChart);
-    return generateChart();
-  };
-
-  var chartData = function (keys, values) {
-    var data = {
-      labels : keys,
-      datasets : [{
-        fillColor : "rgba(220,220,220,0.5)",
-        strokeColor : "rgba(220,220,220,1)",
-        barStrokeWidth: 1,
-        barValueSpacing: 1,
-        barDatasetSpacing: 1,
-        data : values
-      }]
-    };
-    return data;
-  };
-
-  var hourData = chartData(#{@commits_per_time.keys.to_json}, #{@commits_per_time.values.to_json});
-  responsiveChart($('#hour-chart'), hourData);
-
-  var dayData = chartData(#{@commits_per_week_days.keys.to_json}, #{@commits_per_week_days.values.to_json});
-  responsiveChart($('#weekday-chart'), dayData);
-
-  var monthData = chartData(#{@commits_per_month.keys.to_json}, #{@commits_per_month.values.to_json});
-  responsiveChart($('#month-chart'), monthData);
-
-  var data = #{@languages.to_json};
-  var ctx = $("#languages-chart").get(0).getContext("2d");
-  var options = {
-    scaleOverlay: true,
-    responsive: true,
-    maintainAspectRatio: false
-  }
-  var myPieChart = new Chart(ctx).Pie(data, options);
+%script#projectChartData{ type: "application/json" }
+  - projectChartData = {};
+  - projectChartData['hour'] = { 'keys' => @commits_per_time.keys, 'values' => @commits_per_time.values }
+  - projectChartData['weekDays'] = { 'keys' => @commits_per_week_days.keys, 'values' => @commits_per_week_days.values }
+  - projectChartData['month'] = { 'keys' => @commits_per_month.keys, 'values' => @commits_per_month.values }
+  - projectChartData['languages'] = @languages
+  = projectChartData.to_json.html_safe
diff --git a/app/views/projects/graphs/show.html.haml b/app/views/projects/graphs/show.html.haml
index 4256a8c4d7e..f41a0d8293b 100644
--- a/app/views/projects/graphs/show.html.haml
+++ b/app/views/projects/graphs/show.html.haml
@@ -1,15 +1,16 @@
 - @no_container = true
 - page_title "Contributors"
 - content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('common_d3')
-  = page_specific_javascript_bundle_tag('graphs')
+  = webpack_bundle_tag('common_d3')
+  = webpack_bundle_tag('graphs')
+  = webpack_bundle_tag('graphs_show')
 
 - if show_new_nav?
   - add_to_breadcrumbs("Repository", project_tree_path(@project))
 
 = render 'projects/commits/head'
 
-%div{ class: container_class }
+.js-graphs-show{ class: container_class, 'data-project-graph-path': project_graph_path(@project, current_ref, format: :json) }
   .sub-header-block
     .tree-ref-holder
       = render 'shared/ref_switcher', destination: 'graphs'
@@ -33,24 +34,3 @@
       #contributors-master
       #contributors.clearfix
         %ol.contributors-list.clearfix
-
-
-
-:javascript
-  $.ajax({
-    type: "GET",
-    url: "#{project_graph_path(@project, current_ref, format: :json)}",
-    dataType: "json",
-    success: function (data) {
-      var graph = new ContributorsStatGraph();
-      graph.init(data);
-
-      $("#brush_change").change(function(){
-        graph.change_date_header();
-        graph.redraw_authors();
-      });
-
-      $(".stat-graph").fadeIn();
-      $(".loading-graph").hide();
-    }
-  });
diff --git a/app/views/projects/imports/show.html.haml b/app/views/projects/imports/show.html.haml
index c52b3860636..8c490773a56 100644
--- a/app/views/projects/imports/show.html.haml
+++ b/app/views/projects/imports/show.html.haml
@@ -10,5 +10,3 @@
     - if @project.external_import?
       %p.monospace git clone --bare #{@project.safe_import_url}
     %p Please wait while we import the repository for you. Refresh at will.
-    :javascript
-      new ProjectImport();