diff --git a/CHANGELOG.md b/CHANGELOG.md
index 76246a95..1290c021 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -8,6 +8,7 @@
* new option in room configuration to set the slow mode delay (new prosody module mod_muc_slow_mode).
* default delay is configurable in channel's chat rooms options.
* backend rejects messages when the slow mode is not respected.
+ * frontend: display an infobox when slow mode is active.
### Minor changes and fixes
diff --git a/conversejs/builtin.ts b/conversejs/builtin.ts
index 94a05d74..2e065e5e 100644
--- a/conversejs/builtin.ts
+++ b/conversejs/builtin.ts
@@ -10,6 +10,7 @@ import {
} from './lib/converse-params'
import { getLocalAuthentInfos } from './lib/auth'
import { randomNick, getPreviousAnonymousNick, setPreviousAnonymousNick } from './lib/nick'
+import { slowModePlugin } from './lib/slow-mode/plugin'
declare global {
interface Window {
@@ -109,6 +110,8 @@ window.initConverse = async function initConverse (initConverseParams: InitConve
}
})
+ converse.plugins.add('converse-slow-mode', slowModePlugin)
+
// livechatSpecifics plugins add some customization for the livechat plugin.
converse.plugins.add('livechatSpecifics', {
dependencies: ['converse-muc', 'converse-muc-views'],
diff --git a/conversejs/custom/shared/styles/_peertubetheme.scss b/conversejs/custom/shared/styles/_peertubetheme.scss
index 59bf6e83..1c1809c1 100644
--- a/conversejs/custom/shared/styles/_peertubetheme.scss
+++ b/conversejs/custom/shared/styles/_peertubetheme.scss
@@ -16,6 +16,13 @@
}
.chatbox {
+ // Slow mode info box
+ livechat-slow-mode {
+ border-top: var(--chatroom-message-input-border-top);
+ color: var(--peertube-main-foreground);
+ background-color: var(--peertube-main-background);
+ }
+
converse-chat-toolbar {
color: var(--peertube-main-foreground);
background-color: var(--peertube-main-background);
diff --git a/conversejs/custom/templates/muc-bottom-panel.js b/conversejs/custom/templates/muc-bottom-panel.js
index 494edd8e..69d85c60 100644
--- a/conversejs/custom/templates/muc-bottom-panel.js
+++ b/conversejs/custom/templates/muc-bottom-panel.js
@@ -2,6 +2,7 @@ import { __ } from 'i18n'
import { _converse, api } from '@converse/headless/core'
import { html } from 'lit'
import tplMucBottomPanel from '../../src/plugins/muc-views/templates/muc-bottom-panel.js'
+import { CustomElement } from 'shared/components/element.js'
async function setNickname (ev, model) {
ev.preventDefault()
@@ -15,6 +16,41 @@ async function setNickname (ev, model) {
})
}
+class SlowMode extends CustomElement {
+ static get properties () {
+ return {
+ jid: { type: String }
+ }
+ }
+
+ async connectedCallback () {
+ super.connectedCallback()
+ this.model = _converse.chatboxes.get(this.jid)
+ await this.model.initialized
+
+ this.listenTo(this.model.config, 'change:slow_mode_delay', () => {
+ this.requestUpdate()
+ })
+ }
+
+ render () {
+ if (!(parseInt(this.model.config.get('slow_mode_delay')) > 0)) { // This includes NaN, for which ">0"===false
+ return html``
+ }
+ return html`
+
+ ${__(
+ 'Slow mode is enabled, you have to wait %1$s seconds between two messages.',
+ this.model.config.get('slow_mode_delay')
+ )}`
+ }
+}
+api.elements.define('livechat-slow-mode', SlowMode)
+
+const tplSlowMode = (o) => {
+ return html``
+}
+
export default (o) => {
if (api.settings.get('livechat_viewer_mode')) {
const model = o.model
@@ -39,7 +75,11 @@ export default (o) => {
+ ${tplSlowMode(o)}
${tplMucBottomPanel(o)}`
}
- return tplMucBottomPanel(o)
+
+ return html`
+ ${tplSlowMode(o)}
+ ${tplMucBottomPanel(o)}`
}
diff --git a/conversejs/lib/converse-params.ts b/conversejs/lib/converse-params.ts
index 705dd38c..a5de427b 100644
--- a/conversejs/lib/converse-params.ts
+++ b/conversejs/lib/converse-params.ts
@@ -78,7 +78,8 @@ function defaultConverseParams (
'livechatWindowTitlePlugin',
'livechatSpecifics',
'livechatViewerModePlugin',
- 'livechatDisconnectOnUnloadPlugin'
+ 'livechatDisconnectOnUnloadPlugin',
+ 'converse-slow-mode'
],
show_retraction_warning: false, // No need to use this warning (except if we open to external clients?)
muc_show_info_messages: mucShowInfoMessages,
diff --git a/conversejs/lib/slow-mode/plugin.ts b/conversejs/lib/slow-mode/plugin.ts
new file mode 100644
index 00000000..6f5a58bf
--- /dev/null
+++ b/conversejs/lib/slow-mode/plugin.ts
@@ -0,0 +1,14 @@
+/**
+ * Slow Mode plugin definition.
+ * This code should be published to ConverseJS upstream once the XEP for the slow mode feature is proposed.
+ * Note: part of the code is also in the custom muc-bottom-panel template.
+ */
+export const slowModePlugin = {
+ dependencies: ['converse-muc', 'converse-muc-views'],
+ async initialize (this: any) {
+ const _converse = this._converse
+ _converse.api.listen.on('chatRoomInitialized', function (this: any, _model: any): void {
+ // TODO: disable the textarea after each new message, for X seconds.
+ })
+ }
+}
diff --git a/languages/en.yml b/languages/en.yml
index 276d2305..b500cc05 100644
--- a/languages/en.yml
+++ b/languages/en.yml
@@ -387,3 +387,5 @@ livechat_configuration_channel_banned_jids_label: "Banned users and patterns"
livechat_configuration_channel_bot_nickname: "Bot nickname"
invalid_value: "Invalid value."
+
+slow_mode_info: "Slow mode is enabled, you have to wait 10 seconds between two messages."