osem-fcy/app/views/conference/_schedule.html.erb

<div id="schedule-content">
    <h1 class="text-center"> Schedule for <%= @conference.title %></h1>
    <ul class="nav nav-tabs">
      <% @dates.each do |date| %>
        <li <%= "class=active" if @dates.first == date %>>
          <%= link_to date, "#" + "#{date}", "data-toggle" => "tab" %>
        </li>
    <% end %>
    </ul>

    <div class="tab-content">
      <% @dates.each do |date| %>
        <div class="tab-pane <%= 'active' if @dates.first == date %>" id ="<%= date %>" >
          <table class="table table-bordered" id="schedule" width="100%">
            <tr>
              <th>Rooms</th>
              <% (@start_hour..@end_hour-1).each do |i| %>
                  <th colspan="4"><%= "#{i}:00" %></th>
              <% end %>
            </tr>
            <% @rooms.each do |room| %>
              <% span = 1 %>
              <tr>
                <td><%= room.name %></td>
                  <% events_for_date = room.events.find_all{ |e| e.start_time.to_date == date } %>
                  <% start_time = DateTime.parse("#{date} #{@start_hour}:00") %>
                  <% (1..@intervals).each do |i| %>
                    <% events_for_time = events_for_date.find_all{|e| e.start_time == start_time} %>
                    <% if !events_for_time.empty? %>
                      <% event = events_for_time[0] %>
                      <!-- There is an event, calculate the span and show it -->
                      <% span = event.span %>
                      <%= render partial: 'schedule_item', locals: {event: event, span: span, width: @width} %>
                      <% span += 1 %>
                    <% elsif  span > 1 %>
                      <% span -= 1 %>
                    <% end %>
                    <% if span == 1 %>
                      <!-- span equals 1 show an empty td -->
                      <td style="width: <%= @width %>%"></td>
                    <% end %>
                    <% start_time += @step_minutes %>
                  <% end %>
              </tr>
            <% end %>
          </table>
        </div>
      <% end %>
    </div>
</div>
<%= javascript_tag do %>
$(function() {
  // add a hash to the URL when the user clicks on a tab
  $('a[data-toggle="tab"]').on('click', function(e) {
    history.pushState(null, null, $(this).attr('href'));
  });
  // navigate to a tab when the history changes
  window.addEventListener("popstate", function(e) {
    var activeTab = $('[href=' + location.hash + ']');
    if (activeTab.length) {
      activeTab.tab('show');
    } else {
      $('.nav-tabs a[href=#<%= j @today %>]').tab('show');
    }
  });
});

$(function() {
    var hash = window.location.hash;
    hash && $('ul.nav a[href="' + hash + '"]').tab('show');
});

<% end %>