{% extends "@bazar/layouts/input.twig" %}

{% block input %}
    {% if value %}
        <div class="bazar-entry-edit-image">
            <output id="img-{{ field.propertyName }}">{{ image|raw }}</output>
            <div class="image-actions">
                <label class="btn btn-sm btn-default">
                    <i class="fa fa-pencil-alt"></i>
                    {{ _t('BAZ_MODIFIER_IMAGE') }}
                    <input
                        type="file"
                        style="display: none;"
                        class="yw-image-upload"
                        id="{{ field.propertyName }}"
                        name="{{ field.propertyName }}"
                        accept=".webp, .svg, .avif, .jpeg, .jpg, .gif, .png"
                    >
                </label>
                {% if isAllowedToDeleteFile and not isDefaultImage %}
                    <a class="btn btn-sm btn-danger" href="{{ deleteUrl }}" onclick="javascript:return confirm('{{ _t('BAZ_CONFIRMATION_SUPPRESSION_IMAGE') }}');">
                        <i class="fa fa-trash"></i>
                        {{ _t('BAZ_SUPPRIMER_IMAGE') }}
                    </a>
                {% elseif not isDefaultImage %}            
                    <button class="btn btn-sm btn-danger" disabled="disabled"
                        data-toggle="tooltip" data-placement="bottom" title="{{ _t('BAZ_DROIT_INSUFFISANT') }}">
                        <i class="fa fa-trash"></i>
                        {{ _t('BAZ_SUPPRIMER_IMAGE') }}
                    </button>
                {% endif %}
            </div>            
        </div>
        <input type="hidden" id="oldimage_{{ field.propertyName }}" name="oldimage_{{ field.propertyName }}" value="{{ value }}" />
    {% else %}
        <input
            data-max-size="{{ maxSize}}"
            type="file"
            class="yw-image-upload form-control"
            id="{{ field.propertyName }}"
            name="{{ field.propertyName }}"
            accept=".webp, .jpeg, .jpg, .gif, .png"
            {% if field.required %}required{% endif %}
        >
        <output id="img-{{ field.propertyName }}" class="col-xs-9"></output>
    {% endif %}
{% endblock %}
