From b54358b45785639acc49e4b065020d2089040bd9 Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 26 Aug 2015 22:44:02 +0200 Subject: [PATCH] Refactor project list rendering Signed-off-by: Dmitriy Zaporozhets --- app/assets/javascripts/dispatcher.js.coffee | 4 -- app/assets/stylesheets/base/mixins.scss | 37 +++++++++++++++++++ app/assets/stylesheets/generic/lists.scss | 20 +--------- app/assets/stylesheets/pages/projects.scss | 33 +++++++++++------ app/views/dashboard/_projects.html.haml | 5 +-- .../dashboard/projects/starred.html.haml | 3 +- .../explore/projects/_projects.html.haml | 12 +++--- app/views/groups/_projects.html.haml | 2 +- app/views/search/_results.html.haml | 6 ++- app/views/search/results/_project.html.haml | 6 --- app/views/shared/_project.html.haml | 20 ---------- app/views/shared/_projects_list.html.haml | 17 --------- app/views/shared/projects/_list.html.haml | 19 ++++++++++ app/views/shared/projects/_project.html.haml | 23 ++++++++++++ app/views/users/_projects.html.haml | 4 +- 15 files changed, 118 insertions(+), 93 deletions(-) delete mode 100644 app/views/search/results/_project.html.haml delete mode 100644 app/views/shared/_project.html.haml delete mode 100644 app/views/shared/_projects_list.html.haml create mode 100644 app/views/shared/projects/_list.html.haml create mode 100644 app/views/shared/projects/_project.html.haml diff --git a/app/assets/javascripts/dispatcher.js.coffee b/app/assets/javascripts/dispatcher.js.coffee index 539041c2862..5bf0b302179 100644 --- a/app/assets/javascripts/dispatcher.js.coffee +++ b/app/assets/javascripts/dispatcher.js.coffee @@ -55,7 +55,6 @@ class Dispatcher new Activities() when 'dashboard:projects:starred' new Activities() - new ProjectsList() when 'projects:commit:show' new Commit() new Diff() @@ -70,7 +69,6 @@ class Dispatcher when 'groups:show' new Activities() shortcut_handler = new ShortcutsNavigation() - new ProjectsList() when 'groups:group_members:index' new GroupMembers() new UsersSelect() @@ -96,8 +94,6 @@ class Dispatcher when 'users:show' new User() new Activities() - when 'admin:users:show' - new ProjectsList() switch path.first() when 'admin' diff --git a/app/assets/stylesheets/base/mixins.scss b/app/assets/stylesheets/base/mixins.scss index 7beef1845ef..3974befa95c 100644 --- a/app/assets/stylesheets/base/mixins.scss +++ b/app/assets/stylesheets/base/mixins.scss @@ -157,3 +157,40 @@ white-space: nowrap; max-width: $max_width; } + +/* + * Base mixin for lists in GitLab + */ +@mixin basic-list { + margin: 5px 0px; + padding: 0px; + + li { + padding: 10px 0; + border-bottom: 1px solid #EEE; + overflow: hidden; + display: block; + margin: 0px; + + &:last-child { + border:none + } + + &.active { + background: #f9f9f9; + a { + font-weight: bold; + } + } + + &.hide { + display: none; + } + + &.light { + a { + color: #777; + } + } + } +} diff --git a/app/assets/stylesheets/generic/lists.scss b/app/assets/stylesheets/generic/lists.scss index c502d953c75..4b7ff84de2b 100644 --- a/app/assets/stylesheets/generic/lists.scss +++ b/app/assets/stylesheets/generic/lists.scss @@ -93,28 +93,12 @@ ol, ul { /** light list with border-bottom between li **/ ul.bordered-list { - margin: 5px 0px; - padding: 0px; - li { - padding: 5px 0; - border-bottom: 1px solid #EEE; - overflow: hidden; - display: block; - margin: 0px; - &:last-child { border:none } - &.active { - background: #f9f9f9; - a { font-weight: bold; } - } - - &.light { - a { color: #777; } - } - } + @include basic-list; &.top-list { li:first-child { padding-top: 0; + h4, h5 { margin-top: 0; } diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index 4d065c3bdf6..8339c6f5e6b 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -334,23 +334,32 @@ pre.light-well { } } -.project-row { - .project-full-name { - font-weight: bold; - font-size: 15px; - } +/* + * Projects list rendered on dashboard and user page + */ +.projects-list { + @include basic-list; - .project-description { - color: #888; - font-size: 13px; + .project-row { + .project-full-name { + @include str-truncated; + font-weight: bold; + font-size: 15px; + } - p { - margin-bottom: 0; + .project-description { color: #888; + font-size: 13px; + + p { + @include str-truncated; + margin-bottom: 0; + color: #888; + } } } } -.my-projects .project-row { - padding: 10px 0; +.panel .projects-list li { + padding: 10px 15px; } diff --git a/app/views/dashboard/_projects.html.haml b/app/views/dashboard/_projects.html.haml index dc83d5343f2..ef9b9ce756a 100644 --- a/app/views/dashboard/_projects.html.haml +++ b/app/views/dashboard/_projects.html.haml @@ -7,7 +7,4 @@ = link_to new_project_path, class: 'btn btn-success' do New project - %ul.projects-list.bordered-list.my-projects - - @projects.each do |project| - %li.project-row - = render partial: 'shared/project', locals: { project: project, avatar: true, stars: true } + = render 'shared/projects/list', projects: @projects diff --git a/app/views/dashboard/projects/starred.html.haml b/app/views/dashboard/projects/starred.html.haml index 6dcfd497ed2..19f3975e530 100644 --- a/app/views/dashboard/projects/starred.html.haml +++ b/app/views/dashboard/projects/starred.html.haml @@ -17,8 +17,7 @@ = link_to new_project_path, class: 'btn btn-success' do New project - = render 'shared/projects_list', projects: @projects, - projects_limit: 20, stars: true, avatar: false + = render 'shared/projects/list', projects: @projects, projects_limit: 20 - else %h3 You don't have starred projects yet diff --git a/app/views/explore/projects/_projects.html.haml b/app/views/explore/projects/_projects.html.haml index 22cc541115c..669079e9521 100644 --- a/app/views/explore/projects/_projects.html.haml +++ b/app/views/explore/projects/_projects.html.haml @@ -1,6 +1,6 @@ -%ul.projects-list.bordered-list.my-projects.public-projects - - projects.each do |project| - %li.project-row - = render partial: 'shared/project', locals: { project: project, avatar: true, stars: true } -- unless projects.present? - .nothing-here-block No such projects +- if projects.any? + .public-projects + = render 'shared/projects/list', projects: projects +- else + .nothing-here-block + No such projects diff --git a/app/views/groups/_projects.html.haml b/app/views/groups/_projects.html.haml index 2ae51a1c8c0..b2e32ced5e0 100644 --- a/app/views/groups/_projects.html.haml +++ b/app/views/groups/_projects.html.haml @@ -7,4 +7,4 @@ = link_to new_project_path(namespace_id: @group.id), class: 'btn btn-success' do New project - = render 'shared/projects_list', projects: @projects, projects_limit: 20 + = render 'shared/projects/list', projects: @projects, projects_limit: 20 diff --git a/app/views/search/_results.html.haml b/app/views/search/_results.html.haml index 741c780ad96..0dc1dd53628 100644 --- a/app/views/search/_results.html.haml +++ b/app/views/search/_results.html.haml @@ -14,7 +14,11 @@ %br .results.prepend-top-10 .search-results - = render partial: "search/results/#{@scope.singularize}", collection: @objects + - if @scope == 'projects' + .term + = render 'shared/projects/list', projects: @objects + - else + = render partial: "search/results/#{@scope.singularize}", collection: @objects = paginate @objects, theme: 'gitlab' :javascript diff --git a/app/views/search/results/_project.html.haml b/app/views/search/results/_project.html.haml deleted file mode 100644 index 195cf06c8ea..00000000000 --- a/app/views/search/results/_project.html.haml +++ /dev/null @@ -1,6 +0,0 @@ -.search-result-row - %h4 - = link_to [project.namespace.becomes(Namespace), project] do - %span.term= project.name_with_namespace - - if project.description.present? - %span.light.term= project.description diff --git a/app/views/shared/_project.html.haml b/app/views/shared/_project.html.haml deleted file mode 100644 index 15df97b1333..00000000000 --- a/app/views/shared/_project.html.haml +++ /dev/null @@ -1,20 +0,0 @@ -= cache [project.namespace, project, controller.controller_name, controller.action_name] do - = link_to project_path(project), class: dom_class(project) do - - if avatar - .dash-project-avatar - = project_icon(project, alt: '', class: 'avatar project-avatar s40') - %span.str-truncated.project-full-name - %span.namespace-name - - if project.namespace - = project.namespace.human_name - \/ - %span.project-name.filter-title - = project.name - - if stars - %span.pull-right.light - %i.fa.fa-star - = project.star_count - - if project.description.present? - .project-description - .str-truncated - = markdown(project.description, pipeline: :description) diff --git a/app/views/shared/_projects_list.html.haml b/app/views/shared/_projects_list.html.haml deleted file mode 100644 index 4c58092af44..00000000000 --- a/app/views/shared/_projects_list.html.haml +++ /dev/null @@ -1,17 +0,0 @@ -- projects_limit = 20 unless local_assigns[:projects_limit] -- avatar = true unless local_assigns[:avatar] == false -- stars = false unless local_assigns[:stars] == true -%ul.well-list.projects-list - - projects.each_with_index do |project, i| - %li{class: (i >= projects_limit) ? 'project-row hide' : 'project-row'} - = render "shared/project", project: project, avatar: avatar, stars: stars - - if projects.blank? - %li - .nothing-here-block There are no projects here. - - if projects.count > projects_limit - %li.bottom - %span.light - #{projects_limit} of #{pluralize(projects.count, 'project')} displayed. - %span - = link_to '#', class: 'js-expand' do - Show all diff --git a/app/views/shared/projects/_list.html.haml b/app/views/shared/projects/_list.html.haml new file mode 100644 index 00000000000..021e3b689a1 --- /dev/null +++ b/app/views/shared/projects/_list.html.haml @@ -0,0 +1,19 @@ +- projects_limit = 20 unless local_assigns[:projects_limit] +- avatar = true unless local_assigns[:avatar] == false +- stars = true unless local_assigns[:stars] == false + +%ul.projects-list + - projects.each_with_index do |project, i| + - css_class = (i >= projects_limit) ? 'hide' : nil + = render "shared/projects/project", project: project, + avatar: avatar, stars: stars, css_class: css_class + + - if projects.count > projects_limit + %li.bottom.center + .light + #{projects_limit} of #{pluralize(projects.count, 'project')} displayed. + = link_to '#', class: 'js-expand' do + Show all + +:coffeescript + new ProjectsList() diff --git a/app/views/shared/projects/_project.html.haml b/app/views/shared/projects/_project.html.haml new file mode 100644 index 00000000000..4bfdf4d55ff --- /dev/null +++ b/app/views/shared/projects/_project.html.haml @@ -0,0 +1,23 @@ +- avatar = true unless local_assigns[:avatar] == false +- stars = true unless local_assigns[:stars] == false +- css_class = nil unless local_assigns[:css_class] +%li.project-row{ class: css_class } + = cache [project.namespace, project, controller.controller_name, controller.action_name, 'v2'] do + = link_to project_path(project), class: dom_class(project) do + - if avatar + .dash-project-avatar + = project_icon(project, alt: '', class: 'avatar project-avatar s40') + %span.project-full-name + %span.namespace-name + - if project.namespace + = project.namespace.human_name + \/ + %span.project-name.filter-title + = project.name + - if stars + %span.pull-right.light + %i.fa.fa-star + = project.star_count + - if project.description.present? + .project-description + = markdown(project.description, pipeline: :description) diff --git a/app/views/users/_projects.html.haml b/app/views/users/_projects.html.haml index 297fa537394..a126a858ea8 100644 --- a/app/views/users/_projects.html.haml +++ b/app/views/users/_projects.html.haml @@ -1,13 +1,13 @@ - if local_assigns.has_key?(:contributed_projects) && contributed_projects.present? .panel.panel-default.contributed-projects .panel-heading Projects contributed to - = render 'shared/projects_list', + = render 'shared/projects/list', projects: contributed_projects.sort_by(&:star_count).reverse, projects_limit: 5, stars: true, avatar: false - if local_assigns.has_key?(:projects) && projects.present? .panel.panel-default .panel-heading Personal projects - = render 'shared/projects_list', + = render 'shared/projects/list', projects: projects.sort_by(&:star_count).reverse, projects_limit: 10, stars: true, avatar: false