Add "only display embed URL" in share modal

pull/5004/head
Chocobozzz 2022-05-20 09:07:00 +02:00
parent 6b3aa06804
commit a871d2a273
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
2 changed files with 41 additions and 14 deletions

View File

@ -47,7 +47,7 @@
<ng-template ngbNavContent> <ng-template ngbNavContent>
<div class="nav-content"> <div class="nav-content">
<my-input-toggle-hidden <my-input-toggle-hidden
[value]="getPlaylistIframeCode()" (change)="updateEmbedCode()" [value]="customizations.onlyEmbedUrl ? getPlaylistEmbedUrl() : getPlaylistIframeCode()" (change)="updateEmbedCode()"
[withToggle]="false" [withCopy]="true" [show]="true" [readonly]="true" [withToggle]="false" [withCopy]="true" [show]="true" [readonly]="true"
></my-input-toggle-hidden> ></my-input-toggle-hidden>
@ -67,8 +67,18 @@
<div class="filters"> <div class="filters">
<div class="form-group" *ngIf="video"> <div class="form-group" *ngIf="video">
<my-peertube-checkbox inputName="includeVideoInPlaylist" [(ngModel)]="includeVideoInPlaylist" i18n-labelText <my-peertube-checkbox
labelText="Share the playlist at this video position"></my-peertube-checkbox> inputName="includeVideoInPlaylist" [(ngModel)]="includeVideoInPlaylist"
i18n-labelText labelText="Share the playlist at this video position"
></my-peertube-checkbox>
</div>
<div class="form-group">
<my-peertube-checkbox
*ngIf="isInPlaylistEmbedTab()"
inputName="onlyEmbedUrl" [(ngModel)]="customizations.onlyEmbedUrl"
i18n-labelText labelText="Only display embed URL"
></my-peertube-checkbox>
</div> </div>
</div> </div>
@ -114,7 +124,7 @@
<ng-template ngbNavContent> <ng-template ngbNavContent>
<div class="nav-content"> <div class="nav-content">
<my-input-toggle-hidden <my-input-toggle-hidden
[value]="getVideoIframeCode()" (ngModelChange)="updateEmbedCode()" [value]="customizations.onlyEmbedUrl ? getVideoEmbedUrl() : getVideoIframeCode()" (ngModelChange)="updateEmbedCode()"
[withToggle]="false" [withCopy]="true" [show]="true" [readonly]="true" [withToggle]="false" [withCopy]="true" [show]="true" [readonly]="true"
></my-input-toggle-hidden> ></my-input-toggle-hidden>
@ -160,6 +170,14 @@
</select> </select>
</div> </div>
</div> </div>
<div class="form-group">
<my-peertube-checkbox
*ngIf="isInVideoEmbedTab()"
inputName="onlyEmbedUrl" [(ngModel)]="customizations.onlyEmbedUrl"
i18n-labelText labelText="Only display embed URL"
></my-peertube-checkbox>
</div>
</div> </div>
<div class="advanced-filters collapse-transition" [ngbCollapse]="isAdvancedCustomizationCollapsed"> <div class="advanced-filters collapse-transition" [ngbCollapse]="isAdvancedCustomizationCollapsed">
@ -200,7 +218,7 @@
></my-peertube-checkbox> ></my-peertube-checkbox>
</div> </div>
<div *ngIf="!isLocalVideo() && !isVideoInEmbedTab()" class="form-group"> <div *ngIf="!isLocalVideo() && !isInVideoEmbedTab()" class="form-group">
<my-peertube-checkbox <my-peertube-checkbox
inputName="originUrl" [(ngModel)]="customizations.originUrl" inputName="originUrl" [(ngModel)]="customizations.originUrl"
i18n-labelText labelText="Use origin instance URL" i18n-labelText labelText="Use origin instance URL"
@ -208,7 +226,7 @@
</div> </div>
</div> </div>
<ng-container *ngIf="isVideoInEmbedTab()"> <ng-container *ngIf="isInVideoEmbedTab()">
<div class="form-group"> <div class="form-group">
<my-peertube-checkbox <my-peertube-checkbox
inputName="title" [(ngModel)]="customizations.title" inputName="title" [(ngModel)]="customizations.title"

View File

@ -24,6 +24,7 @@ type Customizations = {
muted: boolean muted: boolean
embedP2P: boolean embedP2P: boolean
onlyEmbedUrl: boolean
title: boolean title: boolean
warningTitle: boolean warningTitle: boolean
controls: boolean controls: boolean
@ -82,9 +83,9 @@ export class VideoShareComponent {
autoplay: false, autoplay: false,
muted: false, muted: false,
embedP2P: this.server.getHTMLConfig().defaults.p2p.embed.enabled,
// Embed options // Embed options
embedP2P: this.server.getHTMLConfig().defaults.p2p.embed.enabled,
onlyEmbedUrl: false,
title: true, title: true,
warningTitle: true, warningTitle: true,
controls: true, controls: true,
@ -112,15 +113,19 @@ export class VideoShareComponent {
} }
getVideoIframeCode () { getVideoIframeCode () {
const embedUrl = decorateVideoLink({ url: this.video.embedUrl, ...this.getVideoOptions(true) }) return buildVideoOrPlaylistEmbed(this.getVideoEmbedUrl(), this.video.name)
}
return buildVideoOrPlaylistEmbed(embedUrl, this.video.name) getVideoEmbedUrl () {
return decorateVideoLink({ url: this.video.embedUrl, ...this.getVideoOptions(true) })
}
getPlaylistEmbedUrl () {
return decoratePlaylistLink({ url: this.playlist.embedUrl, ...this.getPlaylistOptions() })
} }
getPlaylistIframeCode () { getPlaylistIframeCode () {
const embedUrl = decoratePlaylistLink({ url: this.playlist.embedUrl, ...this.getPlaylistOptions() }) return buildVideoOrPlaylistEmbed(this.getPlaylistEmbedUrl(), this.playlist.displayName)
return buildVideoOrPlaylistEmbed(embedUrl, this.playlist.displayName)
} }
getVideoUrl () { getVideoUrl () {
@ -152,10 +157,14 @@ export class VideoShareComponent {
return window.location.protocol === 'http:' return window.location.protocol === 'http:'
} }
isVideoInEmbedTab () { isInVideoEmbedTab () {
return this.activeVideoId === 'embed' return this.activeVideoId === 'embed'
} }
isInPlaylistEmbedTab () {
return this.activePlaylistId === 'embed'
}
isLocalVideo () { isLocalVideo () {
return this.video.isLocal return this.video.isLocal
} }