<h1>Create Smart</h1>

<?php
echo "Every $granularity of each $interval<br>";

?>

<div style="background-color: red; padding: 5px; margin: 5px;">
  <b>GATE NOT ACTIVE</b>
</div>
<div style="background-color: green; padding: 5px; margin: 5px;">
  <b>GATE ACTIVE</b>
</div>

<form method="post">
  <script type="text/javascript">
function switchCell(id)
{
  cell_label = '#cell_'+id+'_label';
  cell_value = '#cell_'+id+'_value';
  if($(cell_value).val() == "0")
  {
    $(cell_value).val("1");
    $(cell_label).css("background-color","green");
  }
  else
  {
    $(cell_value).val("0");
    $(cell_label).css("background-color","red");
  }
}
</script>
  <style>
.time_base_cell {
  text-align: center;
  border: 1px solid black;
  margin: 10px;
  padding: 10px;
  width: 10px;
  height: 10px;
}

.time_header_cell {
  text-align: center;
}

.time_cell {
  background-color: red;
}
</style>

  <table>
<?php
echo ("<tr><td class=\"time_base_cell\"></td>");
foreach ( $cols as $col => $colLabel )
  echo ("<td class=\"time_base_cell time_header_cell\">{$colLabel}</td>");
echo ("</tr>");
foreach ( $rows as $row => $rowLabel )
{
  ?>
  <tr>  
<?php
  echo ("<td class=\"time_base_cell time_header_cell\">{$rowLabel}</td>");
  foreach ( $cols as $col => $colLabel )
  {
    echo ("<td title=\"{$rowLabel} / {$colLabel}\" class=\"time_base_cell time_cell\" id=\"cell_{$row}_{$col}_label\" onclick=\"switchCell('{$row}_{$col}');\"><input type=\"hidden\" id=\"cell_{$row}_{$col}_value\" name=\"value_{$row}_{$col}\" value=\"0\"></td>");
  }
  ?>
  </tr>
<?php
}
?>
</table>

<?php
echo HtmlHelper::hiddenData ( $hiddenData )?>
<br> <input type="submit">
</form>