Django with jQuery File Upload

<!--
/*
 * Django with jQuery File Upload Plugin Demo
 * https://github.com/garmoncheg/django_multiuploader_demo/
 *
 * Copyright 2011, Iurii Garmash
 * http://garmoncheg.blogspot.com/
 */
-->
{% load verbatim %}
<meta charset="utf-8">

<link rel="stylesheet" href="/script/backend/jqueryui/css/snap_orange/jquery-ui-1.8.18.custom.css" id="theme">


<link rel="stylesheet" href="/script/backend/jquery_multiuploader/styles/jquery.fileupload-ui.css">

<div id="fileupload">
    <form action="{% url multi %}" method="POST" enctype="multipart/form-data" style="margin: 0 0 0px;">
        <div class="fileupload-buttonbar button_bar">
            <span class="fileinput-button">
                <span> Add files</span>
                <input type="file" multiple="" name="files[]">
            </span>
            <button type="submit" class="start"> Start upload</button>
            <button type="reset" class="cancel"> Cancel upload</button>
            {% comment %}<button type="button" class="delete"> Delete files</button>{% endcomment %}
        </div>
    </form>
    <div class="fileupload-content drop_area">
        <p class="help-block"><small><em>Drag and drop your files here or click on the "Add files" button! The maximum filesize allowed is {{ MAXIMUM_FILE_SIZE }} MB.</em></small></p>
        <table class="files"></table>
        <div class="fileupload-progressbar"></div>
    </div>
</div>
<div id="help" style="color:gray;">
    <h2>
        <p>You can select Multiple files at once using Ctrl(Win) or Command(Mac), or you can drag'n'drop your files on this form.</p>
    </h2>
</div>
{% verbatim %}

<script id="template-upload" type="text/x-jquery-tmpl">
    <tr class="template-upload{{if error}} ui-state-error{{/if}}">
        <td class="preview"></td>
        <td class="name">${name}</td>
        <td class="size">${sizef}</td>
        {{if error}}
            <td class="error" colspan="2">Error:
                {{if error === 'maxFileSize'}}The file is too big! The maximum file size allowed is {% endverbatim %}{{ MAXIMUM_FILE_SIZE }} MB!{% verbatim %}
                {{else error === 'minFileSize'}}File is too small
                {{else error === 'acceptFileTypes'}}Filetype not allowed
                {{else error === 'maxNumberOfFiles'}}Max number of files exceeded
                {{else error === 'maxFileName'}}The file's name exceeds the maximum allowed.
                {{else}}Oops! something went wrong while performing the operation! Please try again or refresh the page if you experience the same problem. Error is: "${error}"
                {{/if}}
            </td>
        {{else}}
            <td class="progress" style="background-color: none; background-image: none; box-shadow: none;"><div></div></td>
            <td class="start"><button class="btn btn-primary"><i class="icon-upload icon-white"></i>Start</button></td>
        {{/if}}
        <td class="cancel"><button class="btn btn-warning"><i class="icon-ban-circle icon-white"></i>Cancel</button></td>
    </tr>
</script>
<script id="template-download" type="text/x-jquery-tmpl">
    <tr class="template-download{{if error}} ui-state-error{{/if}}">
        {{if error}}
            <td></td>
            <td class="name">${name}</td>
            <td class="size">${sizef}</td>
            <td class="error" colspan="2">Error:
                {{if error === 1}}File exceeds upload_max_filesize (php.ini directive)
                {{else error === 2}}File exceeds MAX_FILE_SIZE (HTML form directive)
                {{else error === 3}}File was only partially uploaded
                {{else error === 4}}No File was uploaded
                {{else error === 5}}Missing a temporary folder
                {{else error === 6}}Failed to write file to disk
                {{else error === 7}}File upload stopped by extension
                {{else error === 'maxFileSize'}}The file is too big! The maximum file size allowed is {% endverbatim %}{{ MAXIMUM_FILE_SIZE }} MB!{% verbatim %}
                {{else error === 'minFileSize'}}File is too small
                {{else error === 'acceptFileTypes'}}Filetype not allowed
                {{else error === 'maxNumberOfFiles'}}Max number of files exceeded
                {{else error === 'uploadedBytes'}}Uploaded bytes exceed file size
                {{else error === 'emptyResult'}}Empty file upload result
                {{else error === 'maxFileName'}}The file's name exceeds the maximum allowed. Shortern the file name and try again! Maximum allowed is ${extra} characters long.
                {{else}}Oops! something went wrong while performing the operation! Please try again or refresh the page if you experience the same problem. Error is: "${error}"
                {{/if}}
            </td>
        {{else}}
            <td class="preview">
                {{if thumbnail_url}}
                    <a href="${url}" target="_blank"><img src="${thumbnail_url}"></a>
                {{/if}}
            </td>
            <td class="name">
                <a href="${url}"{{if thumbnail_url}} target="_blank"{{/if}}>${name}</a>
            </td>
            <td class="size">${sizef}</td>
            <td colspan="2"></td>
        {{/if}}
        <td class="delete">
            <button data-type="${delete_type}" data-url="${delete_url}">Delete</button>
        </td>
    </tr>
</script>
{% endverbatim %}