<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
      xmlns:tal="http://xml.zope.org/namespaces/tal"
      xmlns:metal="http://xml.zope.org/namespaces/metal"
      xmlns:i18n="http://xml.zope.org/namespaces/i18n"
      lang="en"
      metal:use-macro="context/main_template/macros/master"
      i18n:domain="xmldirector.plonecore">
<body>


<metal:main fill-slot="javascript_head_slot">
    <script type="text/javascript" tal:attributes="src string:$portal_url/++resource++xmldirector.plonecore/tableutils/js/tableutils.js"></script>
    <link rel="stylesheet" type="text/html" tal:attributes="href string:$portal_url/++resource++xmldirector.plonecore/tableutils/css/tableutils.css"/>
</metal:main>

<metal:main fill-slot="content-core">
    <metal:content-core define-macro="content-core"
        tal:define="toLocalizedTime nocall:context/@@plone/toLocalizedTime">

      <h2 i18n:translate="">Connector logfile</h2>
      <tal:def define="rows view/entries"> 

          <div class="warning" i18n:translate="" tal:condition="not: rows">
              No logger entries found
          </div>

          <table class="listing" id="logging" tal:condition="rows">
              <thead>
                  <tr>
                      <th width="15%" i18n:translate="">Date</th>
                      <th width="10%" i18n:translate="">Level</th>
                      <th width="10%" i18n:translate="">Username</th>
                      <th i18n:translate="">Comment</th>
                  </tr>
              </thead>
              <tbody>
                  <tr tal:repeat="row python: reversed(rows)">
                      <td width="15%" tal:content="python: toLocalizedTime(row['date'], True)" />
                      <td width="10%"tal:attributes="class string:level-${row/level}" tal:content="row/level" />
                      <td width="10%"tal:content="row/username" />
                      <td>
                          <span tal:content="row/comment" />
                          <tal:if condition="row/details | nothing"> 
                              (<a class="action"
                                  i18n:translate="">
                                  Details
                              </a>)
                              <pre class="details" 
                                  style="display: none"
                                  tal:content="row/details" />
                          </tal:if>
                  </tr>
              </tbody>
          </table>

          <script type="text/javascript">
              $(document).ready(function() {
                  $('.action').click(function() {
                          $(this).siblings('pre').fadeToggle('fast');
                  });
                  $('table').tableutils( {
                                filter:true,
                                fixHeader: { width: '100%', height: 600 },                 
                                paginate: { type: 'numeric', pageSize: 20 },             
                                availablePageSizes: [10, 20, 50, 100, 500],
                                columns: [                     
                                       { label: 'Date' },
                                       { label: 'Level' },
                                       { label: 'Username' },
                                       { label: 'Comment' }
                                ]
                });
              });
          </script>

      </tal:def>
  </metal:content-core>
</metal:main>

</body>
</html>

