{% verbatim %}
<div class="clearfix control-group" id="div-upload-mix">
    <div class="controls">
        <input type="hidden" class="upload-hash" id="upload-hash-mix">
        <input id="mix-upload" type="file" multiple="false" name="mix-upload"/>
        <h5>MP3 only for now please..</h5>
    </div>
</div>
<div class="well" id="mix-details">
    <form class="form-horizontal">
{% endverbatim %}
        {% csrf_token %}
{% verbatim %}
        <input type="hidden" class="upload-hash" id="upload-hash-details">
        <input type="hidden" id="upload-extension">
        <legend>Mix details</legend>
        <div class="row">
            <div class="control-group" id="group-title">
                <label class="control-label">Title</label>

                <div class="controls">
                    <input style="width: 98%" id="title" type="text" name="title" value="{{ title }}"
                           placeholder="Brief title for your mix…">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="span9">
                <div class="control-group">
                    <label class="control-label">Description</label>
                    <div class="controls">
                        <textarea style="width: 98%" id="description" name="description" rows="12" placeholder="Tracklist would be nice…">{{ description  }}</textarea>
                    </div>
                </div>
            </div>
            <div class="span3">
                <div class="fileupload fileupload-new" data-provides="fileupload">
                    <div class="fileupload-new thumbnail" style="width: 200px; height: 150px;">
                        <img src="{{ mix_image }}"/>
                    </div>
                    <div class="fileupload-preview fileupload-exists thumbnail"
                         style="max-width: 200px; max-height: 150px; line-height: 20px;">
                    </div>
                    <div>
                        <span class="btn btn-file">
                            <span class="fileupload-new">
                                Select image
                            </span>
                        <span class="fileupload-exists">
                            Change
                        </span>
                            <input id="mix_image" type="file" size="45" name="mix_image" class="input">
                        </span>
                        <a href="#" class="btn fileupload-exists" data-dismiss="fileupload">Remove</a>
                    </div>
                </div>
{% endverbatim  %}
                {% if user.is_staff %}
{% verbatim %}
                    <div>
                        <label class="checkbox">
                            <input type="checkbox" id="is_featured" name="is_featured" {{#is_featured}}checked{{/is_featured}}>Is featured?</label>
                    </div>
{% endverbatim %}
                {% endif %}
{% verbatim %}
            </div>
        </div>
        <div class="row">
            <div class="control-group">
                <label class="control-label">Genres</label>

                <div class="controls">
                    <input type="hidden" value="__placeholder__" id="genres" style="width:98%"/>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="form-actions">
                <button id="save-changes" class="btn">Submit</button>
            </div>
        </div>
    </form>
</div>
{% endverbatim %}