quad
/
quadfile
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Upload animation

This commit is contained in:
Dominik V. Salonen 2015-12-27 00:38:52 +01:00
parent 46d306a7b9
commit ce01f0ac19
2 changed files with 13 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
static/style.css
View File

@ -111,6 +111,16 @@ body {
background-color: #33BB33; background-color: #33BB33;
} }
@keyframes pulse {
0% {background-color: #117711;}
50% {background-color: #44CC44;}
100% {background-color: #117711;}
}
.uploading {
animation: pulse 3s infinite;
}
.uploadButton p { .uploadButton p {
padding: 20px; padding: 20px;
font-weight: 300; font-weight: 300;

4
templates/upload.html
View File

@ -4,7 +4,7 @@
QuadFile QuadFile
</h1> </h1>
<form action="" id="form" name="fileForm" method="post" enctype="multipart/form-data" class="uploadForm"> <form action="" id="form" name="fileForm" method="post" enctype="multipart/form-data" class="uploadForm">
<div class="uploadButton"> <div id="uploadButton" class="uploadButton">
<p id="uploadText"> <p id="uploadText">
Click to select a file Click to select a file
</p> </p>
@ -29,6 +29,8 @@
<script> <script>
document.getElementById("file").onchange = function() { document.getElementById("file").onchange = function() {
document.getElementById("uploadText").innerHTML = "Uploading..."; document.getElementById("uploadText").innerHTML = "Uploading...";
var button = document.getElementById("uploadButton");
button.className = button.className + " uploading";
document.getElementById("form").submit(); document.getElementById("form").submit();
}; };
</script> </script>