Add ability to search live videos

client/src/app/+search/search-filters.component.html

@@ -16,6 +16,25 @@
         </div>
       </div>
 
+      <div class="form-group">
+        <div class="radio-label label-container">
+          <label i18n>Display only</label>
+          <button i18n class="reset-button reset-button-small" (click)="resetField('isLive')" *ngIf="advancedSearch.isLive !== undefined">
+            Reset
+          </button>
+        </div>
+
+        <div class="peertube-radio-container">
+          <input type="radio" name="isLive" id="isLiveTrue" value="true" [(ngModel)]="advancedSearch.isLive">
+          <label i18n for="isLiveTrue" class="radio">Live videos</label>
+        </div>
+
+        <div class="peertube-radio-container">
+          <input type="radio" name="isLive" id="isLiveFalse" value="false" [(ngModel)]="advancedSearch.isLive">
+          <label i18n for="isLiveFalse" class="radio">VOD videos</label>
+        </div>
+      </div>
+
       <div class="form-group">
         <div class="radio-label label-container">
           <label i18n>Display sensitive content</label>
@@ -44,7 +63,7 @@
         </div>
 
         <div class="peertube-radio-container" *ngFor="let date of publishedDateRanges">
-          <input type="radio" (change)="inputUpdated()" name="publishedDateRange" [id]="date.id" [value]="date.id" [(ngModel)]="publishedDateRange">
+          <input type="radio" (change)="onInputUpdated()" name="publishedDateRange" [id]="date.id" [value]="date.id" [(ngModel)]="publishedDateRange">
           <label [for]="date.id" class="radio">{{ date.label }}</label>
         </div>
       </div>
@@ -60,7 +79,7 @@
         <div class="row">
           <div class="pl-0 col-sm-6">
             <input
-              (change)="inputUpdated()"
+              (change)="onInputUpdated()"
               (keydown.enter)="$event.preventDefault()"
               type="text" id="original-publication-after" name="original-publication-after"
               i18n-placeholder placeholder="After..."
@@ -70,7 +89,7 @@
           </div>
           <div class="pr-0 col-sm-6">
             <input
-              (change)="inputUpdated()"
+              (change)="onInputUpdated()"
               (keydown.enter)="$event.preventDefault()"
               type="text" id="original-publication-before" name="original-publication-before"
               i18n-placeholder placeholder="Before..."
@@ -93,7 +112,7 @@
         </div>
 
         <div class="peertube-radio-container" *ngFor="let duration of durationRanges">
-          <input type="radio" (change)="inputUpdated()" name="durationRange" [id]="duration.id" [value]="duration.id" [(ngModel)]="durationRange">
+          <input type="radio" (change)="onInputUpdated()" name="durationRange" [id]="duration.id" [value]="duration.id" [(ngModel)]="durationRange">
           <label [for]="duration.id" class="radio">{{ duration.label }}</label>
         </div>
       </div>

client/src/app/+search/search-filters.component.ts

@@ -3,6 +3,8 @@ import { ServerService } from '@app/core'
 import { AdvancedSearch } from '@app/shared/shared-search'
 import { ServerConfig, VideoConstant } from '@shared/models'
 
+type FormOption = { id: string, label: string }
+
 @Component({
   selector: 'my-search-filters',
   styleUrls: [ './search-filters.component.scss' ],
@@ -17,9 +19,10 @@ export class SearchFiltersComponent implements OnInit {
   videoLicences: VideoConstant<number>[] = []
   videoLanguages: VideoConstant<string>[] = []
 
-  publishedDateRanges: { id: string, label: string }[] = []
-  sorts: { id: string, label: string }[] = []
-  durationRanges: { id: string, label: string }[] = []
+  publishedDateRanges: FormOption[] = []
+  sorts: FormOption[] = []
+  durationRanges: FormOption[] = []
+  videoType: FormOption[] = []
 
   publishedDateRange: string
   durationRange: string
@@ -33,10 +36,6 @@ export class SearchFiltersComponent implements OnInit {
     private serverService: ServerService
   ) {
     this.publishedDateRanges = [
-      {
-        id: 'any_published_date',
-        label: $localize`Any`
-      },
       {
         id: 'today',
         label: $localize`Today`
@@ -55,11 +54,18 @@ export class SearchFiltersComponent implements OnInit {
       }
     ]
 
-    this.durationRanges = [
+    this.videoType = [
       {
-        id: 'any_duration',
-        label: $localize`Any`
+        id: 'vod',
+        label: $localize`VOD videos`
       },
+      {
+        id: 'live',
+        label: $localize`Live videos`
+      }
+    ]
+
+    this.durationRanges = [
       {
         id: 'short',
         label: $localize`Short (< 4 min)`
@@ -104,24 +110,26 @@ export class SearchFiltersComponent implements OnInit {
     this.loadOriginallyPublishedAtYears()
   }
 
-  inputUpdated () {
+  onInputUpdated () {
     this.updateModelFromDurationRange()
     this.updateModelFromPublishedRange()
     this.updateModelFromOriginallyPublishedAtYears()
   }
 
   formUpdated () {
-    this.inputUpdated()
+    this.onInputUpdated()
     this.filtered.emit(this.advancedSearch)
   }
 
   reset () {
     this.advancedSearch.reset()
+
+    this.resetOriginalPublicationYears()
+
     this.durationRange = undefined
     this.publishedDateRange = undefined
-    this.originallyPublishedStartYear = undefined
-    this.originallyPublishedEndYear = undefined
-    this.inputUpdated()
+
+    this.onInputUpdated()
   }
 
   resetField (fieldName: string, value?: any) {
@@ -130,7 +138,7 @@ export class SearchFiltersComponent implements OnInit {
 
   resetLocalField (fieldName: string, value?: any) {
     this[fieldName] = value
-    this.inputUpdated()
+    this.onInputUpdated()
   }
 
   resetOriginalPublicationYears () {

client/src/app/shared/shared-search/advanced-search.model.ts

@@ -1,4 +1,4 @@
-import { BooleanBothQuery, SearchTargetType } from '@shared/models'
+import { BooleanBothQuery, BooleanQuery, SearchTargetType, VideosSearchQuery } from '@shared/models'
 
 export class AdvancedSearch {
   startDate: string // ISO 8601
@@ -21,6 +21,8 @@ export class AdvancedSearch {
   durationMin: number // seconds
   durationMax: number // seconds
 
+  isLive: BooleanQuery
+
   sort: string
 
   searchTarget: SearchTargetType
@@ -41,6 +43,8 @@ export class AdvancedSearch {
     tagsOneOf?: any
     tagsAllOf?: any
 
+    isLive?: BooleanQuery
+
     durationMin?: string
     durationMax?: string
     sort?: string
@@ -54,6 +58,8 @@ export class AdvancedSearch {
     this.originallyPublishedEndDate = options.originallyPublishedEndDate || undefined
 
     this.nsfw = options.nsfw || undefined
+    this.isLive = options.isLive || undefined
+
     this.categoryOneOf = options.categoryOneOf || undefined
     this.licenceOneOf = options.licenceOneOf || undefined
     this.languageOneOf = options.languageOneOf || undefined
@@ -94,6 +100,7 @@ export class AdvancedSearch {
     this.tagsAllOf = undefined
     this.durationMin = undefined
     this.durationMax = undefined
+    this.isLive = undefined
 
     this.sort = '-match'
   }
@@ -112,12 +119,16 @@ export class AdvancedSearch {
       tagsAllOf: this.tagsAllOf,
       durationMin: this.durationMin,
       durationMax: this.durationMax,
+      isLive: this.isLive,
       sort: this.sort,
       searchTarget: this.searchTarget
     }
   }
 
-  toAPIObject () {
+  toAPIObject (): VideosSearchQuery {
+    let isLive: boolean
+    if (this.isLive) isLive = this.isLive === 'true'
+
     return {
       startDate: this.startDate,
       endDate: this.endDate,
@@ -131,6 +142,7 @@ export class AdvancedSearch {
       tagsAllOf: this.tagsAllOf,
       durationMin: this.durationMin,
       durationMax: this.durationMax,
+      isLive,
       sort: this.sort,
       searchTarget: this.searchTarget
     }

shared/models/search/boolean-both-query.model.ts

@@ -1 +1,2 @@
 export type BooleanBothQuery = 'true' | 'false' | 'both'
+export type BooleanQuery = 'true' | 'false'