{% extends "admin/edit_inline/tabular.html" %}
{% load i18n %}

{% block extra_scripts %}
    {{ block.super }}
    <script type="text/javascript">
    // replace value field with the proper one for particular custom field
    // (ex. select field)
    // i don't have better idea right now how to use $ (ralph.jQuery) in this
    // template (it's loaded at the end of the body)
    document.addEventListener("DOMContentLoaded", function(event) {
        (function($) {
            $(function () {
                "use strict";
                function updateValueField($customField){
                    var customFieldId = $customField.attr('value'),
                        $td = $customField.closest('tr').find('td.field-value'),
                        propertiesToRewrite = ['id', 'name'];
                    $.ajax({
                      url: "{% url 'admin:customfield_formfield' '__empty__' %}".replace('__empty__', customFieldId),
                    }).done(function(html) {
                        var $html = $(html),
                            $elemToReplace = $td.find('input,select');
                        $.each(propertiesToRewrite, function(i, property){
                            $html.attr(property, $elemToReplace.attr(property));
                        });
                        if($elemToReplace.val()){
                            $html.val($elemToReplace.val());
                        }
                        $elemToReplace.replaceWith($html);
                    });
                }

                $("auto-complete[name^='custom_fields-customfieldvalue-content_type-object_id-']").bind(
                    "autocomplete-update",
                    function(evt) {
                        updateValueField($(evt.target));
                    }
                );
                // TODO: handle new inline rows (added dynamically)
            });
        })(ralph.jQuery);
    });
    </script>
{% endblock %}


{% block row_div_definition %}
  {% if custom_fields_values_summary %}
    <div class="small-6 medium-6 large-6 columns">
  {% else %}
    {{ block.super }}
  {% endif %}
{% endblock %}


{% block inline_extra %}
  {% if custom_fields_values_summary %}
    {# summary with (inherited) custom fields values #}
    <div class="small-6 medium-6 large-6 columns">
      <div class="inline-group">
        <div class="tabular">
          <fieldset class="module">
           <h2>{{ inline_admin_formset.opts.verbose_name_plural|capfirst }} {% trans "summary" %}</h2>
           <table>
              <thead>
                <tr>
                  <th>{% trans "Custom field" %}</th>
                  <th>{% trans "Value" %}</th>
                  <th>{% trans "Inherited from" %}</th>
                </tr>
              </thead>
              <tbody>
                {% for cfv in custom_fields_all %}
                  <tr>
                    <td>{{ cfv.name }}</td>
                    <td>{{ cfv.value }}</td>
                    <td>
                      {% if cfv.object_url %}
                        <a href="{{ cfv.object_url }}" target="_blank">
                      {% endif %}
                        {{ cfv.object }}
                      {% if cfv.object_url %}
                        </a>
                      {% endif %}
                    </td>
                  </tr>
                {% endfor %}
              </tbody>
            </table>
          </fieldset>
        </div>
      </div>
    </div>
  {% else %}
    {{ block.super }}
  {% endif %}
{% endblock %}