change time table lists look

7 files changed, 101 insertions, 60 deletions

diff --git a/app/assets/stylesheets/main/time_tables.css.scss b/app/assets/stylesheets/main/time_tables.css.scss
index 0989b5745..10a8ca161 100644
--- a/app/assets/stylesheets/main/time_tables.css.scss
+++ b/app/assets/stylesheets/main/time_tables.css.scss
@@ -8,8 +8,14 @@
     .time_tables {
         margin-top: 20px;
     }
-    
+
     .time_table {
+        span.included_day_type {
+            font-weight: bolder;
+            color: black;
+        }
+        span.excluded_day_type {
+        }
 
         .state-code {
             width: 25px;
@@ -28,7 +34,7 @@
                 width: 25px;
                 height: 25px;
             }
-            
+
             .validity_regular {
                 background-color: #86B41D;
                 width: 25px;
@@ -42,12 +48,12 @@
 #workspace.time_tables.show
 {
     .modal-body{overflow-y: visible;}
-    
+
     .typeahead.dropdown-menu {
     z-index: 100001;
-    }    
+    }
 
-    .day_type { 
+    .day_type {
       border-style:solid;
       border-width:1px;
       }
@@ -91,7 +97,7 @@
             background-color: #86B41D;
         }
     }
-}        
+}
 
 #workspace.time_tables.edit,#workspace.time_tables.new,#workspace.time_tables.create,#workspace.time_tables.update
 {
@@ -110,17 +116,17 @@
     #dates,#excluded_dates,#periods{
         .nested-fields {
             margin: 5px;
-            
-            ol {            
+
+            ol {
                 li {
                     display: inline;
                 }
             }
         }
-        
+
         margin-left: 25%;
     }
-    
+
     .day_type ol {
         float: left;
         margin: 0;
@@ -145,14 +151,14 @@
         padding-left: 10%;
         margin-top: 0;
     }
-        
+
     a.add_fields {
         margin-left: 25%;
         margin-top: 20px;
         padding-left: 18px;
         background: url(image-path('icons/add.png')) no-repeat 0% 50%;
     }
-    
+
     a.remove_fields {
         margin-left: 10px;
         padding-left: 18px;
@@ -162,5 +168,5 @@
     .actions{
         margin-top: 20px;
     }
-    
+
 }
diff --git a/app/assets/stylesheets/main/vehicle_journeys.css.scss b/app/assets/stylesheets/main/vehicle_journeys.css.scss
index f6e21ad68..fb872738d 100644
--- a/app/assets/stylesheets/main/vehicle_journeys.css.scss
+++ b/app/assets/stylesheets/main/vehicle_journeys.css.scss
@@ -9,13 +9,13 @@
         color: white;
         font-weight: bold;
     }
-                 
+
     .journey_pattern_dependent_list {
         tr.no_stop { display: none; }
     }
-    
+
     .time_table_list { padding-left: 25%; }
-    
+
     .vehicle_journey_at_stops {
         margin-left: 25%;
 
@@ -31,9 +31,9 @@
 
         .slide{
             margin-left: 30px;
-            
+
         }
-    }    
+    }
 }
 
 #workspace.vehicle_journeys.index
@@ -42,7 +42,7 @@
         .panel-heading .btn{
             margin-left: 20px;
         }
-        
+
         ul.token-input-list{
             display: inline-block;
             vertical-align: middle;
@@ -53,9 +53,9 @@
         .advanced_search_link{
             vertical-align: -webkit-baseline-middle;
         }
-        
+
     }
-    
+
     table{
 
         margin: 20px 0 0 0;
@@ -65,34 +65,34 @@
         }
 
         .stop_area{ width: 200px; }
-    }   
-    
+    }
+
 }
 
-#workspace.vehicle_journeys.show, #workspace.vehicle_journeys.edit, #workspace.vehicle_journeys.update, #workspace.vehicle_journeys.create, #workspace.vehicle_journeys.new {                                 
-    
+#workspace.vehicle_journeys.show, #workspace.vehicle_journeys.edit, #workspace.vehicle_journeys.update, #workspace.vehicle_journeys.create, #workspace.vehicle_journeys.new {
+
     .to_departures {
         cursor: pointer;
     }
-    
+
     .to_arrivals {
         cursor: pointer;
-    }            
-    
+    }
+
     .slide {
         cursor: pointer;
-    }            
+    }
 }
 
 #workspace.vehicle_journeys.show
 {
     .summary p label {
         font-weight: bold;
-    }   
+    }
 
     .time_tables {
         margin-top: 20px;
-    }   
+    }
 
     .time_table {
         span.included_day_type {
@@ -101,15 +101,40 @@
         }
         span.excluded_day_type {
         }
+
+        .state-code {
+            width: 25px;
+            height: 64px;
+            float: left;
+            margin-right: 10px;
+
+            .validity_out {
+                background-color: #FC4903;
+                width: 25px;
+                height: 25px;
+            }
+
+            .validity_out_soon {
+                background-color: orange;
+                width: 25px;
+                height: 25px;
+            }
+
+            .validity_regular {
+                background-color: #86B41D;
+                width: 25px;
+                height: 25px;
+            }
+        }
     }
-}        
+}
 
 #workspace.vehicle_journeys.timeless
 {
     .summary p label {
         font-weight: bold;
     }
-   
+
     .vehicle_journeys {
         margin-top: 20px;
     }
@@ -123,7 +148,7 @@
         span.excluded_day_type {
         }
     }
-}        
+}
 
 
 
diff --git a/app/helpers/time_tables_helper.rb b/app/helpers/time_tables_helper.rb
index 100dfc656..e0c1fc2db 100644
--- a/app/helpers/time_tables_helper.rb
+++ b/app/helpers/time_tables_helper.rb
@@ -8,9 +8,12 @@ module TimeTablesHelper
       "validity_regular"
     end
   end
+  def tag_list_shortened(time_table)
+    time_table.tags.join(', ').truncate(30, separator: ',')
+  end
   def bounding_info(time_table)
     return t('time_tables.time_table.empty') if time_table.bounding_dates.empty?
-    t('time_tables.time_table.bounding', 
+    t('time_tables.time_table.bounding',
         :start => l(time_table.bounding_dates.min),
         :end => l(time_table.bounding_dates.max))
   end
@@ -37,17 +40,17 @@ module TimeTablesHelper
     elsif time_table.periods.empty?
       t('time_tables.time_table.dates_count', :count => time_table.dates.count)
     else
-      t('time_tables.time_table.periods_dates_count', 
+      t('time_tables.time_table.periods_dates_count',
         :dates_count => time_table.dates.count,
         :periods_count => time_table.periods.count)
     end
   end
-  
+
   def time_table_description(time_table)
     if time_table.bounding_dates.empty?
       "#{time_table.comment} (vide)"
     else
-      "#{time_table.comment} : #{time_table_bounding( time_table)} - #{composition_info(time_table)}"  
+      "#{time_table.comment} : #{time_table_bounding( time_table)} - #{composition_info(time_table)}"
     end
   end
 end
diff --git a/app/views/time_tables/_cell_info.html.erb b/app/views/time_tables/_cell_info.html.erb
new file mode 100644
index 000000000..6ca63ba77
--- /dev/null
+++ b/app/views/time_tables/_cell_info.html.erb
@@ -0,0 +1,14 @@
+    <%= time_tables_shortest_info(time_table) %>
+    <% unless time_table.periods.empty? %>
+      <div>
+      <% %w(monday tuesday wednesday thursday friday saturday sunday).each do |day_type| %>
+        <span class="<%= time_table.send( day_type) ? "included_day_type" : "excluded_day_type" %>">
+          <%= time_table.human_attribute_name(day_type).first(2) %>
+        </span>
+      <% end %>
+      </div>
+    <% end %>
+    <% unless time_table.tags.empty? %>
+      <div><%= tag_list_shortened(time_table) %></div>
+    <% end %>
+
diff --git a/app/views/time_tables/_cell_title.html.erb b/app/views/time_tables/_cell_title.html.erb
new file mode 100644
index 000000000..22ada09eb
--- /dev/null
+++ b/app/views/time_tables/_cell_title.html.erb
@@ -0,0 +1,10 @@
+  <%= link_to([@referential, time_table]) do %>
+    <div class="state-code" >
+      <div class="<%= time_table_state_code(time_table) %>" >
+      </div>
+    </div>
+  <% end %>
+  <div class="name">
+  <%= link_to truncate(time_table.comment, :length => 30), [@referential, time_table], :title => "#{Chouette::TimeTable.model_name.human.capitalize} #{time_table.comment}"%>
+  </div>
+
diff --git a/app/views/time_tables/_time_table.html.erb b/app/views/time_tables/_time_table.html.erb
index 0679008fc..bf3ace290 100644
--- a/app/views/time_tables/_time_table.html.erb
+++ b/app/views/time_tables/_time_table.html.erb
@@ -1,17 +1,8 @@
 <%= div_for(time_table) do %>
-  <%= link_to([@referential, time_table]) do %>
-    <div class="state-code" >
-      <div class="<%= time_table_state_code(time_table) %>" >
-      </div>
-    </div>
-  <% end %>
-  <div class="name">
-  <%= link_to truncate(time_table.comment, :length => 30), [@referential, time_table], :title => "#{Chouette::TimeTable.model_name.human.capitalize} #{time_table.comment}"%>
-  </div>
+  <%= render "cell_title", time_table: time_table  %>
   <div class="info">
-    <%= time_tables_shortest_info(time_table) %> -
-    <%= composition_info(time_table) %>
-    <div class="actions">  
+    <%= render "cell_info", time_table: time_table  %>
+    <div class="actions">
       <%= link_to t("actions.edit"), edit_referential_time_table_path(@referential, time_table), :class => "edit" %> |
       <%= link_to t("actions.destroy"), referential_time_table_path(@referential, time_table), :method => :delete, :data => {:confirm =>  t('time_tables.actions.destroy_confirm')}, :class => "remove" %>
     </div>
diff --git a/app/views/vehicle_journeys/_time_table.html.erb b/app/views/vehicle_journeys/_time_table.html.erb
index 61043ab3b..f9e51ac37 100644
--- a/app/views/vehicle_journeys/_time_table.html.erb
+++ b/app/views/vehicle_journeys/_time_table.html.erb
@@ -1,15 +1,7 @@
 <%= div_for(time_table, :class => "time_table") do %>
-  <%= link_to time_table.comment, [@referential, time_table] %>
+  <%= render "time_tables/cell_title", time_table: time_table  %>
   <div class="info">
-    <%= composition_info(time_table) %> -
-    <% unless time_table.periods.empty? %>
-      <% %w(monday tuesday wednesday thursday friday saturday sunday).each do |day_type| %>
-        <span class="<%= time_table.send( day_type) ? "included_day_type" : "excluded_day_type" %>">
-          <%= time_table.human_attribute_name(day_type).first(2) %>
-        </span>
-      <% end %>
-    <% end %> -
-    <%= bounding_info(time_table) %>
+    <%= render "time_tables/cell_info", time_table: time_table  %>
   </div>
 <% end %>