{# base template for file upload widget - contains form caller buttons, place for file info placing #}

{% load i18n %}

<div class="js-picrelated{{ field_name }}" ondblclick="return { load_url: '{{ load_url }}', allow_change: {{ allow_change|lower }}, allow_delete: {{ allow_delete|lower }} }">

    {# relative path to the file, is changed with JS during AJAX file upload #}
    <input name="{{ field_name }}" type="hidden" value="{{ rel_path }}" class="js-picrelated-fieldname"/>

    {# container for file info #}
    <div class="js-picrelated-pic_holder">
        {{ file_info }}	
    </div>

    {# control buttons; visibility is managed by JS #}
    <div style="padding-left: 105px; margin: 5px 0;">
        <input type="button" class="js-picrelated-upload {% if rel_path and not allow_change %}g-hidden{% endif %}" value="{% trans 'Load' %}"/><!--
        -->&nbsp;&nbsp;<!--
        --><input type="button" class="js-picrelated-delete {% if not rel_path or not allow_delete %}g-hidden{% endif %}" value="{% trans 'Remove' %}"/>
    </div>
    
</div>


{# widget registration; there is a lot of magic - it has to work for widgets in base form, inline forms, hidden inline form and jQuery plugin managed temporary inline forms #}
<script type="text/javascript">
    jQuery(function(){
        var prs = jQuery('.js-picrelated{{ field_name }}')

        if (prs.size() > 1) {
            var t = prs.eq(prs.size() - 2);
            t.each(function(i, node){ jQuery(node).picrelated() })
        }
        else {
            prs.each(function(i, node){ jQuery(node).picrelated() })
        }
    })
</script>