git.librecmc.org Git - oweals/peertube.git/blob

   1 <div i18n class="no-results" *ngIf="pagination.totalItems === 0">No videos in this playlist.</div>
   2
   3 <div
   4   class="videos" myInfiniteScroller [autoInit]="true" (nearOfBottom)="onNearOfBottom()"
   5   cdkDropList (cdkDropListDropped)="drop($event)"
   6 >
   7   <div class="video" *ngFor="let video of videos" cdkDrag (cdkDragMoved)="onDragMove($event)">
   8     <div class="position">{{ video.playlistElement.position }}</div>
   9
  10     <my-video-thumbnail [video]="video" [nsfw]="isVideoBlur(video)"></my-video-thumbnail>
  11
  12     <div class="video-info">
  13       <a tabindex="-1" class="video-info-name" [routerLink]="['/videos/watch', video.uuid]" [attr.title]="video.name">{{ video.name }}</a>
  14       <a tabindex="-1" class="video-info-account" [routerLink]="[ '/accounts', video.byAccount ]">{{ video.byAccount }}</a>
  15       <span tabindex="-1" class="video-info-timestamp">{{ formatTimestamp(video)}}</span>
  16     </div>
  17
  18     <div class="more" ngbDropdown #moreDropdown="ngbDropdown" placement="bottom-right" (openChange)="onDropdownOpenChange()" autoClose="outside">
  19       <my-global-icon iconName="more-vertical" ngbDropdownToggle role="button" class="icon-more"></my-global-icon>
  20
  21       <div ngbDropdownMenu>
  22         <div class="dropdown-item" (click)="toggleDisplayTimestampsOptions($event, video)">
  23           <my-global-icon iconName="edit"></my-global-icon> <ng-container i18n>Edit starts/stops at</ng-container>
  24         </div>
  25
  26         <div class="timestamp-options" *ngIf="displayTimestampOptions">
  27           <div>
  28             <my-peertube-checkbox
  29               inputName="startAt" [(ngModel)]="timestampOptions.startTimestampEnabled"
  30               i18n-labelText labelText="Start at"
  31             ></my-peertube-checkbox>
  32
  33             <my-timestamp-input
  34               [timestamp]="timestampOptions.startTimestamp"
  35               [maxTimestamp]="video.duration"
  36               [disabled]="!timestampOptions.startTimestampEnabled"
  37               [(ngModel)]="timestampOptions.startTimestamp"
  38             ></my-timestamp-input>
  39           </div>
  40
  41           <div>
  42             <my-peertube-checkbox
  43               inputName="stopAt" [(ngModel)]="timestampOptions.stopTimestampEnabled"
  44               i18n-labelText labelText="Stop at"
  45             ></my-peertube-checkbox>
  46
  47             <my-timestamp-input
  48               [timestamp]="timestampOptions.stopTimestamp"
  49               [maxTimestamp]="video.duration"
  50               [disabled]="!timestampOptions.stopTimestampEnabled"
  51               [(ngModel)]="timestampOptions.stopTimestamp"
  52             ></my-timestamp-input>
  53           </div>
  54
  55           <input type="submit" i18n-value value="Save" (click)="updateTimestamps(video)">
  56         </div>
  57
  58         <span class="dropdown-item" (click)="removeFromPlaylist(video)">
  59           <my-global-icon iconName="delete"></my-global-icon> <ng-container i18n>Delete from {{playlist?.displayName}}</ng-container>
  60         </span>
  61       </div>
  62     </div>
  63   </div>
  64 </div>