From 40f32fa435dd084f624d1e00ad2eabb9d6489d59 Mon Sep 17 00:00:00 2001
From: Kálmán Viktor <kviktor@cloud.bme.hu>
Date: Mon, 7 Jul 2014 16:06:05 +0200
Subject: [PATCH] dashboard: cooler file upload form
---
circle/dashboard/templates/dashboard/store/list.html | 53 ++++++++++++++++++++++++++++++++++++++++++++---------
1 file changed, 44 insertions(+), 9 deletions(-)
diff --git a/circle/dashboard/templates/dashboard/store/list.html b/circle/dashboard/templates/dashboard/store/list.html
index b6a6705..6a67450 100644
--- a/circle/dashboard/templates/dashboard/store/list.html
+++ b/circle/dashboard/templates/dashboard/store/list.html
@@ -31,7 +31,7 @@
</div>
<div class="clearfix"></div>
</a>
- <div class="infos" style="position: relative;">
+ <div class="store-list-file-infos" style="position: relative;">
<a href="{% url "dashboard.views.store-download" %}?path={{ f.path }}"
class="btn btn-primary" style="position: absolute; right: 15px; top: 32px;">
<i class="icon-download"></i>
@@ -53,14 +53,50 @@
{% trans "This folder is empty." %}
</a>
{% endfor %}
- <div class="list-group-item">
+ <div class="list-group-item" style="height: 50px;">
Upload file to this folder
<form action="" data-action="{% url "dashboard.views.store-upload" %}"
- method="POST" enctype="multipart/form-data" class="pull-right">
+ method="POST" enctype="multipart/form-data" class="pull-right"
+ id="store-upload-form">
{% csrf_token %}
- <input type="hidden" name="current_dir" value="{{ current }}"></a>
- <input type="file" name="data"/>
- <input type="submit"/>
+ <input type="hidden" name="current_dir" value="{{ current }}"/>
+ <div class="input-group" style="max-width: 400px;">
+ <span class="input-group-btn" id="store-upload-browse">
+ <span class="btn btn-primary btn-sm">
+ {% trans "Browse..." %}
+ </span>
+ </span>
+ <input type="text" class="input-sm form-control"
+ id="store-upload-filename"/>
+ <span class="input-group-btn">
+ <input type="submit" class="btn btn-primary btn-sm"
+ value="{% trans "Upload" %}"/>
+ </span>
+ </div>
+ <input id="store-upload-file" name="data" type="file" style="display:none" multiple>
+
+<script type="text/javascript">
+ $('#store-upload-browse').click(function() {
+ $('#store-upload-form input[type="file"]').click();
+ });
+
+ $("#store-upload-file").change(function() {
+ var input = $(this);
+ var numFiles = input.get(0).files ? input.get(0).files.length : 1;
+ var label = input.val().replace(/\\/g, '/').replace(/.*\//, '');
+ input.trigger('fileselect', [numFiles, label]);
+ });
+
+ $("#store-upload-file").on("fileselect", function(event, numFiles, label) {
+ var input = $("#store-upload-filename");
+ var log = numFiles > 1 ? numFiles + ' files selected' : label;
+
+ if( input.length ) {
+ input.val(log);
+ }
+ });
+
+</script>
</form>
</div>
</div>
@@ -93,19 +129,18 @@
float: right;
}
- .infos {
+ .store-list-file-infos {
padding: 20px;
display: none;
border-left: 1px solid #ddd;
border-right: 1px solid #ddd;
}
-
</style>
<script>
$(function() {
$(".store-list-item").click(function() {
if($(this).data("item-type") == "D") return true;
- $(this).next(".infos").stop().slideToggle();
+ $(this).next(".store-list-file-infos").stop().slideToggle();
return false;
});
--
libgit2 0.26.0