Documentation link in task application.

conversejs/build-conversejs-patch-i18n.js

@@ -54,6 +54,10 @@ function patch (lang) {
     const label = labels[key]
     patchLabel(destContent, label, yaml[key] ?? '')
   }
+
+  // We add an extra _livechat_language, so we can compute url to documentation
+  // (same thing as _language in build-languages.js)
+  patchLabel(destContent, '_livechat_language', lang)
   fs.writeFileSync(destFile, destContent.join('\n'))
 }
 

conversejs/custom/plugins/tasks/templates/muc-task-app.js

@@ -1,3 +1,4 @@
+import { converseLocalizedHelpUrl } from '../../../shared/lib/help'
 import { html } from 'lit'
 import { __ } from 'i18n'
 
@@ -23,15 +24,19 @@ export function tplMUCTaskApp (el, mucModel) {
   // eslint-disable-next-line no-undef
   const i18nTasks = __(LOC_tasks)
   // eslint-disable-next-line no-undef
-  const i18nHint = __(LOC_task_app_info)
+  const i18nHelp = __(LOC_online_help)
+  const helpUrl = converseLocalizedHelpUrl({
+    page: 'documentation/user/streamers/tasks'
+  })
+
   return html`
     <div class="livechat-converse-muc-app-header">
       <h5>${i18nTasks}</h5>
-      <converse-icon
-          class="fa fa-info-circle"
+      <a href="${helpUrl}" target="_blank"><converse-icon
+          class="fa fa-circle-question"
           size="1em"
-          title="${i18nHint}"
-      ></converse-icon>
+          title="${i18nHelp}"
+      ></converse-icon></a>
       <button class="livechat-converse-muc-app-close" @click=${el.toggleApp} title="${__('Close')}">
           <converse-icon class="fa fa-times" size="1em"></converse-icon>
       </button>

conversejs/custom/shared/components/font-awesome.js

@@ -11,9 +11,14 @@ export default () => {
 
     <svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
       <!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
-    <symbol id="icon-list-check" viewBox="0 0 448 512">
-      <path d="M152.1 38.2c9.9 8.9 10.7 24 1.8 33.9l-72 80c-4.4 4.9-10.6 7.8-17.2 7.9s-12.9-2.4-17.6-7L7 113C-2.3 103.6-2.3 88.4 7 79s24.6-9.4 33.9 0l22.1 22.1 55.1-61.2c8.9-9.9 24-10.7 33.9-1.8zm0 160c9.9 8.9 10.7 24 1.8 33.9l-72 80c-4.4 4.9-10.6 7.8-17.2 7.9s-12.9-2.4-17.6-7L7 273c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l22.1 22.1 55.1-61.2c8.9-9.9 24-10.7 33.9-1.8zM224 96c0-17.7 14.3-32 32-32H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H256c-17.7 0-32-14.3-32-32zm0 160c0-17.7 14.3-32 32-32H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H256c-17.7 0-32-14.3-32-32zM160 416c0-17.7 14.3-32 32-32H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H192c-17.7 0-32-14.3-32-32zM48 368a48 48 0 1 1 0 96 48 48 0 1 1 0-96z"/>
-    </symbol>
+      <symbol id="icon-list-check" viewBox="0 0 448 512">
+        <path d="M152.1 38.2c9.9 8.9 10.7 24 1.8 33.9l-72 80c-4.4 4.9-10.6 7.8-17.2 7.9s-12.9-2.4-17.6-7L7 113C-2.3 103.6-2.3 88.4 7 79s24.6-9.4 33.9 0l22.1 22.1 55.1-61.2c8.9-9.9 24-10.7 33.9-1.8zm0 160c9.9 8.9 10.7 24 1.8 33.9l-72 80c-4.4 4.9-10.6 7.8-17.2 7.9s-12.9-2.4-17.6-7L7 273c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l22.1 22.1 55.1-61.2c8.9-9.9 24-10.7 33.9-1.8zM224 96c0-17.7 14.3-32 32-32H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H256c-17.7 0-32-14.3-32-32zm0 160c0-17.7 14.3-32 32-32H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H256c-17.7 0-32-14.3-32-32zM160 416c0-17.7 14.3-32 32-32H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H192c-17.7 0-32-14.3-32-32zM48 368a48 48 0 1 1 0 96 48 48 0 1 1 0-96z"/>
+      </symbol>
+
+      <!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
+      <symbol id="icon-circle-question" viewBox="0 0 448 512">
+        <path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM169.8 165.3c7.9-22.3 29.1-37.3 52.8-37.3h58.3c34.9 0 63.1 28.3 63.1 63.1c0 22.6-12.1 43.5-31.7 54.8L280 264.4c-.2 13-10.9 23.6-24 23.6c-13.3 0-24-10.7-24-24V250.5c0-8.6 4.6-16.5 12.1-20.8l44.3-25.4c4.7-2.7 7.6-7.7 7.6-13.1c0-8.4-6.8-15.1-15.1-15.1H222.6c-3.4 0-6.4 2.1-7.5 5.3l-.4 1.2c-4.4 12.5-18.2 19-30.6 14.6s-19-18.2-14.6-30.6l.4-1.2zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z"/>
+      </symbol>
     </svg>
   `
 }

conversejs/custom/shared/lib/help.js

@@ -0,0 +1,44 @@
+import { __ } from 'i18n'
+
+/**
+ * Returns the current language code.
+ * This is the code that correspond to the path for localized documentation
+ * (in other words: 'fr', not 'fr-FR').
+ * This is the 'ConverseJS version' of the same function in `client/utils/help`.
+ * @returns language code
+ */
+function getLangCode () {
+  // See the build-languages.js script for more information about this trick.
+  const s = __('_livechat_language')
+  if (s === '_livechat_language') {
+    return 'en'
+  }
+  return s
+}
+
+function helpUrl (options) {
+  let url = 'https://livingston.frama.io/peertube-plugin-livechat/'
+  if (options.lang && /^[a-zA-Z_-]+$/.test(options.lang)) {
+    url = url + options.lang + '/'
+  }
+  if (options.page && /^[\w/-]+$/.test(options.page)) {
+    url = url + options.page + '/'
+  }
+  return url
+}
+
+/**
+ * Returns the url of the documentation, in the current user language.
+ * This is the 'ConverseJS version' of the same function in `client/utils/help`.
+*/
+function converseLocalizedHelpUrl (helpUrlOptions) {
+  const lang = getLangCode().toLowerCase() // lowercase is needed for zh-hans for example
+  if (lang === 'en') {
+    return helpUrl(helpUrlOptions)
+  }
+  return helpUrl(Object.assign({}, helpUrlOptions, { lang }))
+}
+
+export {
+  converseLocalizedHelpUrl
+}

conversejs/loc.keys.js

@@ -16,6 +16,7 @@ const locKeys = [
   'login_remote_peertube_video_not_found_try_anyway_button',
   'login_remote_peertube_video_open_failed',
   'login_external_auth_alert_message',
+  'online_help',
   'tasks',
   'task_list_create',
   'task_list_create_error',
@@ -27,7 +28,6 @@ const locKeys = [
   'task_description',
   'task_delete',
   'task_delete_confirm',
-  'task_app_info',
   'task_list_pick_title',
   'task_list_pick_empty',
   'task_list_pick_message'

languages/en.yml

@@ -446,9 +446,6 @@ task_name: 'Task name'
 task_description: 'Description'
 task_delete: 'Delete task'
 task_delete_confirm: 'Are you sure you want to delete this task?'
-task_app_info: |
-  You can create tasks and task lists, which are shared between all room's admins.
-  See the livechat streamers documentation for more information.
 task_list_pick_title: 'Please choose a task list'
 task_list_pick_empty: 'There is no task list for now, please first create one'
 task_list_pick_message: |