Allow users to prefer a specific video codec (H.264, H.265, AV1, VP9)
when adding downloads. The selector filters available formats via
yt-dlp format strings, falling back to best available if the preferred
codec is not found. The completed downloads table now shows Quality
and Codec columns.
Display the completion time for each download in the done list.
The backend already stores a nanosecond timestamp on DownloadInfo; this wires it up to the frontend using Angular's DatePipe.
- Extract map reference to local variable before iteration
- Change from forEach to for-of loop for better error handling
- Add null check on map before iterating
- Add @popperjs/core peer dependency for ng-bootstrap
- Update .gitignore to exclude package-lock.json
Co-authored-by: alexta69 <7450369+alexta69@users.noreply.github.com>
Make the app root fill at least the full height of the viewport, and
make the main content grow to fill the empty space - aligning the footer
with the bottom of the page at all times.
The iOS-compatible video may not be the best quality. Add a separate quality option to accommodate people who want the best available versus the best compatible with iOS's strict requirements.
Testing with https://www.youtube.com/watch?v=YiRMs5ZhcH4 where the best quality video is 2160p and not iOS-compatible.
With best quality, the VP9 video format is used (better quality but not iOS-compatible):
```
% ffprobe -hide_banner Who\ Can\ Find\ the\ Weirdest\ PC\ Parts\ on\ AliExpress？.mp4
Input #0, mov,mp4,m4a,3gp,3g2,mj2, from 'Who Can Find the Weirdest PC Parts on AliExpress？.mp4':
Metadata:
major_brand : isom
minor_version : 512
compatible_brands: isomiso2mp41
encoder : Lavf60.16.100
Duration: 00:19:02.72, start: 0.000000, bitrate: 10941 kb/s
Stream #0:0[0x1](und): Video: vp9 (Profile 0) (vp09 / 0x39307076), yuv420p(tv, bt709), 3840x1920, 10805 kb/s, 29.97 fps, 29.97 tbr, 16k tbn (default)
Metadata:
handler_name : ISO Media file produced by Google Inc. Created on: 06/15/2024.
vendor_id : [0][0][0][0]
Stream #0:1[0x2](eng): Audio: aac (LC) (mp4a / 0x6134706D), 44100 Hz, stereo, fltp, 128 kb/s (default)
Metadata:
handler_name : ISO Media file produced by Google Inc.
vendor_id : [0][0][0][0]
```
With "Best (iOS)" quality, the H264 video (lower quality but iOS-compatible) is used:
```
% ffprobe -hide_banner Who\ Can\ Find\ the\ Weirdest\ PC\ Parts\ on\ AliExpress？.mp4
Input #0, mov,mp4,m4a,3gp,3g2,mj2, from 'Who Can Find the Weirdest PC Parts on AliExpress？.mp4':
Metadata:
major_brand : isom
minor_version : 512
compatible_brands: isomiso2avc1mp41
encoder : Lavf60.16.100
Duration: 00:19:02.72, start: 0.000000, bitrate: 1846 kb/s
Stream #0:0[0x1](und): Video: h264 (High) (avc1 / 0x31637661), yuv420p(tv, bt709, progressive), 1920x960 [SAR 1:1 DAR 2:1], 1710 kb/s, 29.97 fps, 29.97 tbr, 30k tbn (default)
Metadata:
handler_name : ISO Media file produced by Google Inc.
vendor_id : [0][0][0][0]
Stream #0:1[0x2](eng): Audio: aac (LC) (mp4a / 0x6134706D), 44100 Hz, stereo, fltp, 128 kb/s (default)
Metadata:
handler_name : ISO Media file produced by Google Inc.
vendor_id : [0][0][0][0]
```
Included a README note about the new quality option.
Previously angular was re-rendering the entire queue whenever any downloads changed their state. The websocket provides progress updates at a high frequency, which combined with a long download queue can quickly cause hundreds of thousands of dom nodes to be created. This results in a spike in memory usage which may persist for some time depending on browser behaviour.
Adding a trackBy function resolves the issue by telling angular which row relates to a particular download.
The arguments passed to retryDownload by the retry button do not match what the function actually expects. This causes downloads to break if a custom folder is set and also causes some settings like format and custom name prefix to be ignored.
