diff --git a/example.nginx.conf b/example.nginx.conf
index 5067ca9c0..fcb8b7435 100644
--- a/example.nginx.conf
+++ b/example.nginx.conf
@@ -32,7 +32,7 @@ server {
     set $scriptSrc  "'self'";
     set $connectSrc "'self' wss://cryptpad.fr wss://api.cryptpad.fr";
     set $fontSrc    "'self'";
-    set $imgSrc     "data: *";
+    set $imgSrc     "data: * blob:";
     set $frameSrc   "'self' beta.cryptpad.fr";
 
     if ($uri = /pad/inner.html) {
@@ -65,8 +65,12 @@ server {
         rewrite ^.*$ /customize/api/config break;
     }
 
+    location ^~ /blob/ {
+        try_files $uri =404;
+    }
+
     ## TODO fix in the code so that we don't need this
-    location ~ ^/(register|login|settings|user|pad|drive|poll|slide|code|whiteboard)$ {
+    location ~ ^/(register|login|settings|user|pad|drive|poll|slide|code|whiteboard|file|media)$ {
         rewrite ^(.*)$ $1/ redirect;
     }
 
diff --git a/www/common/common-userlist.js b/www/common/common-userlist.js
index 8ba7b31e1..7b62d6566 100644
--- a/www/common/common-userlist.js
+++ b/www/common/common-userlist.js
@@ -7,14 +7,16 @@ define(function () {
         var userData = exp.userData = {};
         var userList = exp.userList = info.userList;
         var myData = exp.myData = {};
-        var myUserName = exp.myUserName = info.myID;
-        var myNetfluxId = exp.myNetfluxId = info.myID;
+        exp.myUserName = info.myID;
+        exp.myNetfluxId = info.myID;
+
+        var network = Cryptpad.getNetwork();
 
         var parsed = Cryptpad.parsePadUrl(window.location.href);
         var appType = parsed ? parsed.type : undefined;
 
-        var users = userList.users;
         var addToUserData = exp.addToUserData = function(data) {
+            var users = userList.users;
             for (var attrname in data) { userData[attrname] = data[attrname]; }
 
             if (users && users.length) {
@@ -34,7 +36,7 @@ define(function () {
             return {
                 data: userData,
                 list: userList,
-                userNetfluxId: myNetfluxId
+                userNetfluxId: exp.myNetfluxId
             };
         };
 
@@ -44,13 +46,14 @@ define(function () {
             if(myUserNameTemp.length > 32) {
               myUserNameTemp = myUserNameTemp.substr(0, 32);
             }
-            myUserName = myUserNameTemp;
-            myData[myNetfluxId] = {
-               name: myUserName,
+            exp.myUserName = myUserNameTemp;
+            myData = {};
+            myData[exp.myNetfluxId] = {
+               name: exp.myUserName,
                uid: Cryptpad.getUid(),
             };
             addToUserData(myData);
-            Cryptpad.setAttribute('username', myUserName, function (err) {
+            Cryptpad.setAttribute('username', exp.myUserName, function (err) {
                 if (err) {
                     console.log("Couldn't set username");
                     console.error(err);
@@ -72,7 +75,7 @@ define(function () {
                 if (typeof(lastName) === 'string') {
                     setName(lastName, onLocal);
                 } else {
-                    myData[myNetfluxId] = {
+                    myData[exp.myNetfluxId] = {
                         name: "",
                         uid: Cryptpad.getUid(),
                     };
@@ -90,6 +93,11 @@ define(function () {
             setName(newName, onLocal);
         });
 
+        network.on('reconnect', function (uid) {
+            exp.myNetfluxId = uid;
+            exp.setName(exp.myUserName);
+        });
+
         return exp;
     };
 
diff --git a/www/drive/inner.html b/www/drive/inner.html
index 72bef5a79..859ae3391 100644
--- a/www/drive/inner.html
+++ b/www/drive/inner.html
@@ -33,7 +33,7 @@
                 <li><a tabindex="-1" data-icon="fa-file-code-o" class="newdoc own editable dropdown-item" data-type="code" data-localization="button_newcode">New code</a></li>
                 <li><a tabindex="-1" data-icon="fa-file-powerpoint-o" class="newdoc own editable dropdown-item" data-type="slide" data-localization="button_newslide">New slide</a></li>
                 <li><a tabindex="-1" data-icon="fa-calendar" class="newdoc own editable dropdown-item" data-type="poll" data-localization="button_newpoll">New poll</a></li>
-                <li><a tabindex="-1" data-icon="fa-calendar" class="newdoc own editable dropdown-item" data-type="whiteboard" data-localization="button_newwhiteboard">New whiteboard</a></li>
+                <li><a tabindex="-1" data-icon="fa-paint-brush" class="newdoc own editable dropdown-item" data-type="whiteboard" data-localization="button_newwhiteboard">New whiteboard</a></li>
             </ul>
         </div>
         <div id="defaultContextMenu" class="contextMenu dropdown clearfix">
diff --git a/www/drive/main.js b/www/drive/main.js
index 1788a7e1c..39b5450fc 100644
--- a/www/drive/main.js
+++ b/www/drive/main.js
@@ -2369,7 +2369,7 @@ define([
             module.hideMenu();
         });
 
-        $appContainer.on('click', function (e) {
+        $appContainer.on('mousedown', function (e) {
             if (e.which !== 1) { return ; }
             removeSelected(e);
             removeInput();
diff --git a/www/file/inner.html b/www/file/inner.html
index 09f627842..2f82b3461 100644
--- a/www/file/inner.html
+++ b/www/file/inner.html
@@ -30,11 +30,17 @@
         position: absolute;
         z-index: -1;
     }
-    .inputfile + label {
-        border: 2px solid black;
+
+    .block {
         display: block;
         height: 500px;
         width: 500px;
+    }
+    .hidden {
+        display: none;
+    }
+    .inputfile + label {
+        border: 2px solid black;
         background-color: rgba(50, 50, 50, .10);
         margin: 50px;
     }
@@ -50,7 +56,9 @@
     <div id="toolbar" class="toolbar-container"></div>
     <div id="upload-form" style="display: none;">
         <input type="file" name="file" id="file" class="inputfile" />
-        <label for="file">Choose a file</label>
+        <label for="file" class="block">Choose a file</label>
+    </div>
+    <div id="feedback" class="block hidden">
     </div>
 </body>
 </html>
diff --git a/www/file/main.js b/www/file/main.js
index 7e193e6a9..a7a0f0fb2 100644
--- a/www/file/main.js
+++ b/www/file/main.js
@@ -20,6 +20,7 @@ define([
 
     var ifrw = $('#pad-iframe')[0].contentWindow;
     var $iframe = $('#pad-iframe').contents();
+    var $form = $iframe.find('#upload-form');
 
     Cryptpad.addLoadingScreen();
 
@@ -85,16 +86,18 @@ define([
                                 ''
                             ].join('/');
 
-                            APP.$form.hide();
+                            $form.hide();
 
                             var newU8 = FileCrypto.joinChunks(chunks);
                             FileCrypto.decrypt(newU8, key, function (e, res) {
+                                if (e) { return console.error(e); }
                                 var title = document.title = res.metadata.name;
                                 myFile = res.content;
                                 myDataType = res.metadata.type;
 
                                 var defaultName = Cryptpad.getDefaultName(Cryptpad.parsePadUrl(window.location.href));
                                 APP.updateTitle(title || defaultName);
+
                             });
                         });
                     });
@@ -128,8 +131,6 @@ define([
     var andThen = function () {
         var $bar = $iframe.find('.toolbar-container');
 
-// Test hash:
-// #/2/K6xWU-LT9BJHCQcDCT-DcQ/TBo77200c0e-FdldQFcnQx4Y/
         var secret;
         var hexFileName;
         if (window.location.hash) {
@@ -218,12 +219,15 @@ define([
                 var key = Nacl.util.decodeBase64(cryptKey);
 
                 FileCrypto.decrypt(u8, key, function (e, data) {
+                    if (e) {
+                        Cryptpad.removeLoadingScreen();
+                        return console.error(e);
+                    }
                     console.log(data);
                     var title = document.title = data.metadata.name;
                     myFile = data.content;
                     myDataType = data.metadata.type;
                     updateTitle(title || defaultName);
-
                     Cryptpad.removeLoadingScreen();
                 });
             });
@@ -233,13 +237,12 @@ define([
             return Cryptpad.alert("You must be logged in to upload files");
         }
 
-        var $form = APP.$form = $iframe.find('#upload-form');
         $form.css({
             display: 'block',
         });
 
-        $form.find("#file").on('change', function (e) {
-            var file = e.target.files[0];
+        var handleFile = function (file) {
+            console.log(file);
             var reader = new FileReader();
             reader.onloadend = function () {
                 upload(this.result, {
@@ -248,6 +251,21 @@ define([
                 });
             };
             reader.readAsArrayBuffer(file);
+        };
+
+        $form.find("#file").on('change', function (e) {
+            var file = e.target.files[0];
+            handleFile(file);
+        });
+
+        $form
+        .on('drag dragstart dragend dragover dragenter dragleave drop', function (e) {
+            e.preventDefault();
+            e.stopPropagation();
+        })
+        .on('drop', function (e) {
+            var dropped = e.originalEvent.dataTransfer.files;
+            handleFile(dropped[0]);
         });
 
         // we're in upload mode