From 442f15df983f74478df70d56dea36210c63b489d Mon Sep 17 00:00:00 2001 From: yflory Date: Thu, 8 Mar 2018 15:39:46 +0100 Subject: [PATCH] Add help text in all the apps + french translation --- customize.dist/translations/messages.fr.js | 44 ++++++++++++++++++++++ customize.dist/translations/messages.js | 3 +- www/code/inner.js | 4 +- www/common/common-ui-elements.js | 43 ++++++++++++++++++++- www/pad/inner.js | 4 +- www/poll/inner.js | 12 +----- www/slide/inner.js | 4 +- www/whiteboard/inner.js | 11 ++---- 8 files changed, 95 insertions(+), 30 deletions(-) diff --git a/customize.dist/translations/messages.fr.js b/customize.dist/translations/messages.fr.js index d4743dc9e..10d7e4e03 100644 --- a/customize.dist/translations/messages.fr.js +++ b/customize.dist/translations/messages.fr.js @@ -951,6 +951,50 @@ define(function () { // Initial states + out.help = {}; + + out.help.title = "Pour bien démarrer"; + out.help.generic = { + more: 'Apprenez-en davantage sur le fonctionnement de CryptPad en lisant notre FAQ', + share: 'Utilisez le menu partage () pour générer un lien afin que les collaborateurs puissant voir ou modifier ce pad', + stored: 'Chaque pad que vous visitez est stocké automatiquement dans votre CryptDrive' + }; + + out.help.text = { + formatting: 'Vous pouvez afficher ou cacher la barre d\'outils de mise en forme du texte en cliquant sur les boutons ou ', + embed: 'Les utilisateurs enregistrés peuvent intégrer une image ou un fichier provenant de leur CryptDrive en utilisant le bouton ', + history: 'Vous pouvez utiliser l\'historique () pour voir ou restaurer les versions précédentes du pad' + }; + + out.help.pad = { + export: 'Vous pouvez exporter le contenu en tant que PDF avec le bouton de la barre d\'outils de mise en forme du texte' + }; + + out.help.code = { + modes: 'Utilisez le sous-menu pour changer le mode de coloration syntaxique ou le thème de couleur' + }; + + out.help.slide = { + markdown: 'Rédigez vos slides en Markdown et séparez les avec une ligne contenant ---', + present: 'Démarrez la présentation en utilisant le bouton ', + settings: 'Modifiez les préférences de la présentation (image de fond, transitions, numéro de pages, ...) avec le bouton dans le sous-menu ', + colors: 'Modifiez la couleur du texte ou du fond en utilisant les boutons et ' + }; + + out.help.poll = { + decisions: 'Prenez des décisions en privé avec des personnes de confiance', + options: 'Proposez des options et exprimez vos préférences', + choices: 'Cliquez sur les cellules de votre colonne pour modifier leur valeur entre oui (✔), non (✖) ou peut-être (~)', + submit: 'Cliquez sur Ajouter pour rendre vos choix visibles aux autres' + }; + + out.help.whiteboard = { + colors: 'Double-cliquez sur les couleurs pour changer la palette', + mode: 'Vous pouvez désactiver le mode dessin pour déplacer, redimensionner, ou supprimer des éléments du dessin', + embed: 'Intégrez des images de votre disque ou de votre CryptDrive et exporter le contenu en tant que PNG sur votre disque ou votre CryptDrive ' + }; + + out.initialState = [ '

', 'Voici CryptPad, l\'éditeur collaboratif en temps-réel Zero Knowledge. Tout est sauvegardé dés que vous le tapez.', diff --git a/customize.dist/translations/messages.js b/customize.dist/translations/messages.js index 0c7f643fd..429b4de85 100644 --- a/customize.dist/translations/messages.js +++ b/customize.dist/translations/messages.js @@ -993,9 +993,11 @@ define(function () { out.header_logoTitle = out.updated_0_header_logoTitle; out.header_homeTitle = 'Go to CryptPad homepage'; + // Initial states out.help = {}; + out.help.title = "Getting started"; out.help.generic = { more: 'Learn more about how CryptPad can work for you by reading our FAQ', share: 'Use the share menu () to generate a link so collaborators can view or edit this pad', @@ -1036,7 +1038,6 @@ define(function () { embed: 'Embed images from your disk or your CryptDrive and export them as PNG to your disk or your CryptDrive ' }; - // Initial states out.initialState = [ '

', diff --git a/www/code/inner.js b/www/code/inner.js index 66010a485..c2e5851bf 100644 --- a/www/code/inner.js +++ b/www/code/inner.js @@ -82,11 +82,9 @@ define([ }; var mkHelpMenu = function (framework) { var $codeMirrorContainer = $('#cp-app-code-container'); - var helpMenu = framework._.sfCommon.createHelpMenu(); + var helpMenu = framework._.sfCommon.createHelpMenu(['text', 'code']); $codeMirrorContainer.prepend(helpMenu.menu); - $(helpMenu.text).html(DiffMd.render(Messages.codeInitialState)); - framework._.toolbar.$drawer.append(helpMenu.button); }; var mkPreviewPane = function (editor, CodeMirror, framework, isPresentMode) { diff --git a/www/common/common-ui-elements.js b/www/common/common-ui-elements.js index 5239f43f7..3d6b33964 100644 --- a/www/common/common-ui-elements.js +++ b/www/common/common-ui-elements.js @@ -890,10 +890,49 @@ define([ }; }; - UIElements.createHelpMenu = function (common) { + UIElements.createHelpMenu = function (common, categories) { var type = common.getMetadataMgr().getMetadata().type || 'pad'; - var text = h('p.cp-help-text'); + var setHTML = function (e, html) { + e.innerHTML = html; + return e; + }; + + var elements = []; + if (Messages.help && Messages.help.generic) { + Object.keys(Messages.help.generic).forEach(function (el) { + elements.push(setHTML(h('li'), Messages.help.generic[el])); + }); + } + if (categories) { + categories.forEach(function (cat) { + var msgs = Messages.help[cat]; + if (msgs) { + Object.keys(msgs).forEach(function (el) { + elements.push(setHTML(h('li'), msgs[el])); + }); + } + }); + } + + var text = h('p.cp-help-text', [ + h('h1', Messages.help.title), + h('ul', elements) + ]); + + var origin = common.getMetadataMgr().getPrivateData().origin || ''; + $(text).find('a').click(function (e) { + e.preventDefault(); + e.stopPropagation(); + var href = $(this).attr('href'); + var absolute = /^https?:\/\//i; + if (!absolute.test(href)) { + if (href.slice(0,1) !== '/') { href = '/' + href; } + href = origin + href; + } + common.openUnsafeURL(href); + }); + var closeButton = h('span.cp-help-close.fa.fa-window-close'); var $toolbarButton = common.createButton('', true, { title: Messages.hide_help_button, diff --git a/www/pad/inner.js b/www/pad/inner.js index cf21d199c..3f8f5c995 100644 --- a/www/pad/inner.js +++ b/www/pad/inner.js @@ -138,11 +138,9 @@ define([ var mkHelpMenu = function (framework) { var $toolbarContainer = $('.cke_toolbox_main'); - var helpMenu = framework._.sfCommon.createHelpMenu(); + var helpMenu = framework._.sfCommon.createHelpMenu(['text', 'pad']); $toolbarContainer.before(helpMenu.menu); - $(helpMenu.text).html(Messages.initialState); - framework._.toolbar.$drawer.append(helpMenu.button); }; diff --git a/www/poll/inner.js b/www/poll/inner.js index 577a54ff7..a6e9b8bd8 100644 --- a/www/poll/inner.js +++ b/www/poll/inner.js @@ -1199,19 +1199,9 @@ define([ var $export = common.createButton('export', true, {}, exportFile); $drawer.append($export); - var helpMenu = common.createHelpMenu(); + var helpMenu = common.createHelpMenu(['poll']); $('#cp-app-poll-form').prepend(helpMenu.menu); $drawer.append(helpMenu.button); - var setHTML = function (e, html) { - e.innerHTML = html; - return e; - }; - var help = h('div', [ - setHTML(h('h1'), Messages.poll_subtitle), - h('p', Messages.poll_p_save), - h('p', Messages.poll_p_encryption) - ]); - $(helpMenu.text).html($(help).html()); if (APP.readOnly) { publish(true); return; } var $publish = common.createButton('', true, { diff --git a/www/slide/inner.js b/www/slide/inner.js index 44073bb46..bd9e42852 100644 --- a/www/slide/inner.js +++ b/www/slide/inner.js @@ -432,11 +432,9 @@ define([ var mkHelpMenu = function (framework) { var $codeMirrorContainer = $('#cp-app-slide-editor-container'); - var helpMenu = framework._.sfCommon.createHelpMenu(); + var helpMenu = framework._.sfCommon.createHelpMenu(['text', 'slide']); $codeMirrorContainer.prepend(helpMenu.menu); - $(helpMenu.text).html(DiffMd.render(Messages.slideInitialState)); - framework._.toolbar.$drawer.append(helpMenu.button); }; diff --git a/www/whiteboard/inner.js b/www/whiteboard/inner.js index 8a4da8940..7e132ae18 100644 --- a/www/whiteboard/inner.js +++ b/www/whiteboard/inner.js @@ -454,13 +454,10 @@ define([ var $properties = common.createButton('properties', true); toolbar.$drawer.append($properties); - if (Messages.whiteboardHelp) { - var $appContainer = $('#cp-app-whiteboard-container'); - var helpMenu = common.createHelpMenu(); - $appContainer.prepend(helpMenu.menu); - $(helpMenu.text).html(Messages.whiteboardHelp); - toolbar.$drawer.append(helpMenu.button); - } + var $appContainer = $('#cp-app-whiteboard-container'); + var helpMenu = common.createHelpMenu(['whiteboard']); + $appContainer.prepend(helpMenu.menu); + toolbar.$drawer.append(helpMenu.button); if (!readOnly) { makeColorButton($rightside);