diff --git a/src/components/DownloadManager.tsx b/src/components/DownloadManager.tsx index 8838269b767218fa08e0e7f058addfc0bcc6904a..fdc5ff7b2e1e19fb8a7e394b6903ca6430ab8e02 100644 --- a/src/components/DownloadManager.tsx +++ b/src/components/DownloadManager.tsx @@ -8,6 +8,7 @@ import { showWarningToast } from "@/misc/ErrorHandlers"; import type { GetCourseResponse, media_source } from "@/api/api_v1_types"; import { useLanguage } from "./LanguageProvider"; import { StylizedText } from "./StylizedText"; +import { filesizeToHuman } from "@/misc/Formatting"; interface DownloadStatus { downloaded: number; @@ -324,6 +325,7 @@ export default function DownloadAllModal({ course }: { course: GetCourseResponse let lectures = []; let allQualities: string[] = []; + let totalSize = 0; for (let lecture of course.lectures!) { let sortedsources = sortSources(lecture.media_sources).filter((q) => q.download_url); @@ -343,6 +345,9 @@ export default function DownloadAllModal({ course }: { course: GetCourseResponse (source) => sourceToName(source) === chosenQualities.current.get(lecture.id), ); } + if (selectedQuality) { + totalSize += Math.max(0, selectedQuality.size); + } let displayedProgress; if (downloadStatus !== undefined) { @@ -433,13 +438,13 @@ export default function DownloadAllModal({ course }: { course: GetCourseResponse </td> <td className={ - "col-7 make-span-overflow-scroll " + + "col-6 make-span-overflow-scroll " + ((chosenLectures.current.get(lecture.id) ?? false) ? "" : "text-secondary") } > <StylizedText>{lecture.title}</StylizedText> </td> - <td className="col-2"> + <td className="col-3"> <select className="form-select" disabled={downloadStarted || sortedsources.length === 0} @@ -459,7 +464,6 @@ export default function DownloadAllModal({ course }: { course: GetCourseResponse ); })} </select> - {selectedQuality && `~${Math.round(selectedQuality.size / 1024 / 1024)}MB`} </td> <td className="col-2 text-center">{displayedProgress}</td> </tr>, @@ -585,6 +589,9 @@ export default function DownloadAllModal({ course }: { course: GetCourseResponse {downloadStarted ? language.get("ui.download_manager.stop_download") : language.get("ui.download_manager.start_download")} + {totalSize > 0 && ( + <span className="ms-2">({filesizeToHuman(totalSize)})</span> + )} </button> </div> <div className="mb-2 d-flex"> diff --git a/src/components/Player.tsx b/src/components/Player.tsx index e0d4156dd6c5d0d12d94286b3a01562cd4bdbe12..2325f46bc73e1fef2dab7a0e493ba326e1bf95ef 100644 --- a/src/components/Player.tsx +++ b/src/components/Player.tsx @@ -618,7 +618,7 @@ export function sourceToName(source: media_source) { if (source.comment.length == 0) return `${source.quality.name} (${filesizeToHuman(source.size)})`; - return `${source.quality.name} (${source.comment})`; + return `${source.quality.name}, ${source.comment} (${filesizeToHuman(source.size)})`; } export function sortSources(sources?: media_source[]) {