{% extends 'admin/base.html' %}
{% load i18n %}

{% block title %}{% trans 'Add Transit' %}{% endblock %}

{% block extrahead %}
    {{ block.super }}
    <link href="{{ MEDIA_URL }}timereport/css/transit.css" rel="stylesheet" type="text/css" media="screen" />
    <script src="{{ MEDIA_URL }}admin/js/jquery.min.js" type="text/javascript"></script>
    <script src="{{ MEDIA_URL }}admin/js/jqclock/jqclock-1.2.0.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(function($) {
           var options = {
                timeNotation: '24h',
                am_pm: false,
                fontFamily: 'Verdana, Times New Roman',
                fontSize: '43px'
              }; 
           $('.jclock').jclock(options);
           {% if auth_by_badge %}
           document.getElementById('id_badge').focus();
           {% endif %}
        });
        function stopRKey(evt) {
           //var evt = (evt) ? evt : ((event) ? event : null);
           //var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
           //if ((evt.keyCode == 13) && (node.type=="password")) {return false;}
           if (evt.keyCode == 13) {return false;}
        }
        document.onkeypress = stopRKey;
    </script>
{% endblock %}

{% block content %}
    <div id="inner_small">
        <form action="" method="post">
        {% csrf_token %}
            <div class="button">
                <input type="image" src="{{ MEDIA_URL }}timereport/img/button_enter.gif" name="in" value="in" alt="IN"/>
            </div>
            <div class="button_center">
                <div class="jclock"></div>
                {% if auth_by_badge %}
                    <input id="id_badge" type="password" name="badge" maxlength=12 size=6/>
                {% else %}
                    <p class="user">{{ request.user.username }}</p>
                {% endif %}
            </div>
            <div class="button">
                <input type="image" src="{{ MEDIA_URL }}timereport/img/button_exit.gif" name="out" value="out" alt="OUT"/>
            </div>
            <div style="clear:both;"></div>
        </form>
        <div id="msg">
            {% if errors %}
            <ul class="errorlist">
            {% for error in errors %}
                <li><strong>{{ error|escape }}</strong></li>
            {% endfor %}
            </ul>
            {% endif %}

            {% if messages %}
            <ul class="messagelist">
            {% for message in messages %}
                <li><strong>{{ message|escape }}</strong></li>
            {% endfor %}
            </ul>
            {% endif %}
        </div>
    </div>
{% endblock %}