Merge pull request #1706 from riyad/refactor-tree-views-and-improve-consistency

Refactor tree views and improve consistency

13 files changed, 76 insertions, 79 deletions

diff --git a/app/assets/stylesheets/sections/tree.scss b/app/assets/stylesheets/sections/tree.scss
index c08a93fc8af..fd12ed00a2a 100644
--- a/app/assets/stylesheets/sections/tree.scss
+++ b/app/assets/stylesheets/sections/tree.scss
@@ -43,6 +43,10 @@
   }
 
   .tree-table {
+    th .btn {
+      margin: -2px -1px;
+      padding: 2px 10px;
+    }
     td {
       background:#fafafa;
     }
diff --git a/app/decorators/tree_decorator.rb b/app/decorators/tree_decorator.rb
index 754868f5805..5a7b13abfee 100644
--- a/app/decorators/tree_decorator.rb
+++ b/app/decorators/tree_decorator.rb
@@ -28,17 +28,4 @@ class TreeDecorator < ApplicationDecorator
     file = File.join(path, "..")
     h.project_tree_path(project, h.tree_join(ref, file))
   end
-
-  def history_path
-    h.project_commits_path(project, h.tree_join(ref, path))
-  end
-
-  def mb_size
-    size = (tree.size / 1024)
-    if size < 1024
-      "#{size} KB"
-    else
-      "#{size/1024} MB"
-    end
-  end
 end
diff --git a/app/views/blame/show.html.haml b/app/views/blame/show.html.haml
index 8f82b00f924..5c3231e2318 100644
--- a/app/views/blame/show.html.haml
+++ b/app/views/blame/show.html.haml
@@ -1,6 +1,6 @@
 = render "head"
 
-#tree-holder
+#tree-holder.tree-holder
   %ul.breadcrumb
     %li
       %span.arrow
@@ -15,12 +15,9 @@
     .file_title
       %i.icon-file
       %span.file_name
-        = @tree.name
-        %small blame
-      %span.options
-        = link_to "raw", project_blob_path(@project, @id), class: "btn very_small", target: "_blank"
-        = link_to "history", project_commits_path(@project, @id), class: "btn very_small"
-        = link_to "source", project_tree_path(@project, @id), class: "btn very_small"
+        = @tree.name.force_encoding('utf-8')
+        %small= number_to_human_size @tree.size
+      %span.options= render "tree/blob_actions"
     .file_content.blame
       %table
         - @blame.each do |commit, lines|
diff --git a/app/views/tree/_blob.html.haml b/app/views/tree/_blob.html.haml
new file mode 100644
index 00000000000..9ede3f8eb20
--- /dev/null
+++ b/app/views/tree/_blob.html.haml
@@ -0,0 +1,13 @@
+.file_holder
+  .file_title
+    %i.icon-file
+    %span.file_name
+      = blob.name.force_encoding('utf-8')
+      %small= number_to_human_size blob.size
+    %span.options= render "tree/blob_actions"
+  - if blob.text?
+    = render "tree/blob/text", blob: blob
+  - elsif blob.image?
+    = render "tree/blob/image", blob: blob
+  - else
+    = render "tree/blob/download", blob: blob
diff --git a/app/views/tree/_blob_actions.html.haml b/app/views/tree/_blob_actions.html.haml
new file mode 100644
index 00000000000..d51f7205ef6
--- /dev/null
+++ b/app/views/tree/_blob_actions.html.haml
@@ -0,0 +1,12 @@
+.btn-group.tree-btn-group
+  -# only show edit link for text files
+  - if @tree.text?
+    = link_to "edit", edit_project_tree_path(@project, @id), class: "btn very_small"
+  = link_to "raw", project_blob_path(@project, @id), class: "btn very_small", target: "_blank"
+  -# only show normal/blame view links for text files
+  - if @tree.text?
+    - if current_page? project_blame_path(@project, @id)
+      = link_to "normal view", project_tree_path(@project, @id), class: "btn very_small"
+    - else
+      = link_to "blame", project_blame_path(@project, @id), class: "btn very_small"
+  = link_to "history", project_commits_path(@project, @id), class: "btn very_small"
diff --git a/app/views/tree/_readme.html.haml b/app/views/tree/_readme.html.haml
new file mode 100644
index 00000000000..4e5f4b403c5
--- /dev/null
+++ b/app/views/tree/_readme.html.haml
@@ -0,0 +1,10 @@
+.file_holder#README
+  .file_title
+    %i.icon-file
+    = readme.name
+  .file_content.wiki
+    - if gitlab_markdown?(readme.name)
+      = preserve do
+        = markdown(readme.data)
+    - else
+      = raw GitHub::Markup.render(readme.name, readme.data)
\ No newline at end of file
diff --git a/app/views/tree/_submodule_item.html.haml b/app/views/tree/_submodule_item.html.haml
index cfb0256ce88..43fa7f24642 100644
--- a/app/views/tree/_submodule_item.html.haml
+++ b/app/views/tree/_submodule_item.html.haml
@@ -7,5 +7,5 @@
     %strong= truncate(name, length: 40)
   %td
     %code= submodule_item.id[0..10]
-  %td
+  %td{ colspan: 2 }
     = link_to truncate(url, length: 40), url
diff --git a/app/views/tree/_tree.html.haml b/app/views/tree/_tree.html.haml
index 2937a474bd9..71192109b8f 100644
--- a/app/views/tree/_tree.html.haml
+++ b/app/views/tree/_tree.html.haml
@@ -12,15 +12,14 @@
 
 %div#tree-content-holder.tree-content-holder
   - if tree.is_blob?
-    = render partial: "tree/tree_file", object: tree
+    = render "tree/blob", blob: tree
   - else
     %table#tree-slider{class: "table_#{@hex_path} tree-table" }
       %thead
         %th Name
         %th Last Update
-        %th
-          Last commit
-          = link_to "History", tree.history_path, class: "right"
+        %th Last Commit
+        %th= link_to "history", project_commits_path(@project, @id), class: "btn very_small right"
 
       - if tree.up_dir?
         %tr.tree-item
@@ -29,20 +28,12 @@
             = link_to "..", tree.up_dir_path
           %td
           %td
+          %td
 
       = render_tree(tree.contents)
 
-    - if content = tree.contents.find { |c| c.is_a?(Grit::Blob) and c.name =~ /^readme/i }
-      .file_holder#README
-        .file_title
-          %i.icon-file
-          = content.name
-        .file_content.wiki
-          - if gitlab_markdown?(content.name)
-            = preserve do
-              = markdown(content.data)
-          - else
-            = raw GitHub::Markup.render(content.name, content.data)
+    - if readme = tree.contents.find { |c| c.is_a?(Grit::Blob) and c.name =~ /^readme/i }
+      = render "tree/readme", readme: readme
 
 - unless tree.is_blob?
   :javascript
diff --git a/app/views/tree/_tree_file.html.haml b/app/views/tree/_tree_file.html.haml
deleted file mode 100644
index 5202126792a..00000000000
--- a/app/views/tree/_tree_file.html.haml
+++ /dev/null
@@ -1,42 +0,0 @@
-.file_holder
-  .file_title
-    %i.icon-file
-    %span.file_name
-      = tree_file.name.force_encoding('utf-8')
-      %small #{tree_file.mode}
-    %span.options
-      .btn-group.tree-btn-group
-        = link_to "raw", project_blob_path(@project, @id), class: "btn very_small", target: "_blank"
-        = link_to "history", project_commits_path(@project, @id), class: "btn very_small"
-        = link_to "blame", project_blame_path(@project, @id), class: "btn very_small"
-        = link_to "edit", edit_project_tree_path(@project, @id), class: "btn very_small"
-  - if tree_file.text?
-    - if gitlab_markdown?(tree_file.name)
-      .file_content.wiki
-        = preserve do
-          = markdown(tree_file.data)
-    - elsif markup?(tree_file.name)
-      .file_content.wiki
-        = raw GitHub::Markup.render(tree_file.name, tree_file.data)
-    - else
-      .file_content.code
-        - unless tree_file.empty?
-          %div{class: current_user.dark_scheme ? "black" : "white"}
-            = preserve do
-              = raw tree_file.colorize(options: { linenos: 'True'})
-        - else
-          %h4.nothing_here_message Empty file
-
-  - elsif tree_file.image?
-    .file_content.image_file
-      %img{ src: "data:#{tree_file.mime_type};base64,#{Base64.encode64(tree_file.data)}"}
-
-  - else
-    .file_content.blob_file
-      %center
-        = link_to project_blob_path(@project, @id) do
-          %div.padded
-            %br
-            = image_tag "download.png", width: 64
-            %h3
-              Download (#{tree_file.mb_size})
diff --git a/app/views/tree/_tree_item.html.haml b/app/views/tree/_tree_item.html.haml
index e9675248e79..0a76d5c21b6 100644
--- a/app/views/tree/_tree_item.html.haml
+++ b/app/views/tree/_tree_item.html.haml
@@ -6,4 +6,4 @@
     %span.log_loading.hide
       Loading commit data...
       = image_tag "ajax_loader_tree.gif", width: 14
-  %td.tree_commit
+  %td.tree_commit{ colspan: 2 }
diff --git a/app/views/tree/blob/_download.html.haml b/app/views/tree/blob/_download.html.haml
new file mode 100644
index 00000000000..c307622995b
--- /dev/null
+++ b/app/views/tree/blob/_download.html.haml
@@ -0,0 +1,8 @@
+.file_content.blob_file
+  %center
+    = link_to project_blob_path(@project, @id) do
+      %div.padded
+        %br
+        = image_tag "download.png", width: 64
+        %h3
+          Download (#{number_to_human_size blob.size})
diff --git a/app/views/tree/blob/_image.html.haml b/app/views/tree/blob/_image.html.haml
new file mode 100644
index 00000000000..7b23f0c810c
--- /dev/null
+++ b/app/views/tree/blob/_image.html.haml
@@ -0,0 +1,2 @@
+.file_content.image_file
+  %img{ src: "data:#{blob.mime_type};base64,#{Base64.encode64(blob.data)}"}
diff --git a/app/views/tree/blob/_text.html.haml b/app/views/tree/blob/_text.html.haml
new file mode 100644
index 00000000000..c506a39f338
--- /dev/null
+++ b/app/views/tree/blob/_text.html.haml
@@ -0,0 +1,15 @@
+- if gitlab_markdown?(blob.name)
+  .file_content.wiki
+    = preserve do
+      = markdown(blob.data)
+- elsif markup?(blob.name)
+  .file_content.wiki
+    = raw GitHub::Markup.render(blob.name, blob.data)
+- else
+  .file_content.code
+    - unless blob.empty?
+      %div{class: current_user.dark_scheme ? "black" : "white"}
+        = preserve do
+          = raw blob.colorize(options: { linenos: 'True'})
+    - else
+      %h4.nothing_here_message Empty file