test

<br/>
    <style text = "type/css">
        tr, td.border_bottom td
        {
            border-bottom:1pt solid grey !important;

        }

        th
        {
            background-color: sienna;
            color: white;
        }

        .table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
            background-color: #708090;
        }
    </style>

<script>
    $(function() {
    setInterval(function(){ $.get("/simulations/<%= @simulation.id %>"); }, 5000);
    });
</script>

<table class="table">
    <thead>
        <tr>
            <th colspan="1"> Name</th>
            <th colspan="1"> <%= @simulation.name %></th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td colspan="1"> Verdict </td>
              <td colspan="1"> <span id = "matrix_verdict"><%= @simulation.verdict %></span></td>
        </tr>
    </tbody>
</table>

<br/>

<h3>Current State Representation </h3>

<span id="matrix_data">
    <table class = 'table table-hover'>
      <% JSON.parse(@simulation.matrix).each do |tuple| %>
          <tr>
            <% tuple.each do |value| %>
                <td><%= value %></td>
            <% end %>
          </tr>
      <% end %>
    </table>
</span>