Channel configuration UI + disabling bannedJIDs (for now)
This commit is contained in:
John Livingston
parent
501e958c4b
commit
f00bac5eb1
@ -4,6 +4,10 @@
|
||||
Here we are getting some Peertube variables (see _variables.scss in Peertube source code):
|
||||
We are disabling stylelint-disable custom-property-pattern so we can use Peertube var without warnings.
|
||||
*/
|
||||
$font-size: 13px;
|
||||
$button-calc-line-height: 19px; // $font-size + math.round(math.div($font-size, 2));
|
||||
$button-font-size: 15px;
|
||||
$font-bold: 700;
|
||||
$font-semibold: 600;
|
||||
$grey-actor-name: #777272;
|
||||
$grey-background-color: var(--greyBackgroundColor);
|
||||
@ -24,6 +28,73 @@ $small-view: 800px;
|
||||
margin-bottom: $sub-menu-margin-bottom;
|
||||
}
|
||||
|
||||
/* Channel configuration page */
|
||||
&.peertube-plugin-livechat-configuration-channel {
|
||||
.peertube-plugin-livechat-configuration-channel-info {
|
||||
/* stylelint-disable-next-line value-keyword-case */
|
||||
color: var(--mainForegroundColor);
|
||||
|
||||
span:first-child {
|
||||
/* See Peertube .video-channel-display-name */
|
||||
font-weight: $font-semibold;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
span:not(:first-child) {
|
||||
/* See Peertube .video-channel-name */
|
||||
margin-left: 5px;
|
||||
font-size: 14px;
|
||||
color: $grey-actor-name;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
// See Peertube settings-big-title mixin
|
||||
text-transform: uppercase;
|
||||
color: var(--mainColor);
|
||||
font-weight: $font-bold;
|
||||
font-size: 1rem;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
input[type="submit"],
|
||||
input[type="reset"] {
|
||||
// Peertube rounded-line-height-1-5 mixins
|
||||
line-height: $button-calc-line-height;
|
||||
|
||||
// Peertube peertube-button mixin
|
||||
padding: 4px 13px;
|
||||
border: 0;
|
||||
font-weight: $font-semibold;
|
||||
border-radius: 3px !important;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
font-size: $button-font-size;
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
// Peertube orange-button mixin
|
||||
&,
|
||||
&:active,
|
||||
&:focus {
|
||||
color: #fff;
|
||||
background-color: var(--mainColor);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
background-color: var(--mainHoverColor);
|
||||
}
|
||||
|
||||
&[disabled],
|
||||
&.disabled {
|
||||
cursor: default;
|
||||
color: #fff;
|
||||
background-color: var(--inputBorderColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Channel selection page */
|
||||
&.peertube-plugin-livechat-configuration-home {
|
||||
ul.peertube-plugin-livechat-configuration-home-channels {
|
||||
|
||||
@ -28,7 +28,7 @@ async function vivifyConfigurationChannel (
|
||||
const channelConfigurationOptions: ChannelConfigurationOptions = {
|
||||
bot: data.get('bot') === '1',
|
||||
botNickname: data.get('bot_nickname')?.toString() ?? '',
|
||||
bannedJIDs: (data.get('banned_jids')?.toString() ?? '').split(/\r?\n|\r|\n/g),
|
||||
// bannedJIDs: (data.get('banned_jids')?.toString() ?? '').split(/\r?\n|\r|\n/g),
|
||||
forbiddenWords: (data.get('forbidden_words')?.toString() ?? '').split(/\r?\n|\r|\n/g)
|
||||
}
|
||||
|
||||
|
||||
@ -44,7 +44,7 @@ async function renderConfigurationChannel (
|
||||
enableBot: await peertubeHelpers.translate(LOC_LIVECHAT_CONFIGURATION_CHANNEL_ENABLE_BOT_LABEL),
|
||||
botOptions: await peertubeHelpers.translate(LOC_LIVECHAT_CONFIGURATION_CHANNEL_BOT_OPTIONS_TITLE),
|
||||
forbiddenWords: await peertubeHelpers.translate(LOC_LIVECHAT_CONFIGURATION_CHANNEL_FORBIDDEN_WORDS_LABEL),
|
||||
bannedJIDs: await peertubeHelpers.translate(LOC_LIVECHAT_CONFIGURATION_CHANNEL_BANNED_JIDS_LABEL),
|
||||
// bannedJIDs: await peertubeHelpers.translate(LOC_LIVECHAT_CONFIGURATION_CHANNEL_BANNED_JIDS_LABEL),
|
||||
save: await peertubeHelpers.translate(LOC_SAVE),
|
||||
cancel: await peertubeHelpers.translate(LOC_CANCEL),
|
||||
botNickname: await peertubeHelpers.translate(LOC_LIVECHAT_CONFIGURATION_CHANNEL_BOT_NICKNAME),
|
||||
@ -52,49 +52,62 @@ async function renderConfigurationChannel (
|
||||
}
|
||||
|
||||
return Mustache.render(`
|
||||
<div class="margin-content peertube-plugin-livechat-configuration">
|
||||
<h1>{{title}} {{channelConfiguration.channel.displayName}}</h1>
|
||||
<div class="margin-content peertube-plugin-livechat-configuration peertube-plugin-livechat-configuration-channel">
|
||||
<h1>
|
||||
{{title}}:
|
||||
<span class="peertube-plugin-livechat-configuration-channel-info">
|
||||
<span>{{channelConfiguration.channel.displayName}}</span>
|
||||
<span>{{channelConfiguration.channel.name}}</span>
|
||||
</span>
|
||||
</h1>
|
||||
<p>{{description}}</p>
|
||||
<form livechat-configuration-channel-options>
|
||||
<fieldset>
|
||||
<label>
|
||||
<input
|
||||
type="checkbox" name="bot"
|
||||
value="1"
|
||||
{{#channelConfiguration.configuration.bot}}
|
||||
checked="checked"
|
||||
{{/channelConfiguration.configuration.bot}}
|
||||
/>
|
||||
{{enableBot}}
|
||||
</label>
|
||||
</fieldset>
|
||||
<fieldset livechat-configuration-channel-options-bot-enabled>
|
||||
<legend>{{botOptions}}</legend>
|
||||
<label>
|
||||
{{botNickname}}
|
||||
<input
|
||||
type="text"
|
||||
name="bot_nickname"
|
||||
value="{{channelConfiguration.configuration.botNickname}}"
|
||||
/>
|
||||
</label>
|
||||
<label>
|
||||
{{forbiddenWords}}
|
||||
<textarea name="forbidden_words">
|
||||
<form livechat-configuration-channel-options role="form">
|
||||
<div class="row mt-3">
|
||||
<div class="col-12 col-lg-4 col-xl-3">
|
||||
<h2>{{botOptions}}</h2>
|
||||
</div>
|
||||
<div class="col-12 col-lg-8 col-xl-9">
|
||||
<fieldset>
|
||||
<div class="form-group">
|
||||
<label>
|
||||
<input
|
||||
type="checkbox"
|
||||
name="bot"
|
||||
id="peertube-livechat-bot"
|
||||
value="1"
|
||||
{{#channelConfiguration.configuration.bot}}
|
||||
checked="checked"
|
||||
{{/channelConfiguration.configuration.bot}}
|
||||
/>
|
||||
{{enableBot}}
|
||||
</label>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset livechat-configuration-channel-options-bot-enabled>
|
||||
<div class="form-group">
|
||||
<label for="peertube-livechat-bot-nickname">{{botNickname}}</label>
|
||||
<input
|
||||
type="text"
|
||||
name="bot_nickname"
|
||||
class="form-control"
|
||||
id="peertube-livechat-bot-nickname"
|
||||
value="{{channelConfiguration.configuration.botNickname}}"
|
||||
/>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="peertube-livechat-forbidden-words">{{forbiddenWords}}</label>
|
||||
<textarea name="forbidden_words" id="peertube-livechat-forbidden-words" class="form-control">
|
||||
{{#channelConfiguration.configuration.forbiddenWords}}{{.}}
|
||||
{{/channelConfiguration.configuration.forbiddenWords}}
|
||||
</textarea>
|
||||
</label>
|
||||
<label>
|
||||
{{bannedJIDs}}
|
||||
<textarea name="banned_jids">
|
||||
{{#channelConfiguration.configuration.bannedJIDs}}{{.}}
|
||||
{{/channelConfiguration.configuration.bannedJIDs}}
|
||||
</textarea>
|
||||
</label>
|
||||
</fieldset>
|
||||
<input type="submit" value="{{save}}" />
|
||||
<input type="reset" value="{{cancel}}" />
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input type="submit" value="{{save}}" />
|
||||
<input type="reset" value="{{cancel}}" />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
`, view) as string
|
||||
|
||||
@ -311,8 +311,8 @@ menu_configuration_label: "Chatrooms"
|
||||
livechat_configuration_title: "Configure your live's chatrooms"
|
||||
livechat_configuration_desc: "Here you can configure some advanced options for chatrooms associated to your live streams."
|
||||
livechat_configuration_please_select: "Please select bellow one of your channel, to setup its chatting options."
|
||||
livechat_configuration_channel_title: "Moderation policies for channel:"
|
||||
livechat_configuration_channel_desc: "You can setup here your moderation policies for this channel."
|
||||
livechat_configuration_channel_title: "Channel options"
|
||||
livechat_configuration_channel_desc: "You can setup here some options for this channel (moderation policies, ...)."
|
||||
livechat_configuration_channel_enable_bot_label: "Enable moderation bot"
|
||||
livechat_configuration_channel_bot_options_title: "Moderation bot options"
|
||||
livechat_configuration_channel_forbidden_words_label: "Forbidden words or expressions"
|
||||
|
||||
@ -21,7 +21,7 @@ async function sanitizeChannelConfigurationOptions (
|
||||
const result: ChannelConfigurationOptions = {
|
||||
bot: _readBoolean(data, 'bot'),
|
||||
botNickname: _readSimpleInput(data, 'botNickname'),
|
||||
bannedJIDs: await _readRegExpArray(data, 'bannedJIDs'),
|
||||
// bannedJIDs: await _readRegExpArray(data, 'bannedJIDs'),
|
||||
forbiddenWords: await _readRegExpArray(data, 'forbiddenWords')
|
||||
}
|
||||
|
||||
|
||||
@ -38,7 +38,7 @@ function getDefaultChannelConfigurationOptions (_options: RegisterServerOptions)
|
||||
return {
|
||||
bot: false,
|
||||
botNickname: 'Sepia',
|
||||
bannedJIDs: [],
|
||||
// bannedJIDs: [],
|
||||
forbiddenWords: []
|
||||
}
|
||||
}
|
||||
|
||||
@ -56,7 +56,7 @@ interface ChannelConfigurationOptions {
|
||||
bot: boolean
|
||||
botNickname?: string
|
||||
forbiddenWords: string[]
|
||||
bannedJIDs: string[]
|
||||
// TODO: bannedJIDs: string[]
|
||||
}
|
||||
|
||||
interface ChannelConfiguration {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user