Use a download button instead of downloading a file automatically

customize.dist/main.css

@@ -603,6 +603,14 @@ html.cp,
   font-family: lato, Helvetica, sans-serif;
   font-size: 1.02em;
 }
+.cp .unselectable {
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
 .cp h1,
 .cp h2,
 .cp h3,

customize.dist/translations/messages.fr.js

@@ -366,6 +366,7 @@ define(function () {
     out.upload_name = "Nom du fichier";
     out.upload_size = "Taille";
     out.upload_progress = "État";
+    out.download_button = "Déchiffrer et télécharger";
 
     // general warnings
     out.warn_notPinned = "Ce pad n'est stocké dans aucun CryptDrive. Il va expirer après 3 mois d'inactivité. <a href='/about.html#pinning'>En savoir plus...</a>";

customize.dist/translations/messages.js

@@ -371,6 +371,7 @@ define(function () {
     out.upload_name = "File name";
     out.upload_size = "Size";
     out.upload_progress = "Progress";
+    out.download_button = "Decrypt & Download";
 
     // general warnings
     out.warn_notPinned = "This pad is not in anyone's CryptDrive. It will expire after 3 months. <a href='/about.html#pinning'>Learn more...</a>";

www/file/file.css

@@ -7,7 +7,8 @@ body {
   padding: 0px;
   display: inline-block;
 }
-#file {
+#file,
+#dl {
   display: block;
   height: 100%;
   width: 100%;
@@ -21,7 +22,8 @@ body {
   position: absolute;
   z-index: -1;
 }
-#upload-form {
+#upload-form,
+#download-form {
   padding: 0px;
   margin: 0px;
   position: relative;
@@ -31,7 +33,8 @@ body {
   margin: 50px auto;
   max-width: 80vw;
 }
-#upload-form label {
+#upload-form label,
+#download-form label {
   line-height: 50vh;
   text-align: center;
   position: relative;

www/file/file.less

@@ -9,7 +9,7 @@ html, body {
     padding: 0px;
     display: inline-block;
 }
-#file {
+#file, #dl {
     display: block;
     height: 100%;
     width: 100%;
@@ -25,7 +25,7 @@ html, body {
     z-index: -1;
 }
 
-#upload-form {
+#upload-form, #download-form {
     padding: 0px;
     margin: 0px;
 
@@ -35,17 +35,16 @@ html, body {
     display: block;
     margin: 50px auto;
     max-width: 80vw;
+    label {
+        line-height: 50vh;
+        text-align: center;
+        position: relative;
+        padding: 10px;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
 }
-#upload-form label {
-    line-height: 50vh;
-    text-align: center;
-    position: relative;
-    padding: 10px;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
 .hovering {
     background-color: rgba(255, 0, 115, 0.5) !important;
 }

www/file/inner.html

@@ -13,9 +13,14 @@
     <div id="upload-form" style="display: none;">
         <input type="file" name="file" id="file" class="inputfile" />
         <label for="file" class="block unselectable" data-localization-title="upload_choose"
-            data-localization="upload_choose"><span class="block" id="progress">&nbsp;</span></label>
+            data-localization="upload_choose"></label>
     </div>
-    <table id="status">
+    <div id="download-form" style="display: none;">
+        <input type="button" name="dl" id="dl" class="inputfile" />
+        <label for="dl" class="block unselectable" data-localization-title="download_button"
+            data-localization="download_button"></label>
+    </div>
+    <table id="status" style="display: none;">
         <tr>
             <td data-localization="upload_name">File name</td>
             <td data-localization="upload_size">Size</td>

www/file/main.js

@@ -21,8 +21,9 @@ define([
     var ifrw = $('#pad-iframe')[0].contentWindow;
     var $iframe = $('#pad-iframe').contents();
     var $form = $iframe.find('#upload-form');
-    //var $progress = $form.find('#progress');
+    var $dlform = $iframe.find('#download-form');
     var $label = $form.find('label');
+    var $dllabel = $dlform.find('label');
     var $table = $iframe.find('#status');
 
     Cryptpad.addLoadingScreen();
@@ -100,8 +101,6 @@ define([
                 var b64Key = Nacl.util.encodeBase64(key);
                 Cryptpad.replaceHash(Cryptpad.getFileHashFromKeys(id, b64Key));
 
-                //$form.hide();
-
                 APP.toolbar.addElement(['fileshare'], {});
 
                 var title = document.title = metadata.name;
@@ -250,30 +249,38 @@ define([
         Title.updateTitle(Cryptpad.initialName || getTitle() || Title.defaultTitle);
 
         if (!uploadMode) {
-            var src = Cryptpad.getBlobPathFromHex(hexFileName);
+            $dlform.show();
-            return Cryptpad.fetch(src, function (e, u8) {
+            Cryptpad.removeLoadingScreen();
-                if (e) { return void Cryptpad.alert(e); }
+            $dlform.find('#dl').click(function (e) {
-                // now decrypt the u8
+
-                var cryptKey = secret.keys && secret.keys.fileKeyStr;
+                if (myFile) { exportFile(); }
-                var key = Nacl.util.decodeBase64(cryptKey);
-
-                if (!u8 || !u8.length) {
-                    return void Cryptpad.errorLoadingScreen(e);
-                }
 
-                FileCrypto.decrypt(u8, key, function (e, data) {
+                var src = Cryptpad.getBlobPathFromHex(hexFileName);
-                    if (e) {
+                return Cryptpad.fetch(src, function (e, u8) {
-                        Cryptpad.removeLoadingScreen();
+                    if (e) { return void Cryptpad.alert(e); }
-                        return console.error(e);
+                    // now decrypt the u8
+                    var cryptKey = secret.keys && secret.keys.fileKeyStr;
+                    var key = Nacl.util.decodeBase64(cryptKey);
+
+                    if (!u8 || !u8.length) {
+                        return void Cryptpad.errorLoadingScreen(e);
                     }
-                    console.log(data);
+
-                    var title = document.title = data.metadata.name;
+                    FileCrypto.decrypt(u8, key, function (e, data) {
-                    myFile = data.content;
+                        if (e) {
-                    myDataType = data.metadata.type;
+                            return console.error(e);
-                    Title.updateTitle(title || Title.defaultTitle);
+                        }
-                    Cryptpad.removeLoadingScreen();
+                        console.log(data);
+                        var title = document.title = data.metadata.name;
+                        myFile = data.content;
+                        myDataType = data.metadata.type;
+                        Title.updateTitle(title || Title.defaultTitle);
+                        exportFile();
+                    });
                 });
+
             });
+            return;
         }
 
         if (!Cryptpad.isLoggedIn()) {