matty/peertube-plugin-livechat
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Custom channel emoticons WIP (#130): tabs

Browse Source
This commit is contained in:
John Livingston
2024-06-07 11:51:32 +02:00
parent 2dbfe49212
commit 1b9ecea443
8 changed files with 69 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
client/@types/global.d.ts vendored
View File

@ -95,6 +95,7 @@ declare const LOC_CHATROOM_NOT_ACCESSIBLE: string
declare const LOC_PROMOTE: string
declare const LOC_LIVECHAT_CONFIGURATION_CHANNEL_EMOJIS_TITLE: string
declare const LOC_LIVECHAT_CONFIGURATION_CHANNEL_EMOJIS_DESC: string
declare const LOC_LIVECHAT_EMOJIS_SHORTNAME: string
declare const LOC_LIVECHAT_EMOJIS_SHORTNAME_DESC: string
declare const LOC_LIVECHAT_EMOJIS_FILE: string

11
client/common/configuration/elements/channel-configuration.ts
View File

@ -209,15 +209,20 @@ export class ChannelConfigurationElement extends LivechatElement {
<div class="margin-content peertube-plugin-livechat-configuration
peertube-plugin-livechat-configuration-channel">
<h1>
${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_TITLE)}:
<span class="peertube-plugin-livechat-configuration-channel-info">
<span>${this._channelConfiguration?.channel.displayName}</span>
<span>${this._channelConfiguration?.channel.name}</span>
</span>
</h1>
<livechat-channel-tabs .active=${'configuration'} .channelId=${this.channelId}></livechat-channel-tabs>
<p>
${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_DESC)}
<livechat-help-button .page=${'documentation/user/streamers/channel'}>
</livechat-help-button>
</h1>
<p>${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_DESC)}</p>
</p>
<form livechat-configuration-channel-options role="form" @submit=${this._saveConfig}>
<div class="row mt-3">
<div class="row mt-5">

11
client/common/configuration/elements/channel-emojis.ts
View File

@ -65,15 +65,20 @@ export class ChannelEmojisElement extends LivechatElement {
class="margin-content peertube-plugin-livechat-configuration peertube-plugin-livechat-configuration-channel"
>
<h1>
${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_EMOJIS_TITLE)}:
<span class="peertube-plugin-livechat-configuration-channel-info">
<span>${this._channelEmojisConfiguration?.channel.displayName}</span>
<span>${this._channelEmojisConfiguration?.channel.name}</span>
</span>
</h1>
<livechat-channel-tabs .active=${'emojis'} .channelId=${this.channelId}></livechat-channel-tabs>
<p>
${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_EMOJIS_DESC)}
<livechat-help-button .page=${'documentation/user/streamers/emojis'}>
</livechat-help-button>
FIXME: help url OK?
</h1>
</p>
<form role="form" @submit=${this._saveEmojis}>
<div class="row mt-5">
<livechat-dynamic-table-form

40
client/common/configuration/elements/channel-tabs.ts Normal file
View File

@ -0,0 +1,40 @@
// SPDX-FileCopyrightText: 2024 John Livingston <https://www.john-livingston.fr/>
//
// SPDX-License-Identifier: AGPL-3.0-only
import type { RegisterClientOptions } from '@peertube/peertube-types/client'
import { registerClientOptionsContext } from '../../lib/contexts/peertube'
import { LivechatElement } from '../../lib/elements/livechat'
import { ptTr } from '../../lib/directives/translation'
import { html, TemplateResult } from 'lit'
import { customElement, property } from 'lit/decorators.js'
import { consume } from '@lit/context'
@customElement('livechat-channel-tabs')
export class ChannelHomeElement extends LivechatElement {
@consume({ context: registerClientOptionsContext, subscribe: true })
public registerClientOptions?: RegisterClientOptions
@property({ attribute: false })
public channelId?: number
@property({ attribute: false })
public active?: string
protected override render = (): TemplateResult => {
return html`
<a
class="sub-menu-entry ${this.active === 'configuration' ? 'active' : ''}"
href=${'/p/livechat/configuration/channel?channelId=' + encodeURIComponent(this.channelId ?? '')}
>
${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_TITLE)}
</a>
<a
class="sub-menu-entry ${this.active === 'emojis' ? 'active' : ''}"
href=${'/p/livechat/configuration/emojis?channelId=' + encodeURIComponent(this.channelId ?? '')}
>
${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_EMOJIS_TITLE)}
</a>
`
}
}

1
client/common/configuration/elements/index.js
View File

@ -7,3 +7,4 @@
import './channel-home'
import './channel-configuration'
import './channel-emojis'
import './channel-tabs'