<%= for {{{comment_base, by_stop_base}, {comment_diff, by_stop_diff}}, i} <- Enum.with_index(@vehicle_archive) do %>
  <% {trip_update_base, trip_update_diff} = Enum.at(@trip_update_archive, i) %>
  <div id="viz-<%= i %>" class="viz-tool viz-hidden">
    <div class="viz-comment"><%= comment_base %> / <%= comment_diff %></div>

    <h2>Routes</h2>

    <%= for {route_name, stops} <- @routes do %>
      <h3><%= route_name %></h3>
      <table class="viz-ladder">
        <tr>
          <th class="viz-position">Next Train Arrives at:</th>
          <th class="viz-position">Transit
          <th class="viz-position">Incoming</th>
          <th class="viz-position">At</th>
          <th>Station</th>
          <th class="viz-position">At</th>
          <th class="viz-position">Incoming</th>
          <th class="viz-position">Transit</th>
          <th class="viz-position">Next Train Arrives at:</th>
        </tr>

        <%= for {stop_name, stop_id_0, stop_id_1} <- stops do %>
          <% vs0_base = by_stop_base[stop_id_0] || [] %>
          <% vs1_base = by_stop_base[stop_id_1] || [] %>
          <% base_trips_0 = trip_update_base[stop_id_0] || [] %>
          <% base_trips_1 = trip_update_base[stop_id_1] || [] %>

          <% vs0_diff = by_stop_diff[stop_id_0] || [] %>
          <% vs1_diff = by_stop_diff[stop_id_1] || [] %>
          <% diff_trips_0 = trip_update_diff[stop_id_0] || [] %>
          <% diff_trips_1 = trip_update_diff[stop_id_1] || [] %>



          <tr>
            <td>
              <%= for prediction <- format_times(base_trips_0) do %>
                🚂 <%= prediction %><br>
              <% end %>
              <%= for prediction <- format_times(diff_trips_0) do %>
                👻 <%= prediction %><br>
              <% end %>
            </td>
            <td>
              <%= Phoenix.HTML.raw trainify_diff(vs0_base, vs0_diff, :IN_TRANSIT_TO, "🚂", "👻")%>
            </td>
            <td>
              <%= Phoenix.HTML.raw trainify_diff(vs0_base, vs0_diff, :INCOMING_AT, "🚂", "👻")%>
            </td>
            <td>
              <%= Phoenix.HTML.raw trainify_diff(vs0_base, vs0_diff, :STOPPED_AT, "🚂", "👻")%>
            </td>
            <td>
              <%= stop_name %>
            </td>
            <td>
              <%= Phoenix.HTML.raw trainify_diff(vs1_base, vs1_diff, :STOPPED_AT, "🚂", "👻")%>
            </td>
            <td>
              <%= Phoenix.HTML.raw trainify_diff(vs1_base, vs1_diff, :INCOMING_AT, "🚂", "👻")%>
            </td>
            <td>
              <%= Phoenix.HTML.raw trainify_diff(vs1_base, vs1_diff, :IN_TRANSIT_TO, "🚂", "👻")%>
            </td>
            <td>
              <%= for prediction <- format_times(base_trips_1) do %>
                🚂 <%= prediction %><br>
              <% end %>
              <%= for prediction <- format_times(diff_trips_1) do %>
                👻 <%= prediction %><br>
              <% end %>
            </td>
          </tr>
        <% end %>
      </table>
    <% end %>
  </div>
<% end %>
