{% load i18n adminmedia grp_tags %}

<!-- group -->
<div class="group tabular{% if inline_admin_formset.opts.classes %} {{ inline_admin_formset.opts.classes|join:" " }}{% endif %}"
    id="{{ inline_admin_formset.formset.prefix }}-group" >
    <h2 class="collapse-handler">{% if inline_admin_formset.opts.title %}{{ inline_admin_formset.opts.title }}{% else %}{{ inline_admin_formset.opts.verbose_name_plural|capfirst }}{% endif %}</h2>
    <ul class="tools">
        <li class="add-handler-container"><a href="javascript://" class="icon add-handler" title="{% trans 'Add Another' %}"> </a></li>
    </ul>
    {{ inline_admin_formset.formset.management_form }}
    {{ inline_admin_formset.formset.non_form_errors }}
    <!-- container -->
    <div class="module table">
        <div class="module thead">
            <div class="tr">
                {% for field in inline_admin_formset.fields %}
                    {% if not field.widget.is_hidden %}
                        <div class="th {{ field.label|lower|slugify }}{% if field.required %} required{% endif %}">{{ field.label|capfirst }}</div>
                    {% endif %}
                {% endfor %}
                {% if inline_admin_formset.formset.can_delete %}<div class="th">&nbsp;</div>{% endif %}
            </div>
        </div>
        {% with inline_admin_formset.opts.sortable_field_name|default:"" as sortable_field_name %}
        {% for inline_admin_form in inline_admin_formset|formsetsort:sortable_field_name %}
            <!-- element -->
            <div class="module tbody{% if inline_admin_form.original or inline_admin_form.show_url %} has_original{% endif %}{% if forloop.last %} empty-form{% endif %}"
                id="{{ inline_admin_formset.formset.prefix }}{% if not forloop.last %}{{ forloop.counter0 }}{% else %}-empty{% endif %}">
                {% if inline_admin_form.form.non_field_errors %}
                    <ul class="errorlist"><li>{{ inline_admin_form.form.non_field_errors }}</li></ul>
                {% endif %}
                <h3 style="display: none;"><b>{{ inline_admin_formset.opts.verbose_name|title }} #{{ forloop.counter }}</b>&nbsp;&nbsp;{% if inline_admin_form.original %} {{ inline_admin_form.original }}{% endif %}</h3>
                {% spaceless %}
                {% for fieldset in inline_admin_form %}
                    {% for line in fieldset %}
                        {% for field in line %}
                            {% if field.field.is_hidden %} {{ field.field }} {% endif %}
                        {% endfor %}
                    {% endfor %}
                {% endfor %}
                {% endspaceless %}
                <div class="tr">
                    {% for fieldset in inline_admin_form %}
                        {% for line in fieldset %}
                            {% for field in line %}
                                {% if not field.field.is_hidden %}
                                    <div class="td {{ field.field.name }} {% if field.field.errors %} error{% endif %}">
                                        {% if field.is_readonly %}
                                            <p>{{ field.contents }}</p>
                                        {% else %}
                                            {{ field.field }}
                                            {{ field.field.errors.as_ul }}
                                        {% endif %}
                                        {% if field.field.help_text %}<p class="help">{{ field.field.help_text }}</p>{% endif %}
                                    </div>
                                {% endif %}
                            {% endfor %}
                        {% endfor %}
                    {% endfor %}
                    <div class="td tools">
                        {% spaceless %}
                        <ul class="tools">
                            {% if inline_admin_form.show_url %}<li class="viewsite-link-container"><a href="../../../r/{{ inline_admin_form.original_content_type_id }}/{{ inline_admin_form.original.id }}/" class="icon viewsite-link" title="{% trans 'View on Site' %}" target="_blank"> </a></li>{% endif %}
                            {% if inline_admin_formset.opts.sortable_field_name %}
                                <li class="drag-handler-container"><a href="javascript://" class="icon drag-handler" title="{% trans 'Move Item' %}"></a></li>
                            {% endif %}
                            {% if inline_admin_formset.formset.can_delete %}
                                <li class="delete-handler-container">{{ inline_admin_form.deletion_field.field }}<a href="javascript://" class="icon {% if inline_admin_form.original %}delete-handler{% else %}remove-handler{% endif %}" title="{% trans 'Remove' %}"> </a></li>
                            {% else %}
                                {% if inline_admin_form.original %}
                                    <li class="delete-handler-container">&nbsp;</li>
                                {% else %}
                                    <li class="delete-handler-container"><a href="javascript://" class="icon remove-handler" title="{% trans 'Remove' %}"> </a></li>
                                {% endif %}
                            {% endif %}
                        </ul>
                        {% endspaceless %}
                    </div>
                    {{ inline_admin_form.fk_field.field }}
                    {% if inline_admin_form.has_auto_field %}{{ inline_admin_form.pk_field.field }}{% endif %}
                </div>
            </div>
        {% endfor %}
        {% endwith %}
    </div>
    <div class="module add-item">
        <a href="javascript://" class="add-handler">{% blocktrans with inline_admin_formset.opts.verbose_name|title as verbose_name %}Add another {{ verbose_name }}{% endblocktrans %}</a>
        <ul class="tools">
            <li class="add-handler-container"><a href="javascript://" class="icon add-handler" title="{% trans 'Add Item' %}"> </a></li>
        </ul><br clear="all" />
    </div>
</div>

<script type="text/javascript">
(function($) {
    $(document).ready(function($) {
        
        var prefix = "{{ inline_admin_formset.formset.prefix }}";
        var related_lookup_fields_fk = {% get_related_lookup_fields_fk inline_admin_formset.opts %};
        var related_lookup_fields_m2m = {% get_related_lookup_fields_m2m inline_admin_formset.opts %};
        var related_lookup_fields_generic = {% get_related_lookup_fields_generic inline_admin_formset.opts %};
        var autocomplete_fields_fk = {% get_autocomplete_lookup_fields_fk inline_admin_formset.opts %};
        var autocomplete_fields_m2m = {% get_autocomplete_lookup_fields_m2m inline_admin_formset.opts %};
        var autocomplete_fields_generic = {% get_autocomplete_lookup_fields_generic inline_admin_formset.opts %};
        $.each(related_lookup_fields_fk, function() {
            $("#{{ inline_admin_formset.formset.prefix }}-group > div.table > div:not(.empty-form)")
            .find("input[name^='" + prefix + "'][name$='" + this + "']")
            .grp_related_fk({lookup_url:"{% url grp_related_lookup %}"});
        });
        $.each(related_lookup_fields_m2m, function() {
            $("#{{ inline_admin_formset.formset.prefix }}-group > div.table > div:not(.empty-form)")
            .find("input[name^='" + prefix + "'][name$='" + this + "']")
            .grp_related_m2m({lookup_url:"{% url grp_m2m_lookup %}"});
        });
        $.each(related_lookup_fields_generic, function() {
            var content_type = this[0],
                object_id = this[1];
            $("#{{ inline_admin_formset.formset.prefix }}-group > div.table > div:not(.empty-form)")
            .find("input[name^='" + prefix + "'][name$='" + this[1] + "']")
            .each(function() {
                var i = $(this).attr("id").match(/-\d+-/);
                if (i) {
                    var ct_id = "#id_" + prefix + i[0] + content_type,
                        obj_id = "#id_" + prefix + i[0] + object_id;
                    $(this).grp_related_generic({content_type:ct_id, object_id:obj_id, lookup_url:"{% url grp_related_lookup %}"});
                }
            });
        });
        $.each(autocomplete_fields_fk, function() {
            $("#{{ inline_admin_formset.formset.prefix }}-group > div.table > div:not(.empty-form)")
            .find("input[name^='" + prefix + "'][name$='" + this + "']")
            .each(function() {
                $(this).grp_autocomplete_fk({
                    lookup_url:"{% url grp_related_lookup %}",
                    autocomplete_lookup_url:"{% url grp_autocomplete_lookup %}"
                });
            });
        });
        $.each(autocomplete_fields_m2m, function() {
            $("#{{ inline_admin_formset.formset.prefix }}-group > div.table > div:not(.empty-form)")
            .find("input[name^='" + prefix + "'][name$='" + this + "']")
            .each(function() {
                $(this).grp_autocomplete_m2m({
                    lookup_url:"{% url grp_m2m_lookup %}",
                    autocomplete_lookup_url:"{% url grp_autocomplete_lookup %}"
                });
            });
        });
        $.each(autocomplete_fields_generic, function() {
            var content_type = this[0],
                object_id = this[1];
            $("#{{ inline_admin_formset.formset.prefix }}-group > div.table > div:not(.empty-form)")
            .find("input[name^='" + prefix + "'][name$='" + this[1] + "']")
            .each(function() {
                var i = $(this).attr("id").match(/-\d+-/);
                if (i) {
                    var ct_id = "#id_" + prefix + i[0] + content_type,
                        obj_id = "#id_" + prefix + i[0] + object_id;
                    $(this).grp_autocomplete_generic({
                        content_type:ct_id,
                        object_id:obj_id,
                        lookup_url:"{% url grp_related_lookup %}",
                        autocomplete_lookup_url:"{% url grp_autocomplete_lookup %}"
                    });
                }
            });
        });
        
        $("#{{ inline_admin_formset.formset.prefix }}-group").grp_inline({
            prefix: "{{ inline_admin_formset.formset.prefix }}",
            onBeforeAdded: function(inline) {},
            onAfterAdded: function(form) {
                grappelli.reinitDateTimeFields(form);
                grappelli.updateSelectFilter(form);
                $.each(related_lookup_fields_fk, function() {
                    form.find("input[name^='" + prefix + "'][name$='" + this + "']")
                    .grp_related_fk({lookup_url:"{% url grp_related_lookup %}"});
                });
                $.each(related_lookup_fields_m2m, function() {
                    form.find("input[name^='" + prefix + "'][name$='" + this + "']")
                    .grp_related_m2m({lookup_url:"{% url grp_m2m_lookup %}"});
                });
                $.each(related_lookup_fields_generic, function() {
                    var content_type = this[0],
                        object_id = this[1];
                    form.find("input[name^='" + prefix + "'][name$='" + this[1] + "']")
                    .each(function() {
                        var i = $(this).attr("id").match(/-\d+-/);
                        if (i) {
                            var ct_id = "#id_" + prefix + i[0] + content_type,
                                obj_id = "#id_" + prefix + i[0] + object_id;
                            $(this).grp_related_generic({content_type:ct_id, object_id:obj_id, lookup_url:"{% url grp_related_lookup %}"});
                        }
                    });
                });
                $.each(autocomplete_fields_fk, function() {
                    form.find("input[name^='" + prefix + "'][name$='" + this + "']")
                    .each(function() {
                        $(this).grp_autocomplete_fk({
                            lookup_url:"{% url grp_related_lookup %}",
                            autocomplete_lookup_url:"{% url grp_autocomplete_lookup %}"
                        });
                    });
                });
                $.each(autocomplete_fields_m2m, function() {
                    form.find("input[name^='" + prefix + "'][name$='" + this + "']")
                    .each(function() {
                        $(this).grp_autocomplete_m2m({
                            lookup_url:"{% url grp_m2m_lookup %}",
                            autocomplete_lookup_url:"{% url grp_autocomplete_lookup %}"
                        });
                    });
                });
                $.each(autocomplete_fields_generic, function() {
                    var content_type = this[0],
                        object_id = this[1];
                    form.find("input[name^='" + prefix + "'][name$='" + this[1] + "']")
                    .each(function() {
                        var i = $(this).attr("id").match(/-\d+-/);
                        if (i) {
                            var ct_id = "#id_" + prefix + i[0] + content_type,
                                obj_id = "#id_" + prefix + i[0] + object_id;
                            $(this).grp_autocomplete_generic({
                                content_type:ct_id,
                                object_id:obj_id,
                                lookup_url:"{% url grp_related_lookup %}",
                                autocomplete_lookup_url:"{% url grp_autocomplete_lookup %}"
                            });
                        }
                    });
                });
            },
        });
        
        {% if inline_admin_formset.opts.sortable_field_name %}
        $("#{{ inline_admin_formset.formset.prefix }}-group > div.table").sortable({
            handle: "a.drag-handler",
            items: "div.dynamic-form",
            axis: "y",
            appendTo: 'body',
            forceHelperSize: true,
            placeholder: 'ui-sortable-placeholder',
            forcePlaceholderSize: true,
            containment: '#{{ inline_admin_formset.formset.prefix }}-group > div.table',
            tolerance: 'pointer',
            start: function(evt, ui) {
                var template = "<div class='tr'>",
                    len = ui.item.find("div.tr").children("div.td").length;
                for (var i = 0; i < len; i++) {
                    template += "<div class='td' style='height:" + (ui.item.outerHeight() + 12 ) + "px'>&nbsp;</div>"
                }
                template += "</div>"
                ui.placeholder.addClass("tbody module").append(template);
            },
            stop: function(evt, ui) {
                // Toggle div.table twice to remove webkits border-spacing bug
                $("#{{ inline_admin_formset.formset.prefix }}-group > div.table").toggle().toggle();
            },
        });
        $("#{{ opts.module_name }}_form").bind("submit", function(){
            var sortable_field_name = "{{ inline_admin_formset.opts.sortable_field_name }}";
            var i = 0;
            $("#{{ inline_admin_formset.formset.prefix }}-group").find("div.tbody.dynamic-form").each(function(){
                var fields = $(this).find("div.td :input[value]");
                if (fields.serialize()) {
                    $(this).find("input[name$='"+sortable_field_name+"']").val(i);
                    i++;
                }
            });
        });
        {% endif %}
        
    });
})(django.jQuery);
</script>
