.container#program
  = render 'schedule_tabs', active: 'now'

  %h1.text-center
    Happening Now at
    = @conference.title

  .row
    .col-md-12
      %h2
        #{pluralize(@events_schedules.count, 'Event')} Occurring Within The Next 30 minutes.
      %h3
        This page was loaded at
        = inyourtz(Time.now) do
          #{Time.now.strftime('%a %b %d at %I:%M %P (%z)')}

  .row
    / TODO: Clean this up, merge with all events page.
    / scheduled events
    - date = nil
    - time = nil
    - @events_schedules.each do |event_schedule|
      - unless event_schedule.start_time.strftime('%Y-%m-%d').eql?(date)
        .col-xs-12.col-md-12
          .date-content
            %span{ class: 'date-title', id: "#{ event_schedule.start_time.strftime('%Y-%m-%d') }" }
              = inyourtz(event_schedule.start_time, @conference.timezone) do
                = date = event_schedule.start_time.strftime('%Y-%m-%d')
            %a{ title: "Go up", class: "pull-right", href: "#program" }
              %i{ class: "fa fa-angle-double-up fa-lg", 'aria-hidden' => true }
      - unless event_schedule.start_time.strftime('%H:%M').eql?(time)
        .col-xs-12.col-md-1
          .start-time
            = inyourtz(event_schedule.start_time, @conference.timezone) do
              = time = event_schedule.start_time.strftime('%H:%M')
        .col-xs-12.col-md-11
          .new-time-event
            = render 'event', event: event_schedule.event, event_schedule: event_schedule
      - else
        .col-xs-12.col-md-11.col-md-offset-1
          = render 'event', event: event_schedule.event, event_schedule: event_schedule

:javascript
  // Refresh the page every 5 minutes.
  $(document).ready(function(){
    setTimeout(function() {
      window.location = window.location;
    }, 5 * 60 * 1000);
  });