{% extends "template.html" %}
{% block extrahead %}
    <link rel="stylesheet" type="text/css" href="{% url fm:event:css %}" />
    <link type="text/css" rel="stylesheet" href="/static/css/jquery.pager.css">
    <link type="text/css" rel="stylesheet" href="/static/apps/fm/event/css/index.css">
    <script type="text/javascript" src="/static/js/jquery.form.js"></script>
    <script type="text/javascript" src="/static/js/jquery.pager.js"></script>
    <script type="text/javascript" src="/static/apps/fm/event/js/index.js"></script>
{% endblock %}
<{% block content %}
<ul class="object-tools">
    <li><a href="#" id="toggle_panel_link" onclick="toggle_panel();">Hide Filter</a></li>
</ul>
<h1>Fault Management</h1>
<div id="form_panel">
    <form id="form">
        {% include "includes/noc_fieldset.html" %}
        <div class="submit-row">
            <INPUT TYPE="submit" VALUE="Filter" class="default"/>
        </div>
    </form>
</div>
<script type="text/javascript">
    $(document).ready(function(){
        $("#form").ajaxForm({
            dataType: "json",
            beforeSubmit : show_cover,
            success : show_result,
            url     : "{% url fm:event:events %}"
        });
        window.setTimeout(update_data, 200);
    });
</script>
<div class="module">
    <TABLE BORDER='0' width="100%" ID="events_table">
        <caption>Events: <span id="events_count"></span></caption>
        <THEAD>
            <TR>
                <TH class="event-id">#</TH>
                <TH class="event-object">Object</TH>
                <TH class="event-time">Time</TH>
                <TH class="event-status">Status</TH>
                <TH class="event-category">Category</TH>
                <TH class="event-class">Class</TH>
                <TH class="event-priority">Priority</TH>
                <TH>Subject</TH>
                <TH class="event-action">Action</TH>
            </TR>
        </THEAD>
        <TBODY>
        </TBODY>
    </TABLE>
</div>
<DIV ID="pager"></DIV>
<DIV ID="cover"></DIV>
{%endblock%}
