From 729c013af7cd6e050253dcb234563d8db7a77559 Mon Sep 17 00:00:00 2001
From: yflory <yann.flory@xwiki.com>
Date: Tue, 5 Sep 2017 15:08:05 +0200
Subject: [PATCH 1/2] Get mediatag embed code from the file app

---
 customize.dist/translations/messages.fr.js |  5 ++
 customize.dist/translations/messages.js    |  5 ++
 www/common/cryptpad-common.js              | 17 ++++++
 www/common/toolbar2.js                     | 63 +++++++++++++++++++---
 www/common/toolbar3.js                     |  1 +
 www/file/main.js                           | 17 +++---
 6 files changed, 96 insertions(+), 12 deletions(-)

diff --git a/customize.dist/translations/messages.fr.js b/customize.dist/translations/messages.fr.js
index dfeb46371..43519f76e 100644
--- a/customize.dist/translations/messages.fr.js
+++ b/customize.dist/translations/messages.fr.js
@@ -171,6 +171,11 @@ define(function () {
     out.viewShareTitle = "Copier lien d'accès en lecture seule dans le presse-papiers";
     out.viewOpen = "Voir dans un nouvel onglet";
     out.viewOpenTitle = "Ouvrir le lien en lecture seule dans un nouvel onglet";
+    out.fileShare = "Copier le lien";
+    out.fileEmbed = "Obtenir le code d'intégration";
+    out.fileEmbedTitle = "Intégrer le fichier dans une page web";
+    out.fileEmbedScript = "Pour intégrer un fichier, veuillez inclure le script suivant une fois dans votre page afin de pouvoir charger le Media Tag :";
+    out.fileEmbedTag = "Ensuite vous pouvez placer ce Media Tag où vous souhaitez dans votre page pour l'intégrer :";
 
     out.notifyJoined = "{0} a rejoint la session collaborative";
     out.notifyRenamed = "{0} a changé son nom en {1}";
diff --git a/customize.dist/translations/messages.js b/customize.dist/translations/messages.js
index 96921c11a..3905b7601 100644
--- a/customize.dist/translations/messages.js
+++ b/customize.dist/translations/messages.js
@@ -173,6 +173,11 @@ define(function () {
     out.viewShareTitle = "Copy the read-only link to clipboard";
     out.viewOpen = "Open read-only link in a new tab";
     out.viewOpenTitle = "Open this pad in read-only mode in a new tab";
+    out.fileShare = "Copy link";
+    out.fileEmbed = "Get embed code";
+    out.fileEmbedTitle = "Embed the file in an external page";
+    out.fileEmbedScript = "To embed this file, include this script once in your page to load the Media Tag:";
+    out.fileEmbedTag = "Then place this Media Tag wherever in your page you would like to embed:";
 
     out.notifyJoined = "{0} has joined the collaborative session";
     out.notifyRenamed = "{0} is now known as {1}";
diff --git a/www/common/cryptpad-common.js b/www/common/cryptpad-common.js
index 7b6e67bde..88da2d533 100644
--- a/www/common/cryptpad-common.js
+++ b/www/common/cryptpad-common.js
@@ -1396,6 +1396,23 @@ define([
       return isEmoji(emojis[0])? emojis[0]: str[0];
     };
 
+    common.getMediatagScript = function () {
+        var origin = window.location.origin;
+        return '<script src="' + origin + '/common/media-tag-nacl.min.js"></script>';
+    };
+    common.getMediatagFromHref = function (href) {
+        var parsed = common.parsePadUrl(href);
+        var secret = common.getSecrets('file', parsed.hash);
+        if (secret.keys && secret.channel) {
+            var cryptKey = secret.keys && secret.keys.fileKeyStr;
+            var hexFileName = common.base64ToHex(secret.channel);
+            var origin = Config.fileHost || window.location.origin;
+            var src = origin + common.getBlobPathFromHex(hexFileName);
+            return '<media-tag src="' + src + '" data-crypto-key="cryptpad:' + cryptKey + '">' +
+                   '</media-tag>';
+        }
+        return;
+    };
     $(window.document).on('decryption', function (e) {
         var decrypted = e.originalEvent;
         if (decrypted.callback) {
diff --git a/www/common/toolbar2.js b/www/common/toolbar2.js
index c6cb82751..dd2b8c4b2 100644
--- a/www/common/toolbar2.js
+++ b/www/common/toolbar2.js
@@ -481,17 +481,68 @@ define([
         if (!window.location.hash) {
             throw new Error("Unable to display the share button: hash required in the URL");
         }
+        // Create dropdowns
         var $shareIcon = $('<span>', {'class': 'fa fa-share-alt'});
-        var $button = $('<button>', {'title': Messages.shareButton}).append($shareIcon);
-        $button.addClass('shareButton');
-        $button.click(function () {
-            var url = window.location.href;
+        var options = [];
+        options.push({
+            tag: 'a',
+            attributes: {title: Messages.editShareTitle, 'class': 'fileShare'},
+            content: '<span class="fa fa-file"></span> ' + Messages.fileShare
+        });
+        options.push({
+            tag: 'a',
+            attributes: {title: Messages.editShareTitle, 'class': 'fileEmbed'},
+            content: '<span class="fa fa-file"></span> ' + Messages.fileEmbed
+        });
+        var dropdownConfigShare = {
+            text: $('<div>').append($shareIcon).html(),
+            options: options,
+            feedback: 'FILESHARE_MENU',
+        };
+        var $shareBlock = Cryptpad.createDropdown(dropdownConfigShare);
+        $shareBlock.find('.cp-dropdown-content').addClass(SHARE_CLS);
+        $shareBlock.addClass('shareButton');
+        $shareBlock.find('button').attr('title', Messages.shareButton);
+
+        // Add handlers
+        var url = window.location.href;
+        $shareBlock.find('a.fileShare').click(function () {
             var success = Cryptpad.Clipboard.copy(url);
             if (success) { Cryptpad.log(Messages.shareSuccess); }
         });
+        $shareBlock.find('a.fileEmbed').click(function () {
+            var $content = $('<div>');
+            $('<input>', {'style':'display:none;'}).appendTo($content);
+            $('<h3>').text(Messages.fileEmbedTitle).appendTo($content);
+            var $script = $('<p>').text(Messages.fileEmbedScript).appendTo($content);
+            $('<br>').appendTo($script);
+            var scriptId = uid();
+            $('<input>', {
+                type: 'text',
+                id: scriptId,
+                readonly: 'readonly',
+                value: Cryptpad.getMediatagScript(),
+            }).appendTo($script);
+            var $tag = $('<p>').text(Messages.fileEmbedTag).appendTo($content);
+            $('<br>').appendTo($tag);
+            var tagId = uid();
+            $('<input>', {
+                type:'text',
+                id: tagId,
+                readonly:'readonly',
+                value:Cryptpad.getMediatagFromHref(url),
+            }).appendTo($tag);
+            Cryptpad.alert($content.html(), null, true);
+            $('#'+scriptId).click(function () {
+                this.select();
+            });
+            $('#'+tagId).click(function () {
+                this.select();
+            });
+        });
 
-        toolbar.$leftside.append($button);
-        return $button;
+        toolbar.$leftside.append($shareBlock);
+        return $shareBlock;
     };
 
     var createTitle = function (toolbar, config) {
diff --git a/www/common/toolbar3.js b/www/common/toolbar3.js
index d488852cc..4e07d25d6 100644
--- a/www/common/toolbar3.js
+++ b/www/common/toolbar3.js
@@ -440,6 +440,7 @@ define([
     };
 
     var createFileShare = function (toolbar) {
+        throw new Error('TODO: Update createFileShare to add "embed" and work in secure iframes');
         if (!window.location.hash) {
             throw new Error("Unable to display the share button: hash required in the URL");
         }
diff --git a/www/file/main.js b/www/file/main.js
index ec3961196..136702c47 100644
--- a/www/file/main.js
+++ b/www/file/main.js
@@ -107,6 +107,8 @@ define([
                     $mt.attr('src', '/blob/' + hexFileName.slice(0,2) + '/' + hexFileName);
                     $mt.attr('data-crypto-key', 'cryptpad:'+cryptKey);
 
+                    var rightsideDisplayed = false;
+
                     $(window.document).on('decryption', function (e) {
                         var decrypted = e.originalEvent;
                         if (decrypted.callback) {
@@ -127,12 +129,15 @@ define([
                         text += '<em>' + Messages._getKey('formattedMB', [sizeMb]) + '</em>';
                         $dlButton.html(text);
 
-                        toolbar.$rightside.append(Cryptpad.createButton('export', true, {}, function () {
-                            saveAs(decrypted.blob, decrypted.metadata.name);
-                        }))
-                        .append(Cryptpad.createButton('forget', true, {}, function () {
-                            // not sure what to do here
-                        }));
+                        if (!rightsideDisplayed) {
+                            toolbar.$rightside.append(Cryptpad.createButton('export', true, {}, function () {
+                                saveAs(decrypted.blob, decrypted.metadata.name);
+                            }))
+                            .append(Cryptpad.createButton('forget', true, {}, function () {
+                                // not sure what to do here
+                            }));
+                            rightsideDisplayed = true;
+                        }
 
                         // make pdfs big
                         var toolbarHeight = $iframe.find('#toolbar').height();

From 01881ac4695ea127dbfcdeb0ecbe733b37dc2f18 Mon Sep 17 00:00:00 2001
From: yflory <yann.flory@xwiki.com>
Date: Tue, 5 Sep 2017 15:15:57 +0200
Subject: [PATCH 2/2] Update loading tips in the french translation

---
 customize.dist/translations/messages.fr.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/customize.dist/translations/messages.fr.js b/customize.dist/translations/messages.fr.js
index 43519f76e..e118f8cf9 100644
--- a/customize.dist/translations/messages.fr.js
+++ b/customize.dist/translations/messages.fr.js
@@ -661,13 +661,15 @@ define(function () {
 
     // Tips
     out.tips = {};
-    out.tips.lag = "L'icône verte dans le coin supérieur droit montre la qualité de votre connexion Internet vers le serveur CryptPad.";
     out.tips.shortcuts = "`ctrl+b`, `ctrl+i` et `ctrl+u` sont des raccourcis rapides pour mettre en gras, en italique ou souligner.";
     out.tips.indent = "Dans les listes à puces ou numérotées, vous pouvez utiliser `Tab` ou `Maj+Tab` pour augmenter ou réduire rapidement l'indentation.";
-    out.tips.title = "Vous pouvez changer le titre de votre pad en cliquant au centre en haut de la page.";
     out.tips.store = "Dés que vous ouvrez un nouveau pad, il est automatiquement stocké dans votre CryptDrive si vous êtes connectés.";
     out.tips.marker = "Vous pouvez surligner du texte dans un pad en utilisant l'option \"marker\" dans le menu déroulant des styles.";
     out.tips.driveUpload = "Les utilisateurs enregistrés peuvent importer des fichiers en les faisant glisser et en les déposant dans leur CryptDrive.";
+    out.tips.filenames = "Vous pouvez renommer les fichiers de votre CryptDrive, ce nom ne sera visible que par vous.";
+    out.tips.drive = "Les utilisateurs enregistrés peuvent organiser leurs fichiers dans leur CryptDrive, accessible depuis l'icône CryptPad dans le coin supérieur gauche des pads.";
+    out.tips.profile = "Les utilisateurs enregistrés peuvent créer un profil depuis le menu utilisateur, dans le coin supérieur droit.";
+    out.tips.avatars = "Vous pouvez uploader un avatar dans votre profil. Les autres personnes le verront dans la liste d'utilisateurs des pads.";
 
     out.feedback_about = "Si vous lisez ceci, vous vous demandez probablement pourquoi CryptPad envoie des requêtes vers des pages web quand vous realisez certaines actions.";
     out.feedback_privacy = "Nous prenons au sérieux le respect de votre vie privée, et en même temps nous souhaitons rendre CryptPad très simple à utiliser. Nous utilisons cette page pour comprendre quelles fonctionnalités dans l'interface comptent le plus pour les utilisateurs, en l'appelant avec un paramètre spécifiant quelle action a été réalisée.";