Structured Document list for more flexible UI design with CSS (#17924).

Patch by Yonghwan SO and Mizuki ISHIKAWA.


git-svn-id: http://svn.redmine.org/redmine/trunk@21403 e93f8b46-1217-0410-a6f0-8f06a7374b81

app/views/documents/_document.html.erb

@@ -1,6 +1,8 @@
-<h4><%= link_to document.title, document_path(document) %></h4>
-<p><em><%= format_time(document.updated_on) %></em></p>
+<div class="document-item document-<%= document.id %>">
+  <h4 class="title"><%= link_to document.title, document_path(document) %></h4>
+  <div class="updated_on"><em><%= format_time(document.updated_on) %></em></div>
 
-<div class="wiki">
+  <div class="wiki description">
     <%= textilizable(truncate_lines(document.description), :object => document) %>
   </div>
+</div>

app/views/documents/index.html.erb

@@ -16,12 +16,16 @@
 
 <h2><%=l(:label_document_plural)%></h2>
 
+<div id="document-list">
 <% if @grouped.empty? %><p class="nodata"><%= l(:label_no_data) %></p><% end %>
 
 <% @grouped.keys.sort.__send__(@sort_by == 'date' ? :reverse_each : :each) do |group| %>
-    <h3><%= group %></h3>
+  <div class="document-group document-group-<%= @sort_by %>">
+    <h3 class="group-name"><%= group %></h3>
     <%= render :partial => 'documents/document', :collection => @grouped[group] %>
+  </div>
 <% end %>
+</div>
 
 <% content_for :sidebar do %>
   <h3><%= l(:label_sort_by, '') %></h3>

app/views/my/blocks/_documents.html.erb

@@ -1,3 +1,5 @@
 <h3><%=l(:label_document_plural)%></h3>
 
+<div id="document-list">
   <%= render :partial => 'documents/document', :collection => documents %>
+</div>

public/stylesheets/application.css

@@ -1129,6 +1129,12 @@ img.ui-datepicker-trigger {
   margin-left: 4px;
 }
 
+/***** Documents *****/
+
+#document-list .document-group {
+  margin-bottom: 15px;
+}
+
 /***** Progress bar *****/
 table.progress {
   border-collapse: collapse;

test/functional/documents_controller_test.rb

@@ -57,7 +57,7 @@ class DocumentsControllerTest < Redmine::ControllerTest
     assert_select '#content' do
       # ascending order of DocumentCategory#id.
       ['Uncategorized', 'Technical documentation'].each_with_index do |text, idx|
-        assert_select "h3:nth-of-type(#{idx + 1})", :text => text
+        assert_select ".document-group:nth-of-type(#{idx + 1}) h3.group-name", :text => text
       end
     end
   end
@@ -74,7 +74,7 @@ class DocumentsControllerTest < Redmine::ControllerTest
     assert_select '#content' do
       # descending order of date.
       ['2007-03-05', '2007-02-12'].each_with_index do |text, idx|
-        assert_select "h3:nth-of-type(#{idx + 1})", :text => text
+        assert_select ".document-group:nth-of-type(#{idx + 1}) h3.group-name", :text => text
       end
     end
   end
@@ -91,7 +91,7 @@ class DocumentsControllerTest < Redmine::ControllerTest
     assert_select '#content' do
       # ascending order of title.
       ['A', 'T'].each_with_index do |text, idx|
-        assert_select "h3:nth-of-type(#{idx + 1})", :text => text
+        assert_select ".document-group:nth-of-type(#{idx + 1}) h3.group-name", :text => text
       end
     end
   end
@@ -108,7 +108,7 @@ class DocumentsControllerTest < Redmine::ControllerTest
     assert_select '#content' do
       # ascending order of author.
       ['John Smith', 'Redmine Admin'].each_with_index do |text, idx|
-        assert_select "h3:nth-of-type(#{idx + 1})", :text => text
+        assert_select ".document-group:nth-of-type(#{idx + 1}) h3.group-name", :text => text
       end
     end
   end