{% extends 'safety/safety_base.html' %}
{% load custom_tags_and_filters %}
{% block title %}{{ safety_page_title }}{% endblock %}
{% block safety_title %}{{ safety_page_title }}{% endblock %}
{% block tab_content %}
    {% if safety_categories or safety_items %}
        <div class="row" style="margin-bottom: 25px">
            <div class="col-sm-6">
                <input id="search" type="text" aria-label="Search" placeholder="Search" class="form-control">
            </div>
        </div>
        <div class="row">
            {% if not safety_items_expand_categories %}
                {% if safety_categories %}
                    <div class="col-sm-3">
                        <ul class="nav nav-pills nav-stacked">
                            {% if safety_general %}
                                <li class="{% if category_id is None %}active{% endif %}">
                                    <a href="{% url 'safety_categories' %}">General</a>
                                </li>
                            {% endif %}
                            {% for safety_category in safety_categories %}
                                <li class="{% if category_id and safety_category.id == category_id %}active{% endif %}">
                                    <a href="{% url 'safety_categories' safety_category.id %}">{{ safety_category.name }}</a>
                                </li>
                            {% endfor %}
                        </ul>
                    </div>
                {% endif %}
                <div class="col-sm-{% if safety_categories %}9{% else %}12{% endif %}">{% include 'safety/safety_items.html' %}</div>
            {% else %}
                <div class="col-sm-12">
                    {% if safety_general %}
                        {% include 'safety/safety_items.html' with safety_items=safety_general safety_category="General" %}
                    {% endif %}
                    {% for safety_category in safety_categories %}
                        {% include 'safety/safety_items.html' with safety_items=safety_category.safetyitem_set.all %}
                    {% endfor %}
                </div>
            {% endif %}
        </div>
    {% else %}
        <p>There are currently no safety items.</p>
        {% if user.is_superuser and "django.contrib.admin"|app_installed %}
            <p>
                Please go to <a href="{% url 'admin:NEMO_safetyitem_changelist' %}">Administration -> Detailed Administration -> SafetyItems</a>
            </p>
        {% endif %}
    {% endif %}
    <script>
        function get_safety_item(jquery_event, search_selection, dataset_name)
		{
			window.location.href = "{% url 'safety_item' 999 %}".replace('999', search_selection.id);
		}
		function on_load()
		{
			$("#search").autocomplete('safety_items', get_safety_item, '{% url 'safety_items_search' %}', true);
		}
        function open_doc(url)
        {
            ajax_get(url, undefined, ajax_success_callback, ajax_failure_callback("Unable to display document"));
        }
		window.addEventListener('load', on_load, true);
    </script>
{% endblock %}
