diff --git a/www/file/inner.html b/www/file/inner.html
index 2f82b3461..482fb4955 100644
--- a/www/file/inner.html
+++ b/www/file/inner.html
@@ -31,10 +31,28 @@
z-index: -1;
}
+ #upload-form {
+ padding: 0px;
+ margin: 0px;
+
+ position: relative;
+ width: 50vh;
+ height: 50vh;
+ display: block;
+ margin: auto;
+ }
+ #upload-form label{
+ position: relative;
+ }
+
+ .hovering {
+ background-color: rgba(255, 0, 115, 0.5) !important;
+ }
+
.block {
display: block;
- height: 500px;
- width: 500px;
+ height: 50vh;
+ width: 50vh;
}
.hidden {
display: none;
@@ -43,6 +61,7 @@
border: 2px solid black;
background-color: rgba(50, 50, 50, .10);
margin: 50px;
+ display: block;
}
.inputfile:focus + label,
@@ -50,13 +69,26 @@
background-color: rgba(50, 50, 50, 0.30);
}
+ #progress {
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ height: 100%;
+ width: 0%;
+ max-width: 100%;
+ max-height: 100%;
+ background-color: rgba(255, 0, 115, 0.75);
+ z-index: 10000;
+ display: block;
+ }
+
-
+
diff --git a/www/file/main.js b/www/file/main.js
index 41b8230e3..ba42f9afb 100644
--- a/www/file/main.js
+++ b/www/file/main.js
@@ -21,6 +21,8 @@ define([
var ifrw = $('#pad-iframe')[0].contentWindow;
var $iframe = $('#pad-iframe').contents();
var $form = $iframe.find('#upload-form');
+ var $progress = $form.find('#progress');
+ var $label = $form.find('label');
Cryptpad.addLoadingScreen();
@@ -54,8 +56,15 @@ define([
if (err) { throw new Error(err); }
if (box) {
actual += box.length;
+ var progress = (actual / estimate * 100) + '%';
+ console.log(progress);
+
return void sendChunk(box, function (e) {
if (e) { return console.error(e); }
+ $progress.css({
+ width: progress,
+ });
+
next(again);
});
}
@@ -71,7 +80,7 @@ define([
console.log("encrypted blob is now available as %s", uri);
var b64Key = Nacl.util.encodeBase64(key);
- window.location.hash = Cryptpad.getFileHashFromKeys(id, b64Key);
+ Cryptpad.replaceHash(Cryptpad.getFileHashFromKeys(id, b64Key));
$form.hide();
@@ -221,8 +230,25 @@ define([
handleFile(file);
});
+ var counter = 0;
+ $label
+ .on('dragenter', function (e) {
+ e.preventDefault();
+ e.stopPropagation();
+ counter++;
+ $label.addClass('hovering');
+ })
+ .on('dragleave', function (e) {
+ e.preventDefault();
+ e.stopPropagation();
+ counter--;
+ if (counter <= 0) {
+ $label.removeClass('hovering'); // FIXME Can get stuck...
+ }
+ });
+
$form
- .on('drag dragstart dragend dragover dragenter dragleave drop', function (e) {
+ .on('drag dragstart dragend dragover drop dragenter dragleave', function (e) {
e.preventDefault();
e.stopPropagation();
})