<link href="/dropzone/dropzone.css" rel="stylesheet" type="text/css" />
<link href="/assets/global/plugins/bootstrap-fileinput/bootstrap-fileinput.css" rel="stylesheet" type="text/css" />

<form id="upload_form_headshot" action="/upload_headshot.php" method="post" enctype="multipart/form-data">

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
    <h4 class="modal-title">Upload headshot</h4>
</div>


<div class="modal-body text-center">
    <input type="hidden" name="company_id" value="43" />
    <input type="hidden" name="realtor_id" value="9583" />
    <input type="hidden" name="current_date" value="20190326141012" />

        <div class="alert alert-danger">NOTE: If you have already viewed a tour link associated with this agent in your browser, the updated image may not show as the browser data can be cached. Verify in a different browser to make sure the change was successful.</div>

    <div class="fileinput fileinput-new" data-provides="fileinput">
        <div class="input-group input-large">
            <div class="form-control uneditable-input input-fixed input-medium" data-trigger="fileinput">
                <i class="fa fa-file fileinput-exists"></i>&nbsp;
                <span class="fileinput-filename"> </span>
            </div>
            <span class="input-group-addon btn default btn-file">
                <span class="fileinput-new"> Select image </span>
                <span class="fileinput-exists"> Change </span>
                <input type="file" name="headshot"> </span>
            <a href="javascript:;" class="input-group-addon btn red fileinput-exists" data-dismiss="fileinput"> Remove </a>
        </div>
    </div>
    <div id="response"></div>
</div>

<div class="modal-footer text-center">
    <button id="done" type="button" data-dismiss="modal" class="btn default">Close</button>
    <button type="submit" class="btn blue">Upload</button>
</div>

</form>

<!-- <script src="assets/global/plugins/jquery-1.11.0.min.js" type="text/javascript"></script> -->
<script src="assets/global/plugins/jquery.form.js"></script>
<script src="assets/global/plugins/bootstrap-fileinput/bootstrap-fileinput.js" type="text/javascript"></script>
<!-- <script type="text/JavaScript" src="/dropzone/dropzone.js"></script> -->
<script type="text/javascript">
    $('#upload_form_headshot').ajaxForm(function() {
        img = document.getElementById("headshot137");
        img.src = "https://s3.amazonaws.com/viewshootsite/43/realtor_imgs/9583-20190326141012.jpg?" + new Date().getTime();
        img.style.display = "block";
        del = document.getElementById("delete_headshot137");
        del.style.display = "block";
        $('#done').click();
    });


    /*function initDropzone(){alert('hi');
        Dropzone.options.headshotDropzone = {
            paramName: "headshot",
            parallelUploads: 1,
            maxFilesize: 10,
            acceptedFiles: "image/jpeg",
            uploadMultiple: false
        };
    }
    initDropzone();*/
</script>