andreimarcu
9 years ago
8 changed files with 1902 additions and 1439 deletions
-
85server_test.go
-
58static/css/dropzone.css
-
4static/css/linx.css
-
1291static/js/cat.js
-
1729static/js/dropzone.js
-
74static/js/upload.js
-
87templates/index.html
-
13upload.go
@ -0,0 +1,58 @@ |
|||
#dropzone { |
|||
width: 400px; |
|||
margin-left: auto; |
|||
margin-right: auto; |
|||
} |
|||
|
|||
#choices { |
|||
padding-bottom: 20px; |
|||
} |
|||
|
|||
div.dz-default { |
|||
border: 2px dashed #C9C9C9; |
|||
color: #C9C9C9; |
|||
font: 14px "helvetica neue",helvetica,arial,sans-serif; |
|||
background-color: #FAFBFC; |
|||
padding-top: 60px; |
|||
padding-bottom: 60px; |
|||
text-align: center; |
|||
} |
|||
|
|||
div.dz-default:hover { |
|||
background-color: #eff4f8; |
|||
} |
|||
|
|||
div.upload { |
|||
background-color: #E2E2E2; |
|||
border: 1px solid #C9C9C9; |
|||
margin-bottom: 5px; |
|||
padding: 5px; |
|||
} |
|||
|
|||
.upload { |
|||
font-size: 12px; |
|||
} |
|||
|
|||
.upload a { |
|||
font-size: 12px; |
|||
text-decoration: none; |
|||
border-bottom: 1px dotted #556A7F; |
|||
font-weight: 600; |
|||
color: #556A7F; |
|||
} |
|||
|
|||
.upload a:hover { |
|||
border-bottom: 1px dotted #556A7F; |
|||
color: #556A7F; |
|||
} |
|||
|
|||
.upload .right { |
|||
float: right; |
|||
padding-left: 5px; |
|||
} |
|||
|
|||
.cancel { |
|||
margin-right: 5px; |
|||
font-size: 10px; |
|||
border-bottom: 1px dotted #556A7F; |
|||
} |
1291
static/js/cat.js
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
1729
static/js/dropzone.js
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -0,0 +1,74 @@ |
|||
Dropzone.options.dropzone = { |
|||
addedfile: function(file) { |
|||
var upload = document.createElement("div"); |
|||
upload.className = "upload"; |
|||
|
|||
var left = document.createElement("span"); |
|||
left.innerHTML = file.name; |
|||
file.leftElement = left; |
|||
upload.appendChild(left); |
|||
|
|||
var right = document.createElement("div"); |
|||
right.className = "right"; |
|||
var rightleft = document.createElement("span"); |
|||
rightleft.className = "cancel"; |
|||
rightleft.innerHTML = "Cancel"; |
|||
rightleft.onclick = function(ev) { |
|||
this.removeFile(file); |
|||
}.bind(this); |
|||
|
|||
var rightright = document.createElement("span"); |
|||
right.appendChild(rightleft); |
|||
file.rightLeftElement = rightleft; |
|||
right.appendChild(rightright); |
|||
file.rightRightElement = rightright; |
|||
file.rightElement = right; |
|||
upload.appendChild(right); |
|||
file.uploadElement = upload; |
|||
document.getElementById("uploads").appendChild(upload); |
|||
}, |
|||
uploadprogress: function(file, p, bytesSent) { |
|||
p = parseInt(p); |
|||
file.rightRightElement.innerHTML = p + "%"; |
|||
file.uploadElement.setAttribute("style", 'background-image: -webkit-linear-gradient(left, #F2F4F7 ' + p + '%, #E2E2E2 ' + p + '%); background-image: -moz-linear-gradient(left, #F2F4F7 ' + p + '%, #E2E2E2 ' + p + '%); background-image: -ms-linear-gradient(left, #F2F4F7 ' + p + '%, #E2E2E2 ' + p + '%); background-image: -o-linear-gradient(left, #F2F4F7 ' + p + '%, #E2E2E2 ' + p + '%); background-image: linear-gradient(left, #F2F4F7 ' + p + '%, #E2E2E2 ' + p + '%)'); |
|||
}, |
|||
success: function(file, resp) { |
|||
file.rightLeftElement.innerHTML = ""; |
|||
file.leftElement.innerHTML = '<a target="_blank" href="' + resp.url + '">' + resp.url + '</a>'; |
|||
file.rightRightElement.innerHTML = "Delete"; |
|||
file.rightRightElement.className = "cancel"; |
|||
file.rightRightElement.style.color = "#E68181"; |
|||
file.rightRightElement.onclick = function(ev) { |
|||
xhr = new XMLHttpRequest(); |
|||
xhr.open("DELETE", resp.url, true); |
|||
xhr.setRequestHeader("X-Delete-Key", resp.delete_key); |
|||
xhr.onreadystatechange = function(file) { |
|||
if (xhr.status === 404) { |
|||
file.leftElement.innerHTML = 'Deleted <a target="_blank" href="' + resp.url + '">' + resp.url + '</a>'; |
|||
file.leftElement.style.color = "#E68181"; |
|||
file.rightRightElement.onclick = null; |
|||
file.rightRightElement.innerHTML = ""; |
|||
} |
|||
}.bind(this, file); |
|||
xhr.send(); |
|||
}.bind(this); |
|||
}, |
|||
error: function(file, errMsg, xhrO) { |
|||
file.rightLeftElement.onclick = null; |
|||
file.rightLeftElement.innerHTML = ""; |
|||
file.rightRightElement.innerHTML = ""; |
|||
if (file.status === "canceled") { |
|||
file.leftElement.innerHTML = "Canceled " + file.name; |
|||
} |
|||
else { |
|||
file.leftElement.innerHTML = "Could not upload " + file.name; |
|||
} |
|||
file.leftElement.style.color = "#E68181"; |
|||
}, |
|||
maxFilesize: 4096, |
|||
previewsContainer: "#uploads", |
|||
parallelUploads: 5, |
|||
headers: {"Accept": "application/json"}, |
|||
dictDefaultMessage: "Click or Drop file(s)", |
|||
dictFallbackMessage: "" |
|||
}; |
@ -1,58 +1,45 @@ |
|||
{% extends "base.html" %} |
|||
|
|||
{% block content %} |
|||
{% block head %} |
|||
<link href='/static/css/dropzone.css' media='screen, projection' rel='stylesheet' type='text/css'> |
|||
{% endblock %} |
|||
|
|||
{% block content %} |
|||
<div id="fileupload"> |
|||
|
|||
<div id="html5"> |
|||
<div class="clear"></div> |
|||
|
|||
<form action="/upload" method="POST" enctype="multipart/form-data"> |
|||
<div id="file-uploader" style="min-width: 400px;"> |
|||
<br /> |
|||
<input type="file" name="file" id="file_upload" name="file"><br/ ><br/ > |
|||
<input id ="upload_btn" type="submit" value="Upload"> |
|||
<br /><br /> |
|||
<form action="/upload" class="dropzone" id="dropzone" method="POST" enctype="multipart/form-data"> |
|||
<div class="fallback"> |
|||
<input name="file" type="file" /><br /> |
|||
<input type="submit" value="Upload"> |
|||
</div> |
|||
|
|||
<div class="dz-default dz-message"> |
|||
<span>Click or Drop file(s)</span> |
|||
</div> |
|||
|
|||
|
|||
<div id="choices"> |
|||
<div id="expiry"> |
|||
<label>File expiry: |
|||
<select name="expires" id="expires"> |
|||
</label> |
|||
<option value="0">never</option> |
|||
<option value="60">a minute</option> |
|||
<option value="300">5 minutes</option> |
|||
<option value="3600">an hour</option> |
|||
<option value="86400">a day</option> |
|||
<option value="604800">a week</option> |
|||
<option value="2419200">a month</option> |
|||
<option value="29030400">a year</option> |
|||
</select> |
|||
</div> |
|||
|
|||
<div id="choices"> |
|||
<div id="expiry"> |
|||
<label>File expiry: |
|||
<select name="expires" id="expires" onchange="uploader.setParams({expires: $('#expires').val(), randomize: $('#randomize').is(':checked')})"> |
|||
</label> |
|||
<option value="0">never</option> |
|||
<option value="60">a minute</option> |
|||
<option value="300">5 minutes</option> |
|||
<option value="3600">an hour</option> |
|||
<option value="86400">a day</option> |
|||
<option value="604800">a week</option> |
|||
<option value="2419200">a month</option> |
|||
<option value="29030400">a year</option> |
|||
</select> |
|||
</div> |
|||
|
|||
<label><input name="randomize" id="randomize" type="checkbox" checked onclick="uploader.setParams({expires: $('#expires').val(), randomize: $('#randomize').is(':checked')})" /> Randomize filename</label> |
|||
|
|||
</div> |
|||
|
|||
</form> |
|||
|
|||
<div style="clear:both;"></div> |
|||
|
|||
</div> |
|||
<label><input name="randomize" id="randomize" type="checkbox" checked /> Randomize filename</label> |
|||
</div> |
|||
<div class="clear"></div> |
|||
</form> |
|||
<div id="uploads"></div> |
|||
<div style="clear:both;"></div> |
|||
</div> |
|||
|
|||
<script type="text/javascript"> |
|||
function downloadJSAtOnload() { |
|||
var element = document.createElement("script"); |
|||
element.src = "/static/js/cat.js"; |
|||
document.body.appendChild(element); |
|||
} |
|||
if (window.addEventListener) |
|||
window.addEventListener("load", downloadJSAtOnload, false); |
|||
else if (window.attachEvent) |
|||
window.attachEvent("onload", downloadJSAtOnload); |
|||
else window.onload = downloadJSAtOnload; |
|||
</script> |
|||
|
|||
<script src="/static/js/dropzone.js"></script> |
|||
<script src="/static/js/upload.js"></script> |
|||
{% endblock %} |
Write
Preview
Loading…
Cancel
Save
Reference in new issue