peertube-plugin-livechat/client/common/configuration/logic/channel.ts

86 lines
2.9 KiB
TypeScript
Raw Normal View History

2023-08-09 10:20:19 +00:00
import type { RegisterClientOptions } from '@peertube/peertube-types/client'
import type { ChannelConfigurationOptions } from 'shared/lib/types'
2023-08-09 14:16:02 +00:00
import { getBaseRoute } from '../../../videowatch/uri'
2023-08-09 10:20:19 +00:00
/**
* Adds the front-end logic on the generated html for the channel configuration options.
2023-08-09 10:20:19 +00:00
* @param clientOptions Peertube client options
* @param rootEl The root element in which the template was rendered
*/
async function vivifyConfigurationChannel (
2023-08-09 10:20:19 +00:00
clientOptions: RegisterClientOptions,
2023-08-09 14:16:02 +00:00
rootEl: HTMLElement,
channelId: string
2023-08-09 10:20:19 +00:00
): Promise<void> {
const form = rootEl.querySelector('form[livechat-configuration-channel-options]') as HTMLFormElement
2023-08-09 10:20:19 +00:00
if (!form) { return }
2023-08-09 14:16:02 +00:00
const labelSaved = await clientOptions.peertubeHelpers.translate(LOC_SUCCESSFULLY_SAVED)
const labelError = await clientOptions.peertubeHelpers.translate(LOC_ERROR)
2023-08-09 10:20:19 +00:00
const enableBotCB = form.querySelector('input[name=bot]') as HTMLInputElement
const botEnabledEl = form.querySelector('[livechat-configuration-channel-options-bot-enabled]') as HTMLElement
2023-08-09 10:20:19 +00:00
const refresh: Function = () => {
botEnabledEl.style.display = enableBotCB.checked ? 'initial' : 'none'
}
2023-08-09 14:16:02 +00:00
const submitForm: Function = async () => {
const data = new FormData(form)
const channelConfigurationOptions: ChannelConfigurationOptions = {
2023-08-09 14:16:02 +00:00
bot: data.get('bot') === '1',
2023-09-19 16:56:39 +00:00
botNickname: data.get('bot_nickname')?.toString() ?? '',
2023-08-09 14:16:02 +00:00
bannedJIDs: (data.get('banned_jids')?.toString() ?? '').split(/\r?\n|\r|\n/g),
forbiddenWords: (data.get('forbidden_words')?.toString() ?? '').split(/\r?\n|\r|\n/g)
}
const headers: any = clientOptions.peertubeHelpers.getAuthHeader() ?? {}
headers['content-type'] = 'application/json;charset=UTF-8'
const response = await fetch(
getBaseRoute(clientOptions) + '/api/configuration/channel/' + encodeURIComponent(channelId),
2023-08-09 14:16:02 +00:00
{
method: 'POST',
headers,
body: JSON.stringify(channelConfigurationOptions)
2023-08-09 14:16:02 +00:00
}
)
if (!response.ok) {
throw new Error('Failed to save configuration options.')
2023-08-09 14:16:02 +00:00
}
}
const toggleSubmit: Function = (disabled: boolean) => {
form.querySelectorAll('input[type=submit], input[type=reset]').forEach((el) => {
if (disabled) {
el.setAttribute('disabled', 'disabled')
} else {
el.removeAttribute('disabled')
}
})
}
2023-08-09 10:20:19 +00:00
enableBotCB.onclick = () => refresh()
2023-08-09 14:16:02 +00:00
form.onsubmit = () => {
toggleSubmit(true)
submitForm().then(
() => {
clientOptions.peertubeHelpers.notifier.success(labelSaved)
toggleSubmit(false)
},
() => {
clientOptions.peertubeHelpers.notifier.error(labelError)
toggleSubmit(false)
}
)
return false
}
form.onreset = () => {
// Must refresh in a setTimeout, otherwise the checkbox state is not up to date.
setTimeout(() => refresh(), 1)
}
2023-08-09 10:20:19 +00:00
refresh()
}
export {
vivifyConfigurationChannel
2023-08-09 10:20:19 +00:00
}