53 lines
1.8 KiB
HTML
53 lines
1.8 KiB
HTML
<app-menu-header label="Film aus IMDb importieren" icon="cloud_download"></app-menu-header>
|
|
|
|
<div class="w-6/10 m-auto my-20">
|
|
<form class="movie-search-form w-full" (ngSubmit)="DoSubmit()">
|
|
<div class="flex items-center space-x-4">
|
|
<mat-form-field class="w-full" subscriptSizing="dynamic">
|
|
<mat-label>Film online suchen</mat-label>
|
|
<input class="w-full" type="text" matInput [formControl]="formControl">
|
|
@if (formControl.hasError('noResults')) {
|
|
<mat-error>Keine Suchergebnisse gefunden</mat-error>
|
|
}
|
|
</mat-form-field>
|
|
<button matFab [disabled]="!formControl.value?.trim()?.length || (loadingService.loading$ | async)" type="submit">
|
|
<mat-icon>arrow_forward</mat-icon>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
|
|
@if (search_query.length > 0 && !isSearching) {
|
|
<div class="search-results my-20">
|
|
|
|
@if (movies.length > 0) {
|
|
|
|
<!-- 1. Ergebnis -->
|
|
<app-movie-import-search-info [movie]="movies[0]" class="py-3"></app-movie-import-search-info>
|
|
|
|
@if (movies.length > 1 && !showAll) {
|
|
<div class="text-blue-500 cursor-pointer mt-2 w-fit" (click)="toggleShowAll()">
|
|
{{ movies.length - 1 }} weitere Suchergebnisse anzeigen
|
|
</div>
|
|
}
|
|
|
|
<!-- Weitere Ergebnisse -->
|
|
@if (showAll) {
|
|
@for (movie of movies.slice(1); track movie.imdbID) {
|
|
<app-movie-import-search-info [movie]="movie" class="py-3"></app-movie-import-search-info>
|
|
}
|
|
<div class="text-blue-500 cursor-pointer mt-20 mb-30 w-fit" (click)="toggleShowAll()">
|
|
Weitere Suchergebnisse ausblenden
|
|
</div>
|
|
}
|
|
}
|
|
|
|
<!-- Keine Ergebnisse -->
|
|
@else {
|
|
<app-movie-import-no-search-result [search]="search_query"></app-movie-import-no-search-result>
|
|
}
|
|
|
|
</div>
|
|
}
|
|
</div>
|
|
|