{% extends 'uibase/main/one-col-base.html.twig' %}
{% block content_header %}
    <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/start/jquery-ui.css" type="text/css" />
    <link rel="stylesheet" href="{{ asset('plupload2/js/jquery.ui.plupload/css/jquery.ui.plupload.css') }}" type="text/css" />


    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>

    <script type="text/javascript" src="{{ asset('plupload2/js/plupload.full.min.js') }}"></script>
    <script type="text/javascript" src="{{ asset('plupload2/js/jquery.ui.plupload/jquery.ui.plupload.js') }}"></script>

        <span class="sitefont-green"> UNC RAPID ORDER SYSTEM

</span>{% endblock %}
{% block content %}
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css">


    <script>
        $( function() {
            $( "#form_datereq" ).datepicker(({ minDate: 1, maxDate: "+2M" }));
        } );
    </script>

    {{ form_start(form, { 'attr': {'id': 'form'} }) }}
    {{ form_errors(form) }}

    {{ form_widget(form.manualsend) }}
    <img src="{{ asset('/images/uploaders/UNC-Logo.png') }}" width="400">
<table border="0" width="100%" cellpadding="2">


    <tr>
        <td>{{ form_label(form.name) }}</td>
        <td> {{ form_widget(form.name) }}</td>
    </tr>
    <tr>
        <td>{{ form_label(form.email) }}</td>
        <td>{{ form_widget(form.email) }}</td>
    </tr>
    <tr>
        <td>{{ form_label(form.phone) }}</td>
        <td>{{ form_widget(form.phone) }}</td>
    </tr>
    <tr>
        <td>{{ form_label(form.datereq) }}</td>
        <td>{{ form_widget(form.datereq) }}</td>
    </tr>
    <tr>
        <td>{{ form_label(form.delivery) }}</td>
        <td>{{ form_widget(form.delivery) }}</td>
    </tr>

    <tr>
        <td>{{ form_label(form.deliveryperson) }}</td>
        <td>{{ form_widget(form.deliveryperson) }}</td>
    </tr>
    <tr>
        <td>{{ form_label(form.department) }}</td>
        <td>{{ form_widget(form.department) }}</td>
    </tr>
    <tr>
        <td>{{ form_label(form.ponum) }}</td>
        <td>{{ form_widget(form.ponum) }}</td>
    </tr>

    <tr>
        <td>{{ form_label(form.prooftype) }}</td>
        <td>{{ form_widget(form.prooftype) }}</td>
    </tr>
    <tr>
        <td>{{ form_label(form.comments) }}</td>
        <td>{{ form_widget(form.comments) }}</td>
    </tr>


    <tr><td colspan="2">
        <div id="uploader">
            <p>Your browser doesn't have Flash, Silverlight or HTML5 support.</p>
        </div>
        <br>
        <div class="content-style-form-small content-style-form-maxwidth">
        {{ form_widget(form.FinishedAddingFiles, { 'attr': {'class': 'content-style-form-maxwidth'} }) }}
        {{ form_end(form) }}
        </div>
    </td></tr>


</table>

    <script type="text/javascript">
        $(function() {
            $("#uploader").plupload({
                // General settings
                runtimes : 'html5,flash,silverlight,html4',
                url : '{{ asset(uploadpath) }}',


                chunk_size: '1mb',
                unique_names : true,
                filters : {max_file_size : '2048mb'},
                init : {
                    FilesAdded: function(uploader, files) {
                        uploader.start();
                    }
                },
                rename: true,
                multiple_queues : true,
                max_file_count: 5,
                sortable: true,
                dragdrop: true,
                views: {
                    list: true,
                    thumbs: true, // Show thumbs
                    active: 'list'
                },
                flash_swf_url : '{{ asset('plupload2/js/Moxie.swf') }}',
                silverlight_xap_url : '{{ asset('plupload2/js/Moxie.xap') }}'
            });

            $('#form').submit(function(e) {

                if ($('#uploader').plupload('getFiles').length > 0) {


                    $('#uploader').on('complete', function() {
                        $('#form')[0].submit();
                    });

                    $('#uploader').plupload('start');
                } else {
                    alert("You must select at least 1 file to upload.");
                }
                return false;
            });
        });
        uploader.refresh;
    </script>
             
{% endblock %}