<!--
<div class="card">
    <div class="card-content">
        <div class="card-body">
            <h4 class="card-title">Add Video</h4>
        </div>

        <form class="md-form" method="POST" action="/member/upload" enctype="multipart/form-data">



            <input type="hidden" name="page_key" value="<?= $page_key ?>" >
            <input type="hidden" id='member_id' name='member_id' value="<?= $_SESSION["member_id"] ?>" />
            <input type="hidden" id='page_id' name='page_id' value="<?= $page_id ?>" />


            <div class="form-group">
                <label for="feedback1" class="sr-only">Note Title</label>
                <input type="text" id="feedback1" class="form-control" placeholder="Name" name="name">
            </div>

            <div class="form-group">
                <label for="feedback1" class="sr-only">Note Title</label>
                <textarea id="feedback3" rows="4" class="form-control" name="message" placeholder="Description"></textarea>
            </div>




            <div class="file-field">
                <div class="btn btn-primary btn-sm float-left">
                    <span>Choose files</span>
                    <input type="file" name="uploadedFile" />
                </div>
                <div class="file-path-wrapper">
                </div>
            </div>

              <div class="form-actions">
                
                <input type="submit" class="btn btn-primary mr-1" name="uploadBtn" value="Upload" />
            </div>
        </form>

    </div>
</div>
</div>
</div>
-->

<section id="dropzone-examples">

    <!-- button file upload starts -->
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Media & Video</h4>
                </div>
                <div class="card-content">
                    <div class="card-body">
                        <div style="padding-bottom: 10px;">
                            <p class="card-text">This example uploads a multiple files using dropzone js library. Using this method,
                                user gets an option to select th</p>
                            <button id="select-files" class="btn btn-primary mb-1"><i class="icon-file2"></i> Click me to select
                                files</button>
                            <form action="#" class="dropzone dropzone-area" id="dpz-btn-select-files">
                                <div class="dz-message">Drop Files Here To Upload</div>
                            </form>

                        </div>
                        <div class="form-group">
                            <label for="feedback1" class="sr-only">Note Title</label>
                            <input type="text" id="feedback1" class="form-control" placeholder="Name" name="name">
                        </div>

                        <div class="form-group">
                            <label for="feedback3" class="sr-only">Suggestion</label>
                            <textarea id="feedback3" rows="4" class="form-control" name="message" placeholder="Description"></textarea>
                        </div>

                        <div class="form-actions" style="text-align:right;">
                            <button type="reset" class="btn btn-outline-warning">Cancel</button>
                            <button type="submit" class="btn btn-primary mr-1">Submit</button>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>

</section>

<div id="dropzone"></div>

<script src="/assets2/vendors/js/extensions/dropzone.min.js"></script>
<script type="text/javascript">
<!--
    /********************************************
     *               Multiple Files              *
     ********************************************/
    Dropzone.options.dpzMultipleFiles = {
        paramName: "file", // The name that will be used to transfer the file
        maxFilesize: 0.5, // MB
        clickable: true
    }


    /********************************************************
     *               Use Button To Select Files              *
     ********************************************************/
    new Dropzone(document.body, {// Make the whole body a dropzone
        url: "#", // Set the url
        previewsContainer: "#dpz-btn-select-files", // Define the container to display the previews
        clickable: "#select-files" // Define the element that should be used as click trigger to select files.
    });


// -->
</script>


<!--
<div class="card">
    <div class="card-content">
        <div class="card-body">
            <h4 class="card-title">Add Video</h4>
        </div>
        <div class="card-body">
            <div class="form-body">
                <div class="form-group">
                    <label for="feedback1" class="sr-only">Note Title</label>
                    <input type="text" id="feedback1" class="form-control" placeholder="Name" name="name">
                </div>

                <div class="form-group" style="text-align: right;">



                    <form action="#" class="dropzone dropzone-area" id="dpz-btn-select-files">
                        <div class="dz-message">Drop Files Here To Upload</div>
                    </form>
                    <button id="select-files" class="btn btn-primary mb-1"><i class="icon-file2"></i> Select Files</button>

                </div>      

                <div class="form-group">
                    <label for="feedback3" class="sr-only">Suggestion</label>
                    <textarea id="feedback3" rows="4" class="form-control" name="message" placeholder="Description"></textarea>
                </div>

            </div>

            <div class="form-actions">
                <button type="submit" class="btn btn-primary mr-1">Submit</button>
                <button type="reset" class="btn btn-outline-warning">Cancel</button>
            </div>
        </div>
    </div>
</div>
-->

