Commit 68e4df7065ebb805d8215b8c28f0eaf510dec17f

Authored by Dmitriy Zaporozhets
2 parents 054d68a3 9be5425a

Merge branch 'ui-ux-improvements' into 'master'

UI/UX improvements
app/assets/stylesheets/generic/files.scss
... ... @@ -20,7 +20,7 @@
20 20  
21 21 .options {
22 22 float: right;
23   - margin-top: -5px;
  23 + margin-top: -3px;
24 24 }
25 25  
26 26 .left-options {
... ...
app/assets/stylesheets/sections/snippets.scss
... ... @@ -3,3 +3,6 @@
3 3 padding-top: 0;
4 4 }
5 5  
  6 +.snippet-form-holder .file-holder .file-title {
  7 + padding: 2px;
  8 +}
... ...
app/assets/stylesheets/sections/tree.scss
... ... @@ -117,15 +117,6 @@
117 117 }
118 118 }
119 119  
120   -.tree-btn-group {
121   - top: 2px;
122   -
123   - .btn {
124   - margin-right: 0px;
125   - padding: 2px 10px;
126   - }
127   -}
128   -
129 120 .tree-download-holder .btn {
130 121 padding: 4px 12px;
131 122 }
... ...
app/models/ability.rb
... ... @@ -236,7 +236,11 @@ class Ability
236 236 :"modify_#{name}",
237 237 ]
238 238 else
239   - subject.respond_to?(:project) ? project_abilities(user, subject.project) : []
  239 + if subject.respond_to?(:project)
  240 + project_abilities(user, subject.project)
  241 + else
  242 + []
  243 + end
240 244 end
241 245 end
242 246 end
... ...
app/views/projects/blob/_actions.html.haml
... ... @@ -14,6 +14,6 @@
14 14 = link_to "blame", project_blame_path(@project, @id), class: "btn btn-small" unless @blob.empty?
15 15 = link_to "history", project_commits_path(@project, @id), class: "btn btn-small"
16 16  
17   - - if allowed_tree_edit?
18   - = link_to '#modal-remove-blob', class: "remove-blob btn btn-small btn-remove", "data-toggle" => "modal" do
19   - remove
  17 +- if allowed_tree_edit?
  18 + = link_to '#modal-remove-blob', class: "remove-blob btn btn-small btn-remove", "data-toggle" => "modal" do
  19 + remove
... ...
app/views/projects/snippets/_blob.html.haml
... ... @@ -1,10 +0,0 @@
1   -.file-holder
2   - .file-title
3   - %i.icon-file
4   - %strong= @snippet.file_name
5   - %span.options
6   - .btn-group.tree-btn-group.pull-right
7   - - if can?(current_user, :admin_project_snippet, @project) || @snippet.author == current_user
8   - = link_to "Edit", edit_project_snippet_path(@project, @snippet), class: "btn btn-tiny", title: 'Edit Snippet'
9   - = link_to "Raw", raw_project_snippet_path(@project, @snippet), class: "btn btn-tiny", target: "_blank"
10   - = render 'snippets/blob_content'
app/views/projects/snippets/_form.html.haml
... ... @@ -1,42 +0,0 @@
1   -%h3.page-title
2   - = @snippet.new_record? ? "New Snippet" : "Edit Snippet ##{@snippet.id}"
3   -%hr
4   -.snippet-form-holder
5   - = form_for [@project, @snippet], as: :project_snippet, url: url, html: {class: "form-horizontal snippet-form"} do |f|
6   - -if @snippet.errors.any?
7   - .alert.alert-danger
8   - %ul
9   - - @snippet.errors.full_messages.each do |msg|
10   - %li= msg
11   -
12   - .form-group
13   - = f.label :title, class: 'control-label'
14   - .col-sm-10= f.text_field :title, placeholder: "Example Snippet", class: 'form-control', required: true
15   - .form-group
16   - .file-editor
17   - = f.label :file_name, "File", class: 'control-label'
18   - .col-sm-10
19   - .file-holder.snippet
20   - .file-title
21   - = f.text_field :file_name, placeholder: "example.rb", class: 'form-control snippet-file-name', required: true
22   - .file-content.code
23   - %pre#editor= @snippet.content
24   - = f.hidden_field :content, class: 'snippet-file-content'
25   -
26   - .form-actions
27   - - if @snippet.new_record?
28   - = f.submit 'Create snippet', class: "btn-create btn"
29   - - else
30   - = f.submit 'Save', class: "btn-save btn"
31   -
32   - - unless @snippet.new_record?
33   - .pull-right.prepend-left-20
34   - = link_to 'Remove snippet', project_snippet_path(@project, @snippet), data: { confirm: 'Are you sure?' }, method: :delete, class: "btn pull-right btn-remove delete-snippet prepend-left-10", id: "destroy_snippet_#{@snippet.id}"
35   - = link_to "Cancel", project_snippets_path(@project), class: "btn btn-cancel"
36   -
37   -:javascript
38   - var editor = ace.edit("editor");
39   - $(".snippet-form-holder form").submit(function(){
40   - $(".snippet-file-content").val(editor.getValue());
41   - });
42   -
app/views/projects/snippets/edit.html.haml
1   -= render "projects/snippets/form", url: project_snippet_path(@project, @snippet)
  1 +%h3.page-title
  2 + Edit snippet
  3 +%hr
  4 += render "shared/snippets/form", url: project_snippet_path(@project, @snippet)
... ...
app/views/projects/snippets/new.html.haml
1   -= render "projects/snippets/form", url: project_snippets_path(@project, @snippet)
  1 +%h3.page-title
  2 + New snippet
  3 +%hr
  4 += render "shared/snippets/form", url: project_snippets_path(@project, @snippet)
... ...
app/views/projects/snippets/show.html.haml
1 1 %h3.page-title
2 2 = @snippet.title
3 3  
4   - %small.pull-right
  4 + .pull-right
  5 + = link_to new_project_snippet_path(@project), class: "btn btn-new", title: "New Snippet" do
  6 + Add new snippet
  7 +
  8 +%hr
  9 +
  10 +.append-bottom-20
  11 + .pull-right
5 12 = "##{@snippet.id}"
6 13 %span.light
7 14 by
8   - = image_tag avatar_icon(@snippet.author_email), class: "avatar avatar-inline s16"
9   - = @snippet.author_name
10   -%div= render 'projects/snippets/blob'
  15 + = link_to user_path(@snippet.author) do
  16 + = image_tag avatar_icon(@snippet.author_email), class: "avatar avatar-inline s16"
  17 + = @snippet.author_name
  18 +
  19 + .back-link
  20 + = link_to project_snippets_path(@project) do
  21 + ← project snippets
  22 +
  23 +.file-holder
  24 + .file-title
  25 + %i.icon-file
  26 + %span.file_name
  27 + = @snippet.file_name
  28 + .options
  29 + .btn-group
  30 + - if can?(current_user, :modify_project_snippet, @snippet)
  31 + = link_to "edit", edit_project_snippet_path(@project, @snippet), class: "btn btn-small", title: 'Edit Snippet'
  32 + = link_to "raw", raw_project_snippet_path(@project, @snippet), class: "btn btn-small", target: "_blank"
  33 + - if can?(current_user, :admin_project_snippet, @snippet)
  34 + = link_to "remove", project_snippet_path(@project, @snippet), method: :delete, data: { confirm: "Are you sure?" }, class: "btn btn-small btn-remove", title: 'Delete Snippet'
  35 + = render 'shared/snippets/blob'
  36 +
11 37 %div#notes= render "projects/notes/notes_with_form"
... ...
app/views/shared/snippets/_blob.html.haml 0 → 100644
... ... @@ -0,0 +1,14 @@
  1 +- unless @snippet.content.empty?
  2 + - if gitlab_markdown?(@snippet.file_name)
  3 + .file-content.wiki
  4 + = preserve do
  5 + = markdown(@snippet.data)
  6 + - elsif markup?(@snippet.file_name)
  7 + .file-content.wiki
  8 + = render_markup(@snippet.file_name, @snippet.data)
  9 + - else
  10 + .file-content.code
  11 + = render 'shared/file_hljs', blob: @snippet
  12 +- else
  13 + .file-content.code
  14 + .nothing-here-block Empty file
... ...
app/views/shared/snippets/_form.html.haml 0 → 100644
... ... @@ -0,0 +1,55 @@
  1 +.snippet-form-holder
  2 + = form_for @snippet, url: url, html: { class: "form-horizontal snippet-form" } do |f|
  3 + - if @snippet.errors.any?
  4 + .alert.alert-danger
  5 + %ul
  6 + - @snippet.errors.full_messages.each do |msg|
  7 + %li= msg
  8 +
  9 + .form-group
  10 + = f.label :title, class: 'control-label'
  11 + .col-sm-10= f.text_field :title, placeholder: "Example Snippet", class: 'form-control', required: true
  12 +
  13 + - unless @snippet.respond_to?(:project)
  14 + .form-group
  15 + = f.label "Access", class: 'control-label'
  16 + .col-sm-10
  17 + = f.label :private_true, class: 'radio-label' do
  18 + = f.radio_button :private, true
  19 + %span
  20 + %strong Private
  21 + (only you can see this snippet)
  22 + %br
  23 + = f.label :private_false, class: 'radio-label' do
  24 + = f.radio_button :private, false
  25 + %span
  26 + %strong Public
  27 + (GitLab users can see this snippet)
  28 +
  29 + .form-group
  30 + .file-editor
  31 + = f.label :file_name, "File", class: 'control-label'
  32 + .col-sm-10
  33 + .file-holder.snippet
  34 + .file-title
  35 + = f.text_field :file_name, placeholder: "example.rb", class: 'form-control snippet-file-name', required: true
  36 + .file-content.code
  37 + %pre#editor= @snippet.content
  38 + = f.hidden_field :content, class: 'snippet-file-content'
  39 +
  40 + .form-actions
  41 + - if @snippet.new_record?
  42 + = f.submit 'Create snippet', class: "btn-create btn"
  43 + - else
  44 + = f.submit 'Save', class: "btn-save btn"
  45 +
  46 + - if @snippet.respond_to?(:project)
  47 + = link_to "Cancel", project_snippets_path(@project), class: "btn btn-cancel"
  48 + - else
  49 + = link_to "Cancel", snippets_path(@project), class: "btn btn-cancel"
  50 +
  51 +:javascript
  52 + var editor = ace.edit("editor");
  53 + $(".snippet-form-holder form").submit(function(){
  54 + $(".snippet-file-content").val(editor.getValue());
  55 + });
... ...
app/views/snippets/_blob.html.haml
... ... @@ -1,11 +0,0 @@
1   -.file-holder
2   - .file-title
3   - %i.icon-file
4   - %strong= @snippet.file_name
5   - %span.options
6   - .btn-group.tree-btn-group.pull-right
7   - - if @snippet.author == current_user
8   - = link_to "Edit", edit_snippet_path(@snippet), class: "btn btn-tiny", title: 'Edit Snippet'
9   - = link_to "Delete", snippet_path(@snippet), method: :delete, data: { confirm: "Are you sure?" }, class: "btn btn-tiny", title: 'Delete Snippet'
10   - = link_to "Raw", raw_snippet_path(@snippet), class: "btn btn-tiny", target: "_blank"
11   - = render 'snippets/blob_content'
app/views/snippets/_blob_content.html.haml
... ... @@ -1,14 +0,0 @@
1   -- unless @snippet.content.empty?
2   - - if gitlab_markdown?(@snippet.file_name)
3   - .file-content.wiki
4   - = preserve do
5   - = markdown(@snippet.data)
6   - - elsif markup?(@snippet.file_name)
7   - .file-content.wiki
8   - = render_markup(@snippet.file_name, @snippet.data)
9   - - else
10   - .file-content.code
11   - = render 'shared/file_hljs', blob: @snippet
12   -- else
13   - .file-content.code
14   - .nothing-here-block Empty file
app/views/snippets/_form.html.haml
... ... @@ -1,58 +0,0 @@
1   -%h3.page-title
2   - = @snippet.new_record? ? "New Snippet" : "Edit Snippet ##{@snippet.id}"
3   -%hr
4   -.snippet-form-holder
5   - = form_for @snippet, as: :personal_snippet, url: url, html: { class: "form-horizontal snippet-form" } do |f|
6   - -if @snippet.errors.any?
7   - .alert.alert-danger
8   - %ul
9   - - @snippet.errors.full_messages.each do |msg|
10   - %li= msg
11   -
12   - .form-group
13   - = f.label :title, class: 'control-label'
14   - .col-sm-10= f.text_field :title, placeholder: "Example Snippet", class: 'form-control', required: true
15   - .form-group
16   - = f.label "Access", class: 'control-label'
17   - .col-sm-10
18   - = f.label :private_true, class: 'radio-label' do
19   - = f.radio_button :private, true
20   - %span
21   - %strong Private
22   - (only you can see this snippet)
23   - %br
24   - = f.label :private_false, class: 'radio-label' do
25   - = f.radio_button :private, false
26   - %span
27   - %strong Public
28   - (GitLab users can see this snippet)
29   -
30   - .form-group
31   - .file-editor
32   - = f.label :file_name, "File", class: 'control-label'
33   - .col-sm-10
34   - .file-holder.snippet
35   - .file-title
36   - = f.text_field :file_name, placeholder: "example.rb", class: 'form-control snippet-file-name', required: true
37   - .file-content.code
38   - %pre#editor= @snippet.content
39   - = f.hidden_field :content, class: 'snippet-file-content'
40   -
41   - .form-actions
42   - - if @snippet.new_record?
43   - = f.submit 'Create snippet', class: "btn-create btn"
44   - - else
45   - = f.submit 'Save', class: "btn-save btn"
46   -
47   - - unless @snippet.new_record?
48   - .pull-right.prepend-left-20
49   - = link_to 'Remove', snippet_path(@snippet), data: { confirm: 'Removed snippet cannot be restored! Are you sure?'}, method: :delete, class: "btn btn-remove delete-snippet", id: "destroy_snippet_#{@snippet.id}"
50   - = link_to "Cancel", snippets_path(@project), class: "btn btn-cancel"
51   -
52   -
53   -:javascript
54   - var editor = ace.edit("editor");
55   - $(".snippet-form-holder form").submit(function(){
56   - $(".snippet-file-content").val(editor.getValue());
57   - });
58   -
app/views/snippets/edit.html.haml
1   -= render "snippets/form", url: snippet_path(@snippet)
  1 +%h3.page-title
  2 + Edit snippet
  3 +%hr
  4 += render "shared/snippets/form", url: snippet_path(@snippet)
... ...
app/views/snippets/new.html.haml
1   -= render "snippets/form", url: snippets_path(@snippet)
  1 +%h3.page-title
  2 + New snippet
  3 +%hr
  4 += render "shared/snippets/form", url: snippets_path(@snippet)
... ...
app/views/snippets/show.html.haml
... ... @@ -7,9 +7,9 @@
7 7 private
8 8  
9 9 .pull-right
10   - = link_to new_snippet_path, class: "btn btn-new btn-small", title: "New Snippet" do
  10 + = link_to new_snippet_path, class: "btn btn-new", title: "New Snippet" do
11 11 Add new snippet
12   -
  12 +%hr
13 13  
14 14 .append-bottom-20
15 15 .pull-right
... ... @@ -28,4 +28,16 @@
28 28 = link_to snippets_path do
29 29 ← discover snippets
30 30  
31   -%div= render 'blob'
  31 +.file-holder
  32 + .file-title
  33 + %i.icon-file
  34 + %span.file_name
  35 + = @snippet.file_name
  36 + .options
  37 + .btn-group
  38 + - if can?(current_user, :modify_personal_snippet, @snippet)
  39 + = link_to "edit", edit_snippet_path(@snippet), class: "btn btn-small", title: 'Edit Snippet'
  40 + = link_to "raw", raw_snippet_path(@snippet), class: "btn btn-small", target: "_blank"
  41 + - if can?(current_user, :admin_personal_snippet, @snippet)
  42 + = link_to "remove", snippet_path(@snippet), method: :delete, data: { confirm: "Are you sure?" }, class: "btn btn-small btn-remove", title: 'Delete Snippet'
  43 + = render 'shared/snippets/blob'
... ...
db/fixtures/development/12_snippets.rb
1 1 Gitlab::Seeder.quiet do
2 2 contents = [
3   - `curl https://gist.github.com/randx/4275756/raw/da2f262920c96d1a970d48bf2e99147954b1f4bd/glus1204.sh`,
4   - `curl https://gist.github.com/randx/3754594/raw/11026a295e6ef3a151c635707a3e1e8e15fc4725/gitlab_setup.sh `,
5   - `curl https://gist.github.com/randx/3065552/raw/29fbd09f4605a5ea22a5a9095e35fd1938dea4d6/gistfile1.sh`,
  3 + `curl https://gist.githubusercontent.com/randx/4275756/raw/da2f262920c96d1a970d48bf2e99147954b1f4bd/glus1204.sh`,
  4 + `curl https://gist.githubusercontent.com/randx/3754594/raw/11026a295e6ef3a151c635707a3e1e8e15fc4725/gitlab_setup.sh`,
  5 + `curl https://gist.githubusercontent.com/randx/3065552/raw/29fbd09f4605a5ea22a5a9095e35fd1938dea4d6/gistfile1.sh`,
6 6 ]
7 7  
8 8 (1..50).each do |i|
... ...
features/project/snippets.feature
... ... @@ -30,6 +30,5 @@ Feature: Project Snippets
30 30  
31 31 Scenario: I destroy "Snippet one"
32 32 Given I visit snippet page "Snippet one"
33   - And I click link "Edit"
34 33 And I click link "Remove Snippet"
35 34 Then I should not see "Snippet one" in snippets
... ...
features/snippets/snippets.feature
... ... @@ -24,6 +24,5 @@ Feature: Snippets Feature
24 24  
25 25 Scenario: I destroy "Personal snippet one"
26 26 Given I visit snippet page "Personal snippet one"
27   - And I click link "Edit"
28 27 And I click link "Destroy"
29 28 Then I should not see "Personal snippet one" in snippets
... ...
features/steps/project/snippets.rb
... ... @@ -48,7 +48,7 @@ class ProjectSnippets < Spinach::FeatureSteps
48 48 end
49 49  
50 50 And 'I click link "Remove Snippet"' do
51   - click_link "Remove snippet"
  51 + click_link "remove"
52 52 end
53 53  
54 54 And 'I submit new snippet "Snippet three"' do
... ...
features/steps/snippets/snippets.rb
... ... @@ -19,7 +19,7 @@ class SnippetsFeature < Spinach::FeatureSteps
19 19 end
20 20  
21 21 And 'I click link "Destroy"' do
22   - click_link "Remove"
  22 + click_link "remove"
23 23 end
24 24  
25 25 And 'I submit new snippet "Personal snippet three"' do
... ...