<style>
    #InputFile > input{
        position:absolute;
        cursor:pointer;
        left:0px;
        top:0px;
        width:100%;
        height:100%;
        opacity:0.01;
    }

</style>
<div class="modal fade" role="dialog" id="import_recipe_modal" aria-hidden="true" data-backdrop="static">
    <div class="modal-dialog" style="width:36%;">
        <div class="modal-content">
            <?php echo Forms::ModalLoader("import_recipe_loader"); ?>
            <div class="modal-header text-left">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="pg-close fs-20"></i>
                </button>
                <h5 class="semi-bold"><?php print CommonLanguage::getMessage('import_recipe');?></h5>
            </div>
            <div class="modal-body">
                <form method="post" enctype="multipart/form-data" id="Upload_Excel" onsubmit="return false">
                    <div class="row">
                        <div  id="import_recipe_succ" ></div>
                        <div  id="import_recipe_err" ></div>
                    </div>
                    <div class="row form-group" >
                        <a style="color: black;" href="<?php echo SITE_LINK; ?>uploads/Templatexlsx/import_recipe.xlsx" id="TemplateReference"><i class="fa fa-download"></i> <?php print CommonLanguage::getMessage('Download_Template'); ?></a>
                    </div>
                    <div class="row form-group" >   
                        <label><?php print CommonLanguage::getMessage('Upload_Downloaded_File'); ?> </label>
                        <div class="btn btn-primary full-width" id="InputFile" style="cursor:pointer;"><i class="fa fa-upload"></i> <?php print CommonLanguage::getMessage('Upload'); ?> <input type="file" onchange="window.NewCurrentFileUploadadd = event.target.files;ValidateForNewFile(this, '#InputFile')" name="Document_File_Name" value="Upload"></div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><?php print CommonLanguage::getMessage('Close'); ?></button>
                <button class="btn btn-primary white"  id="submit_import_recipe"><?php print CommonLanguage::getMessage('Save'); ?></button>
            </div>
        </div>
    </div>
</div>
<script>
    var Submitted_Successfully = <?php echo json_encode(CommonLanguage::getMessage('Submitted_Successfully')); ?>,
        alert_excel = <?php echo json_encode(CommonLanguage::getMessage('excel_type_err')); ?>;
        $(function () {
            $('#import_recipe_modal').on('hidden.bs.modal',function(){
                $("#InputFile >input").val('');
                $("#InputFile >.fa-check").hide();
                $("#submit_import_recipe").prop('disabled', false);
                $("#import_recipe_succ, #import_recipe_err").addClass("hidden");
            });
        });

    $("#submit_import_recipe").on("click", function () {      
        var FileName = $.trim($("#InputFile > input").val()),
            FileType = FileName.substring(FileName.lastIndexOf(".")).toLowerCase();
        if (FileType == ".xlsx" || FileType == ".xls") {
            $("#import_recipe_succ, #import_recipe_err").addClass("hidden");
            var Data = new FormData(document.getElementById("Upload_Excel"));
            $("#submit_import_recipe").prop('disabled', true);
            $("#import_recipe_loader").removeClass('hidden');
            $.ajax({
                url: 'InventoryAjax/importRecipe',
                data: Data,
                method: "POST",
                processData: false,
                contentType: false,
                dataType: "json",
                complete: function (v1, v2) {
                    if (v2 == 'success') {
                        if (v1.responseJSON.is_insert == '1') {  //if ok no error
                            //hideModalAlert('import_recipe_modal');
                            $("#import_recipe_succ").attr('class', 'alert alert-success').html(Submitted_Successfully);
                        }
						if(v1.responseJSON.err_msg != '')
							$("#import_recipe_err").attr('class', 'alert alert-danger').html(v1.responseJSON.err_msg);
                    } else
                        $("#import_recipe_err").attr('class', 'alert alert-danger').html( v2 + ': ' + v1.responseText);
                    $("#import_recipe_loader").addClass('hidden');
                }
            });
        } else {
            $("#import_recipe_err").attr('class', 'alert alert-danger').html(alert_excel);
        }
    });

    // ValidateFunction for file
    function ValidateForNewFile(input, inputID) {
        $(inputID + " .fa-check").remove();
        if (input.files && input.files[0]) {
            $(inputID + " > .fa-times").hide();
            $(inputID).append(" <span class='fa fa-check'></span>");
            return true;
        }
        return false;
    }

</script>