From 6a429eaf72cd6b1700dd16e7d4123f10243df071 Mon Sep 17 00:00:00 2001 From: Dany Marcoux Date: Tue, 18 Dec 2018 15:41:55 +0100 Subject: [PATCH 1/6] Set correct date range and period during initial page load --- .../app/controllers/webui/projects/pulse_controller.rb | 6 +++++- .../app/views/webui2/webui/projects/pulse/show.html.haml | 8 ++++---- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/src/api/app/controllers/webui/projects/pulse_controller.rb b/src/api/app/controllers/webui/projects/pulse_controller.rb index 376f400b498..fcf85339d63 100644 --- a/src/api/app/controllers/webui/projects/pulse_controller.rb +++ b/src/api/app/controllers/webui/projects/pulse_controller.rb @@ -2,6 +2,7 @@ module Webui module Projects class PulseController < WebuiController before_action :set_project + before_action :set_range before_action :set_pulse, if: -> { request.xhr? } def show @@ -11,8 +12,11 @@ def show private - def set_pulse + def set_range @range = params[:range] == 'month' ? 'month' : 'week' + end + + def set_pulse case @range when 'month' range = 1.month.ago..Date.tomorrow diff --git a/src/api/app/views/webui2/webui/projects/pulse/show.html.haml b/src/api/app/views/webui2/webui/projects/pulse/show.html.haml index 6300d997640..952d69c108c 100644 --- a/src/api/app/views/webui2/webui/projects/pulse/show.html.haml +++ b/src/api/app/views/webui2/webui/projects/pulse/show.html.haml @@ -7,7 +7,7 @@ .row .col-8.mb-3 %h3#range-header - = pulse_period('month') + = pulse_period(@range) .col .dropdown.float-right %button.btn.btn-secondary.dropdown-toggle#period-dropdown{ 'aria-expanded': 'false', @@ -16,7 +16,7 @@ type: 'button' } Period: One %span#range-text - Week + = @range.capitalize .dropdown-menu{ 'aria-labelledby': 'dropdownMenuButton' } %h6.dropdown-header Period to display: @@ -30,13 +30,13 @@ .col.text-center %i.fas.fa-spinner.fa-spin.fa-3x - :javascript $.ajax({ - url: "#{project_pulse_path(@project)}", + url: "#{project_pulse_path(@project, range: @range)}", type: "get", dataType: 'script' }); + $(".dropdown-item").click(function() { $("#pulse").html('
') // FIXME: No idea why this is needed, maybe remote links are not covered by bootstrap? From 632c1d5b18133d9b0691e95483ea75a183c0095b Mon Sep 17 00:00:00 2001 From: Dany Marcoux Date: Tue, 18 Dec 2018 16:01:37 +0100 Subject: [PATCH 2/6] Reuse spinner on pulse page instead of always overwriting it The spinner is now always in the same position. It was previously centered during the initial page load, then on the left whenever changing the selected period in the dropdown. This was caused by the HTML and CSS classes which differed. --- .../webui/projects/pulse/show.html.haml | 5 ++-- .../webui2/webui/projects/pulse/show.js.erb | 23 ++++++++++--------- 2 files changed, 15 insertions(+), 13 deletions(-) diff --git a/src/api/app/views/webui2/webui/projects/pulse/show.html.haml b/src/api/app/views/webui2/webui/projects/pulse/show.html.haml index 952d69c108c..f957859f8cb 100644 --- a/src/api/app/views/webui2/webui/projects/pulse/show.html.haml +++ b/src/api/app/views/webui2/webui/projects/pulse/show.html.haml @@ -25,10 +25,11 @@ = link_to(project_pulse_path(@project, range: 'month'), remote: true, type: :json, class: 'dropdown-item') do One Month .row - .col#pulse + .col.spinner .row .col.text-center %i.fas.fa-spinner.fa-spin.fa-3x + .col.d-none#pulse :javascript $.ajax({ @@ -38,7 +39,7 @@ }); $(".dropdown-item").click(function() { - $("#pulse").html('
') + $('#pulse, .col.spinner').toggleClass('d-none'); // FIXME: No idea why this is needed, maybe remote links are not covered by bootstrap? $('#period-dropdown').dropdown('toggle') }); diff --git a/src/api/app/views/webui2/webui/projects/pulse/show.js.erb b/src/api/app/views/webui2/webui/projects/pulse/show.js.erb index 2d86046adbf..811f5441df7 100644 --- a/src/api/app/views/webui2/webui/projects/pulse/show.js.erb +++ b/src/api/app/views/webui2/webui/projects/pulse/show.js.erb @@ -1,14 +1,15 @@ $('#range-header').html("<%= escape_javascript(pulse_period(@range)) %>"); $('#range-text').html("<%= @range.titleize %>"); +$('#pulse, .col.spinner').toggleClass('d-none'); $('#pulse').html("<%= escape_javascript render partial: 'pulse_list', locals: { requests_by_percentage: @requests_by_percentage, - requests_by_state: @requests_by_state, - project: @project, - commits: @commits, - new_packages: @new_packages, - deleted_packages: @deleted_packages, - updates: @updates, - project_changes: @project_changes, - builds: @builds, - branches: @branches, - comments: @comments, - requests: @requests } %>"); + requests_by_state: @requests_by_state, + project: @project, + commits: @commits, + new_packages: @new_packages, + deleted_packages: @deleted_packages, + updates: @updates, + project_changes: @project_changes, + builds: @builds, + branches: @branches, + comments: @comments, + requests: @requests } %>"); From 4989c0fd447f2b3172482cd15075c6a1f56d717c Mon Sep 17 00:00:00 2001 From: Dany Marcoux Date: Tue, 18 Dec 2018 16:16:53 +0100 Subject: [PATCH 3/6] Set the request description as a tooltip It isn't truncated anymore --- .../webui2/webui/projects/pulse/_pulse_list_requests.html.haml | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_requests.html.haml b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_requests.html.haml index d7dcbc3a295..170d7629f5a 100644 --- a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_requests.html.haml +++ b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_requests.html.haml @@ -4,9 +4,8 @@ %span{ class: "badge progress-state-#{request.state} text-light" } = request.state.to_s %dd.col-11 - = link_to(request_show_path(request.number)) do + = link_to(request_show_path(request.number), title: request.description) do = request.number - (#{truncate(request.description)}) - if request.request_history_elements.any? = request.request_history_elements.last.description.gsub('Request', '') - else From 173652f787961bb94fa3162099324a5381f63932 Mon Sep 17 00:00:00 2001 From: Dany Marcoux Date: Tue, 18 Dec 2018 16:29:08 +0100 Subject: [PATCH 4/6] Emphasize information under date range in pulse page --- .../webui/projects/pulse/_pulse_list_changes.html.haml | 3 ++- .../webui/projects/pulse/_pulse_list_comments.html.haml | 3 ++- .../webui/projects/pulse/_pulse_list_commits.html.haml | 8 +++++--- 3 files changed, 9 insertions(+), 5 deletions(-) diff --git a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_changes.html.haml b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_changes.html.haml index 065a28d2357..b4600eb543b 100644 --- a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_changes.html.haml +++ b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_changes.html.haml @@ -1,5 +1,6 @@ - if project_changes.any? And the project setup has been changed - #{pluralize(project_changes.count, 'time')}. + %b + #{pluralize(project_changes.count, 'time')}. - else And no one touched the project setup. diff --git a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_comments.html.haml b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_comments.html.haml index a6e0e813eca..9bdcffeb085 100644 --- a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_comments.html.haml +++ b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_comments.html.haml @@ -1,7 +1,8 @@ - if comments.any? And - people = comments.group(:user_name).count - = pluralize(people.count, 'person') + %b + = pluralize(people.count, 'person') added = link_to('#pulse-collaboration') do = pluralize(comments.count, 'comment') diff --git a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_commits.html.haml b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_commits.html.haml index c71b6344233..fb2713308ed 100644 --- a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_commits.html.haml +++ b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_commits.html.haml @@ -8,11 +8,13 @@ to packages in this project. - if updates.any? Out of those commits, - = pluralize(updates.count, 'was a', plural: 'were') - version #{'update'.pluralize(updates.count)}. + %b + = pluralize(updates.count, 'was a', plural: 'were') + version #{'update'.pluralize(updates.count)}. - top_committer = commits.group(:user_name).count.max_by { |_, v| v } %span{ title: "with #{pluralize(top_committer.second, 'commit')}" } - = top_committer.first + %b + = top_committer.first was the busiest commiter, hooray! - else no one committed anything. From 7bb83d85cc05e8422f4fcc366595433072e38f8a Mon Sep 17 00:00:00 2001 From: Dany Marcoux Date: Wed, 19 Dec 2018 12:35:05 +0100 Subject: [PATCH 5/6] Use accordions for lists on the pulse page Also display lists only if data is present --- .../projects/pulse/_pulse_list.html.haml | 109 +++++++++++------- 1 file changed, 68 insertions(+), 41 deletions(-) diff --git a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list.html.haml b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list.html.haml index d900e4a4879..d61277314d5 100644 --- a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list.html.haml +++ b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list.html.haml @@ -45,48 +45,75 @@ There have been no requests send to this project. .row .col - %h5#pulse-packages - Package Changes - %hr - %ul.list-unstyled - - (commits + new_packages + deleted_packages + updates).sort_by(&:datetime).reverse_each do |log_entry| - %li - = render partial: 'pulse_list_entry', locals: { log_entry: log_entry, project: project } + - package_changes = commits + new_packages + deleted_packages + updates + - if package_changes.present? + %h5#pulse-packages + = link_to('.collapse-package-changes', aria: { controls: 'collapse-package-changes', expanded: 'true' }, + 'data-toggle' => 'collapse', role: 'button') do + Package Changes + %small + %span.collapser (Hide) + %span.expander (Show) + %hr + .collapse.show.collapse-package-changes + %ul.list-unstyled + - package_changes.sort_by(&:datetime).reverse_each do |log_entry| + %li + = render partial: 'pulse_list_entry', locals: { log_entry: log_entry, project: project } - %h5#pulse-project - Project Changes - %hr - %ul.list-unstyled - - project_changes.each do |log_entry| - %li - = render partial: 'pulse_list_entry', locals: { log_entry: log_entry, project: project } + - if project_changes.present? + %h5#pulse-project + = link_to('.collapse-project-changes', aria: { controls: 'collapse-project-changes', expanded: 'true' }, + 'data-toggle' => 'collapse', role: 'button') do + Project Changes + %small + %span.collapser (Hide) + %span.expander (Show) + %hr + .collapse.show.collapse-project-changes + %ul.list-unstyled + - project_changes.each do |log_entry| + %li + = render partial: 'pulse_list_entry', locals: { log_entry: log_entry, project: project } - %h5#pulse-builds - Builds - %small - (in the last 24 hours) - %hr - %ul.list-unstyled - - builds.each do |log_entry| - %li - = render partial: 'pulse_list_entry', locals: { log_entry: log_entry, project: project } + - if builds.present? + %h5#pulse-builds + = link_to('.collapse-builds', aria: { controls: 'collapse-builds', expanded: 'true' }, 'data-toggle' => 'collapse', role: 'button') do + Builds + %small + (in the last 24 hours) + %span.collapser (Hide) + %span.expander (Show) + %hr + .collapse.show.collapse-builds + %ul.list-unstyled + - builds.each do |log_entry| + %li + = render partial: 'pulse_list_entry', locals: { log_entry: log_entry, project: project } - %h5#pulse-collaboration - Collaboration - %hr - %ul.list-unstyled - - (branches + comments).sort_by(&:datetime).reverse_each.each do |log_entry| - %li - = render partial: 'pulse_list_entry', locals: { log_entry: log_entry, project: project } - - %h5#pulse-requests - Requests - - if requests.count > 30 - %small.text-muted - ( last 30, - = link_to(project_requests_path(project)) do - view all - ) - %hr - = render partial: 'pulse_list_requests', locals: { requests: requests } + - collaboration = branches + comments + - if collaboration.present? + %h5#pulse-collaboration + = link_to('.collapse-collaboration', aria: { controls: 'collapse-collaboration', expanded: 'true' }, + 'data-toggle' => 'collapse', role: 'button') do + Collaboration + %small + %span.collapser (Hide) + %span.expander (Show) + %hr + .collapse.show.collapse-collaboration + %ul.list-unstyled + - collaboration.sort_by(&:datetime).reverse_each.each do |log_entry| + %li + = render partial: 'pulse_list_entry', locals: { log_entry: log_entry, project: project } + - if requests.present? + %h5#pulse-requests + = link_to('.collapse-requests', aria: { controls: 'collapse-requests', expanded: 'true' }, 'data-toggle' => 'collapse', role: 'button') do + Requests + %small + %span.collapser (Hide) + %span.expander (Show) + %hr + .collapse.show.collapse-requests + = render partial: 'pulse_list_requests', locals: { requests: requests } From 90ea0ce91a170c42bbff3079189bb1b3fe72c22b Mon Sep 17 00:00:00 2001 From: Dany Marcoux Date: Wed, 19 Dec 2018 14:31:37 +0100 Subject: [PATCH 6/6] Use a partial for the Requests box in the pulse page --- .../projects/pulse/_pulse_list.html.haml | 36 +++---------------- .../pulse/_pulse_list_requests_box.html.haml | 31 ++++++++++++++++ 2 files changed, 36 insertions(+), 31 deletions(-) create mode 100644 src/api/app/views/webui2/webui/projects/pulse/_pulse_list_requests_box.html.haml diff --git a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list.html.haml b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list.html.haml index d61277314d5..fa8fb2f49d3 100644 --- a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list.html.haml +++ b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list.html.haml @@ -12,37 +12,11 @@ = render partial: 'pulse_list_comments', locals: { comments: comments } .col - .card - .card-header - Requests - .card-body - - if requests.any? - .row - .col - .progress - -# haml-lint:disable InlineStyles - - requests_by_percentage.each do |state, percentage| - %div{ title: "#{requests_by_state[state]} #{state} requests", - class: "progress-bar progress-state-#{state}", - 'aria-valuemax': '100', 'aria-valuemin': '0', 'aria-valuenow': percentage, - role: 'progressbar', style: "width: #{percentage}%" } - -# haml-lint:enable InlineStyles - %p - = link_to('#pulse-requests') do - = requests_by_state.values.sum - active requests - .row - - requests_by_state.each_key do |state| - .col.border.text-center - %p.fa-3x - %i{ class: "fa #{request_bootstrap_icon(state)} request-state-#{state}" } - %p - = pluralize(requests_by_state[state], 'request') - %br - in #{state} - - else - = link_to(project_requests_path(project)) do - There have been no requests send to this project. + = render partial: 'pulse_list_requests_box', locals: { project: project, + requests: requests, + requests_by_percentage: requests_by_percentage, + requests_by_state: requests_by_state } + .row .col - package_changes = commits + new_packages + deleted_packages + updates diff --git a/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_requests_box.html.haml b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_requests_box.html.haml new file mode 100644 index 00000000000..303f52da58d --- /dev/null +++ b/src/api/app/views/webui2/webui/projects/pulse/_pulse_list_requests_box.html.haml @@ -0,0 +1,31 @@ +.card + .card-header + Requests + .card-body + - if requests.any? + .row + .col + .progress + -# haml-lint:disable InlineStyles + - requests_by_percentage.each do |state, percentage| + %div{ title: "#{requests_by_state[state]} #{state} requests", + class: "progress-bar progress-state-#{state}", + 'aria-valuemax': '100', 'aria-valuemin': '0', 'aria-valuenow': percentage, + role: 'progressbar', style: "width: #{percentage}%" } + -# haml-lint:enable InlineStyles + %p + = link_to('#pulse-requests') do + = requests_by_state.values.sum + active requests + .row + - requests_by_state.each_key do |state| + .col.border.text-center + %p.fa-3x + %i{ class: "fa #{request_bootstrap_icon(state)} request-state-#{state}" } + %p + = pluralize(requests_by_state[state], 'request') + %br + in #{state} + - else + = link_to(project_requests_path(project)) do + There have been no requests send to this project.