{#
/**
 * This file is part of FacturaScripts
 * Copyright (C) 2022-2023 Carlos Garcia Gomez <carlos@facturascripts.com>
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Lesser General Public License as
 * published by the Free Software Foundation, either version 3 of the
 * License, or (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU Lesser General Public License for more details.
 *
 * You should have received a copy of the GNU Lesser General Public License
 * along with this program. If not, see http://www.gnu.org/licenses/.
 *
 * @author Jose Antonio Cuello Principal <yopli2000@gmail.com>
 */
#}
{% set firstView = fsc.views | first %}
{% set product = firstView.model %}
{% set currentView = fsc.getCurrentView() %}

<div class="container-fluid">
    {# -- New form -- #}
    <div class="row">
        <div class="col">
            <form id="{{ 'form' ~ currentView.getViewName() ~ '0' }}" action="{{ product.url() }}" method="post"
                  enctype="multipart/form-data" onsubmit="animateSpinner('add')">
                {{ formToken() }}
                <input type="hidden" name="action" value="add-image"/>
                <input type="hidden" name="activetab" value="{{ currentView.getViewName() }}"/>
                <input type="hidden" name="idproducto" value="{{ product.primaryColumnValue() }}">
                <div class="card border-success shadow mb-3">
                    <div class="card-body p-3">
                        <div class="row g-2">
                            <div class="col-sm-2">
                                {{ trans('variant') }}
                                <select name="referencia" class="form-control mb-2">
                                    <option value="">{{ trans('all-variants') }}</option>
                                    <option value="">------</option>
                                    {% for variant in product.getVariants() %}
                                        <option value="{{ variant.referencia }}">{{ variant.referencia }}</option>
                                    {% endfor %}
                                </select>
                            </div>
                            <div class="col">
                                {{ trans('images') }}
                                <input type="file" name="newfiles[]" class="form-control" multiple=""
                                       accept="image/png, image/jpeg, image/gif" required/>
                                <p class="text-muted mb-2">
                                    {{ trans('help-server-accepts-filesize', {'%size%': currentView.model.getMaxFileUpload()}) }}
                                </p>
                            </div>
                            <div class="col-auto">
                                <br/>
                                <button type="submit" class="btn btn-success mb-2">
                                    <i class="fas fa-save fa-fw" aria-hidden="true"></i> {{ trans('add') }}
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
    {# -- Attached files -- #}
    <div class="row g-2 row-cols-1 row-cols-md-5" id="images-container">
        {% for counter, image in currentView.cursor %}
            <div class="col mb-4 images-item" data-image-id="{{ image.id }}" title="{{ trans('you-can-drag-and-drop-to-sort-the-images') }}">
                {% set border = image.referencia ? '' : 'border-primary' %}
                <div class="card {{ border }} shadow">
                    <img src="{{ asset(image.url('download')) }}" class="card-img-top"
                         alt="{{ image.referencia }}" loading="lazy">
                    <div lang="card-body"></div>
                    <div class="card-footer">
                        {% set formName = currentView.getViewName() ~ (counter + 1) %}
                        <form id="{{ 'form' ~ formName }}" action="{{ product.url() }}" method="post"
                              enctype="multipart/form-data" onsubmit="animateSpinner('add')">
                            {{ formToken() }}
                            <input type="hidden" name="action" value=""/>
                            <input type="hidden" name="activetab" value="{{ currentView.getViewName() }}"/>
                            <input type="hidden" name="idproducto" value="{{ image.idproducto }}"/>
                            <input type="hidden" name="idimage" value="{{ image.id }}"/>
                            <div class="row g-2 align-items-center">
                                <div class="col text-muted">
                                    {{ image.referencia ? image.referencia : trans('all-variants') }}
                                </div>
                                <div class="col-auto">
                                    {{ _self.buttonDelete(formName) }}
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        {% endfor %}
    </div>
</div>

{% macro buttonDelete(formName) %}
    {% set label = trans('delete-file') %}
    {% set text = trans('are-you-sure') %}
    {% set cancel = trans('cancel') %}
    {% set confirm = trans('confirm') %}
    <button type="button" class="btn btn-sm btn-outline-danger p-1"
            onclick="confirmAction('{{ formName }}','delete-image','{{ label }}','{{ text }}','{{ cancel }}','{{ confirm }}');">
        <i class="fas fa-trash-alt fa-fw" aria-hidden="true"></i>
    </button>
{% endmacro %}
