export * from './comment'
+export * from './information'
export * from './metadata'
export * from './playlist'
export * from './recommendations'
--- /dev/null
+export * from './privacy-concerns.component'
--- /dev/null
+<div class="privacy-concerns" *ngIf="hasAlreadyAcceptedPrivacyConcern === false">
+ <div class="privacy-concerns-text">
+ <span class="mr-2">
+ <strong i18n>Friendly Reminder: </strong>
+ <ng-container i18n>
+ the sharing system used for this video implies that some technical information about your system (such as a public IP address) can be sent to other peers.
+ </ng-container>
+ </span>
+ <a i18n i18n-title title="Get more information" target="_blank" rel="noopener noreferrer" href="/about/peertube#privacy">More information</a>
+ </div>
+
+ <div i18n class="privacy-concerns-button privacy-concerns-okay" (click)="acceptedPrivacyConcern()">
+ OK
+ </div>
+</div>
--- /dev/null
+@use '_variables' as *;
+@use '_mixins' as *;
+
+.privacy-concerns {
+ position: fixed;
+ bottom: 0;
+
+ width: calc(100% - #{$menu-width});
+ z-index: z(privacymsg);
+
+ padding: 5px 15px;
+
+ display: flex;
+ flex-wrap: nowrap;
+ align-items: center;
+ justify-content: space-between;
+ background-color: rgba(0, 0, 0, 0.9);
+ color: #fff;
+}
+
+// If the view is expanded
+:host-context(.expanded) {
+ .privacy-concerns {
+ width: 100%;
+ }
+}
+
+// Or if we are in the small view
+@media screen and (max-width: $small-view) {
+ .privacy-concerns {
+ width: 100%;
+ }
+}
+
+.privacy-concerns-text {
+ margin: 0 5px;
+}
+
+a {
+ @include disable-default-a-behaviour;
+
+ color: pvar(--mainColor);
+ transition: color 0.3s;
+
+ &:hover {
+ color: #fff;
+ }
+}
+
+.privacy-concerns-button {
+ @include margin-left(auto);
+
+ padding: 5px 8px 5px 7px;
+ border-radius: 3px;
+ white-space: nowrap;
+ cursor: pointer;
+ transition: background-color 0.3s;
+ font-weight: $font-semibold;
+
+ &:hover {
+ background-color: #000;
+ }
+}
+
+.privacy-concerns-okay {
+ @include margin-left(10px);
+
+ background-color: pvar(--mainColor);
+}
+
+@media screen and (max-width: 1300px) {
+ .privacy-concerns {
+ font-size: 12px;
+ padding: 2px 5px;
+ }
+
+ .privacy-concerns-text {
+ margin: 0;
+ }
+}
--- /dev/null
+import { Component, OnInit } from '@angular/core'
+import { ServerService } from '@app/core'
+import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage'
+import { HTMLServerConfig } from '@shared/models'
+import { getStoredP2PEnabled } from '../../../../../assets/player/peertube-player-local-storage'
+import { isWebRTCDisabled } from '../../../../../assets/player/utils'
+
+@Component({
+ selector: 'my-privacy-concerns',
+ templateUrl: './privacy-concerns.component.html',
+ styleUrls: [ './privacy-concerns.component.scss' ]
+})
+export class PrivacyConcernsComponent implements OnInit {
+ private static LOCAL_STORAGE_PRIVACY_CONCERN_KEY = 'video-watch-privacy-concern'
+
+ hasAlreadyAcceptedPrivacyConcern = false
+
+ private serverConfig: HTMLServerConfig
+
+ constructor (
+ private serverService: ServerService
+ ) { }
+
+ async ngOnInit () {
+ this.serverConfig = this.serverService.getHTMLConfig()
+ if (
+ isWebRTCDisabled() ||
+ this.serverConfig.tracker.enabled === false ||
+ getStoredP2PEnabled() === false ||
+ peertubeLocalStorage.getItem(PrivacyConcernsComponent.LOCAL_STORAGE_PRIVACY_CONCERN_KEY) === 'true'
+ ) {
+ this.hasAlreadyAcceptedPrivacyConcern = true
+ }
+ }
+
+ declinedPrivacyConcern () {
+ peertubeLocalStorage.setItem(PrivacyConcernsComponent.LOCAL_STORAGE_PRIVACY_CONCERN_KEY, 'false')
+ this.hasAlreadyAcceptedPrivacyConcern = false
+ }
+
+ acceptedPrivacyConcern () {
+ peertubeLocalStorage.setItem(PrivacyConcernsComponent.LOCAL_STORAGE_PRIVACY_CONCERN_KEY, 'true')
+ this.hasAlreadyAcceptedPrivacyConcern = true
+ }
+}
import { MarkdownService, Notifier } from '@app/core'
import { VideoDetails, VideoService } from '@app/shared/shared-main'
-
@Component({
selector: 'my-video-description',
templateUrl: './video-description.component.html',
></my-recommended-videos>
</div>
- <div class="row privacy-concerns" *ngIf="hasAlreadyAcceptedPrivacyConcern === false">
- <div class="privacy-concerns-text">
- <span class="mr-2">
- <strong i18n>Friendly Reminder: </strong>
- <ng-container i18n>
- the sharing system used for this video implies that some technical information about your system (such as a public IP address) can be sent to other peers.
- </ng-container>
- </span>
- <a i18n i18n-title title="Get more information" target="_blank" rel="noopener noreferrer" href="/about/peertube#privacy">More information</a>
- </div>
-
- <div i18n class="privacy-concerns-button privacy-concerns-okay" (click)="acceptedPrivacyConcern()">
- OK
- </div>
- </div>
+ <my-privacy-concerns></my-privacy-concerns>
</div>
<ng-container *ngIf="video !== null">
margin-bottom: 20px;
}
-// If the view is not expanded, take into account the menu
-.privacy-concerns {
- z-index: z(dropdown) + 1;
- width: calc(100% - #{$menu-width});
-}
-
-@media screen and (max-width: $small-view) {
- .privacy-concerns {
- @include margin-left($menu-width - 15px); // Menu is absolute
- }
-}
-
-:host-context(.expanded) {
- .privacy-concerns {
- @include margin-left(-15px);
-
- width: 100%;
- }
-}
-
-.privacy-concerns {
- position: fixed;
- bottom: 0;
- z-index: z(privacymsg);
-
- padding: 5px 15px;
-
- display: flex;
- flex-wrap: nowrap;
- align-items: center;
- justify-content: space-between;
- background-color: rgba(0, 0, 0, 0.9);
- color: #fff;
-
- .privacy-concerns-text {
- margin: 0 5px;
- }
-
- a {
- @include disable-default-a-behaviour;
-
- color: pvar(--mainColor);
- transition: color 0.3s;
-
- &:hover {
- color: #fff;
- }
- }
-
- .privacy-concerns-button {
- @include margin-left(auto);
-
- padding: 5px 8px 5px 7px;
- border-radius: 3px;
- white-space: nowrap;
- cursor: pointer;
- transition: background-color 0.3s;
- font-weight: $font-semibold;
-
- &:hover {
- background-color: #000;
- }
- }
-
- .privacy-concerns-okay {
- @include margin-left(10px);
-
- background-color: pvar(--mainColor);
- }
-}
-
@media screen and (max-width: 1600px) {
.video-bottom .video-info .video-attributes .video-attribute {
margin-bottom: 5px;
}
}
-@media screen and (max-width: 1300px) {
- .privacy-concerns {
- font-size: 12px;
- padding: 2px 5px;
-
- .privacy-concerns-text {
- margin: 0;
- }
- }
-}
-
// Use the same breakpoint than in the typescript component to display the other video miniatures as row
@media screen and (max-width: 1100px) {
#video-wrapper {
}
}
}
-
- .privacy-concerns {
- width: 100%;
- }
}
@media screen and (max-width: 450px) {
import { SubscribeButtonComponent } from '@app/shared/shared-user-subscription'
import { VideoActionsDisplayType, VideoDownloadComponent } from '@app/shared/shared-video-miniature'
import { VideoPlaylist, VideoPlaylistService } from '@app/shared/shared-video-playlist'
-import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage'
import { HttpStatusCode } from '@shared/core-utils/miscs/http-error-codes'
import {
HTMLServerConfig,
VideoPrivacy,
VideoState
} from '@shared/models'
-import {
- cleanupVideoWatch,
- getStoredP2PEnabled,
- getStoredTheater,
- getStoredVideoWatchHistory
-} from '../../../assets/player/peertube-player-local-storage'
+import { cleanupVideoWatch, getStoredTheater, getStoredVideoWatchHistory } from '../../../assets/player/peertube-player-local-storage'
import {
CustomizationOptions,
P2PMediaLoaderOptions,
PlayerMode,
videojs
} from '../../../assets/player/peertube-player-manager'
-import { isWebRTCDisabled, timeToInt } from '../../../assets/player/utils'
+import { timeToInt } from '../../../assets/player/utils'
import { environment } from '../../../environments/environment'
import { VideoWatchPlaylistComponent } from './shared'
styleUrls: [ './video-watch.component.scss' ]
})
export class VideoWatchComponent implements OnInit, OnDestroy {
- private static LOCAL_STORAGE_PRIVACY_CONCERN_KEY = 'video-watch-privacy-concern'
-
@ViewChild('videoWatchPlaylist', { static: true }) videoWatchPlaylist: VideoWatchPlaylistComponent
@ViewChild('videoShareModal') videoShareModal: VideoShareComponent
@ViewChild('supportModal') supportModal: SupportModalComponent
playlistPosition: number
playlist: VideoPlaylist = null
- descriptionLoading = false
- completeDescriptionShown = false
- completeVideoDescription: string
- shortVideoDescription: string
- videoHTMLDescription = ''
-
likesBarTooltipText = ''
- hasAlreadyAcceptedPrivacyConcern = false
remoteServerDown = false
tooltipSupport = ''
}
async ngOnInit () {
+ this.serverConfig = this.serverService.getHTMLConfig()
+
// Hide the tooltips for unlogged users in mobile view, this adds confusion with the popover
if (this.user || !this.screenService.isInMobileView()) {
this.tooltipSupport = $localize`Support options for this video`
PeertubePlayerManager.initState()
- this.serverConfig = this.serverService.getHTMLConfig()
- if (
- isWebRTCDisabled() ||
- this.serverConfig.tracker.enabled === false ||
- getStoredP2PEnabled() === false ||
- peertubeLocalStorage.getItem(VideoWatchComponent.LOCAL_STORAGE_PRIVACY_CONCERN_KEY) === 'true'
- ) {
- this.hasAlreadyAcceptedPrivacyConcern = true
- }
-
this.paramsSub = this.route.params.subscribe(routeParams => {
const videoId = routeParams[ 'videoId' ]
if (videoId) this.loadVideo(videoId)
this.redirectService.redirectToHomepage()
}
- declinedPrivacyConcern () {
- peertubeLocalStorage.setItem(VideoWatchComponent.LOCAL_STORAGE_PRIVACY_CONCERN_KEY, 'false')
- this.hasAlreadyAcceptedPrivacyConcern = false
- }
-
- acceptedPrivacyConcern () {
- peertubeLocalStorage.setItem(VideoWatchComponent.LOCAL_STORAGE_PRIVACY_CONCERN_KEY, 'true')
- this.hasAlreadyAcceptedPrivacyConcern = true
- }
-
isVideoToTranscode () {
return this.video && this.video.state.id === VideoState.TO_TRANSCODE
}
// Re init attributes
this.playerPlaceholderImgSrc = undefined
- this.descriptionLoading = false
- this.completeDescriptionShown = false
- this.completeVideoDescription = undefined
this.remoteServerDown = false
this.currentTime = undefined
VideoAvatarChannelComponent,
VideoDescriptionComponent,
VideoRateComponent,
- VideoWatchPlaylistComponent
+ VideoWatchPlaylistComponent,
+ PrivacyConcernsComponent
} from './shared'
import { VideoCommentAddComponent } from './shared/comment/video-comment-add.component'
import { VideoCommentComponent } from './shared/comment/video-comment.component'
VideoWatchPlaylistComponent,
VideoRateComponent,
VideoDescriptionComponent,
+ PrivacyConcernsComponent,
VideoCommentsComponent,
VideoCommentAddComponent,