{% extends 'layout-admin.html.twig' %}

{% block title %}Informations Patient{% endblock %}

{% block extendsstylesheet %}    
    <!-- Layout-Amin : extendsstylesheet -->
    {{ parent() }}
    <link rel="stylesheet" href="/public/assets/vendor/bootstrap-fileinput/css/fileinput.min.css"/> 
{% endblock %}

{% block content %}

    <div class="row zone_stl m-b-lg" style="display:block;">
        <div class="col-md-12">
            <h3>Téléchargez votre fichier .STL.<br/><small class="info">(Extensions de fichier autorisée : stl / poids maximum 100Mo)</small></h3>
            <div>

                <input id="upload_stl" name="upload_stl" type="file" class="form-control" data-control="false">

            </div>
            <div id="kv-error-1" class="file-error-message" style="margin:10px auto;display:none;"></div>
            <div id="kv-error-2" class="file-error-message" style="margin:10px auto;display:none;"></div>
        </div>
        <div class="col-md-12">
            <div id="upload_stl_list" class="" style="margin-top:10px;"></div>
        </div>
    </div>   

{% endblock %}


{% block extendsjavascript %}
    {{ parent() }}
    <script src="/public/assets/vendor/bootstrap-fileinput/js/fileinput.min.js"></script>
    <script src="/public/assets/vendor/bootstrap-fileinput/js/fileinput_locale_fr.js"></script>

    <script>
        let fileStl = $("#upload_stl").fileinput({
            showPreview: false,
            showUpload: false,
            allowedFileExtensions: ['jpg'],
            language: 'fr',
            uploadUrl: "/utils/ajaxUploaFiles",
            multiple: false,
            maxFileSize: 100000,
            uploadAsync: false,
            showRemove: true,
            showCaption: false,
            elErrorContainer: '#kv-error-1',
            //elErrorContainer: '#kv-error-2',
            /*browseClass: "btn bg-comptable",*/
            uploadExtraData: function () {
                /*return {
                 "file_type": "STL",
                 "upload_rep": "commandes",
                 "crypt": $("#commandecrypt").val()
                 };*/
            }
        }).on("filebatchselected", function (event, file) {
            console.log("filebatchselected", file);

            $("#UploadError").hide();

            fileStl.fileinput("upload");
            $("#upload_stl").attr("disabled", "disabled");
            if ('undefined' === typeof file[0]) {
                $("#upload_stl").removeAttr("disabled", "disabled");
            }

        }).on('filebatchuploaderror', function (event, data, msg) {
            console.log("filebatchuploaderror", data.response);

            $("#upload_stl").removeAttr("disabled", "disabled");
            $("#kv-error-1").html(data.response.message);

        }).on('filebatchuploadsuccess', function (event, data, id, index, extra) {
            console.log("filebatchuploadsuccess", data);

            $("#upload_stl").removeAttr("disabled", "disabled");
            var arrFiles = data.response;
            console.log("!!!!!arrFiles", arrFiles);

            $.each(arrFiles, function (index, file) {
                if (0 == file.error) {
                    _OCommande.addFileStl(file.tempName, 'stl');
                } else {
                    $("#kv-error-1").html('<ul><li>' + file.message + '</li></ul>');
                    $("#kv-error-1").show();
                }
            });
            //console.log("_OCommande.arrUpload", _OCommande.arrUpload);
            fileStl.fileinput('reset');
            fileStl.fileinput('clear');
        });
    </script>
{% endblock %}