From 2b3748da4b0e8de0d399990e9d1583bc51f997f3 Mon Sep 17 00:00:00 2001
From: klpoland <kinsey.l.poland@gmail.com>
Date: Fri, 20 Feb 2026 14:16:47 -0500
Subject: [PATCH 1/7] adding time based filtering and slider ui

---
 .../api_methods/helpers/temporal_filtering.py | 168 ++++++++++++++++++
 .../serializers/capture_serializers.py        |  56 +++++-
 gateway/sds_gateway/api_methods/tasks.py      |  62 ++++++-
 .../js/actions/DownloadActionManager.js       |  13 +-
 gateway/sds_gateway/static/js/file-list.js    |   6 +-
 gateway/sds_gateway/templates/base.html       |   3 +
 .../templates/users/file_list.html            |   2 +
 .../users/partials/captures_page_table.html   |   4 +-
 .../users/partials/web_download_modal.html    | 164 +++++++++++++++++
 gateway/sds_gateway/users/views.py            |  11 ++
 10 files changed, 476 insertions(+), 13 deletions(-)
 create mode 100644 gateway/sds_gateway/api_methods/helpers/temporal_filtering.py

diff --git a/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py b/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py
new file mode 100644
index 000000000..16b648d91
--- /dev/null
+++ b/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py
@@ -0,0 +1,168 @@
+import re
+
+from django.db.models import QuerySet
+
+from sds_gateway.api_methods.models import CaptureType, Capture, File
+from sds_gateway.api_methods.utils.opensearch_client import get_opensearch_client
+from sds_gateway.api_methods.utils.relationship_utils import get_capture_files
+from loguru import logger as log
+
+# Digital RF spec: rf@SECONDS.MILLISECONDS.h5 (e.g. rf@1396379502.000.h5)
+# https://github.com/MITHaystack/digital_rf
+DRF_RF_FILENAME_PATTERN = re.compile(
+    r"^rf@(\d+)\.(\d+)\.h5$",
+    re.IGNORECASE,
+)
+DRF_RF_FILENAME_REGEX_STR = r"^rf@\d+\.\d+\.h5$"
+
+
+def drf_rf_filename_from_ms(ms: int) -> str:
+    """Format ms as DRF rf data filename (canonical for range queries)."""
+    return f"rf@{ms // 1000}.{ms % 1000:03d}.h5"
+
+
+def drf_rf_filename_to_ms(file_name: str) -> int | None:
+    """
+    Parse DRF rf data filename to milliseconds.
+    Handles rf@SECONDS.MILLISECONDS.h5; fractional part padded to 3 digits.
+    """
+    name = file_name.strip()
+    match = DRF_RF_FILENAME_PATTERN.match(name)
+    if not match:
+        return None
+    try:
+        seconds = int(match.group(1))
+        frac = match.group(2).ljust(3, "0")[:3]
+        return seconds * 1000 + int(frac)
+    except (ValueError, TypeError):
+        return None
+
+
+def _catch_capture_type_error(capture_type: CaptureType) -> None:
+    if capture_type != CaptureType.DigitalRF:
+        msg = "Only DigitalRF captures are supported for temporal filtering."
+        log.error(msg)
+        raise ValueError(msg)
+
+
+def _parse_drf_rf_timestamp(file_name: str) -> int | None:
+    """Extract timestamp in ms from a Digital RF data filename (alias for drf_rf_filename_to_ms)."""
+    return drf_rf_filename_to_ms(file_name)
+
+
+def get_capture_bounds(capture_type: CaptureType, capture_uuid: str) -> tuple[int, int]:
+    """Get start and end bounds for capture from opensearch."""
+    
+    _catch_capture_type_error(capture_type)
+
+    client = get_opensearch_client()
+    index = f"captures-{capture_type}"
+
+    try:
+        response = client.get(index=index, id=capture_uuid)
+    except Exception as e:
+        if getattr(e, "status_code", None) == 404 or (hasattr(e, "info") and e.info.get("status") == 404):
+            raise ValueError(
+                f"Capture {capture_uuid} not found in OpenSearch index {index}"
+            ) from e
+        raise
+
+    if not response.get("found"):
+        raise ValueError(
+            f"Capture {capture_uuid} not found in OpenSearch index {index}"
+        )
+
+    source = response["_source"]
+    search_props = source["search_props"]
+    start_time = search_props["start_time"]
+    end_time = search_props["end_time"]
+    print(f"start_time: {start_time}, end_time: {end_time}")
+    return start_time, end_time
+
+
+def get_data_files(capture_type: CaptureType, capture: Capture) -> QuerySet[File]:
+    """Get the data files in the capture."""
+    _catch_capture_type_error(capture_type)
+
+    return get_capture_files(capture).filter(name__regex=DRF_RF_FILENAME_REGEX_STR)
+
+
+def get_file_cadence(capture_type: CaptureType, capture: Capture) -> int:
+    """Get the file cadence in milliseconds. OpenSearch bounds are in seconds."""
+    _catch_capture_type_error(capture_type)
+
+    capture_uuid = str(capture.uuid)
+    try:
+        start_time, end_time = get_capture_bounds(capture_type, capture_uuid)
+    except ValueError as e:
+        log.error(e)
+        raise e
+
+    data_files = get_data_files(capture_type, capture)
+    count = data_files.count()
+    if count == 0:
+        return 0
+    duration_sec = end_time - start_time
+    print(f"duration_sec: {duration_sec}")
+    duration_ms = duration_sec * 1000
+    print(f"duration_ms: {duration_ms}")
+    return max(1, int(duration_ms / count))
+
+
+def get_duration_bounds(capture_type: CaptureType, capture_uuid: str, relative_time: int) -> tuple[int, int]:
+    """Return (0, length_of_capture_ms). OpenSearch bounds are in seconds."""
+    try:
+        start_time, end_time = get_capture_bounds(capture_type, capture_uuid)
+    except ValueError as e:
+        log.error(e)
+        raise e
+
+    length_of_capture_ms = (end_time - start_time) * 1000
+    return 0, length_of_capture_ms
+
+
+def filter_capture_data_files_selection_bounds(
+    capture_type: CaptureType,
+    capture: Capture,
+    start_time: int,  # relative ms from start of capture (from UI)
+    end_time: int,    # relative ms from start of capture (from UI)
+) -> QuerySet[File]:
+    """Filter the capture file selection bounds to the given start and end times."""
+    _catch_capture_type_error(capture_type)
+    epoch_start_sec, _ = get_capture_bounds(capture_type, capture.uuid)
+    epoch_start_ms = epoch_start_sec * 1000
+    start_ms = epoch_start_ms + start_time
+    end_ms = epoch_start_ms + end_time
+
+    start_file_name = drf_rf_filename_from_ms(start_ms)
+    end_file_name = drf_rf_filename_from_ms(end_ms)
+
+    data_files = get_data_files(capture_type, capture)
+    return data_files.filter(
+        name__gte=start_file_name,
+        name__lte=end_file_name,
+    ).order_by("name")
+
+def get_capture_files_with_temporal_filter(
+    capture_type: CaptureType,
+    capture: Capture,
+    start_time: int | None = None, # milliseconds since epoch (start of capture)
+    end_time: int | None = None, # milliseconds since epoch
+) -> QuerySet[File]:
+    """Get the capture files with temporal filtering."""
+    _catch_capture_type_error(capture_type)
+
+    if start_time is None or end_time is None:
+        log.warning("Start or end time is None, returning all capture files without temporal filtering")
+        return get_capture_files(capture)
+
+    # get non-data files
+    non_data_files = get_capture_files(capture).exclude(name__regex=DRF_RF_FILENAME_REGEX_STR)
+
+    # get data files with temporal filtering
+    data_files = filter_capture_data_files_selection_bounds(
+        capture_type, capture, start_time, end_time
+    )
+
+    # return all files
+    return non_data_files.union(data_files)
\ No newline at end of file
diff --git a/gateway/sds_gateway/api_methods/serializers/capture_serializers.py b/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
index 037ebafd3..692628483 100644
--- a/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
+++ b/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
@@ -9,6 +9,8 @@
 from rest_framework.utils.serializer_helpers import ReturnList
 
 from sds_gateway.api_methods.helpers.index_handling import retrieve_indexed_metadata
+from sds_gateway.api_methods.helpers.temporal_filtering import get_capture_bounds
+from sds_gateway.api_methods.helpers.temporal_filtering import get_file_cadence
 from sds_gateway.api_methods.models import Capture
 from sds_gateway.api_methods.models import CaptureType
 from sds_gateway.api_methods.models import DEPRECATEDPostProcessedData
@@ -70,6 +72,8 @@ class CaptureGetSerializer(serializers.ModelSerializer[Capture]):
     files = serializers.SerializerMethodField()
     center_frequency_ghz = serializers.SerializerMethodField()
     sample_rate_mhz = serializers.SerializerMethodField()
+    length_of_capture_ms = serializers.SerializerMethodField()
+    file_cadence_ms = serializers.SerializerMethodField()
     files_count = serializers.SerializerMethodField()
     total_file_size = serializers.SerializerMethodField()
     formatted_created_at = serializers.SerializerMethodField()
@@ -94,12 +98,29 @@ def get_files(self, capture: Capture) -> ReturnList[File]:
     def get_center_frequency_ghz(self, capture: Capture) -> float | None:
         """Get the center frequency in GHz from the capture model property."""
         return capture.center_frequency_ghz
-
-    @extend_schema_field(serializers.FloatField)
+    
+    @extend_schema_field(serializers.FloatField(allow_null=True))
     def get_sample_rate_mhz(self, capture: Capture) -> float | None:
-        """Get the sample rate in MHz from the capture model property."""
+        """Get the sample rate in MHz from the capture model property. None if not indexed in OpenSearch."""
         return capture.sample_rate_mhz
 
+    @extend_schema_field(serializers.IntegerField(allow_null=True))
+    def get_length_of_capture_ms(self, capture: Capture) -> int | None:
+        """Get the length of the capture in milliseconds. OpenSearch bounds are in seconds."""
+        try:
+            start_time, end_time = get_capture_bounds(capture.capture_type, str(capture.uuid))
+            return (end_time - start_time) * 1000
+        except (ValueError, IndexError, KeyError):
+            return None
+
+    @extend_schema_field(serializers.IntegerField(allow_null=True))
+    def get_file_cadence_ms(self, capture: Capture) -> int | None:
+        """Get the file cadence in milliseconds. None if not indexed in OpenSearch."""
+        try:
+            return get_file_cadence(capture.capture_type, capture)
+        except (ValueError, IndexError, KeyError):
+            return None
+
     @extend_schema_field(serializers.IntegerField)
     def get_files_count(self, capture: Capture) -> int:
         """Get the count of files associated with this capture."""
@@ -304,6 +325,8 @@ class CompositeCaptureSerializer(serializers.Serializer):
     files_count = serializers.SerializerMethodField()
     total_file_size = serializers.SerializerMethodField()
     formatted_created_at = serializers.SerializerMethodField()
+    length_of_capture_ms = serializers.SerializerMethodField()
+    file_cadence_ms = serializers.SerializerMethodField()
 
     def get_files(self, obj: dict[str, Any]) -> ReturnList[File]:
         """Get all files from all channels in the composite capture."""
@@ -350,6 +373,33 @@ def get_formatted_created_at(self, obj: dict[str, Any]) -> str:
             return created_at.strftime("%m/%d/%Y %I:%M:%S %p")
         return ""
 
+    @extend_schema_field(serializers.IntegerField(allow_null=True))
+    def get_length_of_capture_ms(self, obj: dict[str, Any]) -> int | None:
+        """Use first channel's bounds for composite capture duration."""
+        channels = obj.get("channels") or []
+        if not channels:
+            return None
+        try:
+            capture = Capture.objects.get(uuid=channels[0]["uuid"])
+            start_time, end_time = get_capture_bounds(
+                capture.capture_type, str(capture.uuid)
+            )
+            return (end_time - start_time) * 1000
+        except (ValueError, IndexError, KeyError):
+            return None
+
+    @extend_schema_field(serializers.IntegerField(allow_null=True))
+    def get_file_cadence_ms(self, obj: dict[str, Any]) -> int | None:
+        """Use first channel's file cadence for composite capture."""
+        channels = obj.get("channels") or []
+        if not channels:
+            return None
+        try:
+            capture = Capture.objects.get(uuid=channels[0]["uuid"])
+            return get_file_cadence(capture.capture_type, capture)
+        except (ValueError, IndexError, KeyError):
+            return None
+
 
 def build_composite_capture_data(captures: list[Capture]) -> dict[str, Any]:
     """Build composite capture data from a list of captures with the same top_level_dir.
diff --git a/gateway/sds_gateway/api_methods/tasks.py b/gateway/sds_gateway/api_methods/tasks.py
index e4aed2651..c7dff0b31 100644
--- a/gateway/sds_gateway/api_methods/tasks.py
+++ b/gateway/sds_gateway/api_methods/tasks.py
@@ -26,6 +26,7 @@
 from sds_gateway.api_methods.models import TemporaryZipFile
 from sds_gateway.api_methods.models import ZipFileStatus
 from sds_gateway.api_methods.models import user_has_access_to_item
+from sds_gateway.api_methods.models import CaptureType
 from sds_gateway.api_methods.utils.disk_utils import DISK_SPACE_BUFFER
 from sds_gateway.api_methods.utils.disk_utils import check_disk_space_available
 from sds_gateway.api_methods.utils.disk_utils import estimate_disk_size
@@ -676,15 +677,26 @@ def _process_item_files(
     item_type: ItemType,
     item_uuid: UUID,
     temp_zip: TemporaryZipFile,
+    start_time: int | None = None,
+    end_time: int | None = None,
 ) -> tuple[Mapping[str, UUID | int | str] | None, str | None, int | None, int | None]:  # pyright: ignore[reportMissingTypeArgument]
     """
     Process files for an item and create a zip file.
 
+    Args:
+        user: The user requesting the files
+        item: The item object (Dataset or Capture)
+        item_type: Type of item (dataset or capture)
+        item_uuid: UUID of the item to download
+        temp_zip: The temporary zip file to create
+        start_time: Optional start time for temporal filtering
+        end_time: Optional end time for temporal filtering
+
     Returns:
         tuple: (error_response, zip_file_path, total_size, files_processed)
         If error_response is not None, the other values are None
     """
-    files = _get_item_files(user, item, item_type)
+    files = _get_item_files(user, item, item_type, start_time, end_time)
     if not files:
         log.warning(f"No files found for {item_type} {item_uuid}")
         error_message = f"No files found in {item_type}"
@@ -979,7 +991,11 @@ def _handle_timeout_exception(
     time_limit=30 * 60, soft_time_limit=25 * 60
 )  # 30 min hard limit, 25 min soft limit
 def send_item_files_email(  # noqa: C901, PLR0911, PLR0912, PLR0915
-    item_uuid: UUID, user_id: str, item_type: str | ItemType
+    item_uuid: UUID,
+    user_id: str,
+    item_type: str | ItemType,
+    start_time: int | None = None,
+    end_time: int | None = None,
 ) -> Mapping[str, UUID | str | int]:
     """
     Unified Celery task to create a zip file of item files and send it via email.
@@ -990,6 +1006,8 @@ def send_item_files_email(  # noqa: C901, PLR0911, PLR0912, PLR0915
         item_uuid: UUID of the item to process
         user_id: ID of the user requesting the download
         item_type: Type of item (dataset or capture)
+        start_time: Optional start time for temporal filtering
+        end_time: Optional end time for temporal filtering
     Returns:
         dict: Task result with status and details
     """
@@ -1053,6 +1071,8 @@ def send_item_files_email(  # noqa: C901, PLR0911, PLR0912, PLR0915
                 item_type=item_type_enum,
                 item_uuid=item_uuid,
                 temp_zip=temp_zip,
+                start_time=start_time,
+                end_time=end_time,
             )
         )
         if error_response:
@@ -1251,7 +1271,13 @@ def _validate_item_download_request(
     return None, user, item
 
 
-def _get_item_files(user: User, item: Any, item_type: ItemType) -> list[File]:
+def _get_item_files(
+    user: User,
+    item: Any,
+    item_type: ItemType,
+    start_time: int | None = None,
+    end_time: int | None = None,
+) -> list[File]:
     """
     Get all files for an item based on its type.
 
@@ -1259,14 +1285,16 @@ def _get_item_files(user: User, item: Any, item_type: ItemType) -> list[File]:
         user: The user requesting the files
         item: The item object (Dataset or Capture)
         item_type: Type of item (dataset or capture)
-
+        start_time: Optional start time for temporal filtering
+        end_time: Optional end time for temporal filtering
     Returns:
         List of files associated with the item
     """
-    from sds_gateway.api_methods.utils.relationship_utils import get_capture_files
+    from sds_gateway.api_methods.helpers.temporal_filtering import get_capture_files_with_temporal_filter
     from sds_gateway.api_methods.utils.relationship_utils import (
         get_dataset_files_including_captures,
     )
+    from sds_gateway.api_methods.utils.relationship_utils import get_capture_files
 
     if item_type == ItemType.DATASET:
         files_queryset = get_dataset_files_including_captures(
@@ -1277,8 +1305,28 @@ def _get_item_files(user: User, item: Any, item_type: ItemType) -> list[File]:
         return files
 
     if item_type == ItemType.CAPTURE:
-        files = get_capture_files(item, include_deleted=False)
-        log.info(f"Found {len(files)} files for capture {item.uuid}")
+        capture_type = item.capture_type
+        # temporal filtering is only supported for DigitalRF captures
+        if capture_type is CaptureType.DigitalRF:
+            files = get_capture_files_with_temporal_filter(
+                capture_type=capture_type,
+                capture=item,
+                start_time=start_time,
+                end_time=end_time,
+            )
+        else:
+            if start_time is not None or end_time is not None:
+                logger.warning(
+                    "Temporal filtering is only supported for DigitalRF captures, "
+                    "ignoring start_time and end_time"
+                )
+
+            files = get_capture_files(
+                capture=item,
+                include_deleted=False,
+            )
+
+        logger.info(f"Found {len(files)} files for capture {item.uuid}")
         return list(files)
 
     log.warning(f"Unknown item type: {item_type}")
diff --git a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
index ca33ca45d..233cb9b43 100644
--- a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
+++ b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
@@ -274,7 +274,18 @@ class DownloadActionManager {
 			}
 		};
 
-		window.DOMUtils.openModal(modalId);
+		// Initialize temporal slider from button data attributes (clears or builds slider)
+		const durationMs = parseInt(button.getAttribute("data-length-of-capture-ms"), 10);
+		const fileCadenceMs = parseInt(button.getAttribute("data-file-cadence-ms"), 10);
+		if (typeof window.initCaptureDownloadSlider === "function") {
+			window.initCaptureDownloadSlider(
+				Number.isNaN(durationMs) ? 0 : durationMs,
+				Number.isNaN(fileCadenceMs) ? 1000 : fileCadenceMs,
+			);
+		}
+
+		// Show the modal
+		window.showWebDownloadModal(captureUuid, captureName);
 	}
 
 	/**
diff --git a/gateway/sds_gateway/static/js/file-list.js b/gateway/sds_gateway/static/js/file-list.js
index aba3069c9..609c19f17 100644
--- a/gateway/sds_gateway/static/js/file-list.js
+++ b/gateway/sds_gateway/static/js/file-list.js
@@ -711,6 +711,8 @@ class FileListCapturesTableManager extends CapturesTableManager {
 			centerFrequencyGhz: ComponentUtils.escapeHtml(
 				capture.center_frequency_ghz || "",
 			),
+			lengthOfCaptureMs: capture.length_of_capture_ms ?? 0,
+			fileCadenceMs: capture.file_cadence_ms ?? 1000,
 		};
 
 		let typeDisplay = safeData.captureTypeDisplay || safeData.captureType;
@@ -835,7 +837,9 @@ class FileListCapturesTableManager extends CapturesTableManager {
 								<button class="dropdown-item download-capture-btn"
 										type="button"
 										data-capture-uuid="${safeData.uuid}"
-										data-capture-name="${safeData.name}">
+										data-capture-name="${safeData.name}"
+										data-length-of-capture-ms="${safeData.lengthOfCaptureMs}"
+										data-file-cadence-ms="${safeData.fileCadenceMs}">
 									Download
 								</button>
 							</li>
diff --git a/gateway/sds_gateway/templates/base.html b/gateway/sds_gateway/templates/base.html
index 2e14c130a..fdebfe804 100644
--- a/gateway/sds_gateway/templates/base.html
+++ b/gateway/sds_gateway/templates/base.html
@@ -19,6 +19,8 @@
               href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
         <link rel="stylesheet"
               href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
+        <link rel="stylesheet"
+              href="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/15.7.1/nouislider.min.css" />
         {% block css %}
             <!-- Your stuff: Third-party CSS libraries go here -->
             <!-- This file stores project-specific CSS -->
@@ -226,6 +228,7 @@
             {# Removed JS that was hiding/showing the body #}
         {% endblock inline_javascript %}
         <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/15.7.1/nouislider.min.js"></script>
         <script>
             // Initialize Django messages as Bootstrap toasts on page load
             document.addEventListener('DOMContentLoaded', function() {
diff --git a/gateway/sds_gateway/templates/users/file_list.html b/gateway/sds_gateway/templates/users/file_list.html
index 105b75442..2e03a166e 100644
--- a/gateway/sds_gateway/templates/users/file_list.html
+++ b/gateway/sds_gateway/templates/users/file_list.html
@@ -369,6 +369,8 @@ <h5 class="modal-title" id="uploadResultModalLabel">Upload Result</h5>
     </div>
     <!-- Capture Details Modal -->
     {% include "users/partials/capture_modal.html" %}
+    <!-- Web Download Modal -->
+    {% include "users/partials/web_download_modal.html" with item_type="capture" capture=capture_obj %}
     <!-- Visualization Selection Modal -->
     {% if VISUALIZATIONS_ENABLED %}
         {% include "visualizations/partials/visualization_modal.html" with visualization_compatibility=visualization_compatibility %}
diff --git a/gateway/sds_gateway/templates/users/partials/captures_page_table.html b/gateway/sds_gateway/templates/users/partials/captures_page_table.html
index abeb5f6a0..334ac50c4 100644
--- a/gateway/sds_gateway/templates/users/partials/captures_page_table.html
+++ b/gateway/sds_gateway/templates/users/partials/captures_page_table.html
@@ -140,7 +140,9 @@
                                         <button class="dropdown-item download-capture-btn"
                                                 type="button"
                                                 data-capture-uuid="{{ cap.uuid }}"
-                                                data-capture-name="{{ cap.name|default:'' }}">Download</button>
+                                                data-capture-name="{{ cap.name|default:'' }}"
+                                                data-length-of-capture-ms="{{ cap.length_of_capture_ms|default:0 }}"
+                                                data-file-cadence-ms="{{ cap.file_cadence_ms|default:1000 }}">Download</button>
                                     </li>
                                     {% if cap.capture_type == 'drf' %}
                                         <li>
diff --git a/gateway/sds_gateway/templates/users/partials/web_download_modal.html b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
index 830c8fdef..5275a8972 100644
--- a/gateway/sds_gateway/templates/users/partials/web_download_modal.html
+++ b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
@@ -37,6 +37,15 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
                         {% endif %}
                         You will receive an email with a download link when the file is ready.
                     </p>
+                    {% if item_type == "capture" %}
+                    <div class="mt-4">
+                        <label for="temporalFilterSlider">Filter capture files to download within a subset of time:</label>
+                        <div id="temporalFilterSlider" class="mt-3 mb-3"></div>
+                        <p class="text-muted small mb-0" id="temporalFilterRangeLabel">0:00:00 - 0:00:00</p>
+                        <input type="hidden" id="startTime" name="start_time" value="0">
+                        <input type="hidden" id="endTime" name="end_time" value="">
+                    </div>
+                    {% endif %}
                     <div class="mt-4 d-flex justify-content-end gap-2">
                         <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
                         <button type="button"
@@ -50,3 +59,158 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
         </div>
     </div>
 </div>
+<script>
+    function msToHms(ms) {
+        var n = Number(ms);
+        if (!Number.isFinite(n) || n < 0) return '0:00:00';
+        const totalSec = Math.floor(n / 1000);
+        const h = Math.floor(totalSec / 3600);
+        const m = Math.floor((totalSec % 3600) / 60);
+        const s = totalSec % 60;
+        return [h, m, s].map(function(v) { return String(v).padStart(2, '0'); }).join(':');
+    }
+
+    document.addEventListener('DOMContentLoaded', function() {
+        const webDownloadModal = document.getElementById('webDownloadModal');
+        const confirmWebDownloadBtn = document.getElementById('confirmWebDownloadBtn');
+        const startTimeInput = document.getElementById('startTime');
+        const endTimeInput = document.getElementById('endTime');
+        if (!webDownloadModal || !confirmWebDownloadBtn) return;
+
+        // Handle download confirmation
+        confirmWebDownloadBtn.addEventListener('click', function() {
+            const datasetUuid = this.dataset.datasetUuid;
+            const datasetName = this.dataset.datasetName;
+
+            if (datasetUuid) {
+                this.innerHTML = '<i class="bi bi-hourglass-split"></i> Processing...';
+                this.disabled = true;
+
+                var url = '/users/download-item/dataset/' + datasetUuid + '/';
+                var headers = {
+                    'X-CSRFToken': document.querySelector('[name=csrfmiddlewaretoken]').value
+                };
+                var body = null;
+                if (startTimeInput && endTimeInput) {
+                    headers['Content-Type'] = 'application/x-www-form-urlencoded';
+                    body = new URLSearchParams({
+                        start_time: startTimeInput.value,
+                        end_time: endTimeInput.value
+                    });
+                } else {
+                    headers['Content-Type'] = 'application/json';
+                }
+
+                fetch(url, { method: 'POST', headers: headers, body: body })
+                    .then(function(response) {
+                        var contentType = response.headers.get('content-type');
+                        if (contentType && contentType.includes('application/json')) {
+                            return response.json();
+                        }
+                        return response.text().then(function(text) {
+                            throw new Error('Server returned non-JSON response: ' + text);
+                        });
+                    })
+                    .then(function(data) {
+                        if (data.success === true) {
+                            showAlert(data.message || 'Download request submitted successfully! You will receive an email when ready.', 'success');
+                            var modal = bootstrap.Modal.getInstance(webDownloadModal);
+                            if (modal) modal.hide();
+                        } else {
+                            showAlert('Error requesting download: ' + (data.message || 'Unknown error'), 'error');
+                        }
+                    })
+                    .catch(function(error) {
+                        console.error('Download error:', error);
+                        showAlert(error.message || 'An error occurred while processing your request.', 'error');
+                    })
+                    .finally(function() {
+                        confirmWebDownloadBtn.innerHTML = '<i class="bi bi-download"></i> Yes, Download Dataset';
+                        confirmWebDownloadBtn.disabled = false;
+                    });
+            }
+        });
+
+        webDownloadModal.addEventListener('hidden.bs.modal', function() {
+            confirmWebDownloadBtn.dataset.datasetUuid = '';
+            confirmWebDownloadBtn.dataset.datasetName = '';
+            var nameEl = document.getElementById('webDownloadDatasetName');
+            if (nameEl) nameEl.textContent = '';
+        });
+    });
+
+    /**
+     * Initialize or update the capture download temporal slider. Call before
+     * showing the modal when opening for a capture with known bounds.
+     * @param {number} durationMs - Total capture duration in milliseconds
+     * @param {number} fileCadenceMs - File cadence in milliseconds (step)
+     */
+    function initCaptureDownloadSlider(durationMs, fileCadenceMs) {
+        var sliderEl = document.getElementById('temporalFilterSlider');
+        var rangeLabel = document.getElementById('temporalFilterRangeLabel');
+        var startTimeInput = document.getElementById('startTime');
+        var endTimeInput = document.getElementById('endTime');
+        if (!sliderEl || typeof noUiSlider === 'undefined') return;
+        durationMs = Number(durationMs);
+        if (!Number.isFinite(durationMs) || durationMs < 0) durationMs = 0;
+        fileCadenceMs = Number(fileCadenceMs);
+        if (!Number.isFinite(fileCadenceMs) || fileCadenceMs < 1) fileCadenceMs = 1000;
+        if (sliderEl.noUiSlider) {
+            sliderEl.noUiSlider.destroy();
+        }
+        if (rangeLabel) rangeLabel.textContent = '—';
+        if (startTimeInput) startTimeInput.value = '';
+        if (endTimeInput) endTimeInput.value = '';
+        if (durationMs <= 0) return;
+        noUiSlider.create(sliderEl, {
+            start: [0, durationMs],
+            connect: true,
+            step: fileCadenceMs,
+            range: { min: 0, max: durationMs },
+            format: {
+                to: function(value) {
+                    return msToHms(value);
+                },
+                from: function(value) {
+                    var n = Number(value);
+                    if (!Number.isNaN(n)) return n;
+                    return 0;
+                }
+            }
+        });
+        sliderEl.noUiSlider.on('update', function(values) {
+            var startMs = Number(values[0]);
+            var endMs = Number(values[1]);
+            if (rangeLabel) {
+                rangeLabel.textContent = msToHms(startMs) + ' - ' + msToHms(endMs);
+            }
+            if (startTimeInput) startTimeInput.value = String(Math.round(startMs));
+            if (endTimeInput) endTimeInput.value = String(Math.round(endMs));
+        });
+        if (rangeLabel) {
+            rangeLabel.textContent = '0:00:00 - ' + msToHms(durationMs);
+        }
+        if (startTimeInput) startTimeInput.value = '0';
+        if (endTimeInput) endTimeInput.value = String(durationMs);
+    }
+    window.initCaptureDownloadSlider = initCaptureDownloadSlider;
+
+    // Function to show web download modal (used for both dataset and capture download)
+    function showWebDownloadModal(datasetUuid, datasetName) {
+        var nameEl = document.getElementById('webDownloadDatasetName');
+        var confirmBtn = document.getElementById('confirmWebDownloadBtn');
+        var modalEl = document.getElementById('webDownloadModal');
+        if (nameEl) nameEl.textContent = datasetName || '';
+        if (confirmBtn) {
+            confirmBtn.dataset.datasetUuid = datasetUuid || '';
+            confirmBtn.dataset.datasetName = datasetName || '';
+        }
+        if (modalEl && window.bootstrap) {
+            var modal = new bootstrap.Modal(modalEl);
+            modal.show();
+        }
+    }
+
+    // Make the function globally available
+    window.showWebDownloadModal = showWebDownloadModal;
+</script>
diff --git a/gateway/sds_gateway/users/views.py b/gateway/sds_gateway/users/views.py
index 41f2a70eb..85e340f91 100644
--- a/gateway/sds_gateway/users/views.py
+++ b/gateway/sds_gateway/users/views.py
@@ -3333,6 +3333,15 @@ def post(
         Returns:
             A JSON response containing the download status
         """
+        # optional start and end times for temporal filtering
+        start_time = request.POST.get("start_time", None)
+        end_time = request.POST.get("end_time", None)
+
+        if start_time:
+            start_time = int(start_time)
+        if end_time:
+            end_time = int(end_time)
+
         # Validate item type
         if item_type not in self.ITEM_MODELS:
             return JsonResponse(
@@ -3399,6 +3408,8 @@ def post(
             str(item.uuid),
             str(request.user.id),
             item_type,
+            start_time=start_time,
+            end_time=end_time,
         )
 
         return JsonResponse(

From 39c488502ee8a5d71b0c8dace50fcd84b1c097ef Mon Sep 17 00:00:00 2001
From: klpoland <kinsey.l.poland@gmail.com>
Date: Mon, 23 Feb 2026 09:17:22 -0500
Subject: [PATCH 2/7] fix label updates

---
 gateway/sds_gateway/api_methods/tasks.py      | 12 ++--
 .../users/partials/web_download_modal.html    | 55 +++++++++++--------
 2 files changed, 40 insertions(+), 27 deletions(-)

diff --git a/gateway/sds_gateway/api_methods/tasks.py b/gateway/sds_gateway/api_methods/tasks.py
index c7dff0b31..7a13f4390 100644
--- a/gateway/sds_gateway/api_methods/tasks.py
+++ b/gateway/sds_gateway/api_methods/tasks.py
@@ -20,13 +20,13 @@
 from redis import Redis
 
 from sds_gateway.api_methods.models import Capture
+from sds_gateway.api_methods.models import CaptureType
 from sds_gateway.api_methods.models import Dataset
 from sds_gateway.api_methods.models import File
 from sds_gateway.api_methods.models import ItemType
 from sds_gateway.api_methods.models import TemporaryZipFile
 from sds_gateway.api_methods.models import ZipFileStatus
 from sds_gateway.api_methods.models import user_has_access_to_item
-from sds_gateway.api_methods.models import CaptureType
 from sds_gateway.api_methods.utils.disk_utils import DISK_SPACE_BUFFER
 from sds_gateway.api_methods.utils.disk_utils import check_disk_space_available
 from sds_gateway.api_methods.utils.disk_utils import estimate_disk_size
@@ -1290,11 +1290,13 @@ def _get_item_files(
     Returns:
         List of files associated with the item
     """
-    from sds_gateway.api_methods.helpers.temporal_filtering import get_capture_files_with_temporal_filter
+    from sds_gateway.api_methods.helpers.temporal_filtering import (
+        get_capture_files_with_temporal_filter,
+    )
+    from sds_gateway.api_methods.utils.relationship_utils import get_capture_files
     from sds_gateway.api_methods.utils.relationship_utils import (
         get_dataset_files_including_captures,
     )
-    from sds_gateway.api_methods.utils.relationship_utils import get_capture_files
 
     if item_type == ItemType.DATASET:
         files_queryset = get_dataset_files_including_captures(
@@ -1316,7 +1318,7 @@ def _get_item_files(
             )
         else:
             if start_time is not None or end_time is not None:
-                logger.warning(
+                log.warning(
                     "Temporal filtering is only supported for DigitalRF captures, "
                     "ignoring start_time and end_time"
                 )
@@ -1326,7 +1328,7 @@ def _get_item_files(
                 include_deleted=False,
             )
 
-        logger.info(f"Found {len(files)} files for capture {item.uuid}")
+        log.info(f"Found {len(files)} files for capture {item.uuid}")
         return list(files)
 
     log.warning(f"Unknown item type: {item_type}")
diff --git a/gateway/sds_gateway/templates/users/partials/web_download_modal.html b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
index 5275a8972..8fb67d878 100644
--- a/gateway/sds_gateway/templates/users/partials/web_download_modal.html
+++ b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
@@ -38,13 +38,14 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
                         You will receive an email with a download link when the file is ready.
                     </p>
                     {% if item_type == "capture" %}
-                    <div class="mt-4">
-                        <label for="temporalFilterSlider">Filter capture files to download within a subset of time:</label>
-                        <div id="temporalFilterSlider" class="mt-3 mb-3"></div>
-                        <p class="text-muted small mb-0" id="temporalFilterRangeLabel">0:00:00 - 0:00:00</p>
-                        <input type="hidden" id="startTime" name="start_time" value="0">
-                        <input type="hidden" id="endTime" name="end_time" value="">
-                    </div>
+                        <div class="mt-4 px-4">
+                            <label for="temporalFilterSlider">Filter capture files to download within a subset of time:</label>
+                            <div id="temporalFilterSlider" class="mt-3 mb-3"></div>
+                            <p class="text-muted small mb-0" id="temporalFilterRangeLabel">0:00:00.000 - 0:00:00.000</p>
+                            <p class="text-muted small mb-0" id="totalFilesLabel">0 files</p>
+                            <input type="hidden" id="startTime" name="start_time" value="0" />
+                            <input type="hidden" id="endTime" name="end_time" value="" />
+                        </div>
                     {% endif %}
                     <div class="mt-4 d-flex justify-content-end gap-2">
                         <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
@@ -62,12 +63,16 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
 <script>
     function msToHms(ms) {
         var n = Number(ms);
-        if (!Number.isFinite(n) || n < 0) return '0:00:00';
+        if (!Number.isFinite(n) || n < 0) return '0:00:00.000';
         const totalSec = Math.floor(n / 1000);
         const h = Math.floor(totalSec / 3600);
         const m = Math.floor((totalSec % 3600) / 60);
         const s = totalSec % 60;
-        return [h, m, s].map(function(v) { return String(v).padStart(2, '0'); }).join(':');
+        const decimalMs = n % 1000;
+        const hms = [h, m, s].map(function(v) {
+            return String(v).padStart(2, '0');
+        }).join(':');
+        return hms + '.' + decimalMs.toString().padStart(3, '0');
     }
 
     document.addEventListener('DOMContentLoaded', function() {
@@ -101,7 +106,11 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
                     headers['Content-Type'] = 'application/json';
                 }
 
-                fetch(url, { method: 'POST', headers: headers, body: body })
+                fetch(url, {
+                        method: 'POST',
+                        headers: headers,
+                        body: body
+                    })
                     .then(function(response) {
                         var contentType = response.headers.get('content-type');
                         if (contentType && contentType.includes('application/json')) {
@@ -148,6 +157,7 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
     function initCaptureDownloadSlider(durationMs, fileCadenceMs) {
         var sliderEl = document.getElementById('temporalFilterSlider');
         var rangeLabel = document.getElementById('temporalFilterRangeLabel');
+        var totalFilesLabel = document.getElementById('totalFilesLabel');
         var startTimeInput = document.getElementById('startTime');
         var endTimeInput = document.getElementById('endTime');
         if (!sliderEl || typeof noUiSlider === 'undefined') return;
@@ -166,29 +176,30 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
             start: [0, durationMs],
             connect: true,
             step: fileCadenceMs,
-            range: { min: 0, max: durationMs },
-            format: {
-                to: function(value) {
-                    return msToHms(value);
-                },
-                from: function(value) {
-                    var n = Number(value);
-                    if (!Number.isNaN(n)) return n;
-                    return 0;
-                }
-            }
+            range: {
+                min: 0,
+                max: durationMs
+            },
         });
         sliderEl.noUiSlider.on('update', function(values) {
             var startMs = Number(values[0]);
             var endMs = Number(values[1]);
+            var totalFiles = (endMs - startMs) / fileCadenceMs;
             if (rangeLabel) {
                 rangeLabel.textContent = msToHms(startMs) + ' - ' + msToHms(endMs);
             }
+            if (totalFilesLabel) {
+                totalFilesLabel.textContent = totalFiles.toFixed(0) + ' files';
+            }
             if (startTimeInput) startTimeInput.value = String(Math.round(startMs));
             if (endTimeInput) endTimeInput.value = String(Math.round(endMs));
         });
         if (rangeLabel) {
-            rangeLabel.textContent = '0:00:00 - ' + msToHms(durationMs);
+            rangeLabel.textContent = '0:00:00.000 - ' + msToHms(durationMs);
+        }
+        if (totalFilesLabel) {
+            totalFiles = durationMs / fileCadenceMs;
+            totalFilesLabel.textContent = totalFiles.toFixed(0) + ' files';
         }
         if (startTimeInput) startTimeInput.value = '0';
         if (endTimeInput) endTimeInput.value = String(durationMs);

From 1edcd0b6a90c07a9f5906195e4c81502165910df Mon Sep 17 00:00:00 2001
From: klpoland <kinsey.l.poland@gmail.com>
Date: Fri, 27 Feb 2026 07:49:42 -0500
Subject: [PATCH 3/7] fix backend issues, enhance filter labels

---
 .../api_methods/helpers/temporal_filtering.py |   8 +-
 .../serializers/capture_serializers.py        |  46 ++++++-
 gateway/sds_gateway/api_methods/tasks.py      |   3 +-
 .../js/actions/DownloadActionManager.js       | 115 ++++++++++++++++--
 gateway/sds_gateway/static/js/file-list.js    |  12 +-
 .../users/partials/captures_page_table.html   |   7 +-
 .../users/partials/web_download_modal.html    |  95 ++++++---------
 gateway/sds_gateway/users/views.py            |   9 +-
 8 files changed, 209 insertions(+), 86 deletions(-)

diff --git a/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py b/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py
index 16b648d91..31e1845a2 100644
--- a/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py
+++ b/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py
@@ -76,7 +76,6 @@ def get_capture_bounds(capture_type: CaptureType, capture_uuid: str) -> tuple[in
     search_props = source["search_props"]
     start_time = search_props["start_time"]
     end_time = search_props["end_time"]
-    print(f"start_time: {start_time}, end_time: {end_time}")
     return start_time, end_time
 
 
@@ -100,12 +99,15 @@ def get_file_cadence(capture_type: CaptureType, capture: Capture) -> int:
 
     data_files = get_data_files(capture_type, capture)
     count = data_files.count()
+
+    # the first file represents the beginning of the capture
+    # exclude it from the count to get the correct file cadence
+    # the count - 1 gives us the number of "spaces" between the files
+    count -= 1
     if count == 0:
         return 0
     duration_sec = end_time - start_time
-    print(f"duration_sec: {duration_sec}")
     duration_ms = duration_sec * 1000
-    print(f"duration_ms: {duration_ms}")
     return max(1, int(duration_ms / count))
 
 
diff --git a/gateway/sds_gateway/api_methods/serializers/capture_serializers.py b/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
index 692628483..d084a2441 100644
--- a/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
+++ b/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
@@ -11,6 +11,7 @@
 from sds_gateway.api_methods.helpers.index_handling import retrieve_indexed_metadata
 from sds_gateway.api_methods.helpers.temporal_filtering import get_capture_bounds
 from sds_gateway.api_methods.helpers.temporal_filtering import get_file_cadence
+from sds_gateway.api_methods.helpers.temporal_filtering import get_data_files
 from sds_gateway.api_methods.models import Capture
 from sds_gateway.api_methods.models import CaptureType
 from sds_gateway.api_methods.models import DEPRECATEDPostProcessedData
@@ -74,7 +75,9 @@ class CaptureGetSerializer(serializers.ModelSerializer[Capture]):
     sample_rate_mhz = serializers.SerializerMethodField()
     length_of_capture_ms = serializers.SerializerMethodField()
     file_cadence_ms = serializers.SerializerMethodField()
-    files_count = serializers.SerializerMethodField()
+    capture_start_epoch_sec = serializers.SerializerMethodField()
+    data_files_count = serializers.SerializerMethodField()
+    per_data_file_size = serializers.SerializerMethodField()
     total_file_size = serializers.SerializerMethodField()
     formatted_created_at = serializers.SerializerMethodField()
     capture_type_display = serializers.SerializerMethodField()
@@ -121,10 +124,25 @@ def get_file_cadence_ms(self, capture: Capture) -> int | None:
         except (ValueError, IndexError, KeyError):
             return None
 
+    @extend_schema_field(serializers.IntegerField(allow_null=True))
+    def get_capture_start_epoch_sec(self, capture: Capture) -> int | None:
+        """Get the capture start time as Unix epoch seconds. None if not indexed in OpenSearch."""
+        try:
+            start_time, _ = get_capture_bounds(capture.capture_type, str(capture.uuid))
+            return start_time
+        except (ValueError, IndexError, KeyError):
+            return None
+
     @extend_schema_field(serializers.IntegerField)
-    def get_files_count(self, capture: Capture) -> int:
+    def get_data_files_count(self, capture: Capture) -> int:
         """Get the count of files associated with this capture."""
-        return get_capture_files(capture, include_deleted=False).count()
+        return get_data_files(capture.capture_type, capture).count()
+    
+    @extend_schema_field(serializers.FloatField)
+    def get_per_data_file_size(self, capture: Capture) -> float:
+        """Get the size of each data file in the capture."""
+        data_file_sizes = get_data_files(capture.capture_type, capture).aggregate(total_size=Sum("size"))
+        return data_file_sizes["total_size"] / self.get_data_files_count(capture)
 
     @extend_schema_field(serializers.IntegerField)
     def get_total_file_size(self, capture: Capture) -> int:
@@ -322,11 +340,12 @@ class CompositeCaptureSerializer(serializers.Serializer):
 
     # Computed fields
     files = serializers.SerializerMethodField()
-    files_count = serializers.SerializerMethodField()
+    data_files_count = serializers.SerializerMethodField()
     total_file_size = serializers.SerializerMethodField()
     formatted_created_at = serializers.SerializerMethodField()
     length_of_capture_ms = serializers.SerializerMethodField()
     file_cadence_ms = serializers.SerializerMethodField()
+    capture_start_epoch_sec = serializers.SerializerMethodField()
 
     def get_files(self, obj: dict[str, Any]) -> ReturnList[File]:
         """Get all files from all channels in the composite capture."""
@@ -344,13 +363,13 @@ def get_files(self, obj: dict[str, Any]) -> ReturnList[File]:
         return cast("ReturnList[File]", all_files)
 
     @extend_schema_field(serializers.IntegerField)
-    def get_files_count(self, obj: dict[str, Any]) -> int:
+    def get_data_files_count(self, obj: dict[str, Any]) -> int:
         """Get the total count of files across all channels."""
         total_count = 0
         for channel_data in obj["channels"]:
             capture_uuid = channel_data["uuid"]
             capture = Capture.objects.get(uuid=capture_uuid)
-            total_count += get_capture_files(capture, include_deleted=False).count()
+            total_count += get_data_files(capture.capture_type, capture).count()
         return total_count
 
     @extend_schema_field(serializers.IntegerField)
@@ -400,6 +419,21 @@ def get_file_cadence_ms(self, obj: dict[str, Any]) -> int | None:
         except (ValueError, IndexError, KeyError):
             return None
 
+    @extend_schema_field(serializers.IntegerField(allow_null=True))
+    def get_capture_start_epoch_sec(self, obj: dict[str, Any]) -> int | None:
+        """Use first channel's start time for composite capture."""
+        channels = obj.get("channels") or []
+        if not channels:
+            return None
+        try:
+            capture = Capture.objects.get(uuid=channels[0]["uuid"])
+            start_time, _ = get_capture_bounds(
+                capture.capture_type, str(capture.uuid)
+            )
+            return start_time
+        except (ValueError, IndexError, KeyError):
+            return None
+
 
 def build_composite_capture_data(captures: list[Capture]) -> dict[str, Any]:
     """Build composite capture data from a list of captures with the same top_level_dir.
diff --git a/gateway/sds_gateway/api_methods/tasks.py b/gateway/sds_gateway/api_methods/tasks.py
index 7a13f4390..93b0a5f1a 100644
--- a/gateway/sds_gateway/api_methods/tasks.py
+++ b/gateway/sds_gateway/api_methods/tasks.py
@@ -941,7 +941,6 @@ def _send_download_email(
         getattr(item, "name", str(item)) or f"{item_type.capitalize()} {item.uuid}"
     )
     subject = f"Your {item_type} '{item_display_name}' is ready for download"
-
     context = {
         "item_type": item_type,
         "item_name": item_display_name,
@@ -1309,7 +1308,7 @@ def _get_item_files(
     if item_type == ItemType.CAPTURE:
         capture_type = item.capture_type
         # temporal filtering is only supported for DigitalRF captures
-        if capture_type is CaptureType.DigitalRF:
+        if capture_type == CaptureType.DigitalRF:
             files = get_capture_files_with_temporal_filter(
                 capture_type=capture_type,
                 capture=item,
diff --git a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
index 233cb9b43..7b90fbb4b 100644
--- a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
+++ b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
@@ -94,6 +94,97 @@ class DownloadActionManager {
 		}
 	}
 
+	    /**
+     * Initialize or update the capture download temporal slider. Call before
+     * showing the modal when opening for a capture with known bounds.
+     * @param {number} durationMs - Total capture duration in milliseconds
+     * @param {number} fileCadenceMs - File cadence in milliseconds (step)
+     * @param {Object} opts - Optional: { perDataFileSize, totalSize, dataFilesCount, totalFilesCount, captureStartEpochSec }
+     */
+	initializeCaptureDownloadSlider(durationMs, fileCadenceMs, opts) {
+		opts = opts || {};
+		var sliderEl = document.getElementById('temporalFilterSlider');
+		var rangeLabel = document.getElementById('temporalFilterRangeLabel');
+		var totalFilesLabel = document.getElementById('totalFilesLabel');
+		var metadataFilesLabel = document.getElementById('metadataFilesLabel');
+		var totalSizeLabel = document.getElementById('totalSizeLabel');
+		var dateTimeLabel = document.getElementById('dateTimeLabel');
+		var startTimeInput = document.getElementById('startTime');
+		var endTimeInput = document.getElementById('endTime');
+		if (!sliderEl || typeof noUiSlider === 'undefined') return;
+		durationMs = Number(durationMs);
+		if (!Number.isFinite(durationMs) || durationMs < 0) durationMs = 0;
+		fileCadenceMs = Number(fileCadenceMs);
+		if (!Number.isFinite(fileCadenceMs) || fileCadenceMs < 1) fileCadenceMs = 1000;
+		var perDataFileSize = Number(opts.perDataFileSize) || 0;
+		var totalSize = Number(opts.totalSize) || 0;
+		var dataFilesCount = Number(opts.dataFilesCount) || 0;
+		var totalFilesCount = Number(opts.totalFilesCount) || 0;
+		var dataFilesTotalSize = perDataFileSize * dataFilesCount;
+		var metadataFilesTotalSize = totalSize - dataFilesTotalSize;
+		var metadataFilesCount = totalFilesCount - dataFilesCount;
+		var captureStartEpochSec = Number(opts.captureStartEpochSec);
+		if (sliderEl.noUiSlider) {
+			sliderEl.noUiSlider.destroy();
+		}
+		if (rangeLabel) rangeLabel.textContent = '—';
+		if (totalFilesLabel) totalFilesLabel.textContent = '0 files';
+		if (totalSizeLabel) totalSizeLabel.textContent = formatBytes(totalSize);
+		if (dateTimeLabel) dateTimeLabel.textContent = '—';
+		if (startTimeInput) startTimeInput.value = '';
+		if (endTimeInput) endTimeInput.value = '';
+		if (durationMs <= 0) return;
+		noUiSlider.create(sliderEl, {
+			start: [0, durationMs],
+			connect: true,
+			step: fileCadenceMs,
+			range: { min: 0, max: durationMs },
+		});
+		sliderEl.noUiSlider.on('update', function(values) {
+			var startMs = Number(values[0]);
+			var endMs = Number(values[1]);
+			// the + 1 is to include the first file in the selection
+			// as file cadence is the time between files, not the time of the file
+			var filesInSelection = Math.round((endMs - startMs) / fileCadenceMs) + 1;
+			if (rangeLabel) {
+				rangeLabel.textContent = msToHms(startMs) + ' - ' + msToHms(endMs);
+			}
+			if (totalFilesLabel) {
+				totalFilesLabel.textContent = dataFilesCount > 0
+					? filesInSelection + ' of ' + dataFilesCount + ' files'
+					: filesInSelection + ' files';
+			}
+			if (totalSizeLabel) {
+				totalSizeLabel.textContent = formatBytes(
+					(perDataFileSize * filesInSelection) + metadataFilesTotalSize
+				);
+			}
+			if (dateTimeLabel && Number.isFinite(captureStartEpochSec)) {
+				dateTimeLabel.textContent = formatUtcRange(captureStartEpochSec, startMs, endMs);
+			}
+			if (startTimeInput) startTimeInput.value = String(Math.round(startMs));
+			if (endTimeInput) endTimeInput.value = String(Math.round(endMs));
+		});
+		if (rangeLabel) {
+			rangeLabel.textContent = '0:00:00.000 - ' + msToHms(durationMs);
+		}
+		if (totalFilesLabel) {
+			totalFilesLabel.textContent = dataFilesCount > 0
+				? dataFilesCount + ' files'
+				: '0 files';
+		}
+		if (metadataFilesLabel) {
+			metadataFilesLabel.textContent = metadataFilesCount > 0
+				? metadataFilesCount + ' files'
+				: '0 files';
+		}
+		if (dateTimeLabel && Number.isFinite(captureStartEpochSec)) {
+			dateTimeLabel.textContent = formatUtcRange(captureStartEpochSec, 0, durationMs);
+		}
+		if (startTimeInput) startTimeInput.value = '0';
+		if (endTimeInput) endTimeInput.value = String(durationMs);
+	}
+
 	/**
 	 * Handle dataset download
 	 * @param {string} datasetUuid - Dataset UUID
@@ -277,15 +368,25 @@ class DownloadActionManager {
 		// Initialize temporal slider from button data attributes (clears or builds slider)
 		const durationMs = parseInt(button.getAttribute("data-length-of-capture-ms"), 10);
 		const fileCadenceMs = parseInt(button.getAttribute("data-file-cadence-ms"), 10);
-		if (typeof window.initCaptureDownloadSlider === "function") {
-			window.initCaptureDownloadSlider(
-				Number.isNaN(durationMs) ? 0 : durationMs,
-				Number.isNaN(fileCadenceMs) ? 1000 : fileCadenceMs,
-			);
-		}
+		const perDataFileSize = parseFloat(button.getAttribute("data-per-data-file-size"), 10);
+		const totalSize = parseInt(button.getAttribute("data-total-size"), 10);
+		const dataFilesCount = parseInt(button.getAttribute("data-data-files-count"), 10);
+		const totalFilesCount = parseInt(button.getAttribute("data-total-files-count"), 10);
+		const captureStartEpochSec = parseInt(button.getAttribute("data-capture-start-epoch-sec"), 10);
+		this.initializeCaptureDownloadSlider(
+			Number.isNaN(durationMs) ? 0 : durationMs,
+			Number.isNaN(fileCadenceMs) ? 1000 : fileCadenceMs,
+			{
+				perDataFileSize: Number.isNaN(perDataFileSize) ? 0 : perDataFileSize,
+				totalSize: Number.isNaN(totalSize) ? 0 : totalSize,
+				dataFilesCount: Number.isNaN(dataFilesCount) ? 0 : dataFilesCount,
+				totalFilesCount: Number.isNaN(totalFilesCount) ? 0 : totalFilesCount,
+				captureStartEpochSec: Number.isNaN(captureStartEpochSec) ? undefined : captureStartEpochSec,
+			},
+		);
 
 		// Show the modal
-		window.showWebDownloadModal(captureUuid, captureName);
+		this.openCustomModal("webDownloadModal");
 	}
 
 	/**
diff --git a/gateway/sds_gateway/static/js/file-list.js b/gateway/sds_gateway/static/js/file-list.js
index 609c19f17..d9f8c495b 100644
--- a/gateway/sds_gateway/static/js/file-list.js
+++ b/gateway/sds_gateway/static/js/file-list.js
@@ -713,6 +713,11 @@ class FileListCapturesTableManager extends CapturesTableManager {
 			),
 			lengthOfCaptureMs: capture.length_of_capture_ms ?? 0,
 			fileCadenceMs: capture.file_cadence_ms ?? 1000,
+			perDataFileSize: capture.per_data_file_size ?? 0,
+			totalSize: capture.total_file_size ?? 0,
+			dataFilesCount: capture.data_files_count ?? 0,
+			totalFilesCount: capture.files.length ?? 0,
+			captureStartEpochSec: capture.capture_start_epoch_sec ?? 0,
 		};
 
 		let typeDisplay = safeData.captureTypeDisplay || safeData.captureType;
@@ -839,7 +844,12 @@ class FileListCapturesTableManager extends CapturesTableManager {
 										data-capture-uuid="${safeData.uuid}"
 										data-capture-name="${safeData.name}"
 										data-length-of-capture-ms="${safeData.lengthOfCaptureMs}"
-										data-file-cadence-ms="${safeData.fileCadenceMs}">
+										data-file-cadence-ms="${safeData.fileCadenceMs}"
+										data-per-data-file-size="${safeData.perDataFileSize}"
+										data-total-size="${safeData.totalSize}"
+										data-data-files-count="${safeData.dataFilesCount}"
+										data-total-files-count="${safeData.totalFilesCount}"
+										data-capture-start-epoch-sec="${safeData.captureStartEpochSec}">
 									Download
 								</button>
 							</li>
diff --git a/gateway/sds_gateway/templates/users/partials/captures_page_table.html b/gateway/sds_gateway/templates/users/partials/captures_page_table.html
index 334ac50c4..088b8c369 100644
--- a/gateway/sds_gateway/templates/users/partials/captures_page_table.html
+++ b/gateway/sds_gateway/templates/users/partials/captures_page_table.html
@@ -142,7 +142,12 @@
                                                 data-capture-uuid="{{ cap.uuid }}"
                                                 data-capture-name="{{ cap.name|default:'' }}"
                                                 data-length-of-capture-ms="{{ cap.length_of_capture_ms|default:0 }}"
-                                                data-file-cadence-ms="{{ cap.file_cadence_ms|default:1000 }}">Download</button>
+                                                data-file-cadence-ms="{{ cap.file_cadence_ms|default:1000 }}"
+                                                data-per-data-file-size="{{ cap.per_data_file_size|default:0 }}"
+                                                data-total-size="{{ cap.total_file_size|default:0 }}"
+                                                data-data-files-count="{{ cap.data_files_count|default:0 }}"
+                                                data-total-files-count="{{ cap.files|length|default:0 }}"
+                                                data-capture-start-epoch-sec="{{ cap.capture_start_epoch_sec|default:0 }}">Download</button>
                                     </li>
                                     {% if cap.capture_type == 'drf' %}
                                         <li>
diff --git a/gateway/sds_gateway/templates/users/partials/web_download_modal.html b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
index 8fb67d878..713c1221b 100644
--- a/gateway/sds_gateway/templates/users/partials/web_download_modal.html
+++ b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
@@ -39,10 +39,15 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
                     </p>
                     {% if item_type == "capture" %}
                         <div class="mt-4 px-4">
-                            <label for="temporalFilterSlider">Filter capture files to download within a subset of time:</label>
+                            <label for="temporalFilterSlider">Filter capture <strong>RF data files</strong> to download within a subset of time:</label>
                             <div id="temporalFilterSlider" class="mt-3 mb-3"></div>
-                            <p class="text-muted small mb-0" id="temporalFilterRangeLabel">0:00:00.000 - 0:00:00.000</p>
-                            <p class="text-muted small mb-0" id="totalFilesLabel">0 files</p>
+                            <div class="bg-light rounded px-3 py-2 mt-2 border-start border-3 border-primary">
+                                <p class="small mb-1 fw-medium"><span class="text-muted">Range:</span> <span id="temporalFilterRangeLabel">0:00:00.000 - 0:00:00.000</span></p>
+                                <p class="small mb-1 fw-medium"><span class="text-muted">Files in selection:</span> <span id="totalFilesLabel">0 files</span></p>
+                                <p class="small mb-1 fw-medium"><span class="text-muted">Number of metadata files to include in download:</span> <span id="metadataFilesLabel">0 files</span></p>
+                                <p class="small mb-1 fw-medium"><span class="text-muted">Total download size (including metadata files):</span> <span id="totalSizeLabel">0 bytes</span></p>
+                                <p class="small mb-0 fw-medium"><span class="text-muted">Time (UTC):</span> <span id="dateTimeLabel">—</span></p>
+                            </div>
                             <input type="hidden" id="startTime" name="start_time" value="0" />
                             <input type="hidden" id="endTime" name="end_time" value="" />
                         </div>
@@ -75,6 +80,32 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
         return hms + '.' + decimalMs.toString().padStart(3, '0');
     }
 
+    function formatBytes(bytes) {
+        var n = Number(bytes);
+        if (!Number.isFinite(n) || n < 0) return '0 bytes';
+        if (n === 0) return '0 bytes';
+        var units = ['bytes', 'KB', 'MB', 'GB'];
+        var i = 0;
+        while (n >= 1024 && i < units.length - 1) {
+            n /= 1024;
+            i++;
+        }
+        return (i === 0 ? n : n.toFixed(2)) + ' ' + units[i];
+    }
+
+    function formatUtcRange(startEpochSec, startMs, endMs) {
+        if (!Number.isFinite(startEpochSec)) return '—';
+        var startDate = new Date(startEpochSec * 1000 + startMs);
+        var endDate = new Date(startEpochSec * 1000 + endMs);
+        function pad2(x) { return String(x).padStart(2, '0'); }
+        function fmt(d) {
+            var h = d.getUTCHours(), m = d.getUTCMinutes(), s = d.getUTCSeconds();
+            var mo = d.getUTCMonth() + 1, day = d.getUTCDate(), y = d.getUTCFullYear();
+            return pad2(h) + ':' + pad2(m) + ':' + pad2(s) + ' ' + pad2(mo) + '/' + pad2(day) + '/' + y;
+        }
+        return fmt(startDate) + ' - ' + fmt(endDate) + ' (UTC)';
+    }
+
     document.addEventListener('DOMContentLoaded', function() {
         const webDownloadModal = document.getElementById('webDownloadModal');
         const confirmWebDownloadBtn = document.getElementById('confirmWebDownloadBtn');
@@ -148,64 +179,6 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
         });
     });
 
-    /**
-     * Initialize or update the capture download temporal slider. Call before
-     * showing the modal when opening for a capture with known bounds.
-     * @param {number} durationMs - Total capture duration in milliseconds
-     * @param {number} fileCadenceMs - File cadence in milliseconds (step)
-     */
-    function initCaptureDownloadSlider(durationMs, fileCadenceMs) {
-        var sliderEl = document.getElementById('temporalFilterSlider');
-        var rangeLabel = document.getElementById('temporalFilterRangeLabel');
-        var totalFilesLabel = document.getElementById('totalFilesLabel');
-        var startTimeInput = document.getElementById('startTime');
-        var endTimeInput = document.getElementById('endTime');
-        if (!sliderEl || typeof noUiSlider === 'undefined') return;
-        durationMs = Number(durationMs);
-        if (!Number.isFinite(durationMs) || durationMs < 0) durationMs = 0;
-        fileCadenceMs = Number(fileCadenceMs);
-        if (!Number.isFinite(fileCadenceMs) || fileCadenceMs < 1) fileCadenceMs = 1000;
-        if (sliderEl.noUiSlider) {
-            sliderEl.noUiSlider.destroy();
-        }
-        if (rangeLabel) rangeLabel.textContent = '—';
-        if (startTimeInput) startTimeInput.value = '';
-        if (endTimeInput) endTimeInput.value = '';
-        if (durationMs <= 0) return;
-        noUiSlider.create(sliderEl, {
-            start: [0, durationMs],
-            connect: true,
-            step: fileCadenceMs,
-            range: {
-                min: 0,
-                max: durationMs
-            },
-        });
-        sliderEl.noUiSlider.on('update', function(values) {
-            var startMs = Number(values[0]);
-            var endMs = Number(values[1]);
-            var totalFiles = (endMs - startMs) / fileCadenceMs;
-            if (rangeLabel) {
-                rangeLabel.textContent = msToHms(startMs) + ' - ' + msToHms(endMs);
-            }
-            if (totalFilesLabel) {
-                totalFilesLabel.textContent = totalFiles.toFixed(0) + ' files';
-            }
-            if (startTimeInput) startTimeInput.value = String(Math.round(startMs));
-            if (endTimeInput) endTimeInput.value = String(Math.round(endMs));
-        });
-        if (rangeLabel) {
-            rangeLabel.textContent = '0:00:00.000 - ' + msToHms(durationMs);
-        }
-        if (totalFilesLabel) {
-            totalFiles = durationMs / fileCadenceMs;
-            totalFilesLabel.textContent = totalFiles.toFixed(0) + ' files';
-        }
-        if (startTimeInput) startTimeInput.value = '0';
-        if (endTimeInput) endTimeInput.value = String(durationMs);
-    }
-    window.initCaptureDownloadSlider = initCaptureDownloadSlider;
-
     // Function to show web download modal (used for both dataset and capture download)
     function showWebDownloadModal(datasetUuid, datasetName) {
         var nameEl = document.getElementById('webDownloadDatasetName');
diff --git a/gateway/sds_gateway/users/views.py b/gateway/sds_gateway/users/views.py
index 85e340f91..d3d44b123 100644
--- a/gateway/sds_gateway/users/views.py
+++ b/gateway/sds_gateway/users/views.py
@@ -3334,12 +3334,11 @@ def post(
             A JSON response containing the download status
         """
         # optional start and end times for temporal filtering
-        start_time = request.POST.get("start_time", None)
-        end_time = request.POST.get("end_time", None)
-
-        if start_time:
+        start_time = request.POST.get("start_time") or None
+        end_time = request.POST.get("end_time") or None
+        if start_time is not None:
             start_time = int(start_time)
-        if end_time:
+        if end_time is not None:
             end_time = int(end_time)
 
         # Validate item type

From bb974126fb84653219cf29afd5d50d8342f82e95 Mon Sep 17 00:00:00 2001
From: klpoland <kinsey.l.poland@gmail.com>
Date: Sun, 1 Mar 2026 17:01:49 -0500
Subject: [PATCH 4/7] add start and end time inputs

---
 .../js/actions/DownloadActionManager.js       | 34 ++++++++++++++++--
 .../users/partials/web_download_modal.html    | 36 ++++++++++++++++++-
 2 files changed, 67 insertions(+), 3 deletions(-)

diff --git a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
index 7b90fbb4b..766e9e520 100644
--- a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
+++ b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
@@ -111,6 +111,10 @@ class DownloadActionManager {
 		var dateTimeLabel = document.getElementById('dateTimeLabel');
 		var startTimeInput = document.getElementById('startTime');
 		var endTimeInput = document.getElementById('endTime');
+		var startTimeEntry = document.getElementById('startTimeEntry');
+		var endTimeEntry = document.getElementById('endTimeEntry');
+		var rangeHintEl = document.getElementById('temporalRangeHint');
+		var webDownloadModal = document.getElementById('webDownloadModal');
 		if (!sliderEl || typeof noUiSlider === 'undefined') return;
 		durationMs = Number(durationMs);
 		if (!Number.isFinite(durationMs) || durationMs < 0) durationMs = 0;
@@ -124,6 +128,8 @@ class DownloadActionManager {
 		var metadataFilesTotalSize = totalSize - dataFilesTotalSize;
 		var metadataFilesCount = totalFilesCount - dataFilesCount;
 		var captureStartEpochSec = Number(opts.captureStartEpochSec);
+		if (webDownloadModal) webDownloadModal.dataset.durationMs = String(Math.round(durationMs));
+		if (rangeHintEl) rangeHintEl.textContent = '0 – ' + Math.round(durationMs) + ' ms';
 		if (sliderEl.noUiSlider) {
 			sliderEl.noUiSlider.destroy();
 		}
@@ -133,6 +139,8 @@ class DownloadActionManager {
 		if (dateTimeLabel) dateTimeLabel.textContent = '—';
 		if (startTimeInput) startTimeInput.value = '';
 		if (endTimeInput) endTimeInput.value = '';
+		if (startTimeEntry) startTimeEntry.value = '';
+		if (endTimeEntry) endTimeEntry.value = '';
 		if (durationMs <= 0) return;
 		noUiSlider.create(sliderEl, {
 			start: [0, durationMs],
@@ -164,6 +172,8 @@ class DownloadActionManager {
 			}
 			if (startTimeInput) startTimeInput.value = String(Math.round(startMs));
 			if (endTimeInput) endTimeInput.value = String(Math.round(endMs));
+			if (startTimeEntry) startTimeEntry.value = String(Math.round(startMs));
+			if (endTimeEntry) endTimeEntry.value = String(Math.round(endMs));
 		});
 		if (rangeLabel) {
 			rangeLabel.textContent = '0:00:00.000 - ' + msToHms(durationMs);
@@ -181,8 +191,28 @@ class DownloadActionManager {
 		if (dateTimeLabel && Number.isFinite(captureStartEpochSec)) {
 			dateTimeLabel.textContent = formatUtcRange(captureStartEpochSec, 0, durationMs);
 		}
-		if (startTimeInput) startTimeInput.value = '0';
-		if (endTimeInput) endTimeInput.value = String(durationMs);
+		var startVal = '0';
+		var endVal = String(durationMs);
+		if (startTimeInput) startTimeInput.value = startVal;
+		if (endTimeInput) endTimeInput.value = endVal;
+		if (startTimeEntry) startTimeEntry.value = startVal;
+		if (endTimeEntry) endTimeEntry.value = endVal;
+
+		function syncSliderFromEntries() {
+			if (!sliderEl.noUiSlider || !startTimeEntry || !endTimeEntry) return;
+			var s = startTimeEntry.value.trim();
+			var e = endTimeEntry.value.trim();
+			var startMs = s === '' ? 0 : parseInt(s, 10);
+			var endMs = e === '' ? durationMs : parseInt(e, 10);
+			if (!Number.isFinite(startMs)) startMs = 0;
+			if (!Number.isFinite(endMs)) endMs = durationMs;
+			startMs = Math.max(0, Math.min(startMs, durationMs));
+			endMs = Math.max(0, Math.min(endMs, durationMs));
+			if (startMs >= endMs) endMs = Math.min(startMs + fileCadenceMs, durationMs);
+			sliderEl.noUiSlider.set([startMs, endMs]);
+		}
+		if (startTimeEntry) startTimeEntry.addEventListener('change', syncSliderFromEntries);
+		if (endTimeEntry) endTimeEntry.addEventListener('change', syncSliderFromEntries);
 	}
 
 	/**
diff --git a/gateway/sds_gateway/templates/users/partials/web_download_modal.html b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
index 713c1221b..5ee45ca03 100644
--- a/gateway/sds_gateway/templates/users/partials/web_download_modal.html
+++ b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
@@ -39,8 +39,19 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
                     </p>
                     {% if item_type == "capture" %}
                         <div class="mt-4 px-4">
-                            <label for="temporalFilterSlider">Filter capture <strong>RF data files</strong> to download within a subset of time:</label>
+                            <label for="temporalFilterSlider">Filter capture RF data files to download within a subset of time:</label>
                             <div id="temporalFilterSlider" class="mt-3 mb-3"></div>
+                            <div class="row">
+                                <div class="col-6">
+                                    <label for="startTimeEntry">Start (ms from capture start)</label>
+                                    <input type="number" id="startTimeEntry" class="form-control" min="0" step="1" placeholder="0" />
+                                </div>
+                                <div class="col-6">
+                                    <label for="endTimeEntry">End (ms from capture start)</label>
+                                    <input type="number" id="endTimeEntry" class="form-control" min="0" step="1" placeholder="0" />
+                                </div>
+                            </div>
+                            <p class="small text-muted mt-1 mb-0">Valid range: <span id="temporalRangeHint">0 – — ms</span> (same values as the slider above)</p>
                             <div class="bg-light rounded px-3 py-2 mt-2 border-start border-3 border-primary">
                                 <p class="small mb-1 fw-medium"><span class="text-muted">Range:</span> <span id="temporalFilterRangeLabel">0:00:00.000 - 0:00:00.000</span></p>
                                 <p class="small mb-1 fw-medium"><span class="text-muted">Files in selection:</span> <span id="totalFilesLabel">0 files</span></p>
@@ -119,6 +130,29 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
             const datasetName = this.dataset.datasetName;
 
             if (datasetUuid) {
+                var startVal = startTimeInput ? startTimeInput.value : '';
+                var endVal = endTimeInput ? endTimeInput.value : '';
+                var startEntry = document.getElementById('startTimeEntry');
+                var endEntry = document.getElementById('endTimeEntry');
+                var modalEl = document.getElementById('webDownloadModal');
+                if (startEntry && endEntry && modalEl && modalEl.dataset.durationMs) {
+                    var entryStart = startEntry.value.trim();
+                    var entryEnd = endEntry.value.trim();
+                    if (entryStart !== '' || entryEnd !== '') {
+                        var durationMs = parseInt(modalEl.dataset.durationMs, 10);
+                        var startMs = entryStart === '' ? 0 : parseInt(entryStart, 10);
+                        var endMs = entryEnd === '' ? durationMs : parseInt(entryEnd, 10);
+                        if (!Number.isFinite(startMs) || !Number.isFinite(endMs) || startMs < 0 || endMs > durationMs || startMs >= endMs) {
+                            showAlert('Please enter valid start/end times (0 ≤ start < end ≤ ' + durationMs + ' ms).', 'error');
+                            return;
+                        }
+                        startVal = String(startMs);
+                        endVal = String(endMs);
+                        startTimeInput.value = startVal;
+                        endTimeInput.value = endVal;
+                    }
+                }
+
                 this.innerHTML = '<i class="bi bi-hourglass-split"></i> Processing...';
                 this.disabled = true;
 

From 5aae2ca293080719a60d08f2a0b79a7de1314636 Mon Sep 17 00:00:00 2001
From: klpoland <kinsey.l.poland@gmail.com>
Date: Fri, 6 Mar 2026 08:16:22 -0500
Subject: [PATCH 5/7] add tests, generalize download modal, move js from
 template to manager file, catch potential errors

---
 .../api_methods/helpers/temporal_filtering.py |  42 +-
 .../serializers/capture_serializers.py        |  78 +++-
 gateway/sds_gateway/api_methods/tasks.py      |   5 +-
 .../api_methods/tests/factories.py            |  50 +++
 .../api_methods/tests/test_celery_tasks.py    |  49 +++
 .../tests/test_temporal_filtering.py          | 112 +++++
 .../js/actions/DownloadActionManager.js       | 415 ++++++++++++++----
 .../__tests__/DownloadActionManager.test.js   |  97 ++++
 gateway/sds_gateway/static/js/file-list.js    |   2 +
 .../users/partials/web_download_modal.html    | 172 +-------
 .../sds_gateway/users/tests/test_drf_views.py | 238 +++++++---
 gateway/sds_gateway/users/views.py            |  49 ++-
 12 files changed, 971 insertions(+), 338 deletions(-)
 create mode 100644 gateway/sds_gateway/api_methods/tests/test_temporal_filtering.py

diff --git a/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py b/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py
index 31e1845a2..e56eea898 100644
--- a/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py
+++ b/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py
@@ -2,6 +2,7 @@
 
 from django.db.models import QuerySet
 
+from opensearchpy.exceptions import NotFoundError as OpenSearchNotFoundError
 from sds_gateway.api_methods.models import CaptureType, Capture, File
 from sds_gateway.api_methods.utils.opensearch_client import get_opensearch_client
 from sds_gateway.api_methods.utils.relationship_utils import get_capture_files
@@ -45,11 +46,6 @@ def _catch_capture_type_error(capture_type: CaptureType) -> None:
         raise ValueError(msg)
 
 
-def _parse_drf_rf_timestamp(file_name: str) -> int | None:
-    """Extract timestamp in ms from a Digital RF data filename (alias for drf_rf_filename_to_ms)."""
-    return drf_rf_filename_to_ms(file_name)
-
-
 def get_capture_bounds(capture_type: CaptureType, capture_uuid: str) -> tuple[int, int]:
     """Get start and end bounds for capture from opensearch."""
     
@@ -60,22 +56,20 @@ def get_capture_bounds(capture_type: CaptureType, capture_uuid: str) -> tuple[in
 
     try:
         response = client.get(index=index, id=capture_uuid)
-    except Exception as e:
-        if getattr(e, "status_code", None) == 404 or (hasattr(e, "info") and e.info.get("status") == 404):
-            raise ValueError(
-                f"Capture {capture_uuid} not found in OpenSearch index {index}"
-            ) from e
-        raise
+    except OpenSearchNotFoundError as e:
+        raise ValueError(
+            f"Capture {capture_uuid} not found in OpenSearch index {index}"
+        ) from e
 
     if not response.get("found"):
         raise ValueError(
             f"Capture {capture_uuid} not found in OpenSearch index {index}"
         )
 
-    source = response["_source"]
-    search_props = source["search_props"]
-    start_time = search_props["start_time"]
-    end_time = search_props["end_time"]
+    source = response.get("_source", {})
+    search_props = source.get("search_props", {})
+    start_time = search_props.get("start_time", 0)
+    end_time = search_props.get("end_time", 0)
     return start_time, end_time
 
 
@@ -111,18 +105,6 @@ def get_file_cadence(capture_type: CaptureType, capture: Capture) -> int:
     return max(1, int(duration_ms / count))
 
 
-def get_duration_bounds(capture_type: CaptureType, capture_uuid: str, relative_time: int) -> tuple[int, int]:
-    """Return (0, length_of_capture_ms). OpenSearch bounds are in seconds."""
-    try:
-        start_time, end_time = get_capture_bounds(capture_type, capture_uuid)
-    except ValueError as e:
-        log.error(e)
-        raise e
-
-    length_of_capture_ms = (end_time - start_time) * 1000
-    return 0, length_of_capture_ms
-
-
 def filter_capture_data_files_selection_bounds(
     capture_type: CaptureType,
     capture: Capture,
@@ -131,7 +113,7 @@ def filter_capture_data_files_selection_bounds(
 ) -> QuerySet[File]:
     """Filter the capture file selection bounds to the given start and end times."""
     _catch_capture_type_error(capture_type)
-    epoch_start_sec, _ = get_capture_bounds(capture_type, capture.uuid)
+    epoch_start_sec, _ = get_capture_bounds(capture_type, str(capture.uuid))
     epoch_start_ms = epoch_start_sec * 1000
     start_ms = epoch_start_ms + start_time
     end_ms = epoch_start_ms + end_time
@@ -148,8 +130,8 @@ def filter_capture_data_files_selection_bounds(
 def get_capture_files_with_temporal_filter(
     capture_type: CaptureType,
     capture: Capture,
-    start_time: int | None = None, # milliseconds since epoch (start of capture)
-    end_time: int | None = None, # milliseconds since epoch
+    start_time: int | None = None, # milliseconds since start of capture
+    end_time: int | None = None,
 ) -> QuerySet[File]:
     """Get the capture files with temporal filtering."""
     _catch_capture_type_error(capture_type)
diff --git a/gateway/sds_gateway/api_methods/serializers/capture_serializers.py b/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
index d084a2441..5391d3c36 100644
--- a/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
+++ b/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
@@ -1,5 +1,6 @@
 """Capture serializers for the SDS Gateway API methods."""
 
+import logging
 from typing import Any
 from typing import cast
 
@@ -77,6 +78,7 @@ class CaptureGetSerializer(serializers.ModelSerializer[Capture]):
     file_cadence_ms = serializers.SerializerMethodField()
     capture_start_epoch_sec = serializers.SerializerMethodField()
     data_files_count = serializers.SerializerMethodField()
+    data_files_total_size = serializers.SerializerMethodField()
     per_data_file_size = serializers.SerializerMethodField()
     total_file_size = serializers.SerializerMethodField()
     formatted_created_at = serializers.SerializerMethodField()
@@ -134,22 +136,56 @@ def get_capture_start_epoch_sec(self, capture: Capture) -> int | None:
             return None
 
     @extend_schema_field(serializers.IntegerField)
-    def get_data_files_count(self, capture: Capture) -> int:
+    def get_data_files_count(self, capture: Capture) -> int | None:
         """Get the count of files associated with this capture."""
+        if capture.capture_type != CaptureType.DigitalRF:
+            return None
+        
         return get_data_files(capture.capture_type, capture).count()
-    
+
+    @extend_schema_field(serializers.IntegerField)
+    def get_data_files_total_size(self, capture: Capture) -> int | None:
+        """Exact sum of data file sizes; use this for consistent totals with total_file_size."""
+        if capture.capture_type != CaptureType.DigitalRF:
+            return None
+        data_files = get_data_files(capture.capture_type, capture)
+        result = data_files.aggregate(total_size=Sum("size"))
+        return result.get("total_size") or 0
+        
     @extend_schema_field(serializers.FloatField)
-    def get_per_data_file_size(self, capture: Capture) -> float:
+    def get_per_data_file_size(self, capture: Capture) -> float | None:
         """Get the size of each data file in the capture."""
-        data_file_sizes = get_data_files(capture.capture_type, capture).aggregate(total_size=Sum("size"))
-        return data_file_sizes["total_size"] / self.get_data_files_count(capture)
+        if capture.capture_type != CaptureType.DigitalRF:
+            return None
+        
+        data_files = get_data_files(capture.capture_type, capture)
+
+        if data_files.count() == 0:  
+            return None  
+
+        data_file_sizes = data_files.aggregate(total_size=Sum("size"))
+        total_size = data_file_sizes.get("total_size")  
+
+        if not total_size:  
+            return None  
 
+        return float(total_size) / data_files.count()
+        
     @extend_schema_field(serializers.IntegerField)
     def get_total_file_size(self, capture: Capture) -> int:
         """Get the total file size of all files associated with this capture."""
         all_files = get_capture_files(capture, include_deleted=False)
         result = all_files.aggregate(total_size=Sum("size"))
-        return result["total_size"] or 0
+        total = result["total_size"] or 0
+        if capture.capture_type == CaptureType.DigitalRF:
+            data_total = self.get_data_files_total_size(capture) or 0
+            if total < data_total:
+                logging.getLogger(__name__).warning(
+                    "Capture %s: total_file_size (%s) < data_files_total_size (%s); using data total.",
+                    str(capture.uuid), total, data_total,
+                )
+                total = data_total
+        return total
 
     @extend_schema_field(serializers.DictField)
     def get_capture_props(self, capture: Capture) -> dict[str, Any]:
@@ -341,6 +377,7 @@ class CompositeCaptureSerializer(serializers.Serializer):
     # Computed fields
     files = serializers.SerializerMethodField()
     data_files_count = serializers.SerializerMethodField()
+    data_files_total_size = serializers.SerializerMethodField()
     total_file_size = serializers.SerializerMethodField()
     formatted_created_at = serializers.SerializerMethodField()
     length_of_capture_ms = serializers.SerializerMethodField()
@@ -363,8 +400,11 @@ def get_files(self, obj: dict[str, Any]) -> ReturnList[File]:
         return cast("ReturnList[File]", all_files)
 
     @extend_schema_field(serializers.IntegerField)
-    def get_data_files_count(self, obj: dict[str, Any]) -> int:
+    def get_data_files_count(self, obj: dict[str, Any]) -> int | None:
         """Get the total count of files across all channels."""
+        if obj["capture_type"] != CaptureType.DigitalRF:
+            return None
+        
         total_count = 0
         for channel_data in obj["channels"]:
             capture_uuid = channel_data["uuid"]
@@ -372,9 +412,26 @@ def get_data_files_count(self, obj: dict[str, Any]) -> int:
             total_count += get_data_files(capture.capture_type, capture).count()
         return total_count
 
+    @extend_schema_field(serializers.IntegerField)
+    def get_data_files_total_size(self, obj: dict[str, Any]) -> int | None:
+        """Exact sum of data file sizes across all channels."""
+        if obj["capture_type"] != CaptureType.DigitalRF:
+            return None
+        total = 0
+        for channel_data in obj["channels"]:
+            capture_uuid = channel_data["uuid"]
+            capture = Capture.objects.get(uuid=capture_uuid)
+            data_files = get_data_files(capture.capture_type, capture)
+            result = data_files.aggregate(total_size=Sum("size"))
+            total += result.get("total_size") or 0
+        return total
+
     @extend_schema_field(serializers.IntegerField)
     def get_total_file_size(self, obj: dict[str, Any]) -> int:
         """Get the total file size across all channels."""
+        if obj["capture_type"] != CaptureType.DigitalRF:
+            return None
+        
         total_size = 0
         for channel_data in obj["channels"]:
             capture_uuid = channel_data["uuid"]
@@ -382,6 +439,13 @@ def get_total_file_size(self, obj: dict[str, Any]) -> int:
             all_files = get_capture_files(capture, include_deleted=False)
             result = all_files.aggregate(total_size=Sum("size"))
             total_size += result["total_size"] or 0
+        data_total = self.get_data_files_total_size(obj) or 0
+        if total_size < data_total:
+            logging.getLogger(__name__).warning(
+                "Composite capture: total_file_size (%s) < data_files_total_size (%s); using data total.",
+                total_size, data_total,
+            )
+            total_size = data_total
         return total_size
 
     @extend_schema_field(serializers.CharField)
diff --git a/gateway/sds_gateway/api_methods/tasks.py b/gateway/sds_gateway/api_methods/tasks.py
index 93b0a5f1a..440b7dfb7 100644
--- a/gateway/sds_gateway/api_methods/tasks.py
+++ b/gateway/sds_gateway/api_methods/tasks.py
@@ -1301,7 +1301,7 @@ def _get_item_files(
         files_queryset = get_dataset_files_including_captures(
             item, include_deleted=False
         )
-        files = list(files_queryset)  # Convert to list before len() to avoid SQL issues
+        files = list(files_queryset)
         log.info(f"Found {len(files)} files for dataset {item.uuid}")
         return files
 
@@ -1327,8 +1327,9 @@ def _get_item_files(
                 include_deleted=False,
             )
 
+        files = list(files)
         log.info(f"Found {len(files)} files for capture {item.uuid}")
-        return list(files)
+        return files
 
     log.warning(f"Unknown item type: {item_type}")
     return []
diff --git a/gateway/sds_gateway/api_methods/tests/factories.py b/gateway/sds_gateway/api_methods/tests/factories.py
index 3503cf4af..d52e6e80d 100644
--- a/gateway/sds_gateway/api_methods/tests/factories.py
+++ b/gateway/sds_gateway/api_methods/tests/factories.py
@@ -15,8 +15,11 @@
 from django.core.files.base import ContentFile
 from factory import Faker
 from factory import post_generation
+from factory import Sequence
 from factory.django import DjangoModelFactory
 
+from sds_gateway.api_methods.helpers.temporal_filtering import drf_rf_filename_from_ms
+from sds_gateway.api_methods.models import Capture
 from sds_gateway.api_methods.models import Dataset
 from sds_gateway.api_methods.models import File
 from sds_gateway.api_methods.models import ItemType
@@ -223,6 +226,53 @@ class Meta:
         model = File
 
 
+class CaptureFactory(DjangoModelFactory):
+    class Meta:
+        model = Capture
+
+    channel = Faker("word")
+    capture_type = "drf"
+    top_level_dir = Faker("file_path", depth=2).replace("/", "_")
+    owner = Faker("subfactory", factory=UserFactory)
+    name = Faker("slug")
+    index_name = "captures-drf"
+
+
+class DRFDataFileFactory(DjangoModelFactory):
+    """Factory for creating DRF data file instances for testing.
+    
+    This factory creates realistic DRF data file objects that represent files stored in the system.
+    It generates test data for file metadata and creates a Django ContentFile for the actual file content.
+    
+    The factory creates files with realistic metadata including size, checksums, and proper file extensions.
+    It also handles the creation of the Django file field with test content.
+    """
+
+    uuid = Faker("uuid4")
+    directory = f"/files/{self.owner.email}/{self.capture.top_level_dir}/"
+    name = Sequence(lambda n: drf_rf_filename_from_ms(1000 + n * 1000))
+    media_type = "application/x-hdf5"
+    permissions = "rw-r----"
+    size = Faker("random_int", min=1000, max=1000000)
+    sum_blake3 = Faker("sha256")
+    owner = Faker("subfactory", factory=UserFactory)
+    capture = Faker("subfactory", factory=CaptureFactory)
+    is_deleted = False
+
+    @post_generation
+    def file(self, create, extracted, **kwargs):
+        if not create:
+            return
+        if extracted:
+            self.file = extracted
+        else:
+            content = b"test drf file content"
+            self.file = ContentFile(content, name=self.name)
+
+    class Meta:
+        model = File
+
+
 class UserSharePermissionFactory(DjangoModelFactory):
     """Factory for creating UserSharePermission instances for testing.
 
diff --git a/gateway/sds_gateway/api_methods/tests/test_celery_tasks.py b/gateway/sds_gateway/api_methods/tests/test_celery_tasks.py
index d5c6fba3a..7f5f16d1d 100644
--- a/gateway/sds_gateway/api_methods/tests/test_celery_tasks.py
+++ b/gateway/sds_gateway/api_methods/tests/test_celery_tasks.py
@@ -36,6 +36,7 @@
 from sds_gateway.api_methods.tasks import get_user_task_status
 from sds_gateway.api_methods.tasks import is_user_locked
 from sds_gateway.api_methods.tasks import release_user_lock
+from sds_gateway.api_methods.tasks import _get_item_files
 from sds_gateway.api_methods.tasks import send_item_files_email
 from sds_gateway.api_methods.utils.disk_utils import estimate_disk_size
 
@@ -1232,3 +1233,51 @@ def test_large_file_download_redirects_to_sdk(self):
             assert result["status"] == "error"
             assert "SDK" in result["message"]
             assert "GB" in result["message"]  # Check for GB in general
+
+    def test_get_item_files_with_temporal_bounds_returns_expected_rf_subset(self):
+        """
+        Task-level test: start_time/end_time flow into _get_item_files and the helper
+        returns only the expected DRF data files in range (temporal_filtering logic
+        is unit-tested in test_temporal_filtering.py).
+        """
+        # Create DRF-named files for self.capture (epoch 1s..5s)
+        epoch_start_sec = 1
+        epoch_end_sec = 6
+        for i in range(epoch_start_sec, epoch_end_sec):
+            name = f"rf@{i}.000.h5"
+            content = ContentFile(b"x", name=name)
+            File.objects.create(
+                name=name,
+                size=100,
+                directory=self.top_level_dir,
+                owner=self.user,
+                capture=self.capture,
+                file=content,
+                sum_blake3="a" * 64,
+            )
+        # Link to capture via FK (get_capture_files uses both M2M and FK)
+        mock_response = {
+            "found": True,
+            "_source": {
+                "search_props": {
+                    "start_time": epoch_start_sec,
+                    "end_time": epoch_end_sec,
+                }
+            },
+        }
+        with patch(
+            "sds_gateway.api_methods.helpers.temporal_filtering.get_opensearch_client"
+        ) as m:
+            m.return_value.get.return_value = mock_response
+            # Relative ms: 1000–4000 ms from start → files rf@1.000.h5 .. rf@4.000.h5
+            result = _get_item_files(
+                self.user,
+                self.capture,
+                ItemType.CAPTURE,
+                start_time=1000,
+                end_time=4000,
+            )
+        names = [f.name for f in result]
+        # start_time=1000, end_time=4000 → absolute 2s..5s → rf@2.000.h5 .. rf@5.000.h5
+        expected = [f"rf@{i}.000.h5" for i in range(2, 6)]
+        assert names == expected, f"Expected {expected}, got {names}"
diff --git a/gateway/sds_gateway/api_methods/tests/test_temporal_filtering.py b/gateway/sds_gateway/api_methods/tests/test_temporal_filtering.py
new file mode 100644
index 000000000..a9d5d8c53
--- /dev/null
+++ b/gateway/sds_gateway/api_methods/tests/test_temporal_filtering.py
@@ -0,0 +1,112 @@
+import time
+
+from unittest.mock import patch
+from django.test import TestCase
+
+import sds_gateway.api_methods.helpers.temporal_filtering as temporal_filtering
+from sds_gateway.api_methods.models import Capture, CaptureType
+
+from sds_gateway.api_methods.tests.factories import CaptureFactory, DRFDataFileFactory, UserFactory
+
+
+class TemporalFilteringTestCase(TestCase):
+    def setUp(self):
+        # get unix timestamp for now
+        self.now = int(time.time())
+        self.file_count = 10
+        self.user = UserFactory()
+        self.capture = CaptureFactory(owner=self.user, capture_type="drf")
+
+        # Create 5 DRF data files in sequence with 1 second interval
+        self.files = [
+            DRFDataFileFactory(
+                capture=self.capture,
+                owner=self.user,
+                name=f"rf@{self.now + i}.000.h5",
+            )
+            for i in range(self.file_count)
+        ]
+
+    def _get_test_capture_bounds(self):
+        start_sec = int(self.now)
+        end_sec = start_sec + 10  # 10 second span
+        return start_sec, end_sec
+
+    def test_rf_filename_ms_conversion(self):
+        for i in range(10):
+            expected_ms = (self.now + i) * 1000
+            filename_to_ms = temporal_filtering.drf_rf_filename_to_ms(self.files[i].name)
+            assert filename_to_ms is not None
+            assert filename_to_ms == expected_ms
+
+            ms_to_filename = temporal_filtering.drf_rf_filename_from_ms(expected_ms)
+            assert ms_to_filename is not None
+            assert ms_to_filename == self.files[i].name
+    
+    def test_get_capture_bounds(self):
+        start_sec, end_sec = self._get_test_capture_bounds()
+        # mock response, opensearch calls are tested in test_opensearch.py
+        mock_response = {
+            "found": True,
+            "_source": {
+                "search_props": {
+                    "start_time": start_sec,
+                    "end_time": end_sec,
+                }
+            },
+        }
+        with patch("sds_gateway.api_methods.helpers.temporal_filtering.get_opensearch_client") as m:
+            m.return_value.get.return_value = mock_response
+            start_time, end_time = temporal_filtering.get_capture_bounds(
+                self.capture.capture_type, str(self.capture.uuid)
+            )
+        assert start_time is not None
+        assert end_time is not None
+        assert start_time == start_sec
+        assert end_time == end_sec
+    
+    def test_get_file_cadence(self):
+        start_sec, end_sec = self._get_test_capture_bounds()
+        # mock response, opensearch calls are tested in test_opensearch.py
+        mock_response = {
+            "found": True,
+            "_source": {
+                "search_props": {
+                    "start_time": start_sec,
+                    "end_time": end_sec,
+                }
+            },
+        }
+        with patch("sds_gateway.api_methods.helpers.temporal_filtering.get_opensearch_client") as m:
+            m.return_value.get.return_value = mock_response
+            file_cadence = temporal_filtering.get_file_cadence(
+                self.capture.capture_type, self.capture
+            )
+            expected_cadence = max(1, int((end_sec - start_sec) * 1000 / (self.file_count - 1)))
+            assert file_cadence is not None
+            assert file_cadence == expected_cadence
+
+    def test_file_filtering(self):
+        start_ms = 1000
+        end_ms = 5000
+        # Inclusive range: 1s, 2s, 3s, 4s, 5s -> 5 files
+        expected_count = (end_ms - start_ms) // 1000 + 1
+        start_sec, end_sec = self._get_test_capture_bounds()
+        mock_response = {
+            "found": True,
+            "_source": {
+                "search_props": {
+                    "start_time": start_sec,
+                    "end_time": end_sec,
+                }
+            },
+        }
+        with patch("sds_gateway.api_methods.helpers.temporal_filtering.get_opensearch_client") as m:
+            m.return_value.get.return_value = mock_response
+            filtered_files = temporal_filtering.filter_capture_data_files_selection_bounds(
+                self.capture.capture_type, self.capture, start_ms, end_ms
+            )
+        assert filtered_files is not None
+        assert len(filtered_files) == expected_count
+        for i in range(expected_count):
+            assert filtered_files[i].name == self.files[1 + i].name
diff --git a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
index 766e9e520..cb2da7332 100644
--- a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
+++ b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
@@ -2,6 +2,84 @@
  * Download Action Manager
  * Handles all download-related actions
  */
+
+function msToHms(ms) {
+	const n = Number(ms);
+	if (!Number.isFinite(n) || n < 0) return "0:00:00.000";
+	const totalSec = Math.floor(n / 1000);
+	const h = Math.floor(totalSec / 3600);
+	const m = Math.floor((totalSec % 3600) / 60);
+	const s = totalSec % 60;
+	const decimalMs = n % 1000;
+	const hms = [h, m, s].map((v) => String(v).padStart(2, "0")).join(":");
+	return hms + "." + String(decimalMs).padStart(3, "0");
+}
+
+function formatBytes(bytes) {
+	const n = Number(bytes);
+	if (!Number.isFinite(n) || n < 0) return "0 bytes";
+	if (n === 0) return "0 bytes";
+	const units = ["bytes", "KB", "MB", "GB"];
+	let i = 0;
+	let v = n;
+	while (v >= 1024 && i < units.length - 1) {
+		v /= 1024;
+		i++;
+	}
+	return (i === 0 ? v : v.toFixed(2)) + " " + units[i];
+}
+
+function formatUtcRange(startEpochSec, startMs, endMs) {
+	if (!Number.isFinite(startEpochSec)) return "—";
+	const startDate = new Date(startEpochSec * 1000 + startMs);
+	const endDate = new Date(startEpochSec * 1000 + endMs);
+	const pad2 = (x) => String(x).padStart(2, "0");
+	const fmt = (d) =>
+		pad2(d.getUTCHours()) +
+		":" +
+		pad2(d.getUTCMinutes()) +
+		":" +
+		pad2(d.getUTCSeconds()) +
+		" " +
+		pad2(d.getUTCMonth() + 1) +
+		"/" +
+		pad2(d.getUTCDate()) +
+		"/" +
+		d.getUTCFullYear();
+	return fmt(startDate) + " - " + fmt(endDate) + " (UTC)";
+}
+
+/** Format ms from capture start as datetime-local value (local time). */
+function msToDatetimeLocal(captureStartEpochSec, ms) {
+	if (!Number.isFinite(captureStartEpochSec) || !Number.isFinite(ms)) return "";
+	const d = new Date(captureStartEpochSec * 1000 + ms);
+	const pad2 = (x) => String(x).padStart(2, "0");
+	const pad3 = (x) => String(x).padStart(3, "0");
+	return (
+		d.getFullYear() +
+		"-" +
+		pad2(d.getMonth() + 1) +
+		"-" +
+		pad2(d.getDate()) +
+		"T" +
+		pad2(d.getHours()) +
+		":" +
+		pad2(d.getMinutes()) +
+		":" +
+		pad2(d.getSeconds()) +
+		"." +
+		pad3(d.getMilliseconds())
+	);
+}
+
+/** Parse datetime-local value to ms from capture start (UTC epoch sec). */
+function datetimeLocalToMs(captureStartEpochSec, valueStr) {
+	if (!Number.isFinite(captureStartEpochSec) || !valueStr || !valueStr.trim()) return NaN;
+	const d = new Date(valueStr.trim());
+	if (Number.isNaN(d.getTime())) return NaN;
+	return d.getTime() - captureStartEpochSec * 1000;
+}
+
 class DownloadActionManager {
 	/**
 	 * Initialize download action manager
@@ -27,6 +105,9 @@ class DownloadActionManager {
 
 		// Initialize SDK download modal buttons
 		this.initializeSDKDownloadButtons();
+
+		// Web download modal (dataset + capture)
+		this.initializeWebDownloadModal();
 	}
 
 	/**
@@ -94,12 +175,166 @@ class DownloadActionManager {
 		}
 	}
 
-	    /**
-     * Initialize or update the capture download temporal slider. Call before
+	/**
+	 * Initialize web download modal: confirm button click and modal hidden handler.
+	 * Exposes showWebDownloadModal on window for template callbacks.
+	 */
+	initializeWebDownloadModal() {
+		const webDownloadModal = document.getElementById("webDownloadModal");
+		const confirmWebDownloadBtn = document.getElementById("confirmWebDownloadBtn");
+		if (!webDownloadModal || !confirmWebDownloadBtn) return;
+
+		confirmWebDownloadBtn.addEventListener("click", () => {
+			const itemType = confirmWebDownloadBtn.dataset.itemType || "dataset";
+			const uuid = confirmWebDownloadBtn.dataset.itemUuid || confirmWebDownloadBtn.dataset.datasetUuid;
+
+			if (!uuid) return;
+
+			const startTimeInput = document.getElementById("startTime");
+			const endTimeInput = document.getElementById("endTime");
+			const startEntry = document.getElementById("startTimeEntry");
+			const endEntry = document.getElementById("endTimeEntry");
+			const modalEl = document.getElementById("webDownloadModal");
+
+			if (startEntry && endEntry && modalEl && modalEl.dataset.durationMs) {
+				const entryStart = startEntry.value.trim();
+				const entryEnd = endEntry.value.trim();
+				if (entryStart !== "" || entryEnd !== "") {
+					const durationMs = parseInt(modalEl.dataset.durationMs, 10);
+					const startMs = entryStart === "" ? 0 : parseInt(entryStart, 10);
+					const endMs = entryEnd === "" ? durationMs : parseInt(entryEnd, 10);
+					if (
+						!Number.isFinite(startMs) ||
+						!Number.isFinite(endMs) ||
+						startMs < 0 ||
+						endMs > durationMs ||
+						startMs >= endMs
+					) {
+						this.showToast(
+							"Please enter valid start/end times (0 ≤ start < end ≤ " + durationMs + " ms).",
+							"warning",
+						);
+						return;
+					}
+					if (startTimeInput) startTimeInput.value = String(startMs);
+					if (endTimeInput) endTimeInput.value = String(endMs);
+				}
+			}
+
+			const labels = this.getWebDownloadModalLabels(itemType);
+			confirmWebDownloadBtn.innerHTML = '<i class="bi bi-hourglass-split"></i> Processing...';
+			confirmWebDownloadBtn.disabled = true;
+
+			const url = "/users/download-item/" + itemType + "/" + uuid + "/";
+			const headers = {
+				"X-CSRFToken": document.querySelector("[name=csrfmiddlewaretoken]")?.value,
+			};
+			let body = null;
+			if (startTimeInput && endTimeInput && startTimeInput.value && endTimeInput.value) {
+				headers["Content-Type"] = "application/x-www-form-urlencoded";
+				body = new URLSearchParams({
+					start_time: startTimeInput.value,
+					end_time: endTimeInput.value,
+				});
+			} else {
+				headers["Content-Type"] = "application/json";
+			}
+
+			fetch(url, { method: "POST", headers, body })
+				.then((response) => {
+					const contentType = response.headers.get("content-type");
+					if (contentType && contentType.includes("application/json")) {
+						return response.json();
+					}
+					return response.text().then((text) => {
+						throw new Error("Server returned non-JSON response: " + text);
+					});
+				})
+				.then((data) => {
+					if (data.success === true) {
+						this.showToast(
+							data.message ||
+								"Download request submitted successfully! You will receive an email when ready.",
+							"success",
+						);
+						const modal = bootstrap.Modal.getInstance(webDownloadModal);
+						if (modal) modal.hide();
+					} else {
+						this.showToast(
+							"Error requesting download: " + (data.message || "Unknown error"),
+							"danger",
+						);
+					}
+				})
+				.catch((error) => {
+					console.error("Download error:", error);
+					this.showToast(
+						error.message || "An error occurred while processing your request.",
+						"danger",
+					);
+				})
+				.finally(() => {
+					confirmWebDownloadBtn.innerHTML =
+						'<i class="bi bi-download"></i> ' + labels.confirmText;
+					confirmWebDownloadBtn.disabled = false;
+				});
+		});
+
+		webDownloadModal.addEventListener("hidden.bs.modal", () => {
+			confirmWebDownloadBtn.dataset.itemType = "";
+			confirmWebDownloadBtn.dataset.itemUuid = "";
+			confirmWebDownloadBtn.dataset.itemName = "";
+			confirmWebDownloadBtn.dataset.datasetUuid = "";
+			confirmWebDownloadBtn.dataset.datasetName = "";
+			const nameEl = document.getElementById("webDownloadDatasetName");
+			if (nameEl) nameEl.textContent = "";
+		});
+
+		window.showWebDownloadModal = (a1, a2) => {
+			const options =
+				typeof a1 === "string" && a2 !== undefined
+					? { itemType: "dataset", uuid: a1, name: a2 }
+					: a1;
+			this.showWebDownloadModal(options);
+		};
+	}
+
+	/**
+	 * Open web download modal for a dataset or capture.
+	 * @param {{ itemType?: string, uuid: string, name?: string }} options - itemType 'dataset'|'capture', uuid, name
+	 */
+	showWebDownloadModal(options) {
+		const { itemType = "dataset", uuid, name } = options || {};
+		const nameEl = document.getElementById("webDownloadDatasetName");
+		const confirmBtn = document.getElementById("confirmWebDownloadBtn");
+		const modalEl = document.getElementById("webDownloadModal");
+		const titleEl = document.getElementById("webDownloadModalLabel");
+
+		if (nameEl) nameEl.textContent = name || "";
+		if (confirmBtn) {
+			confirmBtn.dataset.itemType = itemType;
+			confirmBtn.dataset.itemUuid = uuid || "";
+			confirmBtn.dataset.itemName = name || "";
+		}
+		// Update title and button text from item type
+		const labels = this.getWebDownloadModalLabels(itemType);
+		if (titleEl && window.DOMUtils) {
+			window.DOMUtils.renderContent(titleEl, { icon: "download", text: labels.title });
+		}
+		if (confirmBtn && window.DOMUtils) {
+			window.DOMUtils.renderContent(confirmBtn, { icon: "download", text: labels.confirmText });
+		}
+		if (modalEl && window.bootstrap) {
+			new bootstrap.Modal(modalEl).show();
+		}
+	}
+
+	/**
+	 * Initialize or update the capture download temporal slider. Call before
      * showing the modal when opening for a capture with known bounds.
      * @param {number} durationMs - Total capture duration in milliseconds
      * @param {number} fileCadenceMs - File cadence in milliseconds (step)
-     * @param {Object} opts - Optional: { perDataFileSize, totalSize, dataFilesCount, totalFilesCount, captureStartEpochSec }
+     * @param {Object} opts - Optional: { perDataFileSize, totalSize, dataFilesCount, totalFilesCount, dataFilesTotalSize, captureUuid, captureStartEpochSec }
      */
 	initializeCaptureDownloadSlider(durationMs, fileCadenceMs, opts) {
 		opts = opts || {};
@@ -113,7 +348,10 @@ class DownloadActionManager {
 		var endTimeInput = document.getElementById('endTime');
 		var startTimeEntry = document.getElementById('startTimeEntry');
 		var endTimeEntry = document.getElementById('endTimeEntry');
+		var startDateTimeEntry = document.getElementById('startDateTimeEntry');
+		var endDateTimeEntry = document.getElementById('endDateTimeEntry');
 		var rangeHintEl = document.getElementById('temporalRangeHint');
+		var sizeWarningEl = document.getElementById('temporalFilterSizeWarning');
 		var webDownloadModal = document.getElementById('webDownloadModal');
 		if (!sliderEl || typeof noUiSlider === 'undefined') return;
 		durationMs = Number(durationMs);
@@ -124,11 +362,33 @@ class DownloadActionManager {
 		var totalSize = Number(opts.totalSize) || 0;
 		var dataFilesCount = Number(opts.dataFilesCount) || 0;
 		var totalFilesCount = Number(opts.totalFilesCount) || 0;
-		var dataFilesTotalSize = perDataFileSize * dataFilesCount;
+		var dataFilesTotalSize = Number(opts.dataFilesTotalSize);
+		if (!Number.isFinite(dataFilesTotalSize) || dataFilesTotalSize < 0) {
+			dataFilesTotalSize = perDataFileSize * dataFilesCount;
+		}
 		var metadataFilesTotalSize = totalSize - dataFilesTotalSize;
-		var metadataFilesCount = totalFilesCount - dataFilesCount;
+		if (metadataFilesTotalSize < 0) metadataFilesTotalSize = 0;
+		var metadataFilesCount = Math.max(0, totalFilesCount - dataFilesCount);
+		var captureUuid = opts.captureUuid != null ? String(opts.captureUuid) : '';
 		var captureStartEpochSec = Number(opts.captureStartEpochSec);
-		if (webDownloadModal) webDownloadModal.dataset.durationMs = String(Math.round(durationMs));
+		if (totalSize > 0 && dataFilesTotalSize > totalSize) {
+			console.warn(
+				'[DownloadActionManager] data files total size exceeds total size (backend/query inconsistency).',
+				{ captureUuid: captureUuid || '(unknown)', totalSize, dataFilesTotalSize, perDataFileSize, dataFilesCount }
+			);
+			if (sizeWarningEl) {
+				sizeWarningEl.classList.remove('d-none');
+			}
+			dataFilesTotalSize = totalSize;
+			metadataFilesTotalSize = 0;
+		} else if (sizeWarningEl) {
+			sizeWarningEl.classList.add('d-none');
+		}
+		if (webDownloadModal) {
+			webDownloadModal.dataset.durationMs = String(Math.round(durationMs));
+			webDownloadModal.dataset.fileCadenceMs = String(fileCadenceMs);
+			webDownloadModal.dataset.captureStartEpochSec = Number.isFinite(captureStartEpochSec) ? String(captureStartEpochSec) : '';
+		}
 		if (rangeHintEl) rangeHintEl.textContent = '0 – ' + Math.round(durationMs) + ' ms';
 		if (sliderEl.noUiSlider) {
 			sliderEl.noUiSlider.destroy();
@@ -141,6 +401,15 @@ class DownloadActionManager {
 		if (endTimeInput) endTimeInput.value = '';
 		if (startTimeEntry) startTimeEntry.value = '';
 		if (endTimeEntry) endTimeEntry.value = '';
+		var hasEpoch = Number.isFinite(captureStartEpochSec);
+		if (startDateTimeEntry) {
+			startDateTimeEntry.value = '';
+			startDateTimeEntry.disabled = !hasEpoch;
+		}
+		if (endDateTimeEntry) {
+			endDateTimeEntry.value = '';
+			endDateTimeEntry.disabled = !hasEpoch;
+		}
 		if (durationMs <= 0) return;
 		noUiSlider.create(sliderEl, {
 			start: [0, durationMs],
@@ -174,6 +443,10 @@ class DownloadActionManager {
 			if (endTimeInput) endTimeInput.value = String(Math.round(endMs));
 			if (startTimeEntry) startTimeEntry.value = String(Math.round(startMs));
 			if (endTimeEntry) endTimeEntry.value = String(Math.round(endMs));
+			if (hasEpoch) {
+				if (startDateTimeEntry) startDateTimeEntry.value = msToDatetimeLocal(captureStartEpochSec, startMs);
+				if (endDateTimeEntry) endDateTimeEntry.value = msToDatetimeLocal(captureStartEpochSec, endMs);
+			}
 		});
 		if (rangeLabel) {
 			rangeLabel.textContent = '0:00:00.000 - ' + msToHms(durationMs);
@@ -197,6 +470,12 @@ class DownloadActionManager {
 		if (endTimeInput) endTimeInput.value = endVal;
 		if (startTimeEntry) startTimeEntry.value = startVal;
 		if (endTimeEntry) endTimeEntry.value = endVal;
+		if (hasEpoch && startDateTimeEntry && endDateTimeEntry) {
+			startDateTimeEntry.value = msToDatetimeLocal(captureStartEpochSec, 0);
+			endDateTimeEntry.value = msToDatetimeLocal(captureStartEpochSec, durationMs);
+			startDateTimeEntry.disabled = false;
+			endDateTimeEntry.disabled = false;
+		}
 
 		function syncSliderFromEntries() {
 			if (!sliderEl.noUiSlider || !startTimeEntry || !endTimeEntry) return;
@@ -211,8 +490,34 @@ class DownloadActionManager {
 			if (startMs >= endMs) endMs = Math.min(startMs + fileCadenceMs, durationMs);
 			sliderEl.noUiSlider.set([startMs, endMs]);
 		}
+		function syncFromDateTimeEntries() {
+			if (!hasEpoch || !sliderEl.noUiSlider || !startDateTimeEntry || !endDateTimeEntry) return;
+			var startMs = datetimeLocalToMs(captureStartEpochSec, startDateTimeEntry.value);
+			var endMs = datetimeLocalToMs(captureStartEpochSec, endDateTimeEntry.value);
+			if (Number.isNaN(startMs) || Number.isNaN(endMs)) return;
+			startMs = Math.max(0, Math.min(startMs, durationMs));
+			endMs = Math.max(0, Math.min(endMs, durationMs));
+			if (startMs >= endMs) endMs = Math.min(startMs + fileCadenceMs, durationMs);
+			sliderEl.noUiSlider.set([startMs, endMs]);
+		}
 		if (startTimeEntry) startTimeEntry.addEventListener('change', syncSliderFromEntries);
 		if (endTimeEntry) endTimeEntry.addEventListener('change', syncSliderFromEntries);
+		if (startDateTimeEntry) startDateTimeEntry.addEventListener('change', syncFromDateTimeEntries);
+		if (endDateTimeEntry) endDateTimeEntry.addEventListener('change', syncFromDateTimeEntries);
+	}
+
+	/**
+	 * Labels for web download modal by item type (dataset vs capture).
+	 * @param {string} itemType - 'dataset' or 'capture'
+	 * @returns {{ title: string, confirmText: string }}
+	 */
+	getWebDownloadModalLabels(itemType) {
+		const t = (itemType || "dataset").toLowerCase();
+		return {
+			title: t === "capture" ? "Download Capture" : "Download Dataset",
+			confirmText:
+				t === "capture" ? "Yes, Download Capture" : "Yes, Download Dataset",
+		};
 	}
 
 	/**
@@ -313,87 +618,30 @@ class DownloadActionManager {
 			return;
 		}
 
-		const confirmBtn = document.getElementById(
-			`confirmWebDownloadBtn-${captureUuid}`,
-		);
+		const labels = this.getWebDownloadModalLabels("capture");
+		const modalTitleElement = document.getElementById("webDownloadModalLabel");
+		const modalNameElement = document.getElementById("webDownloadDatasetName");
+		const confirmBtn = document.getElementById("confirmWebDownloadBtn");
 
-		if (!confirmBtn) {
-			console.warn(
-				`Web download confirm button not found for capture ${captureUuid}`,
-			);
-			return;
+		if (modalTitleElement) {
+			await window.DOMUtils.renderContent(modalTitleElement, {
+				icon: "download",
+				text: labels.title,
+			});
 		}
 
 		const newConfirmBtn = confirmBtn.cloneNode(true);
 		confirmBtn.parentNode.replaceChild(newConfirmBtn, confirmBtn);
 
-		const originalRowButtonContent = button?.innerHTML;
-
-		newConfirmBtn.onclick = async () => {
-			window.DOMUtils.closeModal(modalId);
-
-			if (button) {
-				await window.DOMUtils.renderLoading(button, "Processing...", {
-					format: "spinner",
-					size: "sm",
-				});
-				button.disabled = true;
-			}
-
-			try {
-				const response = await window.APIClient.post(
-					`/users/download-item/capture/${captureUuid}/`,
-					{},
-				);
-
-				if (response.success === true) {
-					if (button) {
-						await window.DOMUtils.renderContent(button, {
-							icon: "check-circle",
-							color: "success",
-							text: "Download Requested",
-						});
-					}
-					this.showToast(
-						response.message ||
-							"Download request submitted successfully! You will receive an email when ready.",
-						"success",
-					);
-				} else {
-					if (button) {
-						await window.DOMUtils.renderContent(button, {
-							icon: "exclamation-triangle",
-							color: "danger",
-							text: "Request Failed",
-						});
-					}
-					this.showToast(
-						response.message || "Download request failed. Please try again.",
-						"danger",
-					);
-				}
-			} catch (error) {
-				console.error("Download error:", error);
-				if (button) {
-					await window.DOMUtils.renderContent(button, {
-						icon: "exclamation-triangle",
-						color: "danger",
-						text: "Request Failed",
-					});
-				}
-				this.showToast(
-					error.message || "An error occurred while processing your request.",
-					"danger",
-				);
-			} finally {
-				if (button && originalRowButtonContent !== undefined) {
-					setTimeout(() => {
-						button.innerHTML = originalRowButtonContent;
-						button.disabled = false;
-					}, 3000);
-				}
-			}
-		};
+		if (confirmBtn) {
+			await window.DOMUtils.renderContent(confirmBtn, {
+				icon: "download",
+				text: labels.confirmText,
+			});
+			confirmBtn.dataset.itemType = "capture";
+			confirmBtn.dataset.itemUuid = captureUuid;
+			confirmBtn.dataset.itemName = captureName || "Unnamed Capture";
+		}
 
 		// Initialize temporal slider from button data attributes (clears or builds slider)
 		const durationMs = parseInt(button.getAttribute("data-length-of-capture-ms"), 10);
@@ -402,7 +650,10 @@ class DownloadActionManager {
 		const totalSize = parseInt(button.getAttribute("data-total-size"), 10);
 		const dataFilesCount = parseInt(button.getAttribute("data-data-files-count"), 10);
 		const totalFilesCount = parseInt(button.getAttribute("data-total-files-count"), 10);
+		const dataFilesTotalSizeRaw = button.getAttribute("data-data-files-total-size");
+		const dataFilesTotalSize = dataFilesTotalSizeRaw !== null && dataFilesTotalSizeRaw !== '' ? parseInt(dataFilesTotalSizeRaw, 10) : NaN;
 		const captureStartEpochSec = parseInt(button.getAttribute("data-capture-start-epoch-sec"), 10);
+		const captureUuid = button.getAttribute("data-capture-uuid") || undefined;
 		this.initializeCaptureDownloadSlider(
 			Number.isNaN(durationMs) ? 0 : durationMs,
 			Number.isNaN(fileCadenceMs) ? 1000 : fileCadenceMs,
@@ -411,6 +662,8 @@ class DownloadActionManager {
 				totalSize: Number.isNaN(totalSize) ? 0 : totalSize,
 				dataFilesCount: Number.isNaN(dataFilesCount) ? 0 : dataFilesCount,
 				totalFilesCount: Number.isNaN(totalFilesCount) ? 0 : totalFilesCount,
+				dataFilesTotalSize: Number.isNaN(dataFilesTotalSize) ? undefined : dataFilesTotalSize,
+				captureUuid: captureUuid,
 				captureStartEpochSec: Number.isNaN(captureStartEpochSec) ? undefined : captureStartEpochSec,
 			},
 		);
diff --git a/gateway/sds_gateway/static/js/actions/__tests__/DownloadActionManager.test.js b/gateway/sds_gateway/static/js/actions/__tests__/DownloadActionManager.test.js
index 8db67530c..29944286f 100644
--- a/gateway/sds_gateway/static/js/actions/__tests__/DownloadActionManager.test.js
+++ b/gateway/sds_gateway/static/js/actions/__tests__/DownloadActionManager.test.js
@@ -352,6 +352,103 @@ describe("DownloadActionManager", () => {
 		});
 	});
 
+	describe("initializeCaptureDownloadSlider", () => {
+		let mockSliderEl;
+		let mockNoUiSliderCreate;
+		let mockSliderInstance;
+
+		beforeEach(() => {
+			downloadManager = new DownloadActionManager({
+				permissions: mockPermissions,
+			});
+			mockSliderInstance = {
+				on: jest.fn(),
+				destroy: jest.fn(),
+				set: jest.fn(),
+			};
+			mockSliderEl = {
+				noUiSlider: null,
+				dataset: {},
+			};
+			mockNoUiSliderCreate = jest.fn(() => {
+				mockSliderEl.noUiSlider = mockSliderInstance;
+			});
+		});
+
+		test("should return early when temporalFilterSlider element is missing", () => {
+			document.getElementById = jest.fn((id) => {
+				if (id === "temporalFilterSlider") return null;
+				return {};
+			});
+			global.noUiSlider = { create: mockNoUiSliderCreate };
+
+			expect(() => {
+				downloadManager.initializeCaptureDownloadSlider(10000, 1000, {});
+			}).not.toThrow();
+			expect(mockNoUiSliderCreate).not.toHaveBeenCalled();
+		});
+
+		test("should return early when noUiSlider is undefined", () => {
+			const originalNoUiSlider = global.noUiSlider;
+			global.noUiSlider = undefined;
+			document.getElementById = jest.fn((id) => {
+				if (id === "temporalFilterSlider") return mockSliderEl;
+				return {};
+			});
+
+			expect(() => {
+				downloadManager.initializeCaptureDownloadSlider(10000, 1000, {});
+			}).not.toThrow();
+
+			global.noUiSlider = originalNoUiSlider;
+		});
+
+		test("should create slider and set modal dataset and range hint when slider and noUiSlider exist", () => {
+			const rangeHintEl = { textContent: "" };
+			const webDownloadModal = { dataset: {} };
+			document.getElementById = jest.fn((id) => {
+				if (id === "temporalFilterSlider") return mockSliderEl;
+				if (id === "temporalRangeHint") return rangeHintEl;
+				if (id === "webDownloadModal") return webDownloadModal;
+				return { textContent: "", value: "", dataset: {}, classList: { add: jest.fn(), remove: jest.fn() }, disabled: false };
+			});
+			global.noUiSlider = { create: mockNoUiSliderCreate };
+
+			downloadManager.initializeCaptureDownloadSlider(5000, 500, {
+				dataFilesCount: 10,
+				totalFilesCount: 12,
+				totalSize: 1000000,
+			});
+
+			expect(mockNoUiSliderCreate).toHaveBeenCalledWith(
+				mockSliderEl,
+				expect.objectContaining({
+					start: [0, 5000],
+					connect: true,
+					step: 500,
+					range: { min: 0, max: 5000 },
+				})
+			);
+			expect(webDownloadModal.dataset.durationMs).toBe("5000");
+			expect(webDownloadModal.dataset.fileCadenceMs).toBe("500");
+			expect(rangeHintEl.textContent).toBe("0 – 5000 ms");
+		});
+
+		test("should not create slider when durationMs is 0", () => {
+			const rangeHintEl = { textContent: "" };
+			document.getElementById = jest.fn((id) => {
+				if (id === "temporalFilterSlider") return mockSliderEl;
+				if (id === "temporalRangeHint") return rangeHintEl;
+				return {};
+			});
+			global.noUiSlider = { create: mockNoUiSliderCreate };
+
+			downloadManager.initializeCaptureDownloadSlider(0, 1000, {});
+
+			expect(mockNoUiSliderCreate).not.toHaveBeenCalled();
+		});
+	});
+
 	describe("Web Download Modal", () => {
 		beforeEach(() => {
 			downloadManager = new DownloadActionManager({
diff --git a/gateway/sds_gateway/static/js/file-list.js b/gateway/sds_gateway/static/js/file-list.js
index d9f8c495b..756526285 100644
--- a/gateway/sds_gateway/static/js/file-list.js
+++ b/gateway/sds_gateway/static/js/file-list.js
@@ -716,6 +716,7 @@ class FileListCapturesTableManager extends CapturesTableManager {
 			perDataFileSize: capture.per_data_file_size ?? 0,
 			totalSize: capture.total_file_size ?? 0,
 			dataFilesCount: capture.data_files_count ?? 0,
+			dataFilesTotalSize: capture.data_files_total_size ?? 0,
 			totalFilesCount: capture.files.length ?? 0,
 			captureStartEpochSec: capture.capture_start_epoch_sec ?? 0,
 		};
@@ -848,6 +849,7 @@ class FileListCapturesTableManager extends CapturesTableManager {
 										data-per-data-file-size="${safeData.perDataFileSize}"
 										data-total-size="${safeData.totalSize}"
 										data-data-files-count="${safeData.dataFilesCount}"
+										data-data-files-total-size="${safeData.dataFilesTotalSize}"
 										data-total-files-count="${safeData.totalFilesCount}"
 										data-capture-start-epoch-sec="${safeData.captureStartEpochSec}">
 									Download
diff --git a/gateway/sds_gateway/templates/users/partials/web_download_modal.html b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
index 5ee45ca03..0d0341f9c 100644
--- a/gateway/sds_gateway/templates/users/partials/web_download_modal.html
+++ b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
@@ -51,13 +51,27 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
                                     <input type="number" id="endTimeEntry" class="form-control" min="0" step="1" placeholder="0" />
                                 </div>
                             </div>
+                            <!-- Date/Time selection -->
+                            <div class="row">
+                                <div class="col-6">
+                                    <label for="startDateTimeEntry">Start (date/time UTC)</label>
+                                    <input type="datetime-local" id="startDateTimeEntry" class="form-control" step="0.001" />
+                                </div>
+                                <div class="col-6">
+                                    <label for="endDateTimeEntry">End (date/time UTC)</label>
+                                    <input type="datetime-local" id="endDateTimeEntry" class="form-control" step="0.001" />
+                                </div>
+                            </div>
                             <p class="small text-muted mt-1 mb-0">Valid range: <span id="temporalRangeHint">0 – — ms</span> (same values as the slider above)</p>
+                            <div id="temporalFilterSizeWarning" class="alert alert-warning small py-2 mb-2 d-none" role="alert">
+                                <i class="bi bi-exclamation-triangle-fill"></i> Size estimates may be inaccurate (server totals inconsistent).
+                            </div>
                             <div class="bg-light rounded px-3 py-2 mt-2 border-start border-3 border-primary">
                                 <p class="small mb-1 fw-medium"><span class="text-muted">Range:</span> <span id="temporalFilterRangeLabel">0:00:00.000 - 0:00:00.000</span></p>
+                                <p class="small mb-0 fw-medium"><span class="text-muted">Time (UTC):</span> <span id="dateTimeLabel">—</span></p>
                                 <p class="small mb-1 fw-medium"><span class="text-muted">Files in selection:</span> <span id="totalFilesLabel">0 files</span></p>
                                 <p class="small mb-1 fw-medium"><span class="text-muted">Number of metadata files to include in download:</span> <span id="metadataFilesLabel">0 files</span></p>
                                 <p class="small mb-1 fw-medium"><span class="text-muted">Total download size (including metadata files):</span> <span id="totalSizeLabel">0 bytes</span></p>
-                                <p class="small mb-0 fw-medium"><span class="text-muted">Time (UTC):</span> <span id="dateTimeLabel">—</span></p>
                             </div>
                             <input type="hidden" id="startTime" name="start_time" value="0" />
                             <input type="hidden" id="endTime" name="end_time" value="" />
@@ -76,159 +90,3 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
         </div>
     </div>
 </div>
-<script>
-    function msToHms(ms) {
-        var n = Number(ms);
-        if (!Number.isFinite(n) || n < 0) return '0:00:00.000';
-        const totalSec = Math.floor(n / 1000);
-        const h = Math.floor(totalSec / 3600);
-        const m = Math.floor((totalSec % 3600) / 60);
-        const s = totalSec % 60;
-        const decimalMs = n % 1000;
-        const hms = [h, m, s].map(function(v) {
-            return String(v).padStart(2, '0');
-        }).join(':');
-        return hms + '.' + decimalMs.toString().padStart(3, '0');
-    }
-
-    function formatBytes(bytes) {
-        var n = Number(bytes);
-        if (!Number.isFinite(n) || n < 0) return '0 bytes';
-        if (n === 0) return '0 bytes';
-        var units = ['bytes', 'KB', 'MB', 'GB'];
-        var i = 0;
-        while (n >= 1024 && i < units.length - 1) {
-            n /= 1024;
-            i++;
-        }
-        return (i === 0 ? n : n.toFixed(2)) + ' ' + units[i];
-    }
-
-    function formatUtcRange(startEpochSec, startMs, endMs) {
-        if (!Number.isFinite(startEpochSec)) return '—';
-        var startDate = new Date(startEpochSec * 1000 + startMs);
-        var endDate = new Date(startEpochSec * 1000 + endMs);
-        function pad2(x) { return String(x).padStart(2, '0'); }
-        function fmt(d) {
-            var h = d.getUTCHours(), m = d.getUTCMinutes(), s = d.getUTCSeconds();
-            var mo = d.getUTCMonth() + 1, day = d.getUTCDate(), y = d.getUTCFullYear();
-            return pad2(h) + ':' + pad2(m) + ':' + pad2(s) + ' ' + pad2(mo) + '/' + pad2(day) + '/' + y;
-        }
-        return fmt(startDate) + ' - ' + fmt(endDate) + ' (UTC)';
-    }
-
-    document.addEventListener('DOMContentLoaded', function() {
-        const webDownloadModal = document.getElementById('webDownloadModal');
-        const confirmWebDownloadBtn = document.getElementById('confirmWebDownloadBtn');
-        const startTimeInput = document.getElementById('startTime');
-        const endTimeInput = document.getElementById('endTime');
-        if (!webDownloadModal || !confirmWebDownloadBtn) return;
-
-        // Handle download confirmation
-        confirmWebDownloadBtn.addEventListener('click', function() {
-            const datasetUuid = this.dataset.datasetUuid;
-            const datasetName = this.dataset.datasetName;
-
-            if (datasetUuid) {
-                var startVal = startTimeInput ? startTimeInput.value : '';
-                var endVal = endTimeInput ? endTimeInput.value : '';
-                var startEntry = document.getElementById('startTimeEntry');
-                var endEntry = document.getElementById('endTimeEntry');
-                var modalEl = document.getElementById('webDownloadModal');
-                if (startEntry && endEntry && modalEl && modalEl.dataset.durationMs) {
-                    var entryStart = startEntry.value.trim();
-                    var entryEnd = endEntry.value.trim();
-                    if (entryStart !== '' || entryEnd !== '') {
-                        var durationMs = parseInt(modalEl.dataset.durationMs, 10);
-                        var startMs = entryStart === '' ? 0 : parseInt(entryStart, 10);
-                        var endMs = entryEnd === '' ? durationMs : parseInt(entryEnd, 10);
-                        if (!Number.isFinite(startMs) || !Number.isFinite(endMs) || startMs < 0 || endMs > durationMs || startMs >= endMs) {
-                            showAlert('Please enter valid start/end times (0 ≤ start < end ≤ ' + durationMs + ' ms).', 'error');
-                            return;
-                        }
-                        startVal = String(startMs);
-                        endVal = String(endMs);
-                        startTimeInput.value = startVal;
-                        endTimeInput.value = endVal;
-                    }
-                }
-
-                this.innerHTML = '<i class="bi bi-hourglass-split"></i> Processing...';
-                this.disabled = true;
-
-                var url = '/users/download-item/dataset/' + datasetUuid + '/';
-                var headers = {
-                    'X-CSRFToken': document.querySelector('[name=csrfmiddlewaretoken]').value
-                };
-                var body = null;
-                if (startTimeInput && endTimeInput) {
-                    headers['Content-Type'] = 'application/x-www-form-urlencoded';
-                    body = new URLSearchParams({
-                        start_time: startTimeInput.value,
-                        end_time: endTimeInput.value
-                    });
-                } else {
-                    headers['Content-Type'] = 'application/json';
-                }
-
-                fetch(url, {
-                        method: 'POST',
-                        headers: headers,
-                        body: body
-                    })
-                    .then(function(response) {
-                        var contentType = response.headers.get('content-type');
-                        if (contentType && contentType.includes('application/json')) {
-                            return response.json();
-                        }
-                        return response.text().then(function(text) {
-                            throw new Error('Server returned non-JSON response: ' + text);
-                        });
-                    })
-                    .then(function(data) {
-                        if (data.success === true) {
-                            showAlert(data.message || 'Download request submitted successfully! You will receive an email when ready.', 'success');
-                            var modal = bootstrap.Modal.getInstance(webDownloadModal);
-                            if (modal) modal.hide();
-                        } else {
-                            showAlert('Error requesting download: ' + (data.message || 'Unknown error'), 'error');
-                        }
-                    })
-                    .catch(function(error) {
-                        console.error('Download error:', error);
-                        showAlert(error.message || 'An error occurred while processing your request.', 'error');
-                    })
-                    .finally(function() {
-                        confirmWebDownloadBtn.innerHTML = '<i class="bi bi-download"></i> Yes, Download Dataset';
-                        confirmWebDownloadBtn.disabled = false;
-                    });
-            }
-        });
-
-        webDownloadModal.addEventListener('hidden.bs.modal', function() {
-            confirmWebDownloadBtn.dataset.datasetUuid = '';
-            confirmWebDownloadBtn.dataset.datasetName = '';
-            var nameEl = document.getElementById('webDownloadDatasetName');
-            if (nameEl) nameEl.textContent = '';
-        });
-    });
-
-    // Function to show web download modal (used for both dataset and capture download)
-    function showWebDownloadModal(datasetUuid, datasetName) {
-        var nameEl = document.getElementById('webDownloadDatasetName');
-        var confirmBtn = document.getElementById('confirmWebDownloadBtn');
-        var modalEl = document.getElementById('webDownloadModal');
-        if (nameEl) nameEl.textContent = datasetName || '';
-        if (confirmBtn) {
-            confirmBtn.dataset.datasetUuid = datasetUuid || '';
-            confirmBtn.dataset.datasetName = datasetName || '';
-        }
-        if (modalEl && window.bootstrap) {
-            var modal = new bootstrap.Modal(modalEl);
-            modal.show();
-        }
-    }
-
-    // Make the function globally available
-    window.showWebDownloadModal = showWebDownloadModal;
-</script>
diff --git a/gateway/sds_gateway/users/tests/test_drf_views.py b/gateway/sds_gateway/users/tests/test_drf_views.py
index ebe29ee65..c3c6c8d65 100644
--- a/gateway/sds_gateway/users/tests/test_drf_views.py
+++ b/gateway/sds_gateway/users/tests/test_drf_views.py
@@ -2,6 +2,7 @@
 
 import json
 import uuid
+from unittest.mock import patch
 
 import pytest
 from django.conf import settings
@@ -326,60 +327,6 @@ def test_share_with_multiple_users(
         assert permissions.filter(shared_with=user_to_share_with).exists()
         assert permissions.filter(shared_with=user2).exists()
 
-    def test_unified_download_dataset_success(
-        self, client: Client, owner: User, dataset: Dataset
-    ) -> None:
-        """Test successful download request using the unified download endpoint."""
-        client.force_login(owner)
-        url = reverse(
-            "users:download_item",
-            kwargs={"item_type": ItemType.DATASET, "item_uuid": dataset.uuid},
-        )
-
-        response = client.post(url)
-
-        assert response.status_code == status.HTTP_202_ACCEPTED
-        result = response.json()
-        assert result["success"] is True
-        assert "download request accepted" in result["message"].lower()
-        assert "task_id" in result
-        assert result["item_name"] == dataset.name
-        assert result["user_email"] == owner.email
-
-    def test_unified_download_dataset_not_owner(
-        self, client: Client, user_to_share_with: User, dataset: Dataset
-    ) -> None:
-        """Test download request when user is not the owner."""
-        client.force_login(user_to_share_with)
-        url = reverse(
-            "users:download_item",
-            kwargs={"item_type": ItemType.DATASET, "item_uuid": dataset.uuid},
-        )
-
-        response = client.post(url)
-
-        assert response.status_code == status.HTTP_404_NOT_FOUND
-        result = response.json()
-        assert result["success"] is False
-        assert "not found or access denied" in result["message"].lower()
-
-    def test_unified_download_dataset_invalid_type(
-        self, client: Client, owner: User, dataset: Dataset
-    ) -> None:
-        """Test download request with invalid item type."""
-        client.force_login(owner)
-        url = reverse(
-            "users:download_item",
-            kwargs={"item_type": "invalid_type", "item_uuid": dataset.uuid},
-        )
-
-        response = client.post(url)
-
-        assert response.status_code == status.HTTP_400_BAD_REQUEST
-        result = response.json()
-        assert result["success"] is False
-        assert "invalid item type" in result["message"].lower()
-
     def test_share_with_group_individual_members_already_shared(
         self, client: Client, owner: User, user_to_share_with: User, dataset: Dataset
     ) -> None:
@@ -543,3 +490,186 @@ def test_capture_share_modal_displays_groups_properly(
         member_emails = [member["email"] for member in group_entry["members"]]
         assert user_to_share_with.email in member_emails
         assert user2.email in member_emails
+
+
+@pytest.mark.django_db
+class TestDownloadItemView:
+    """Tests for the DownloadItemView (unified download endpoint)."""
+
+    @pytest.fixture
+    def client(self) -> Client:
+        return Client()
+
+    @pytest.fixture
+    def owner(self) -> User:
+        """Create a user who owns items."""
+        return User.objects.create_user(
+            email="owner@example.com",
+            password=TEST_PASSWORD,
+            name="Owner User",
+            is_approved=True,
+        )
+
+    @pytest.fixture
+    def user_to_share_with(self) -> User:
+        """Create a user to share items with."""
+        return User.objects.create_user(
+            email="share@example.com",
+            password=TEST_PASSWORD,
+            name="Share User",
+            is_approved=True,
+        )
+
+    @pytest.fixture
+    def dataset(self, owner: User) -> Dataset:
+        """Create a dataset owned by the owner."""
+        return Dataset.objects.create(
+            uuid=uuid.uuid4(),
+            name="Test Dataset",
+            owner=owner,
+            description="A test dataset",
+        )
+
+    def test_unified_download_dataset_success(
+        self, client: Client, owner: User, dataset: Dataset
+    ) -> None:
+        """Test successful download request using the unified download endpoint."""
+        client.force_login(owner)
+        url = reverse(
+            "users:download_item",
+            kwargs={"item_type": ItemType.DATASET, "item_uuid": dataset.uuid},
+        )
+
+        response = client.post(url)
+
+        assert response.status_code == status.HTTP_202_ACCEPTED
+        result = response.json()
+        assert result["success"] is True
+        assert "download request accepted" in result["message"].lower()
+        assert "task_id" in result
+        assert result["item_name"] == dataset.name
+        assert result["user_email"] == owner.email
+
+    def test_unified_download_dataset_not_owner(
+        self, client: Client, user_to_share_with: User, dataset: Dataset
+    ) -> None:
+        """Test download request when user is not the owner."""
+        client.force_login(user_to_share_with)
+        url = reverse(
+            "users:download_item",
+            kwargs={"item_type": ItemType.DATASET, "item_uuid": dataset.uuid},
+        )
+
+        response = client.post(url)
+
+        assert response.status_code == status.HTTP_404_NOT_FOUND
+        result = response.json()
+        assert result["success"] is False
+        assert "not found or access denied" in result["message"].lower()
+
+    def test_unified_download_dataset_invalid_type(
+        self, client: Client, owner: User, dataset: Dataset
+    ) -> None:
+        """Test download request with invalid item type."""
+        client.force_login(owner)
+        url = reverse(
+            "users:download_item",
+            kwargs={"item_type": "invalid_type", "item_uuid": dataset.uuid},
+        )
+
+        response = client.post(url)
+
+        assert response.status_code == status.HTTP_400_BAD_REQUEST
+        result = response.json()
+        assert result["success"] is False
+        assert "invalid item type" in result["message"].lower()
+
+    def test_unified_download_capture_with_time_filter_success(
+        self, client: Client, owner: User
+    ) -> None:
+        """Test capture download request with start_time/end_time passes bounds to task."""
+        capture = Capture.objects.create(
+            uuid=uuid.uuid4(),
+            name="Test DRF Capture",
+            owner=owner,
+            capture_type="drf",
+            top_level_dir="/test",
+            index_name="captures-drf",
+        )
+        client.force_login(owner)
+        url = reverse(
+            "users:download_item",
+            kwargs={"item_type": ItemType.CAPTURE, "item_uuid": capture.uuid},
+        )
+        data = {"start_time": "1000", "end_time": "5000"}
+
+        with patch(
+            "sds_gateway.users.views.send_item_files_email"
+        ) as mock_send_task:
+            mock_send_task.delay.return_value = type("Result", (), {"id": "task-1"})()
+            response = client.post(url, data)
+
+        assert response.status_code == status.HTTP_202_ACCEPTED
+        result = response.json()
+        assert result["success"] is True
+        assert "download request accepted" in result["message"].lower()
+        mock_send_task.delay.assert_called_once()
+        call_kwargs = mock_send_task.delay.call_args[1]
+        assert call_kwargs["start_time"] == 1000
+        assert call_kwargs["end_time"] == 5000
+
+    def test_unified_download_capture_without_time_filter(
+        self, client: Client, owner: User
+    ) -> None:
+        """Test capture download without start_time/end_time passes None to task."""
+        capture = Capture.objects.create(
+            uuid=uuid.uuid4(),
+            name="Test DRF Capture",
+            owner=owner,
+            capture_type="drf",
+            top_level_dir="/test",
+            index_name="captures-drf",
+        )
+        client.force_login(owner)
+        url = reverse(
+            "users:download_item",
+            kwargs={"item_type": ItemType.CAPTURE, "item_uuid": capture.uuid},
+        )
+
+        with patch(
+            "sds_gateway.users.views.send_item_files_email"
+        ) as mock_send_task:
+            mock_send_task.delay.return_value = type("Result", (), {"id": "task-1"})()
+            response = client.post(url)
+
+        assert response.status_code == status.HTTP_202_ACCEPTED
+        mock_send_task.delay.assert_called_once()
+        call_kwargs = mock_send_task.delay.call_args[1]
+        assert call_kwargs.get("start_time") is None
+        assert call_kwargs.get("end_time") is None
+
+    def test_unified_download_capture_invalid_time_range(
+        self, client: Client, owner: User
+    ) -> None:
+        """Test capture download with start_time >= end_time returns 400."""
+        capture = Capture.objects.create(
+            uuid=uuid.uuid4(),
+            name="Test DRF Capture",
+            owner=owner,
+            capture_type="drf",
+            top_level_dir="/test",
+            index_name="captures-drf",
+        )
+        client.force_login(owner)
+        url = reverse(
+            "users:download_item",
+            kwargs={"item_type": ItemType.CAPTURE, "item_uuid": capture.uuid},
+        )
+        data = {"start_time": "5000", "end_time": "1000"}
+
+        response = client.post(url, data)
+
+        assert response.status_code == status.HTTP_400_BAD_REQUEST
+        result = response.json()
+        assert result["success"] is False
+        assert "start_time" in result["message"].lower() or "time range" in result["message"].lower()
diff --git a/gateway/sds_gateway/users/views.py b/gateway/sds_gateway/users/views.py
index d3d44b123..1b4b145f3 100644
--- a/gateway/sds_gateway/users/views.py
+++ b/gateway/sds_gateway/users/views.py
@@ -3300,6 +3300,35 @@ def _serve_file_download(self, zip_uuid: str, user) -> HttpResponse:
 user_temporary_zip_download_view = TemporaryZipDownloadView.as_view()
 
 
+def _parse_optional_time(raw_value: str | None, param_name: str) -> tuple[int | None, JsonResponse | None]:
+    """Parse optional start/end time. Returns (value, None) or (None, error_response)."""
+    if raw_value in (None, ""):
+        return None, None
+    try:
+        value = int(raw_value)
+    except (TypeError, ValueError):
+        return None, JsonResponse(
+            {"success": False, "message": f"Invalid {param_name}; it must be an integer value."},
+            status=400,
+        )
+    if value < 0:
+        return None, JsonResponse(
+            {"success": False, "message": f"Invalid {param_name}; it must be greater than or equal to 0."},
+            status=400,
+        )
+    return value, None
+
+
+def _validate_time_range(start_time: int | None, end_time: int | None) -> JsonResponse | None:
+    """Return 400 JsonResponse if both provided and start >= end; else None."""
+    if start_time is not None and end_time is not None and start_time >= end_time:
+        return JsonResponse(
+            {"success": False, "message": "Invalid time range; start_time must be less than end_time."},
+            status=400,
+        )
+    return None
+
+
 class DownloadItemView(Auth0LoginRequiredMixin, View):
     """
     Unified view to handle item download requests for both datasets and captures.
@@ -3333,13 +3362,19 @@ def post(
         Returns:
             A JSON response containing the download status
         """
-        # optional start and end times for temporal filtering
-        start_time = request.POST.get("start_time") or None
-        end_time = request.POST.get("end_time") or None
-        if start_time is not None:
-            start_time = int(start_time)
-        if end_time is not None:
-            end_time = int(end_time)
+        # Optional start and end times for temporal filtering
+        raw_start_time = request.POST.get("start_time")
+        raw_end_time = request.POST.get("end_time")
+
+        start_time, err = _parse_optional_time(raw_start_time, "start_time")
+        if err is not None:
+            return err
+        end_time, err = _parse_optional_time(raw_end_time, "end_time")
+        if err is not None:
+            return err
+        err = _validate_time_range(start_time, end_time)
+        if err is not None:
+            return err
 
         # Validate item type
         if item_type not in self.ITEM_MODELS:

From 0aa1c3a29c82ce7163a869afc6e059aa79099643 Mon Sep 17 00:00:00 2001
From: klpoland <kinsey.l.poland@gmail.com>
Date: Fri, 6 Mar 2026 14:19:12 -0500
Subject: [PATCH 6/7] add flatpickr to handle datetime selection for better
 control

---
 .../js/actions/DownloadActionManager.js       | 96 +++++++++++++------
 gateway/sds_gateway/static/js/file-list.js    | 18 ++++
 gateway/sds_gateway/templates/base.html       |  3 +
 .../templates/users/file_list.html            |  6 +-
 .../users/partials/web_download_modal.html    |  6 +-
 5 files changed, 93 insertions(+), 36 deletions(-)

diff --git a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
index cb2da7332..5b23012a6 100644
--- a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
+++ b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
@@ -49,35 +49,32 @@ function formatUtcRange(startEpochSec, startMs, endMs) {
 	return fmt(startDate) + " - " + fmt(endDate) + " (UTC)";
 }
 
-/** Format ms from capture start as datetime-local value (local time). */
-function msToDatetimeLocal(captureStartEpochSec, ms) {
+/** Format ms from capture start as UTC string for display (Y-m-d H:i:s). */
+function msToUtcString(captureStartEpochSec, ms) {
 	if (!Number.isFinite(captureStartEpochSec) || !Number.isFinite(ms)) return "";
 	const d = new Date(captureStartEpochSec * 1000 + ms);
 	const pad2 = (x) => String(x).padStart(2, "0");
-	const pad3 = (x) => String(x).padStart(3, "0");
 	return (
-		d.getFullYear() +
+		d.getUTCFullYear() +
 		"-" +
-		pad2(d.getMonth() + 1) +
+		pad2(d.getUTCMonth() + 1) +
 		"-" +
-		pad2(d.getDate()) +
-		"T" +
-		pad2(d.getHours()) +
+		pad2(d.getUTCDate()) +
+		" " +
+		pad2(d.getUTCHours()) +
 		":" +
-		pad2(d.getMinutes()) +
+		pad2(d.getUTCMinutes()) +
 		":" +
-		pad2(d.getSeconds()) +
-		"." +
-		pad3(d.getMilliseconds())
+		pad2(d.getUTCSeconds())
 	);
 }
 
-/** Parse datetime-local value to ms from capture start (UTC epoch sec). */
-function datetimeLocalToMs(captureStartEpochSec, valueStr) {
-	if (!Number.isFinite(captureStartEpochSec) || !valueStr || !valueStr.trim()) return NaN;
-	const d = new Date(valueStr.trim());
-	if (Number.isNaN(d.getTime())) return NaN;
-	return d.getTime() - captureStartEpochSec * 1000;
+/** Parse UTC date string (Y-m-d H:i:s or Y-m-d H:i) to epoch ms. */
+function parseUtcStringToEpochMs(str) {
+	if (!str || !str.trim()) return NaN;
+	const s = str.trim();
+	const d = new Date(s.endsWith("Z") ? s : s.replace(" ", "T") + "Z");
+	return Number.isFinite(d.getTime()) ? d.getTime() : NaN;
 }
 
 class DownloadActionManager {
@@ -411,6 +408,33 @@ class DownloadActionManager {
 			endDateTimeEntry.disabled = !hasEpoch;
 		}
 		if (durationMs <= 0) return;
+		var fpStart = null, fpEnd = null;
+		var epochStart = captureStartEpochSec * 1000;
+		var epochEnd = epochStart + durationMs;
+		if (hasEpoch && typeof flatpickr !== 'undefined' && startDateTimeEntry && endDateTimeEntry) {
+			var fpOpts = {
+				enableTime: true,
+				enableSeconds: true,
+				utc: true,
+				dateFormat: 'Y-m-d H:i:S',
+				time_24hr: true,
+				minDate: epochStart,
+				maxDate: epochEnd,
+				allowInput: true,
+				static: true,
+				appendTo: webDownloadModal || undefined,
+			};
+			flatpickr(startDateTimeEntry, Object.assign({}, fpOpts, {
+				onChange: function() { syncFromDateTimeEntries(); }
+			}));
+			flatpickr(endDateTimeEntry, Object.assign({}, fpOpts, {
+				onChange: function() { syncFromDateTimeEntries(); }
+			}));
+			fpStart = startDateTimeEntry._flatpickr;
+			fpEnd = endDateTimeEntry._flatpickr;
+			startDateTimeEntry.disabled = false;
+			endDateTimeEntry.disabled = false;
+		}
 		noUiSlider.create(sliderEl, {
 			start: [0, durationMs],
 			connect: true,
@@ -444,8 +468,10 @@ class DownloadActionManager {
 			if (startTimeEntry) startTimeEntry.value = String(Math.round(startMs));
 			if (endTimeEntry) endTimeEntry.value = String(Math.round(endMs));
 			if (hasEpoch) {
-				if (startDateTimeEntry) startDateTimeEntry.value = msToDatetimeLocal(captureStartEpochSec, startMs);
-				if (endDateTimeEntry) endDateTimeEntry.value = msToDatetimeLocal(captureStartEpochSec, endMs);
+				if (fpStart && typeof fpStart.setDate === 'function') fpStart.setDate(epochStart + startMs);
+				else if (startDateTimeEntry) startDateTimeEntry.value = msToUtcString(captureStartEpochSec, startMs);
+				if (fpEnd && typeof fpEnd.setDate === 'function') fpEnd.setDate(epochStart + endMs);
+				else if (endDateTimeEntry) endDateTimeEntry.value = msToUtcString(captureStartEpochSec, endMs);
 			}
 		});
 		if (rangeLabel) {
@@ -471,10 +497,11 @@ class DownloadActionManager {
 		if (startTimeEntry) startTimeEntry.value = startVal;
 		if (endTimeEntry) endTimeEntry.value = endVal;
 		if (hasEpoch && startDateTimeEntry && endDateTimeEntry) {
-			startDateTimeEntry.value = msToDatetimeLocal(captureStartEpochSec, 0);
-			endDateTimeEntry.value = msToDatetimeLocal(captureStartEpochSec, durationMs);
-			startDateTimeEntry.disabled = false;
-			endDateTimeEntry.disabled = false;
+			if (fpStart && typeof fpStart.setDate === 'function') fpStart.setDate(epochStart);
+			else startDateTimeEntry.value = msToUtcString(captureStartEpochSec, 0);
+			if (fpEnd && typeof fpEnd.setDate === 'function') fpEnd.setDate(epochEnd);
+			else endDateTimeEntry.value = msToUtcString(captureStartEpochSec, durationMs);
+			if (!fpStart) { startDateTimeEntry.disabled = false; endDateTimeEntry.disabled = false; }
 		}
 
 		function syncSliderFromEntries() {
@@ -492,18 +519,28 @@ class DownloadActionManager {
 		}
 		function syncFromDateTimeEntries() {
 			if (!hasEpoch || !sliderEl.noUiSlider || !startDateTimeEntry || !endDateTimeEntry) return;
-			var startMs = datetimeLocalToMs(captureStartEpochSec, startDateTimeEntry.value);
-			var endMs = datetimeLocalToMs(captureStartEpochSec, endDateTimeEntry.value);
+			var startMs, endMs;
+			if (startDateTimeEntry._flatpickr && endDateTimeEntry._flatpickr) {
+				var dStart = startDateTimeEntry._flatpickr.selectedDates[0];
+				var dEnd = endDateTimeEntry._flatpickr.selectedDates[0];
+				startMs = dStart ? dStart.getTime() - epochStart : 0;
+				endMs = dEnd ? dEnd.getTime() - epochStart : durationMs;
+			} else {
+				startMs = parseUtcStringToEpochMs(startDateTimeEntry.value) - epochStart;
+				endMs = parseUtcStringToEpochMs(endDateTimeEntry.value) - epochStart;
+			}
 			if (Number.isNaN(startMs) || Number.isNaN(endMs)) return;
 			startMs = Math.max(0, Math.min(startMs, durationMs));
 			endMs = Math.max(0, Math.min(endMs, durationMs));
 			if (startMs >= endMs) endMs = Math.min(startMs + fileCadenceMs, durationMs);
+			var cur = sliderEl.noUiSlider.get();
+			if (Math.round(Number(cur[0])) === Math.round(startMs) && Math.round(Number(cur[1])) === Math.round(endMs)) return;
 			sliderEl.noUiSlider.set([startMs, endMs]);
 		}
 		if (startTimeEntry) startTimeEntry.addEventListener('change', syncSliderFromEntries);
 		if (endTimeEntry) endTimeEntry.addEventListener('change', syncSliderFromEntries);
-		if (startDateTimeEntry) startDateTimeEntry.addEventListener('change', syncFromDateTimeEntries);
-		if (endDateTimeEntry) endDateTimeEntry.addEventListener('change', syncFromDateTimeEntries);
+		if (startDateTimeEntry && !startDateTimeEntry._flatpickr) startDateTimeEntry.addEventListener('change', syncFromDateTimeEntries);
+		if (endDateTimeEntry && !endDateTimeEntry._flatpickr) endDateTimeEntry.addEventListener('change', syncFromDateTimeEntries);
 	}
 
 	/**
@@ -653,7 +690,6 @@ class DownloadActionManager {
 		const dataFilesTotalSizeRaw = button.getAttribute("data-data-files-total-size");
 		const dataFilesTotalSize = dataFilesTotalSizeRaw !== null && dataFilesTotalSizeRaw !== '' ? parseInt(dataFilesTotalSizeRaw, 10) : NaN;
 		const captureStartEpochSec = parseInt(button.getAttribute("data-capture-start-epoch-sec"), 10);
-		const captureUuid = button.getAttribute("data-capture-uuid") || undefined;
 		this.initializeCaptureDownloadSlider(
 			Number.isNaN(durationMs) ? 0 : durationMs,
 			Number.isNaN(fileCadenceMs) ? 1000 : fileCadenceMs,
@@ -663,7 +699,7 @@ class DownloadActionManager {
 				dataFilesCount: Number.isNaN(dataFilesCount) ? 0 : dataFilesCount,
 				totalFilesCount: Number.isNaN(totalFilesCount) ? 0 : totalFilesCount,
 				dataFilesTotalSize: Number.isNaN(dataFilesTotalSize) ? undefined : dataFilesTotalSize,
-				captureUuid: captureUuid,
+				captureUuid: captureUuid || undefined,
 				captureStartEpochSec: Number.isNaN(captureStartEpochSec) ? undefined : captureStartEpochSec,
 			},
 		);
diff --git a/gateway/sds_gateway/static/js/file-list.js b/gateway/sds_gateway/static/js/file-list.js
index 756526285..3f5175077 100644
--- a/gateway/sds_gateway/static/js/file-list.js
+++ b/gateway/sds_gateway/static/js/file-list.js
@@ -575,6 +575,24 @@ class FileListCapturesTableManager extends CapturesTableManager {
 		this.searchButtonLoading = document.getElementById("search-btn-loading");
 	}
 
+	/**
+	 * Use web download modal (with temporal slider) when DownloadActionManager is available.
+	 */
+	handleDownloadCapture(button) {
+		if (window.currentDownloadManager && document.getElementById("webDownloadModal")) {
+			const captureUuid = button.getAttribute("data-capture-uuid");
+			const captureName = button.getAttribute("data-capture-name") || captureUuid;
+			if (captureUuid) {
+				window.currentDownloadManager.handleCaptureDownload(
+					captureUuid,
+					captureName,
+					button,
+				);
+			}
+			return;
+		}
+	}
+
 	/**
 	 * Override showLoading to toggle button contents instead of showing separate indicator
 	 */
diff --git a/gateway/sds_gateway/templates/base.html b/gateway/sds_gateway/templates/base.html
index fdebfe804..b121a037d 100644
--- a/gateway/sds_gateway/templates/base.html
+++ b/gateway/sds_gateway/templates/base.html
@@ -21,6 +21,8 @@
               href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
         <link rel="stylesheet"
               href="https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/15.7.1/nouislider.min.css" />
+        <link rel="stylesheet"
+              href="https://cdn.jsdelivr.net/npm/flatpickr@4.6.13/dist/flatpickr.min.css" />
         {% block css %}
             <!-- Your stuff: Third-party CSS libraries go here -->
             <!-- This file stores project-specific CSS -->
@@ -44,6 +46,7 @@
             <script src="{% static 'js/core/PermissionsManager.js' %}"></script>
             <script src="{% static 'js/core/DOMUtils.js' %}"></script>
             <script src="{% static 'js/core/PageLifecycleManager.js' %}"></script>
+            <script src="https://cdn.jsdelivr.net/npm/flatpickr@4.6.13/dist/flatpickr.min.js"></script>
         {% endblock javascript %}
     </head>
     {# djlint:off H021 #}
diff --git a/gateway/sds_gateway/templates/users/file_list.html b/gateway/sds_gateway/templates/users/file_list.html
index 2e03a166e..d3d9a77c0 100644
--- a/gateway/sds_gateway/templates/users/file_list.html
+++ b/gateway/sds_gateway/templates/users/file_list.html
@@ -527,11 +527,11 @@ <h5 class="modal-title" id="uploadResultModalLabel">Upload Result</h5>
                 }
             };
 
-            // Initialize managers for captures
-            const permissionsManager = new PermissionsManager(pageConfig.permissions);
+            // Initialize managers for captures (use window.* — classes are attached by module/scripts)
+            const permissionsManager = new window.PermissionsManager(pageConfig.permissions);
 
             // Initialize download manager
-            const downloadManager = new DownloadActionManager({
+            const downloadManager = new window.DownloadActionManager({
                 permissions: permissionsManager
             });
 
diff --git a/gateway/sds_gateway/templates/users/partials/web_download_modal.html b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
index 0d0341f9c..8003acd2d 100644
--- a/gateway/sds_gateway/templates/users/partials/web_download_modal.html
+++ b/gateway/sds_gateway/templates/users/partials/web_download_modal.html
@@ -4,7 +4,7 @@
      tabindex="-1"
      aria-labelledby="webDownloadModalLabel-{{ item.uuid }}"
      aria-hidden="true">
-    <div class="modal-dialog">
+    <div class="modal-dialog modal-lg">
         <div class="modal-content">
             <div class="modal-header">
                 <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
@@ -55,11 +55,11 @@ <h5 class="modal-title" id="webDownloadModalLabel-{{ item.uuid }}">
                             <div class="row">
                                 <div class="col-6">
                                     <label for="startDateTimeEntry">Start (date/time UTC)</label>
-                                    <input type="datetime-local" id="startDateTimeEntry" class="form-control" step="0.001" />
+                                    <input type="text" id="startDateTimeEntry" class="form-control" placeholder="YYYY-MM-DD HH:mm:ss" />
                                 </div>
                                 <div class="col-6">
                                     <label for="endDateTimeEntry">End (date/time UTC)</label>
-                                    <input type="datetime-local" id="endDateTimeEntry" class="form-control" step="0.001" />
+                                    <input type="text" id="endDateTimeEntry" class="form-control" placeholder="YYYY-MM-DD HH:mm:ss" />
                                 </div>
                             </div>
                             <p class="small text-muted mt-1 mb-0">Valid range: <span id="temporalRangeHint">0 – — ms</span> (same values as the slider above)</p>

From d53e603c467fc9b2b00230694be2c36f867cd18f Mon Sep 17 00:00:00 2001
From: klpoland <kinsey.l.poland@gmail.com>
Date: Fri, 27 Mar 2026 13:06:29 -0400
Subject: [PATCH 7/7] clean up download action manager, refactor js, filters,
 tests

---
 .../api_methods/helpers/temporal_filtering.py |  29 +-
 gateway/sds_gateway/api_methods/models.py     |  31 +
 .../serializers/capture_serializers.py        | 151 ++--
 .../api_methods/tests/factories.py            |  69 +-
 .../api_methods/tests/test_celery_tasks.py    |  19 +-
 .../tests/test_temporal_filtering.py          |  19 +-
 .../js/actions/DownloadActionManager.js       | 692 ++++--------------
 .../__tests__/DownloadActionManager.test.js   | 253 ++++---
 gateway/sds_gateway/static/js/components.js   | 168 +----
 .../sds_gateway/static/js/core/DOMUtils.js    |  16 +-
 .../static/js/core/PageLifecycleManager.js    |  77 +-
 gateway/sds_gateway/static/js/file-list.js    |  24 +-
 .../users/components/dataset_list_table.html  |   4 +-
 .../templates/users/dataset_list.html         |  15 +-
 .../templates/users/file_list.html            |   2 -
 .../sds_gateway/templates/users/files.html    |  19 +-
 .../users/partials/captures_page_table.html   |  11 +-
 .../search_published_datasets_tab.html        |   4 +-
 18 files changed, 574 insertions(+), 1029 deletions(-)

diff --git a/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py b/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py
index e56eea898..787174fda 100644
--- a/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py
+++ b/gateway/sds_gateway/api_methods/helpers/temporal_filtering.py
@@ -3,7 +3,7 @@
 from django.db.models import QuerySet
 
 from opensearchpy.exceptions import NotFoundError as OpenSearchNotFoundError
-from sds_gateway.api_methods.models import CaptureType, Capture, File
+from sds_gateway.api_methods.models import CaptureType, Capture, File, DRF_RF_FILENAME_REGEX_STR
 from sds_gateway.api_methods.utils.opensearch_client import get_opensearch_client
 from sds_gateway.api_methods.utils.relationship_utils import get_capture_files
 from loguru import logger as log
@@ -14,7 +14,6 @@
     r"^rf@(\d+)\.(\d+)\.h5$",
     re.IGNORECASE,
 )
-DRF_RF_FILENAME_REGEX_STR = r"^rf@\d+\.\d+\.h5$"
 
 
 def drf_rf_filename_from_ms(ms: int) -> str:
@@ -48,7 +47,6 @@ def _catch_capture_type_error(capture_type: CaptureType) -> None:
 
 def get_capture_bounds(capture_type: CaptureType, capture_uuid: str) -> tuple[int, int]:
     """Get start and end bounds for capture from opensearch."""
-    
     _catch_capture_type_error(capture_type)
 
     client = get_opensearch_client()
@@ -73,31 +71,14 @@ def get_capture_bounds(capture_type: CaptureType, capture_uuid: str) -> tuple[in
     return start_time, end_time
 
 
-def get_data_files(capture_type: CaptureType, capture: Capture) -> QuerySet[File]:
-    """Get the data files in the capture."""
-    _catch_capture_type_error(capture_type)
-
-    return get_capture_files(capture).filter(name__regex=DRF_RF_FILENAME_REGEX_STR)
-
-
 def get_file_cadence(capture_type: CaptureType, capture: Capture) -> int:
     """Get the file cadence in milliseconds. OpenSearch bounds are in seconds."""
     _catch_capture_type_error(capture_type)
 
     capture_uuid = str(capture.uuid)
-    try:
-        start_time, end_time = get_capture_bounds(capture_type, capture_uuid)
-    except ValueError as e:
-        log.error(e)
-        raise e
-
-    data_files = get_data_files(capture_type, capture)
-    count = data_files.count()
-
-    # the first file represents the beginning of the capture
-    # exclude it from the count to get the correct file cadence
-    # the count - 1 gives us the number of "spaces" between the files
-    count -= 1
+    start_time, end_time = get_capture_bounds(capture_type, capture_uuid)
+
+    count = capture.get_drf_data_files_stats()["total_count"]
     if count == 0:
         return 0
     duration_sec = end_time - start_time
@@ -121,7 +102,7 @@ def filter_capture_data_files_selection_bounds(
     start_file_name = drf_rf_filename_from_ms(start_ms)
     end_file_name = drf_rf_filename_from_ms(end_ms)
 
-    data_files = get_data_files(capture_type, capture)
+    data_files = capture.get_drf_data_files_queryset()
     return data_files.filter(
         name__gte=start_file_name,
         name__lte=end_file_name,
diff --git a/gateway/sds_gateway/api_methods/models.py b/gateway/sds_gateway/api_methods/models.py
index 7a9aa896e..8bb007266 100644
--- a/gateway/sds_gateway/api_methods/models.py
+++ b/gateway/sds_gateway/api_methods/models.py
@@ -13,6 +13,8 @@
 from blake3 import blake3 as Blake3  # noqa: N812
 from django.conf import settings
 from django.db import models
+from django.db.models import Sum
+from django.db.models import Count
 from django.db.models import ProtectedError
 from django.db.models import QuerySet
 from django.db.models.signals import post_save
@@ -27,6 +29,8 @@
 
 log = logging.getLogger(__name__)
 
+DRF_RF_FILENAME_REGEX_STR = r"^rf@\d+\.\d+\.h5$"
+
 
 class KeywordNameField(models.CharField):
     """
@@ -419,6 +423,33 @@ def get_capture(self) -> dict[str, Any]:
             "owner": self.owner,
         }
 
+
+    def get_drf_data_files_queryset(self) -> QuerySet[File]:
+        """DRF data files (rf@*.h5) for this capture (M2M + FK)."""
+        if self.capture_type != CaptureType.DigitalRF:
+            log.warning("Capture %s is not a DigitalRF capture", self.uuid)
+            return File.objects.none()
+
+        # Local import avoids circular import (relationship_utils imports Capture).
+        from sds_gateway.api_methods.utils.relationship_utils import get_capture_files
+
+        return get_capture_files(self, include_deleted=False).filter(
+            name__regex=DRF_RF_FILENAME_REGEX_STR,
+        )
+
+    def get_drf_data_files_stats(self) -> dict[str, int]:
+        """Count + total size in one query; cached per instance. File PK is ``uuid`` — use ``pk``."""
+        if hasattr(self, "_drf_data_files_stats_cache"):
+            return self._drf_data_files_stats_cache
+
+        qs = self.get_drf_data_files_queryset()
+        agg = qs.aggregate(total_count=Count("pk"), total_size=Sum("size"))
+        self._drf_data_files_stats_cache = {
+            "total_count": agg["total_count"] or 0,
+            "total_size": int(agg["total_size"] or 0),
+        }
+        return self._drf_data_files_stats_cache
+
     def get_opensearch_frequency_metadata(self) -> dict[str, Any]:
         """
         Query OpenSearch for frequency metadata for this specific capture.
diff --git a/gateway/sds_gateway/api_methods/serializers/capture_serializers.py b/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
index 5391d3c36..549c09f72 100644
--- a/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
+++ b/gateway/sds_gateway/api_methods/serializers/capture_serializers.py
@@ -12,7 +12,6 @@
 from sds_gateway.api_methods.helpers.index_handling import retrieve_indexed_metadata
 from sds_gateway.api_methods.helpers.temporal_filtering import get_capture_bounds
 from sds_gateway.api_methods.helpers.temporal_filtering import get_file_cadence
-from sds_gateway.api_methods.helpers.temporal_filtering import get_data_files
 from sds_gateway.api_methods.models import Capture
 from sds_gateway.api_methods.models import CaptureType
 from sds_gateway.api_methods.models import DEPRECATEDPostProcessedData
@@ -72,15 +71,13 @@ class CaptureGetSerializer(serializers.ModelSerializer[Capture]):
     owner = UserGetSerializer()
     capture_props = serializers.SerializerMethodField()
     files = serializers.SerializerMethodField()
+    total_file_size = serializers.SerializerMethodField()
+    data_files_info = serializers.SerializerMethodField()
     center_frequency_ghz = serializers.SerializerMethodField()
     sample_rate_mhz = serializers.SerializerMethodField()
     length_of_capture_ms = serializers.SerializerMethodField()
     file_cadence_ms = serializers.SerializerMethodField()
     capture_start_epoch_sec = serializers.SerializerMethodField()
-    data_files_count = serializers.SerializerMethodField()
-    data_files_total_size = serializers.SerializerMethodField()
-    per_data_file_size = serializers.SerializerMethodField()
-    total_file_size = serializers.SerializerMethodField()
     formatted_created_at = serializers.SerializerMethodField()
     capture_type_display = serializers.SerializerMethodField()
     post_processed_data = serializers.SerializerMethodField()
@@ -99,6 +96,41 @@ def get_files(self, capture: Capture) -> ReturnList[File]:
         )
         return cast("ReturnList[File]", serializer.data)
 
+    @extend_schema_field(serializers.IntegerField(allow_null=True))
+    def get_total_file_size(self, capture: Capture) -> int | None:
+        """Get the total file size of all files associated with this capture."""
+        
+        if capture.capture_type != CaptureType.DigitalRF:
+            return None
+
+        all_files = get_capture_files(capture, include_deleted=False)
+        result = all_files.aggregate(total_size=Sum("size"))
+        total = result["total_size"] or 0
+        data_total = self.get_data_files_info(capture).get("total_size", 0)
+        if total < data_total:
+            logging.getLogger(__name__).warning(
+                "Capture %s: total_file_size (%s) < data_files_total_size (%s); using data total.",
+                str(capture.uuid), total, data_total,
+            )
+            total = data_total
+        
+        return total
+
+    @extend_schema_field(serializers.DictField(allow_null=True))
+    def get_data_files_info(self, capture: Capture) -> dict[str, Any]:
+        """Get the data files info for the capture."""
+        if capture.capture_type != CaptureType.DigitalRF:
+            return {}
+
+        stats = capture.get_drf_data_files_stats()
+        total_size = stats["total_size"]
+        count = stats["total_count"]
+        return {
+            "count": count,
+            "total_size": total_size,
+            "per_data_file_size": (float(total_size) / count) if count else None,
+        }
+
     @extend_schema_field(serializers.FloatField)
     def get_center_frequency_ghz(self, capture: Capture) -> float | None:
         """Get the center frequency in GHz from the capture model property."""
@@ -134,59 +166,7 @@ def get_capture_start_epoch_sec(self, capture: Capture) -> int | None:
             return start_time
         except (ValueError, IndexError, KeyError):
             return None
-
-    @extend_schema_field(serializers.IntegerField)
-    def get_data_files_count(self, capture: Capture) -> int | None:
-        """Get the count of files associated with this capture."""
-        if capture.capture_type != CaptureType.DigitalRF:
-            return None
-        
-        return get_data_files(capture.capture_type, capture).count()
-
-    @extend_schema_field(serializers.IntegerField)
-    def get_data_files_total_size(self, capture: Capture) -> int | None:
-        """Exact sum of data file sizes; use this for consistent totals with total_file_size."""
-        if capture.capture_type != CaptureType.DigitalRF:
-            return None
-        data_files = get_data_files(capture.capture_type, capture)
-        result = data_files.aggregate(total_size=Sum("size"))
-        return result.get("total_size") or 0
         
-    @extend_schema_field(serializers.FloatField)
-    def get_per_data_file_size(self, capture: Capture) -> float | None:
-        """Get the size of each data file in the capture."""
-        if capture.capture_type != CaptureType.DigitalRF:
-            return None
-        
-        data_files = get_data_files(capture.capture_type, capture)
-
-        if data_files.count() == 0:  
-            return None  
-
-        data_file_sizes = data_files.aggregate(total_size=Sum("size"))
-        total_size = data_file_sizes.get("total_size")  
-
-        if not total_size:  
-            return None  
-
-        return float(total_size) / data_files.count()
-        
-    @extend_schema_field(serializers.IntegerField)
-    def get_total_file_size(self, capture: Capture) -> int:
-        """Get the total file size of all files associated with this capture."""
-        all_files = get_capture_files(capture, include_deleted=False)
-        result = all_files.aggregate(total_size=Sum("size"))
-        total = result["total_size"] or 0
-        if capture.capture_type == CaptureType.DigitalRF:
-            data_total = self.get_data_files_total_size(capture) or 0
-            if total < data_total:
-                logging.getLogger(__name__).warning(
-                    "Capture %s: total_file_size (%s) < data_files_total_size (%s); using data total.",
-                    str(capture.uuid), total, data_total,
-                )
-                total = data_total
-        return total
-
     @extend_schema_field(serializers.DictField)
     def get_capture_props(self, capture: Capture) -> dict[str, Any]:
         """Retrieve the indexed metadata for the capture."""
@@ -376,9 +356,8 @@ class CompositeCaptureSerializer(serializers.Serializer):
 
     # Computed fields
     files = serializers.SerializerMethodField()
-    data_files_count = serializers.SerializerMethodField()
-    data_files_total_size = serializers.SerializerMethodField()
     total_file_size = serializers.SerializerMethodField()
+    data_files_info = serializers.SerializerMethodField()
     formatted_created_at = serializers.SerializerMethodField()
     length_of_capture_ms = serializers.SerializerMethodField()
     file_cadence_ms = serializers.SerializerMethodField()
@@ -399,35 +378,7 @@ def get_files(self, obj: dict[str, Any]) -> ReturnList[File]:
             all_files.extend(serializer.data)
         return cast("ReturnList[File]", all_files)
 
-    @extend_schema_field(serializers.IntegerField)
-    def get_data_files_count(self, obj: dict[str, Any]) -> int | None:
-        """Get the total count of files across all channels."""
-        if obj["capture_type"] != CaptureType.DigitalRF:
-            return None
-        
-        total_count = 0
-        for channel_data in obj["channels"]:
-            capture_uuid = channel_data["uuid"]
-            capture = Capture.objects.get(uuid=capture_uuid)
-            total_count += get_data_files(capture.capture_type, capture).count()
-        return total_count
-
-    @extend_schema_field(serializers.IntegerField)
-    def get_data_files_total_size(self, obj: dict[str, Any]) -> int | None:
-        """Exact sum of data file sizes across all channels."""
-        if obj["capture_type"] != CaptureType.DigitalRF:
-            return None
-        total = 0
-        for channel_data in obj["channels"]:
-            capture_uuid = channel_data["uuid"]
-            capture = Capture.objects.get(uuid=capture_uuid)
-            data_files = get_data_files(capture.capture_type, capture)
-            result = data_files.aggregate(total_size=Sum("size"))
-            total += result.get("total_size") or 0
-        return total
-
-    @extend_schema_field(serializers.IntegerField)
-    def get_total_file_size(self, obj: dict[str, Any]) -> int:
+    def get_total_file_size(self, obj: dict[str, Any]) -> int | None:
         """Get the total file size across all channels."""
         if obj["capture_type"] != CaptureType.DigitalRF:
             return None
@@ -439,7 +390,9 @@ def get_total_file_size(self, obj: dict[str, Any]) -> int:
             all_files = get_capture_files(capture, include_deleted=False)
             result = all_files.aggregate(total_size=Sum("size"))
             total_size += result["total_size"] or 0
-        data_total = self.get_data_files_total_size(obj) or 0
+        
+        data_total = self.get_data_files_info(obj).get("total_size", 0)
+        
         if total_size < data_total:
             logging.getLogger(__name__).warning(
                 "Composite capture: total_file_size (%s) < data_files_total_size (%s); using data total.",
@@ -448,6 +401,26 @@ def get_total_file_size(self, obj: dict[str, Any]) -> int:
             total_size = data_total
         return total_size
 
+    def get_data_files_info(self, obj: dict[str, Any]) -> dict[str, Any]:
+        """Get the data files info for the composite capture."""
+        if obj["capture_type"] != CaptureType.DigitalRF:
+            return {}
+        
+        total_count = 0
+        total_size = 0
+        for channel_data in obj["channels"]:
+            capture_uuid = channel_data["uuid"]
+            capture = Capture.objects.get(uuid=capture_uuid)
+            stats = capture.get_drf_data_files_stats()
+            total_count += stats["total_count"]
+            total_size += stats["total_size"]
+
+        return {
+            "count": total_count,
+            "total_size": total_size,
+            "per_data_file_size": (float(total_size) / total_count) if total_count else None,
+        }
+
     @extend_schema_field(serializers.CharField)
     def get_formatted_created_at(self, obj: dict[str, Any]) -> str:
         """Format the created_at timestamp for display."""
diff --git a/gateway/sds_gateway/api_methods/tests/factories.py b/gateway/sds_gateway/api_methods/tests/factories.py
index d52e6e80d..d0a00849f 100644
--- a/gateway/sds_gateway/api_methods/tests/factories.py
+++ b/gateway/sds_gateway/api_methods/tests/factories.py
@@ -13,7 +13,10 @@
 from unittest.mock import patch
 
 from django.core.files.base import ContentFile
-from factory import Faker
+from faker import Faker as FakerInstance
+from factory import Faker as FactoryFaker
+from factory import LazyAttribute
+from factory import LazyFunction
 from factory import post_generation
 from factory import Sequence
 from factory.django import DjangoModelFactory
@@ -27,6 +30,8 @@
 from sds_gateway.api_methods.models import UserSharePermission
 from sds_gateway.users.tests.factories import UserFactory
 
+# Standalone Faker for LazyFunction callbacks (not factory_boy's FactoryFaker declaration)
+_faker = FakerInstance()
 
 class DatasetFactory(DjangoModelFactory):
     """Factory for creating Dataset instances for testing.
@@ -82,22 +87,22 @@ class DatasetFactory(DjangoModelFactory):
         dataset = DatasetFactory(keywords=None)
     """
 
-    uuid = Faker("uuid4")
-    name = Faker("sentence", nb_words=3)
-    abstract = Faker("text", max_nb_chars=200)
-    description = Faker("text", max_nb_chars=500)
-    doi = Faker("uuid4")
+    uuid = FactoryFaker("uuid4")
+    name = FactoryFaker("sentence", nb_words=3)
+    abstract = FactoryFaker("text", max_nb_chars=200)
+    description = FactoryFaker("text", max_nb_chars=500)
+    doi = FactoryFaker("uuid4")
     authors = ["John Doe", "Jane Smith"]
     license = "MIT"
     institutions = ["Example University"]
-    release_date = Faker("date_time")
-    repository = Faker("url")
+    release_date = FactoryFaker("date_time")
+    repository = FactoryFaker("url")
     version = 1
-    website = Faker("url")
+    website = FactoryFaker("url")
     provenance = {"source": "test"}
     citation = {"title": "Test Dataset"}
     other = {"notes": "Test dataset"}
-    owner = Faker("subfactory", factory=UserFactory)
+    owner = FactoryFaker("subfactory", factory=UserFactory)
     is_deleted = False
     is_public = False
 
@@ -184,14 +189,14 @@ class FileFactory(DjangoModelFactory):
         file = FileFactory(dataset=dataset)
     """
 
-    uuid = Faker("uuid4")
+    uuid = FactoryFaker("uuid4")
     directory = "/files/test/"
-    name = Faker("file_name", extension="h5")
+    name = FactoryFaker("file_name", extension="h5")
     media_type = "application/x-hdf5"
     permissions = "rw-r--r--"
-    size = Faker("random_int", min=1000, max=1000000)
-    sum_blake3 = Faker("sha256")
-    owner = Faker("subfactory", factory=UserFactory)
+    size = FactoryFaker("random_int", min=1000, max=1000000)
+    sum_blake3 = FactoryFaker("sha256")
+    owner = FactoryFaker("subfactory", factory=UserFactory)
     is_deleted = False
 
     @post_generation
@@ -230,11 +235,13 @@ class CaptureFactory(DjangoModelFactory):
     class Meta:
         model = Capture
 
-    channel = Faker("word")
+    channel = FactoryFaker("word")
     capture_type = "drf"
-    top_level_dir = Faker("file_path", depth=2).replace("/", "_")
-    owner = Faker("subfactory", factory=UserFactory)
-    name = Faker("slug")
+    top_level_dir = LazyFunction(
+        lambda: _faker.file_path(depth=2).replace("/", "_")
+    )
+    owner = FactoryFaker("subfactory", factory=UserFactory)
+    name = FactoryFaker("slug")
     index_name = "captures-drf"
 
 
@@ -248,15 +255,15 @@ class DRFDataFileFactory(DjangoModelFactory):
     It also handles the creation of the Django file field with test content.
     """
 
-    uuid = Faker("uuid4")
-    directory = f"/files/{self.owner.email}/{self.capture.top_level_dir}/"
+    uuid = FactoryFaker("uuid4")
+    directory = LazyAttribute(lambda obj: f"/files/{obj.owner.email}/{obj.capture.top_level_dir}/")
     name = Sequence(lambda n: drf_rf_filename_from_ms(1000 + n * 1000))
     media_type = "application/x-hdf5"
     permissions = "rw-r----"
-    size = Faker("random_int", min=1000, max=1000000)
-    sum_blake3 = Faker("sha256")
-    owner = Faker("subfactory", factory=UserFactory)
-    capture = Faker("subfactory", factory=CaptureFactory)
+    size = FactoryFaker("random_int", min=1000, max=1000000)
+    sum_blake3 = FactoryFaker("sha256")
+    owner = FactoryFaker("subfactory", factory=UserFactory)
+    capture = FactoryFaker("subfactory", factory=CaptureFactory)
     is_deleted = False
 
     @post_generation
@@ -268,6 +275,8 @@ def file(self, create, extracted, **kwargs):
         else:
             content = b"test drf file content"
             self.file = ContentFile(content, name=self.name)
+    
+
 
     class Meta:
         model = File
@@ -305,12 +314,12 @@ class UserSharePermissionFactory(DjangoModelFactory):
         permission = UserSharePermissionFactory(is_enabled=False)
     """
 
-    owner = Faker("subfactory", factory=UserFactory)
-    shared_with = Faker("subfactory", factory=UserFactory)
-    item_type = Faker("random_element", elements=[ItemType.DATASET, ItemType.CAPTURE])
-    item_uuid = Faker("uuid4")
+    owner = FactoryFaker("subfactory", factory=UserFactory)
+    shared_with = FactoryFaker("subfactory", factory=UserFactory)
+    item_type = FactoryFaker("random_element", elements=[ItemType.DATASET, ItemType.CAPTURE])
+    item_uuid = FactoryFaker("uuid4")
     is_enabled = True
-    message = Faker("sentence", nb_words=5)
+    message = FactoryFaker("sentence", nb_words=5)
     is_deleted = False
 
     class Meta:
diff --git a/gateway/sds_gateway/api_methods/tests/test_celery_tasks.py b/gateway/sds_gateway/api_methods/tests/test_celery_tasks.py
index 7f5f16d1d..2ceff4451 100644
--- a/gateway/sds_gateway/api_methods/tests/test_celery_tasks.py
+++ b/gateway/sds_gateway/api_methods/tests/test_celery_tasks.py
@@ -1236,9 +1236,10 @@ def test_large_file_download_redirects_to_sdk(self):
 
     def test_get_item_files_with_temporal_bounds_returns_expected_rf_subset(self):
         """
-        Task-level test: start_time/end_time flow into _get_item_files and the helper
-        returns only the expected DRF data files in range (temporal_filtering logic
-        is unit-tested in test_temporal_filtering.py).
+        Task-level test: start_time/end_time flow into _get_item_files.
+        For DigitalRF captures, ``get_capture_files_with_temporal_filter`` returns
+        non-DRF capture files (metadata) plus DRF files in the selected time range
+        (temporal_filtering details are unit-tested in test_temporal_filtering.py).
         """
         # Create DRF-named files for self.capture (epoch 1s..5s)
         epoch_start_sec = 1
@@ -1269,7 +1270,7 @@ def test_get_item_files_with_temporal_bounds_returns_expected_rf_subset(self):
             "sds_gateway.api_methods.helpers.temporal_filtering.get_opensearch_client"
         ) as m:
             m.return_value.get.return_value = mock_response
-            # Relative ms: 1000–4000 ms from start → files rf@1.000.h5 .. rf@4.000.h5
+            # Relative ms: 1000–4000 from capture start → absolute 2s–5s filenames
             result = _get_item_files(
                 self.user,
                 self.capture,
@@ -1278,6 +1279,10 @@ def test_get_item_files_with_temporal_bounds_returns_expected_rf_subset(self):
                 end_time=4000,
             )
         names = [f.name for f in result]
-        # start_time=1000, end_time=4000 → absolute 2s..5s → rf@2.000.h5 .. rf@5.000.h5
-        expected = [f"rf@{i}.000.h5" for i in range(2, 6)]
-        assert names == expected, f"Expected {expected}, got {names}"
+        # DRF files in [2s, 5s] inclusive (see filter_capture_data_files_selection_bounds)
+        expected_rf = [f"rf@{i}.000.h5" for i in range(2, 6)]
+        rf_names = sorted(n for n in names if n.startswith("rf@"))
+        assert rf_names == expected_rf, f"Expected RF files {expected_rf}, got {rf_names}"
+        # Metadata / non-DRF capture files from setUp are still included in the download set
+        assert "test_file1.txt" in names
+        assert "test_file2.txt" in names
diff --git a/gateway/sds_gateway/api_methods/tests/test_temporal_filtering.py b/gateway/sds_gateway/api_methods/tests/test_temporal_filtering.py
index a9d5d8c53..fb5dfea8e 100644
--- a/gateway/sds_gateway/api_methods/tests/test_temporal_filtering.py
+++ b/gateway/sds_gateway/api_methods/tests/test_temporal_filtering.py
@@ -1,11 +1,10 @@
 import time
 
 from unittest.mock import patch
+from django.db.models import QuerySet
 from django.test import TestCase
 
 import sds_gateway.api_methods.helpers.temporal_filtering as temporal_filtering
-from sds_gateway.api_methods.models import Capture, CaptureType
-
 from sds_gateway.api_methods.tests.factories import CaptureFactory, DRFDataFileFactory, UserFactory
 
 
@@ -82,8 +81,13 @@ def test_get_file_cadence(self):
             file_cadence = temporal_filtering.get_file_cadence(
                 self.capture.capture_type, self.capture
             )
-            expected_cadence = max(1, int((end_sec - start_sec) * 1000 / (self.file_count - 1)))
-            assert file_cadence is not None
+            
+            expected_cadence = max(
+                1, int((end_sec - start_sec) * 1000 / self.file_count)
+            )
+            
+            # duration_ms / DRF data file count (get_drf_data_files_stats total_count)
+            assert self.capture.get_drf_data_files_stats()["total_count"] == self.file_count
             assert file_cadence == expected_cadence
 
     def test_file_filtering(self):
@@ -106,7 +110,8 @@ def test_file_filtering(self):
             filtered_files = temporal_filtering.filter_capture_data_files_selection_bounds(
                 self.capture.capture_type, self.capture, start_ms, end_ms
             )
-        assert filtered_files is not None
-        assert len(filtered_files) == expected_count
+        assert isinstance(filtered_files, QuerySet)
+        assert filtered_files.count() == expected_count
+        names = list(filtered_files.values_list("name", flat=True))
         for i in range(expected_count):
-            assert filtered_files[i].name == self.files[1 + i].name
+            assert names[i] == self.files[1 + i].name
diff --git a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
index 5b23012a6..e2af831a9 100644
--- a/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
+++ b/gateway/sds_gateway/static/js/actions/DownloadActionManager.js
@@ -15,20 +15,6 @@ function msToHms(ms) {
 	return hms + "." + String(decimalMs).padStart(3, "0");
 }
 
-function formatBytes(bytes) {
-	const n = Number(bytes);
-	if (!Number.isFinite(n) || n < 0) return "0 bytes";
-	if (n === 0) return "0 bytes";
-	const units = ["bytes", "KB", "MB", "GB"];
-	let i = 0;
-	let v = n;
-	while (v >= 1024 && i < units.length - 1) {
-		v /= 1024;
-		i++;
-	}
-	return (i === 0 ? v : v.toFixed(2)) + " " + units[i];
-}
-
 function formatUtcRange(startEpochSec, startMs, endMs) {
 	if (!Number.isFinite(startEpochSec)) return "—";
 	const startDate = new Date(startEpochSec * 1000 + startMs);
@@ -91,60 +77,18 @@ class DownloadActionManager {
 	 * Initialize event listeners
 	 */
 	initializeEventListeners() {
-		// Initialize download buttons for datasets
-		this.initializeDatasetDownloadButtons();
-
-		// Initialize download buttons for captures
-		this.initializeCaptureDownloadButtons();
-
 		// Initialize web download modal buttons
 		this.initializeWebDownloadButtons();
 
 		// Initialize SDK download modal buttons
 		this.initializeSDKDownloadButtons();
-
-		// Web download modal (dataset + capture)
-		this.initializeWebDownloadModal();
-	}
-
-	/**
-	 * Initialize dataset download buttons
-	 */
-	initializeDatasetDownloadButtons() {
-		const downloadButtons = document.querySelectorAll(".download-dataset-btn");
-
-		for (const button of downloadButtons) {
-			// Prevent duplicate event listener attachment
-			if (button.dataset.downloadSetup === "true") {
-				continue;
-			}
-			button.dataset.downloadSetup = "true";
-
-			button.addEventListener("click", (e) => {
-				e.preventDefault();
-				e.stopPropagation();
-
-				const datasetUuid = button.getAttribute("data-dataset-uuid");
-				const datasetName = button.getAttribute("data-dataset-name");
-
-				if (!this.permissions.canDownload()) {
-					this.showToast(
-						"You don't have permission to download this dataset",
-						"warning",
-					);
-					return;
-				}
-
-				this.handleDatasetDownload(datasetUuid, datasetName, button);
-			});
-		}
 	}
 
 	/**
-	 * Initialize capture download buttons
+	 * Initialize web download buttons on the table rows
 	 */
-	initializeCaptureDownloadButtons() {
-		const downloadButtons = document.querySelectorAll(".download-capture-btn");
+	initializeWebDownloadButtons() {
+		const downloadButtons = document.querySelectorAll(".web-download-btn");
 
 		for (const button of downloadButtons) {
 			// Prevent duplicate event listener attachment
@@ -157,175 +101,22 @@ class DownloadActionManager {
 				e.preventDefault();
 				e.stopPropagation();
 
-				const captureUuid = button.getAttribute("data-capture-uuid");
+				const itemUuid = button.getAttribute("data-item-uuid");
+				const itemType = button.getAttribute("data-item-type");
 
 				if (!this.permissions.canDownload()) {
 					this.showToast(
-						"You don't have permission to download this capture",
+						`You don't have permission to download this ${itemType}`,
 						"warning",
 					);
 					return;
 				}
 
-				this.handleCaptureDownload(captureUuid, button);
+				this.initializeWebDownloadModal(itemUuid, itemType, button);
 			});
 		}
 	}
 
-	/**
-	 * Initialize web download modal: confirm button click and modal hidden handler.
-	 * Exposes showWebDownloadModal on window for template callbacks.
-	 */
-	initializeWebDownloadModal() {
-		const webDownloadModal = document.getElementById("webDownloadModal");
-		const confirmWebDownloadBtn = document.getElementById("confirmWebDownloadBtn");
-		if (!webDownloadModal || !confirmWebDownloadBtn) return;
-
-		confirmWebDownloadBtn.addEventListener("click", () => {
-			const itemType = confirmWebDownloadBtn.dataset.itemType || "dataset";
-			const uuid = confirmWebDownloadBtn.dataset.itemUuid || confirmWebDownloadBtn.dataset.datasetUuid;
-
-			if (!uuid) return;
-
-			const startTimeInput = document.getElementById("startTime");
-			const endTimeInput = document.getElementById("endTime");
-			const startEntry = document.getElementById("startTimeEntry");
-			const endEntry = document.getElementById("endTimeEntry");
-			const modalEl = document.getElementById("webDownloadModal");
-
-			if (startEntry && endEntry && modalEl && modalEl.dataset.durationMs) {
-				const entryStart = startEntry.value.trim();
-				const entryEnd = endEntry.value.trim();
-				if (entryStart !== "" || entryEnd !== "") {
-					const durationMs = parseInt(modalEl.dataset.durationMs, 10);
-					const startMs = entryStart === "" ? 0 : parseInt(entryStart, 10);
-					const endMs = entryEnd === "" ? durationMs : parseInt(entryEnd, 10);
-					if (
-						!Number.isFinite(startMs) ||
-						!Number.isFinite(endMs) ||
-						startMs < 0 ||
-						endMs > durationMs ||
-						startMs >= endMs
-					) {
-						this.showToast(
-							"Please enter valid start/end times (0 ≤ start < end ≤ " + durationMs + " ms).",
-							"warning",
-						);
-						return;
-					}
-					if (startTimeInput) startTimeInput.value = String(startMs);
-					if (endTimeInput) endTimeInput.value = String(endMs);
-				}
-			}
-
-			const labels = this.getWebDownloadModalLabels(itemType);
-			confirmWebDownloadBtn.innerHTML = '<i class="bi bi-hourglass-split"></i> Processing...';
-			confirmWebDownloadBtn.disabled = true;
-
-			const url = "/users/download-item/" + itemType + "/" + uuid + "/";
-			const headers = {
-				"X-CSRFToken": document.querySelector("[name=csrfmiddlewaretoken]")?.value,
-			};
-			let body = null;
-			if (startTimeInput && endTimeInput && startTimeInput.value && endTimeInput.value) {
-				headers["Content-Type"] = "application/x-www-form-urlencoded";
-				body = new URLSearchParams({
-					start_time: startTimeInput.value,
-					end_time: endTimeInput.value,
-				});
-			} else {
-				headers["Content-Type"] = "application/json";
-			}
-
-			fetch(url, { method: "POST", headers, body })
-				.then((response) => {
-					const contentType = response.headers.get("content-type");
-					if (contentType && contentType.includes("application/json")) {
-						return response.json();
-					}
-					return response.text().then((text) => {
-						throw new Error("Server returned non-JSON response: " + text);
-					});
-				})
-				.then((data) => {
-					if (data.success === true) {
-						this.showToast(
-							data.message ||
-								"Download request submitted successfully! You will receive an email when ready.",
-							"success",
-						);
-						const modal = bootstrap.Modal.getInstance(webDownloadModal);
-						if (modal) modal.hide();
-					} else {
-						this.showToast(
-							"Error requesting download: " + (data.message || "Unknown error"),
-							"danger",
-						);
-					}
-				})
-				.catch((error) => {
-					console.error("Download error:", error);
-					this.showToast(
-						error.message || "An error occurred while processing your request.",
-						"danger",
-					);
-				})
-				.finally(() => {
-					confirmWebDownloadBtn.innerHTML =
-						'<i class="bi bi-download"></i> ' + labels.confirmText;
-					confirmWebDownloadBtn.disabled = false;
-				});
-		});
-
-		webDownloadModal.addEventListener("hidden.bs.modal", () => {
-			confirmWebDownloadBtn.dataset.itemType = "";
-			confirmWebDownloadBtn.dataset.itemUuid = "";
-			confirmWebDownloadBtn.dataset.itemName = "";
-			confirmWebDownloadBtn.dataset.datasetUuid = "";
-			confirmWebDownloadBtn.dataset.datasetName = "";
-			const nameEl = document.getElementById("webDownloadDatasetName");
-			if (nameEl) nameEl.textContent = "";
-		});
-
-		window.showWebDownloadModal = (a1, a2) => {
-			const options =
-				typeof a1 === "string" && a2 !== undefined
-					? { itemType: "dataset", uuid: a1, name: a2 }
-					: a1;
-			this.showWebDownloadModal(options);
-		};
-	}
-
-	/**
-	 * Open web download modal for a dataset or capture.
-	 * @param {{ itemType?: string, uuid: string, name?: string }} options - itemType 'dataset'|'capture', uuid, name
-	 */
-	showWebDownloadModal(options) {
-		const { itemType = "dataset", uuid, name } = options || {};
-		const nameEl = document.getElementById("webDownloadDatasetName");
-		const confirmBtn = document.getElementById("confirmWebDownloadBtn");
-		const modalEl = document.getElementById("webDownloadModal");
-		const titleEl = document.getElementById("webDownloadModalLabel");
-
-		if (nameEl) nameEl.textContent = name || "";
-		if (confirmBtn) {
-			confirmBtn.dataset.itemType = itemType;
-			confirmBtn.dataset.itemUuid = uuid || "";
-			confirmBtn.dataset.itemName = name || "";
-		}
-		// Update title and button text from item type
-		const labels = this.getWebDownloadModalLabels(itemType);
-		if (titleEl && window.DOMUtils) {
-			window.DOMUtils.renderContent(titleEl, { icon: "download", text: labels.title });
-		}
-		if (confirmBtn && window.DOMUtils) {
-			window.DOMUtils.renderContent(confirmBtn, { icon: "download", text: labels.confirmText });
-		}
-		if (modalEl && window.bootstrap) {
-			new bootstrap.Modal(modalEl).show();
-		}
-	}
-
 	/**
 	 * Initialize or update the capture download temporal slider. Call before
      * showing the modal when opening for a capture with known bounds.
@@ -333,41 +124,44 @@ class DownloadActionManager {
      * @param {number} fileCadenceMs - File cadence in milliseconds (step)
      * @param {Object} opts - Optional: { perDataFileSize, totalSize, dataFilesCount, totalFilesCount, dataFilesTotalSize, captureUuid, captureStartEpochSec }
      */
-	initializeCaptureDownloadSlider(durationMs, fileCadenceMs, opts) {
+	initializeCaptureDownloadSlider(modalId, durationMs, fileCadenceMs, opts) {
+		const webDownloadModal = document.getElementById(modalId);
+		if (!webDownloadModal) return;
+
 		opts = opts || {};
-		var sliderEl = document.getElementById('temporalFilterSlider');
-		var rangeLabel = document.getElementById('temporalFilterRangeLabel');
-		var totalFilesLabel = document.getElementById('totalFilesLabel');
-		var metadataFilesLabel = document.getElementById('metadataFilesLabel');
-		var totalSizeLabel = document.getElementById('totalSizeLabel');
-		var dateTimeLabel = document.getElementById('dateTimeLabel');
-		var startTimeInput = document.getElementById('startTime');
-		var endTimeInput = document.getElementById('endTime');
-		var startTimeEntry = document.getElementById('startTimeEntry');
-		var endTimeEntry = document.getElementById('endTimeEntry');
-		var startDateTimeEntry = document.getElementById('startDateTimeEntry');
-		var endDateTimeEntry = document.getElementById('endDateTimeEntry');
-		var rangeHintEl = document.getElementById('temporalRangeHint');
-		var sizeWarningEl = document.getElementById('temporalFilterSizeWarning');
-		var webDownloadModal = document.getElementById('webDownloadModal');
+		const q = (id) => webDownloadModal.querySelector("#" + id);
+		const sliderEl = q("temporalFilterSlider");
+		const rangeLabel = q("temporalFilterRangeLabel");
+		const totalFilesLabel = q("totalFilesLabel");
+		const metadataFilesLabel = q("metadataFilesLabel");
+		const totalSizeLabel = q("totalSizeLabel");
+		const dateTimeLabel = q("dateTimeLabel");
+		const startTimeInput = q("startTime");
+		const endTimeInput = q("endTime");
+		const startTimeEntry = q("startTimeEntry");
+		const endTimeEntry = q("endTimeEntry");
+		const startDateTimeEntry = q("startDateTimeEntry");
+		const endDateTimeEntry = q("endDateTimeEntry");
+		const rangeHintEl = q("temporalRangeHint");
+		const sizeWarningEl = q("temporalFilterSizeWarning");
 		if (!sliderEl || typeof noUiSlider === 'undefined') return;
 		durationMs = Number(durationMs);
 		if (!Number.isFinite(durationMs) || durationMs < 0) durationMs = 0;
 		fileCadenceMs = Number(fileCadenceMs);
 		if (!Number.isFinite(fileCadenceMs) || fileCadenceMs < 1) fileCadenceMs = 1000;
-		var perDataFileSize = Number(opts.perDataFileSize) || 0;
-		var totalSize = Number(opts.totalSize) || 0;
-		var dataFilesCount = Number(opts.dataFilesCount) || 0;
-		var totalFilesCount = Number(opts.totalFilesCount) || 0;
-		var dataFilesTotalSize = Number(opts.dataFilesTotalSize);
+		const perDataFileSize = Number(opts.perDataFileSize) || 0;
+		const totalSize = Number(opts.totalSize) || 0;
+		const dataFilesCount = Number(opts.dataFilesCount) || 0;
+		const totalFilesCount = Number(opts.totalFilesCount) || 0;
+		let dataFilesTotalSize = Number(opts.dataFilesTotalSize);
 		if (!Number.isFinite(dataFilesTotalSize) || dataFilesTotalSize < 0) {
 			dataFilesTotalSize = perDataFileSize * dataFilesCount;
 		}
-		var metadataFilesTotalSize = totalSize - dataFilesTotalSize;
+		let metadataFilesTotalSize = totalSize - dataFilesTotalSize;
 		if (metadataFilesTotalSize < 0) metadataFilesTotalSize = 0;
-		var metadataFilesCount = Math.max(0, totalFilesCount - dataFilesCount);
-		var captureUuid = opts.captureUuid != null ? String(opts.captureUuid) : '';
-		var captureStartEpochSec = Number(opts.captureStartEpochSec);
+		const metadataFilesCount = Math.max(0, totalFilesCount - dataFilesCount);
+		const captureUuid = opts.captureUuid != null ? String(opts.captureUuid) : '';
+		const captureStartEpochSec = Number(opts.captureStartEpochSec);
 		if (totalSize > 0 && dataFilesTotalSize > totalSize) {
 			console.warn(
 				'[DownloadActionManager] data files total size exceeds total size (backend/query inconsistency).',
@@ -392,13 +186,13 @@ class DownloadActionManager {
 		}
 		if (rangeLabel) rangeLabel.textContent = '—';
 		if (totalFilesLabel) totalFilesLabel.textContent = '0 files';
-		if (totalSizeLabel) totalSizeLabel.textContent = formatBytes(totalSize);
+		if (totalSizeLabel) totalSizeLabel.textContent = window.DOMUtils.formatFileSize(totalSize);
 		if (dateTimeLabel) dateTimeLabel.textContent = '—';
 		if (startTimeInput) startTimeInput.value = '';
 		if (endTimeInput) endTimeInput.value = '';
 		if (startTimeEntry) startTimeEntry.value = '';
 		if (endTimeEntry) endTimeEntry.value = '';
-		var hasEpoch = Number.isFinite(captureStartEpochSec);
+		const hasEpoch = Number.isFinite(captureStartEpochSec);
 		if (startDateTimeEntry) {
 			startDateTimeEntry.value = '';
 			startDateTimeEntry.disabled = !hasEpoch;
@@ -408,11 +202,12 @@ class DownloadActionManager {
 			endDateTimeEntry.disabled = !hasEpoch;
 		}
 		if (durationMs <= 0) return;
-		var fpStart = null, fpEnd = null;
-		var epochStart = captureStartEpochSec * 1000;
-		var epochEnd = epochStart + durationMs;
+		let fpStart = null;
+		let fpEnd = null;
+		const epochStart = captureStartEpochSec * 1000;
+		const epochEnd = epochStart + durationMs;
 		if (hasEpoch && typeof flatpickr !== 'undefined' && startDateTimeEntry && endDateTimeEntry) {
-			var fpOpts = {
+			const fpOpts = {
 				enableTime: true,
 				enableSeconds: true,
 				utc: true,
@@ -442,11 +237,11 @@ class DownloadActionManager {
 			range: { min: 0, max: durationMs },
 		});
 		sliderEl.noUiSlider.on('update', function(values) {
-			var startMs = Number(values[0]);
-			var endMs = Number(values[1]);
+			const startMs = Number(values[0]);
+			const endMs = Number(values[1]);
 			// the + 1 is to include the first file in the selection
 			// as file cadence is the time between files, not the time of the file
-			var filesInSelection = Math.round((endMs - startMs) / fileCadenceMs) + 1;
+			const filesInSelection = Math.round((endMs - startMs) / fileCadenceMs) + 1;
 			if (rangeLabel) {
 				rangeLabel.textContent = msToHms(startMs) + ' - ' + msToHms(endMs);
 			}
@@ -456,7 +251,7 @@ class DownloadActionManager {
 					: filesInSelection + ' files';
 			}
 			if (totalSizeLabel) {
-				totalSizeLabel.textContent = formatBytes(
+				totalSizeLabel.textContent = window.DOMUtils.formatFileSize(
 					(perDataFileSize * filesInSelection) + metadataFilesTotalSize
 				);
 			}
@@ -490,8 +285,8 @@ class DownloadActionManager {
 		if (dateTimeLabel && Number.isFinite(captureStartEpochSec)) {
 			dateTimeLabel.textContent = formatUtcRange(captureStartEpochSec, 0, durationMs);
 		}
-		var startVal = '0';
-		var endVal = String(durationMs);
+		const startVal = '0';
+		const endVal = String(durationMs);
 		if (startTimeInput) startTimeInput.value = startVal;
 		if (endTimeInput) endTimeInput.value = endVal;
 		if (startTimeEntry) startTimeEntry.value = startVal;
@@ -506,10 +301,10 @@ class DownloadActionManager {
 
 		function syncSliderFromEntries() {
 			if (!sliderEl.noUiSlider || !startTimeEntry || !endTimeEntry) return;
-			var s = startTimeEntry.value.trim();
-			var e = endTimeEntry.value.trim();
-			var startMs = s === '' ? 0 : parseInt(s, 10);
-			var endMs = e === '' ? durationMs : parseInt(e, 10);
+			const s = startTimeEntry.value.trim();
+			const e = endTimeEntry.value.trim();
+			let startMs = s === '' ? 0 : parseInt(s, 10);
+			let endMs = e === '' ? durationMs : parseInt(e, 10);
 			if (!Number.isFinite(startMs)) startMs = 0;
 			if (!Number.isFinite(endMs)) endMs = durationMs;
 			startMs = Math.max(0, Math.min(startMs, durationMs));
@@ -519,10 +314,10 @@ class DownloadActionManager {
 		}
 		function syncFromDateTimeEntries() {
 			if (!hasEpoch || !sliderEl.noUiSlider || !startDateTimeEntry || !endDateTimeEntry) return;
-			var startMs, endMs;
+			let startMs, endMs;
 			if (startDateTimeEntry._flatpickr && endDateTimeEntry._flatpickr) {
-				var dStart = startDateTimeEntry._flatpickr.selectedDates[0];
-				var dEnd = endDateTimeEntry._flatpickr.selectedDates[0];
+				const dStart = startDateTimeEntry._flatpickr.selectedDates[0];
+				const dEnd = endDateTimeEntry._flatpickr.selectedDates[0];
 				startMs = dStart ? dStart.getTime() - epochStart : 0;
 				endMs = dEnd ? dEnd.getTime() - epochStart : durationMs;
 			} else {
@@ -533,7 +328,7 @@ class DownloadActionManager {
 			startMs = Math.max(0, Math.min(startMs, durationMs));
 			endMs = Math.max(0, Math.min(endMs, durationMs));
 			if (startMs >= endMs) endMs = Math.min(startMs + fileCadenceMs, durationMs);
-			var cur = sliderEl.noUiSlider.get();
+			const cur = sliderEl.noUiSlider.get();
 			if (Math.round(Number(cur[0])) === Math.round(startMs) && Math.round(Number(cur[1])) === Math.round(endMs)) return;
 			sliderEl.noUiSlider.set([startMs, endMs]);
 		}
@@ -543,38 +338,93 @@ class DownloadActionManager {
 		if (endDateTimeEntry && !endDateTimeEntry._flatpickr) endDateTimeEntry.addEventListener('change', syncFromDateTimeEntries);
 	}
 
-	/**
-	 * Labels for web download modal by item type (dataset vs capture).
-	 * @param {string} itemType - 'dataset' or 'capture'
-	 * @returns {{ title: string, confirmText: string }}
-	 */
-	getWebDownloadModalLabels(itemType) {
-		const t = (itemType || "dataset").toLowerCase();
-		return {
-			title: t === "capture" ? "Download Capture" : "Download Dataset",
-			confirmText:
-				t === "capture" ? "Yes, Download Capture" : "Yes, Download Dataset",
-		};
+	setTemporalSliderAttrs(modalId, button, itemUuid) {
+		// Initialize temporal slider from button data attributes (clears or builds slider)
+		let durationMs = parseInt(button.getAttribute("data-length-of-capture-ms"), 10);
+		let fileCadenceMs = parseInt(button.getAttribute("data-file-cadence-ms"), 10);
+		let perDataFileSize = parseFloat(button.getAttribute("data-per-data-file-size"));
+		let dataFilesCount = parseInt(button.getAttribute("data-data-files-count"), 10);
+		let dataFilesTotalSize = parseInt(button.getAttribute("data-total-data-file-size"), 10);
+		let totalSize = parseInt(button.getAttribute("data-total-size"), 10);
+		let totalFilesCount = parseInt(button.getAttribute("data-total-files-count"), 10);
+		let captureStartEpochSec = parseInt(button.getAttribute("data-capture-start-epoch-sec"), 10);
+		this.initializeCaptureDownloadSlider(
+			modalId,
+			Number.isNaN(durationMs) ? 0 : durationMs,
+			Number.isNaN(fileCadenceMs) ? 1000 : fileCadenceMs,
+			{
+				perDataFileSize: Number.isNaN(perDataFileSize) ? 0 : perDataFileSize,
+				totalSize: Number.isNaN(totalSize) ? 0 : totalSize,
+				dataFilesCount: Number.isNaN(dataFilesCount) ? 0 : dataFilesCount,
+				totalFilesCount: Number.isNaN(totalFilesCount) ? 0 : totalFilesCount,
+				dataFilesTotalSize: Number.isNaN(dataFilesTotalSize) ? undefined : dataFilesTotalSize,
+				captureUuid: itemUuid || undefined,
+				captureStartEpochSec: Number.isNaN(captureStartEpochSec) ? undefined : captureStartEpochSec,
+			},
+		);
+	}
+
+	addTimeFilteringToFetchRequest(modalId) {
+		const modalEl = document.getElementById(modalId);
+		if (!modalEl) {
+			return { body: {}, isJson: false };
+		}
+		const startTimeInput = modalEl.querySelector("#startTime");
+		const endTimeInput = modalEl.querySelector("#endTime");
+		const startEntry = modalEl.querySelector("#startTimeEntry");
+		const endEntry = modalEl.querySelector("#endTimeEntry");
+
+		if (startEntry && endEntry && modalEl && modalEl.dataset.durationMs) {
+			const entryStart = startEntry.value.trim();
+			const entryEnd = endEntry.value.trim();
+			if (entryStart !== "" || entryEnd !== "") {
+				const durationMs = parseInt(modalEl.dataset.durationMs, 10);
+				const startMs = entryStart === "" ? 0 : parseInt(entryStart, 10);
+				const endMs = entryEnd === "" ? durationMs : parseInt(entryEnd, 10);
+				if (
+					!Number.isFinite(startMs) ||
+					!Number.isFinite(endMs) ||
+					startMs < 0 ||
+					endMs > durationMs ||
+					startMs >= endMs
+				) {
+					this.showToast(
+						"Please enter valid start/end times (0 ≤ start < end ≤ " + durationMs + " ms).",
+						"warning",
+					);
+					return;
+				}
+				if (startTimeInput) startTimeInput.value = String(startMs);
+				if (endTimeInput) endTimeInput.value = String(endMs);
+			}
+		}
+
+		let body = {};
+		let isJson = true;
+		if (startTimeInput && endTimeInput && startTimeInput.value && endTimeInput.value) {
+			body.start_time = startTimeInput.value;
+			body.end_time = endTimeInput.value;
+			isJson = false;
+		}
+
+		return { body, isJson };
 	}
 
 	/**
-	 * Handle dataset download
-	 * @param {string} datasetUuid - Dataset UUID
-	 * @param {string} datasetName - Dataset name
+	 * Initialize web download modal for assets
 	 * @param {Element} button - Download button element
 	 */
-	async handleDatasetDownload(datasetUuid, datasetName, button) {
-		// Update modal content
-		const modalNameElement = document.getElementById("downloadDatasetName");
-		if (modalNameElement) {
-			modalNameElement.textContent = datasetName;
-		}
-
+	async initializeWebDownloadModal(itemUuid, itemType, button) {
+		const modalId = `webDownloadModal-${itemUuid}`;
 		// Show the modal
-		window.DOMUtils.openModal("downloadModal");
+		window.DOMUtils.openModal(modalId);
+
+		if (itemType === "capture") {
+			this.setTemporalSliderAttrs(modalId, button, itemUuid);
+		}
 
 		// Handle confirm download
-		const confirmBtn = document.getElementById("confirmDownloadBtn");
+		const confirmBtn = document.getElementById(`confirmWebDownloadBtn-${itemUuid}`);
 		if (!confirmBtn) return;
 
 		// Remove any existing event listeners
@@ -582,9 +432,6 @@ class DownloadActionManager {
 		confirmBtn.parentNode.replaceChild(newConfirmBtn, confirmBtn);
 
 		newConfirmBtn.onclick = async () => {
-			// Close modal first
-			window.DOMUtils.closeModal("downloadModal");
-
 			// Show loading state
 			const originalContent = button.innerHTML;
 			await window.DOMUtils.renderLoading(button, "Processing...", {
@@ -593,10 +440,23 @@ class DownloadActionManager {
 			});
 			button.disabled = true;
 
+			// Close modal
+			window.DOMUtils.closeModal(modalId);
+
+			let body = {};
+			let isJson = false;
 			try {
+
+				if (itemType === "capture") {
+					const result = this.addTimeFilteringToFetchRequest(modalId);
+					body = result.body;
+					isJson = result.isJson;
+				}
 				const response = await window.APIClient.post(
-					`/users/download-item/dataset/${datasetUuid}/`,
-					{},
+					`/users/download-item/${itemType}/${itemUuid}/`,
+					body,
+					null,
+					isJson,
 				);
 
 				if (response.success === true) {
@@ -642,104 +502,6 @@ class DownloadActionManager {
 		};
 	}
 
-	/**
-	 * Handle capture download (modal copy comes from web_download_modal.html)
-	 * @param {string} captureUuid - Capture UUID
-	 * @param {Element} [button] - Optional row action button for loading state
-	 */
-	async handleCaptureDownload(captureUuid, button) {
-		const modalId = `webDownloadModal-${captureUuid}`;
-		const modal = document.getElementById(modalId);
-		if (!modal) {
-			console.warn(`Web download modal not found for capture ${captureUuid}`);
-			return;
-		}
-
-		const labels = this.getWebDownloadModalLabels("capture");
-		const modalTitleElement = document.getElementById("webDownloadModalLabel");
-		const modalNameElement = document.getElementById("webDownloadDatasetName");
-		const confirmBtn = document.getElementById("confirmWebDownloadBtn");
-
-		if (modalTitleElement) {
-			await window.DOMUtils.renderContent(modalTitleElement, {
-				icon: "download",
-				text: labels.title,
-			});
-		}
-
-		const newConfirmBtn = confirmBtn.cloneNode(true);
-		confirmBtn.parentNode.replaceChild(newConfirmBtn, confirmBtn);
-
-		if (confirmBtn) {
-			await window.DOMUtils.renderContent(confirmBtn, {
-				icon: "download",
-				text: labels.confirmText,
-			});
-			confirmBtn.dataset.itemType = "capture";
-			confirmBtn.dataset.itemUuid = captureUuid;
-			confirmBtn.dataset.itemName = captureName || "Unnamed Capture";
-		}
-
-		// Initialize temporal slider from button data attributes (clears or builds slider)
-		const durationMs = parseInt(button.getAttribute("data-length-of-capture-ms"), 10);
-		const fileCadenceMs = parseInt(button.getAttribute("data-file-cadence-ms"), 10);
-		const perDataFileSize = parseFloat(button.getAttribute("data-per-data-file-size"), 10);
-		const totalSize = parseInt(button.getAttribute("data-total-size"), 10);
-		const dataFilesCount = parseInt(button.getAttribute("data-data-files-count"), 10);
-		const totalFilesCount = parseInt(button.getAttribute("data-total-files-count"), 10);
-		const dataFilesTotalSizeRaw = button.getAttribute("data-data-files-total-size");
-		const dataFilesTotalSize = dataFilesTotalSizeRaw !== null && dataFilesTotalSizeRaw !== '' ? parseInt(dataFilesTotalSizeRaw, 10) : NaN;
-		const captureStartEpochSec = parseInt(button.getAttribute("data-capture-start-epoch-sec"), 10);
-		this.initializeCaptureDownloadSlider(
-			Number.isNaN(durationMs) ? 0 : durationMs,
-			Number.isNaN(fileCadenceMs) ? 1000 : fileCadenceMs,
-			{
-				perDataFileSize: Number.isNaN(perDataFileSize) ? 0 : perDataFileSize,
-				totalSize: Number.isNaN(totalSize) ? 0 : totalSize,
-				dataFilesCount: Number.isNaN(dataFilesCount) ? 0 : dataFilesCount,
-				totalFilesCount: Number.isNaN(totalFilesCount) ? 0 : totalFilesCount,
-				dataFilesTotalSize: Number.isNaN(dataFilesTotalSize) ? undefined : dataFilesTotalSize,
-				captureUuid: captureUuid || undefined,
-				captureStartEpochSec: Number.isNaN(captureStartEpochSec) ? undefined : captureStartEpochSec,
-			},
-		);
-
-		// Show the modal
-		this.openCustomModal("webDownloadModal");
-	}
-
-	/**
-	 * Initialize web download modal buttons
-	 */
-	initializeWebDownloadButtons() {
-		// Find all web download buttons (by data attribute or class)
-		const webDownloadButtons = document.querySelectorAll(
-			'[data-action="web-download"], .web-download-btn',
-		);
-
-		for (const button of webDownloadButtons) {
-			// Prevent duplicate event listener attachment
-			if (button.dataset.downloadSetup === "true") {
-				continue;
-			}
-			button.dataset.downloadSetup = "true";
-
-			button.addEventListener("click", (e) => {
-				e.preventDefault();
-				e.stopPropagation();
-
-				const datasetUuid = button.getAttribute("data-dataset-uuid");
-
-				if (!datasetUuid) {
-					console.warn("Web download button missing dataset-uuid attribute");
-					return;
-				}
-
-				this.openWebDownloadModal(datasetUuid);
-			});
-		}
-	}
-
 	/**
 	 * Initialize SDK download modal buttons
 	 */
@@ -772,96 +534,6 @@ class DownloadActionManager {
 		}
 	}
 
-	/**
-	 * Open web download modal for a specific dataset (labels from web_download_modal.html)
-	 * @param {string} datasetUuid - Dataset UUID
-	 */
-	openWebDownloadModal(datasetUuid) {
-		const modalId = `webDownloadModal-${datasetUuid}`;
-		const modal = document.getElementById(modalId);
-		if (!modal) {
-			console.warn(`Web download modal not found for dataset ${datasetUuid}`);
-			return;
-		}
-
-		const confirmBtn = document.getElementById(
-			`confirmWebDownloadBtn-${datasetUuid}`,
-		);
-
-		if (!confirmBtn) {
-			console.warn(`Confirm button not found for dataset ${datasetUuid}`);
-			return;
-		}
-
-		// Remove any existing event listeners by cloning
-		const newConfirmBtn = confirmBtn.cloneNode(true);
-		confirmBtn.parentNode.replaceChild(newConfirmBtn, confirmBtn);
-
-		// Attach download handler
-		newConfirmBtn.onclick = async () => {
-			// Close modal first
-			window.DOMUtils.closeModal(modalId);
-
-			// Show loading state
-			const originalContent = newConfirmBtn.innerHTML;
-			await window.DOMUtils.renderLoading(newConfirmBtn, "Processing...", {
-				format: "spinner",
-				size: "sm",
-			});
-			newConfirmBtn.disabled = true;
-
-			try {
-				const response = await window.APIClient.post(
-					`/users/download-item/dataset/${datasetUuid}/`,
-					{},
-				);
-
-				if (response.success === true) {
-					await window.DOMUtils.renderContent(newConfirmBtn, {
-						icon: "check-circle",
-						color: "success",
-						text: "Download Requested",
-					});
-					this.showToast(
-						response.message ||
-							"Download request submitted successfully! You will receive an email when ready.",
-						"success",
-					);
-				} else {
-					await window.DOMUtils.renderContent(newConfirmBtn, {
-						icon: "exclamation-triangle",
-						color: "danger",
-						text: "Request Failed",
-					});
-					this.showToast(
-						response.message || "Download request failed. Please try again.",
-						"danger",
-					);
-				}
-			} catch (error) {
-				console.error("Download error:", error);
-				await window.DOMUtils.renderContent(newConfirmBtn, {
-					icon: "exclamation-triangle",
-					color: "danger",
-					text: "Request Failed",
-				});
-				this.showToast(
-					error.message || "An error occurred while processing your request.",
-					"danger",
-				);
-			} finally {
-				// Reset button after 3 seconds
-				setTimeout(() => {
-					newConfirmBtn.innerHTML = originalContent;
-					newConfirmBtn.disabled = false;
-				}, 3000);
-			}
-		};
-
-		// Use centralized openModal method
-		window.DOMUtils.openModal(modalId);
-	}
-
 	/**
 	 * Open SDK download modal for a specific dataset
 	 * @param {string} datasetUuid - Dataset UUID
@@ -907,65 +579,6 @@ class DownloadActionManager {
 		}
 	}
 
-	/**
-	 * Initialize download buttons for dynamically loaded content
-	 * @param {Element} container - Container element to search within
-	 */
-	initializeDownloadButtonsForContainer(container) {
-		// Initialize dataset download buttons in the container
-		const datasetDownloadButtons = container.querySelectorAll(
-			".download-dataset-btn",
-		);
-		for (const button of datasetDownloadButtons) {
-			if (!button.dataset.downloadSetup) {
-				button.dataset.downloadSetup = "true";
-				button.addEventListener("click", (e) => {
-					e.preventDefault();
-					e.stopPropagation();
-
-					const datasetUuid = button.getAttribute("data-dataset-uuid");
-					const datasetName = button.getAttribute("data-dataset-name");
-
-					if (!this.permissions.canDownload()) {
-						this.showToast(
-							"You don't have permission to download this dataset",
-							"warning",
-						);
-						return;
-					}
-
-					this.handleDatasetDownload(datasetUuid, datasetName, button);
-				});
-			}
-		}
-
-		// Initialize capture download buttons in the container
-		const captureDownloadButtons = container.querySelectorAll(
-			".download-capture-btn",
-		);
-		for (const button of captureDownloadButtons) {
-			if (!button.dataset.downloadSetup) {
-				button.dataset.downloadSetup = "true";
-				button.addEventListener("click", (e) => {
-					e.preventDefault();
-					e.stopPropagation();
-
-					const captureUuid = button.getAttribute("data-capture-uuid");
-
-					if (!this.permissions.canDownload()) {
-						this.showToast(
-							"You don't have permission to download this capture",
-							"warning",
-						);
-						return;
-					}
-
-					this.handleCaptureDownload(captureUuid, button);
-				});
-			}
-		}
-	}
-
 	/**
 	 * Check if user can download specific item
 	 * @param {Object} item - Item object
@@ -999,11 +612,10 @@ class DownloadActionManager {
 	cleanup() {
 		// Remove event listeners and clean up any resources
 		const downloadButtons = document.querySelectorAll(
-			".download-dataset-btn, .download-capture-btn",
+			".web-download-btn",
 		);
 		for (const button of downloadButtons) {
-			button.removeEventListener("click", this.handleDatasetDownload);
-			button.removeEventListener("click", this.handleCaptureDownload);
+			button.removeEventListener("click", this.initializeWebDownloadButtons);
 		}
 	}
 }
diff --git a/gateway/sds_gateway/static/js/actions/__tests__/DownloadActionManager.test.js b/gateway/sds_gateway/static/js/actions/__tests__/DownloadActionManager.test.js
index 29944286f..7f3369262 100644
--- a/gateway/sds_gateway/static/js/actions/__tests__/DownloadActionManager.test.js
+++ b/gateway/sds_gateway/static/js/actions/__tests__/DownloadActionManager.test.js
@@ -55,17 +55,11 @@ describe("DownloadActionManager", () => {
 		// Mock document methods
 		document.querySelector = jest.fn(() => mockButton);
 		document.querySelectorAll = jest.fn((selector) => {
-			if (selector === ".download-dataset-btn") return [mockButton];
-			if (selector === ".download-capture-btn") return [mockButton];
-			if (selector === ".download-dataset-btn, .download-capture-btn")
-				return [mockButton];
+			if (selector === ".web-download-btn") return [mockButton];
 			return [];
 		});
 
 		document.getElementById = jest.fn((id) => {
-			if (id === "downloadModal") return mockModal;
-			if (id === "downloadDatasetName") return { textContent: "" };
-			if (id === "confirmDownloadBtn") return mockButton;
 			if (id.startsWith("webDownloadModal-")) return mockModal;
 			if (id.startsWith("webDownloadModalLabel-")) return { innerHTML: "" };
 			if (id.startsWith("webDownloadDatasetName-")) return { textContent: "" };
@@ -163,25 +157,22 @@ describe("DownloadActionManager", () => {
 				addEventListener: jest.fn(),
 				dataset: { downloadSetup: "false" },
 				getAttribute: jest.fn((attr) => {
-					if (attr === "data-dataset-uuid") return "test-dataset-uuid";
-					if (attr === "data-dataset-name") return "Test Dataset";
+					if (attr === "data-item-uuid") return "test-item-uuid";
+					if (attr === "data-item-type") return "dataset";
 					return null;
 				}),
 			};
 
 			document.querySelectorAll = jest.fn((selector) => {
-				if (selector === ".download-dataset-btn") return [mockButton];
-				if (selector === ".download-capture-btn") return [mockButton];
-				if (selector === ".download-dataset-btn, .download-capture-btn")
-					return [mockButton];
+				if (selector === ".web-download-btn") return [mockButton];
 				return [];
 			});
 
 			document.getElementById = jest.fn((id) => {
-				if (id === "downloadDatasetName") {
+				if (id.startsWith("webDownloadDatasetName-")) {
 					return { textContent: "" };
 				}
-				if (id === "confirmDownloadBtn") {
+				if (id.startsWith("confirmWebDownloadBtn-")) {
 					return {
 						cloneNode: jest.fn(() => {
 							clonedConfirmBtn = {
@@ -199,16 +190,14 @@ describe("DownloadActionManager", () => {
 			downloadManager = new DownloadActionManager({
 				permissions: { canDownload: () => true },
 			});
-			downloadManager.openCustomModal = jest.fn();
-			downloadManager.closeCustomModal = jest.fn();
 			downloadManager.showToast = jest.fn();
 		});
 
-		test("should initialize dataset download buttons", () => {
-			downloadManager.initializeDatasetDownloadButtons();
+		test("should initialize web download buttons", () => {
+			downloadManager.initializeWebDownloadButtons();
 
 			expect(document.querySelectorAll).toHaveBeenCalledWith(
-				".download-dataset-btn",
+				".web-download-btn",
 			);
 			expect(mockButton.addEventListener).toHaveBeenCalledWith(
 				"click",
@@ -222,9 +211,9 @@ describe("DownloadActionManager", () => {
 				message: "Download request submitted",
 			});
 
-			await downloadManager.handleDatasetDownload(
-				"test-uuid",
-				"Test Dataset",
+			await downloadManager.initializeWebDownloadModal(
+				"test-item-uuid",
+				"dataset",
 				mockButton,
 			);
 
@@ -236,8 +225,10 @@ describe("DownloadActionManager", () => {
 			await new Promise((resolve) => setTimeout(resolve, 0));
 
 			expect(mockAPIClient.post).toHaveBeenCalledWith(
-				"/users/download-item/dataset/test-uuid/",
+				"/users/download-item/dataset/test-item-uuid/",
 				{},
+				null,
+				false,
 			);
 			expect(window.DOMUtils.renderContent).toHaveBeenCalledWith(
 				mockButton,
@@ -266,7 +257,7 @@ describe("DownloadActionManager", () => {
 			// Clear previous calls
 			mockButtonWithSetup.addEventListener.mockClear();
 
-			downloadManager.initializeDatasetDownloadButtons();
+			downloadManager.initializeWebDownloadButtons();
 
 			expect(mockButtonWithSetup.addEventListener).not.toHaveBeenCalled();
 		});
@@ -297,35 +288,60 @@ describe("DownloadActionManager", () => {
 
 	describe("Capture Download Functionality", () => {
 		beforeEach(() => {
-			if (!window.DOMUtils) window.DOMUtils = {};
-			window.DOMUtils.showAlert = jest.fn();
+			window.DOMUtils = {
+				...global.window.DOMUtils,
+				openModal: jest.fn(),
+				closeModal: jest.fn(),
+				renderLoading: jest.fn().mockResolvedValue(true),
+				renderContent: jest.fn().mockResolvedValue(true),
+				showAlert: jest.fn(),
+			};
 			downloadManager = new DownloadActionManager({
 				permissions: mockPermissions,
 			});
 		});
 
-		test("should initialize capture download buttons", () => {
-			downloadManager.initializeCaptureDownloadButtons();
+		test("should configure temporal slider when opening web download for capture", async () => {
+			const spy = jest
+				.spyOn(downloadManager, "setTemporalSliderAttrs")
+				.mockImplementation(() => {});
 
-			expect(document.querySelectorAll).toHaveBeenCalledWith(
-				".download-capture-btn",
-			);
-			expect(mockButton.addEventListener).toHaveBeenCalledWith(
-				"click",
-				expect.any(Function),
-			);
-		});
+			document.getElementById = jest.fn((id) => {
+				if (id.startsWith("confirmWebDownloadBtn-")) {
+					return {
+						cloneNode: jest.fn(() => ({
+							parentNode: { replaceChild: jest.fn() },
+							onclick: null,
+						})),
+						parentNode: { replaceChild: jest.fn() },
+					};
+				}
+				return null;
+			});
 
-		test("should handle capture download click with permissions", async () => {
-			const captureUuid = "test-capture-uuid";
+			const captureBtn = {
+				innerHTML: "Download",
+				disabled: false,
+				dataset: {},
+				getAttribute: jest.fn((attr) => {
+					if (attr === "data-item-uuid") return "test-capture-uuid";
+					if (attr === "data-item-type") return "capture";
+					return null;
+				}),
+			};
 
-			// Ensure window.DOMUtils is properly set up
-			window.DOMUtils = global.window.DOMUtils;
+			await downloadManager.initializeWebDownloadModal(
+				"test-capture-uuid",
+				"capture",
+				captureBtn,
+			);
 
-			// Test that the method exists and can be called without throwing
-			await expect(
-				downloadManager.handleCaptureDownload(captureUuid, mockButton),
-			).resolves.not.toThrow();
+			expect(spy).toHaveBeenCalledWith(
+				"webDownloadModal-test-capture-uuid",
+				captureBtn,
+				"test-capture-uuid",
+			);
+			spy.mockRestore();
 		});
 
 		test("should show permission error for capture download", async () => {
@@ -353,10 +369,37 @@ describe("DownloadActionManager", () => {
 	});
 
 	describe("initializeCaptureDownloadSlider", () => {
+		const MODAL_ID = "webDownloadModal-test-uuid";
 		let mockSliderEl;
 		let mockNoUiSliderCreate;
 		let mockSliderInstance;
 
+		function stubEl() {
+			return {
+				textContent: "",
+				value: "",
+				dataset: {},
+				classList: { add: jest.fn(), remove: jest.fn() },
+				disabled: false,
+				addEventListener: jest.fn(),
+			};
+		}
+
+		/** Modal root with querySelector("#id") like the real DOM */
+		function mockWebDownloadModal(elementMap) {
+			const map = elementMap || {};
+			return {
+				dataset: {},
+				querySelector: jest.fn((sel) => {
+					const id = sel.startsWith("#") ? sel.slice(1) : sel;
+					if (Object.prototype.hasOwnProperty.call(map, id)) {
+						return map[id];
+					}
+					return stubEl();
+				}),
+			};
+		}
+
 		beforeEach(() => {
 			downloadManager = new DownloadActionManager({
 				permissions: mockPermissions,
@@ -373,31 +416,59 @@ describe("DownloadActionManager", () => {
 			mockNoUiSliderCreate = jest.fn(() => {
 				mockSliderEl.noUiSlider = mockSliderInstance;
 			});
+			// Slider path touches formatFileSize on totalSizeLabel
+			global.window.DOMUtils = {
+				...global.window.DOMUtils,
+				formatFileSize: jest.fn((n) => `${n} B`),
+			};
+		});
+
+		test("should return early when modal root element is missing", () => {
+			document.getElementById = jest.fn(() => null);
+			global.noUiSlider = { create: mockNoUiSliderCreate };
+
+			downloadManager.initializeCaptureDownloadSlider(
+				MODAL_ID,
+				10000,
+				1000,
+				{},
+			);
+			expect(mockNoUiSliderCreate).not.toHaveBeenCalled();
 		});
 
 		test("should return early when temporalFilterSlider element is missing", () => {
-			document.getElementById = jest.fn((id) => {
-				if (id === "temporalFilterSlider") return null;
-				return {};
-			});
+			const modal = mockWebDownloadModal({ temporalFilterSlider: null });
+			document.getElementById = jest.fn((id) =>
+				id === MODAL_ID ? modal : null,
+			);
 			global.noUiSlider = { create: mockNoUiSliderCreate };
 
-			expect(() => {
-				downloadManager.initializeCaptureDownloadSlider(10000, 1000, {});
-			}).not.toThrow();
+			downloadManager.initializeCaptureDownloadSlider(
+				MODAL_ID,
+				10000,
+				1000,
+				{},
+			);
 			expect(mockNoUiSliderCreate).not.toHaveBeenCalled();
 		});
 
 		test("should return early when noUiSlider is undefined", () => {
 			const originalNoUiSlider = global.noUiSlider;
 			global.noUiSlider = undefined;
-			document.getElementById = jest.fn((id) => {
-				if (id === "temporalFilterSlider") return mockSliderEl;
-				return {};
+			const modal = mockWebDownloadModal({
+				temporalFilterSlider: mockSliderEl,
 			});
+			document.getElementById = jest.fn((id) =>
+				id === MODAL_ID ? modal : null,
+			);
 
 			expect(() => {
-				downloadManager.initializeCaptureDownloadSlider(10000, 1000, {});
+				downloadManager.initializeCaptureDownloadSlider(
+					MODAL_ID,
+					10000,
+					1000,
+					{},
+				);
 			}).not.toThrow();
 
 			global.noUiSlider = originalNoUiSlider;
@@ -405,16 +476,16 @@ describe("DownloadActionManager", () => {
 
 		test("should create slider and set modal dataset and range hint when slider and noUiSlider exist", () => {
 			const rangeHintEl = { textContent: "" };
-			const webDownloadModal = { dataset: {} };
-			document.getElementById = jest.fn((id) => {
-				if (id === "temporalFilterSlider") return mockSliderEl;
-				if (id === "temporalRangeHint") return rangeHintEl;
-				if (id === "webDownloadModal") return webDownloadModal;
-				return { textContent: "", value: "", dataset: {}, classList: { add: jest.fn(), remove: jest.fn() }, disabled: false };
+			const webDownloadModal = mockWebDownloadModal({
+				temporalFilterSlider: mockSliderEl,
+				temporalRangeHint: rangeHintEl,
 			});
+			document.getElementById = jest.fn((id) =>
+				id === MODAL_ID ? webDownloadModal : null,
+			);
 			global.noUiSlider = { create: mockNoUiSliderCreate };
 
-			downloadManager.initializeCaptureDownloadSlider(5000, 500, {
+			downloadManager.initializeCaptureDownloadSlider(MODAL_ID, 5000, 500, {
 				dataFilesCount: 10,
 				totalFilesCount: 12,
 				totalSize: 1000000,
@@ -427,7 +498,7 @@ describe("DownloadActionManager", () => {
 					connect: true,
 					step: 500,
 					range: { min: 0, max: 5000 },
-				})
+				}),
 			);
 			expect(webDownloadModal.dataset.durationMs).toBe("5000");
 			expect(webDownloadModal.dataset.fileCadenceMs).toBe("500");
@@ -436,14 +507,16 @@ describe("DownloadActionManager", () => {
 
 		test("should not create slider when durationMs is 0", () => {
 			const rangeHintEl = { textContent: "" };
-			document.getElementById = jest.fn((id) => {
-				if (id === "temporalFilterSlider") return mockSliderEl;
-				if (id === "temporalRangeHint") return rangeHintEl;
-				return {};
+			const modal = mockWebDownloadModal({
+				temporalFilterSlider: mockSliderEl,
+				temporalRangeHint: rangeHintEl,
 			});
+			document.getElementById = jest.fn((id) =>
+				id === MODAL_ID ? modal : null,
+			);
 			global.noUiSlider = { create: mockNoUiSliderCreate };
 
-			downloadManager.initializeCaptureDownloadSlider(0, 1000, {});
+			downloadManager.initializeCaptureDownloadSlider(MODAL_ID, 0, 1000, {});
 
 			expect(mockNoUiSliderCreate).not.toHaveBeenCalled();
 		});
@@ -456,9 +529,11 @@ describe("DownloadActionManager", () => {
 			});
 		});
 
-		test("should have openWebDownloadModal method", () => {
-			expect(downloadManager.openWebDownloadModal).toBeDefined();
-			expect(typeof downloadManager.openWebDownloadModal).toBe("function");
+		test("should have initializeWebDownloadModal method", () => {
+			expect(downloadManager.initializeWebDownloadModal).toBeDefined();
+			expect(typeof downloadManager.initializeWebDownloadModal).toBe(
+				"function",
+			);
 		});
 
 		test("should have openSDKDownloadModal method", () => {
@@ -466,7 +541,7 @@ describe("DownloadActionManager", () => {
 			expect(typeof downloadManager.openSDKDownloadModal).toBe("function");
 		});
 
-		test("should use DOMUtils.openModal for opening modals", () => {
+		test("should use DOMUtils.openModal for opening modals", async () => {
 			const modalId = "webDownloadModal-test-uuid";
 			const confirmBtn = {
 				dataset: {},
@@ -489,7 +564,22 @@ describe("DownloadActionManager", () => {
 				return null;
 			});
 
-			downloadManager.openWebDownloadModal("test-uuid");
+			const btn = {
+				innerHTML: "Download",
+				disabled: false,
+				dataset: {},
+				getAttribute: jest.fn((attr) => {
+					if (attr === "data-item-uuid") return "test-uuid";
+					if (attr === "data-item-type") return "dataset";
+					return null;
+				}),
+			};
+
+			await downloadManager.initializeWebDownloadModal(
+				"test-uuid",
+				"dataset",
+				btn,
+			);
 
 			expect(global.window.DOMUtils.openModal).toHaveBeenCalledWith(modalId);
 		});
@@ -502,14 +592,11 @@ describe("DownloadActionManager", () => {
 			});
 		});
 
-		test("should have handleDatasetDownload method", () => {
-			expect(downloadManager.handleDatasetDownload).toBeDefined();
-			expect(typeof downloadManager.handleDatasetDownload).toBe("function");
-		});
-
-		test("should have handleCaptureDownload method", () => {
-			expect(downloadManager.handleCaptureDownload).toBeDefined();
-			expect(typeof downloadManager.handleCaptureDownload).toBe("function");
+		test("should have initializeWebDownloadModal method", () => {
+			expect(downloadManager.initializeWebDownloadModal).toBeDefined();
+			expect(typeof downloadManager.initializeWebDownloadModal).toBe(
+				"function",
+			);
 		});
 	});
 
@@ -553,7 +640,7 @@ describe("DownloadActionManager", () => {
 			document.querySelectorAll.mockReturnValue([]);
 
 			expect(() => {
-				downloadManager.initializeDatasetDownloadButtons();
+				downloadManager.initializeWebDownloadButtons();
 			}).not.toThrow();
 		});
 
diff --git a/gateway/sds_gateway/static/js/components.js b/gateway/sds_gateway/static/js/components.js
index 2d802eb39..8bb020a5c 100644
--- a/gateway/sds_gateway/static/js/components.js
+++ b/gateway/sds_gateway/static/js/components.js
@@ -23,18 +23,6 @@ const ComponentUtils = {
 		return div.innerHTML;
 	},
 
-	/**
-	 * Formats file size in human readable format
-	 * @param {number} bytes - File size in bytes
-	 * @returns {string} Formatted file size
-	 */
-	formatFileSize(bytes) {
-		if (bytes === 0) return "0 Bytes";
-		const k = 1024;
-		const sizes = ["Bytes", "KB", "MB", "GB", "TB"];
-		const i = Math.floor(Math.log(bytes) / Math.log(k));
-		return `${Number.parseFloat((bytes / k ** i).toFixed(2))} ${sizes[i]}`;
-	},
 
 	/**
 	 * Formats date for display with date and time on separate lines
@@ -335,19 +323,6 @@ class CapturesTableManager extends TableManager {
 				return;
 			}
 
-			// Handle download capture button clicks from actions dropdown
-			if (
-				e.target.matches(".download-capture-btn") ||
-				e.target.closest(".download-capture-btn")
-			) {
-				e.preventDefault();
-				const button = e.target.matches(".download-capture-btn")
-					? e.target
-					: e.target.closest(".download-capture-btn");
-				this.handleDownloadCapture(button);
-				return;
-			}
-
 			// Handle capture link clicks
 			if (
 				e.target.matches(".capture-link") ||
@@ -379,145 +354,6 @@ class CapturesTableManager extends TableManager {
 		document.addEventListener("click", this.eventDelegationHandler);
 	}
 
-	/**
-	 * Handle download capture action
-	 */
-	handleDownloadCapture(button) {
-		const captureUuid = button.dataset.captureUuid;
-		const captureName =
-			button.dataset.captureName || button.dataset.captureUuid;
-
-		if (!captureUuid) {
-			console.error("No capture UUID found for download");
-			return;
-		}
-
-		// Update modal content
-		document.getElementById("downloadCaptureName").textContent = captureName;
-
-		// Show the modal
-		this.openCustomModal("downloadModal");
-
-		// Handle confirm download
-		document.getElementById("confirmDownloadBtn").onclick = () => {
-			// Close modal first
-			this.closeCustomModal("downloadModal");
-
-			// Show loading state
-			const originalContent = button.innerHTML;
-			button.innerHTML = '<i class="bi bi-hourglass-split"></i> Processing...';
-			button.disabled = true;
-
-			// Make API request using the unified download endpoint
-			fetch(`/users/download-item/capture/${captureUuid}/`, {
-				method: "POST",
-				headers: {
-					"Content-Type": "application/json",
-					"X-CSRFToken": this.getCSRFToken(),
-				},
-			})
-				.then((response) => response.json())
-				.then((data) => {
-					if (data.success === true) {
-						button.innerHTML =
-							'<i class="bi bi-check-circle text-success"></i> Download Requested';
-						this.showDownloadSuccessMessage(data.message);
-					} else {
-						button.innerHTML =
-							'<i class="bi bi-exclamation-triangle text-danger"></i> Request Failed';
-						this.showDownloadErrorMessage(
-							data.detail ||
-								data.message ||
-								"Download request failed. Please try again.",
-						);
-					}
-				})
-				.catch((error) => {
-					console.error("Download error:", error);
-					button.innerHTML =
-						'<i class="bi bi-exclamation-triangle text-danger"></i> Request Failed';
-					this.showDownloadErrorMessage(
-						"An error occurred while processing your request.",
-					);
-				})
-				.finally(() => {
-					// Reset button after 3 seconds
-					setTimeout(() => {
-						button.innerHTML = originalContent;
-						button.disabled = false;
-					}, 3000);
-				});
-		};
-	}
-
-	/**
-	 * Show download success message
-	 */
-	showDownloadSuccessMessage(message) {
-		// Try to find an existing alert container or create one
-		let alertContainer = document.querySelector(".alert-container");
-		if (!alertContainer) {
-			alertContainer = document.createElement("div");
-			alertContainer.className = "alert-container";
-			// Insert at the top of the main content area
-			const mainContent =
-				document.querySelector(".container-fluid") || document.body;
-			mainContent.insertBefore(alertContainer, mainContent.firstChild);
-		}
-
-		const alertHtml = `
-			<div class="alert alert-success alert-dismissible fade show" role="alert">
-				<i class="bi bi-check-circle-fill me-2"></i>
-				${ComponentUtils.escapeHtml(message)}
-				<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
-			</div>
-		`;
-
-		alertContainer.innerHTML = alertHtml;
-
-		// Auto-dismiss after 5 seconds
-		setTimeout(() => {
-			const alert = alertContainer.querySelector(".alert");
-			if (alert) {
-				alert.remove();
-			}
-		}, 5000);
-	}
-
-	/**
-	 * Show download error message
-	 */
-	showDownloadErrorMessage(message) {
-		// Try to find an existing alert container or create one
-		let alertContainer = document.querySelector(".alert-container");
-		if (!alertContainer) {
-			alertContainer = document.createElement("div");
-			alertContainer.className = "alert-container";
-			// Insert at the top of the main content area
-			const mainContent =
-				document.querySelector(".container-fluid") || document.body;
-			mainContent.insertBefore(alertContainer, mainContent.firstChild);
-		}
-
-		const alertHtml = `
-			<div class="alert alert-danger alert-dismissible fade show" role="alert">
-				<i class="bi bi-exclamation-triangle-fill me-2"></i>
-				${ComponentUtils.escapeHtml(message)}
-				<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
-			</div>
-		`;
-
-		alertContainer.innerHTML = alertHtml;
-
-		// Auto-dismiss after 8 seconds (longer for error messages)
-		setTimeout(() => {
-			const alert = alertContainer.querySelector(".alert");
-			if (alert) {
-				alert.remove();
-			}
-		}, 8000);
-	}
-
 	renderRow(capture, index) {
 		// Sanitize all data before rendering
 		const safeData = {
@@ -1674,7 +1510,7 @@ class ModalManager {
 						<div class="col-md-6">
 							<p class="mb-2">
 								<span class="fw-medium text-muted">Total Size:</span>
-								<span class="ms-2">${ComponentUtils.formatFileSize(totalSize)}</span>
+								<span class="ms-2">${window.DOMUtils.formatFileSize(totalSize)}</span>
 							</p>
 						</div>
 					</div>
@@ -1703,7 +1539,7 @@ class ModalManager {
 		// Primary file information - most useful for users
 		if (file.size) {
 			metadata.push(
-				`<strong>Size:</strong> ${ComponentUtils.formatFileSize(file.size)} (${file.size.toLocaleString()} bytes)`,
+				`<strong>Size:</strong> ${window.DOMUtils.formatFileSize(file.size)} (${file.size.toLocaleString()} bytes)`,
 			);
 		}
 
diff --git a/gateway/sds_gateway/static/js/core/DOMUtils.js b/gateway/sds_gateway/static/js/core/DOMUtils.js
index 902196232..3309538f5 100644
--- a/gateway/sds_gateway/static/js/core/DOMUtils.js
+++ b/gateway/sds_gateway/static/js/core/DOMUtils.js
@@ -18,11 +18,17 @@ class DOMUtils {
 	 * @returns {string} Formatted file size
 	 */
 	formatFileSize(bytes) {
-		if (bytes === 0) return "0 Bytes";
-		const k = 1024;
-		const sizes = ["Bytes", "KB", "MB", "GB", "TB"];
-		const i = Math.floor(Math.log(bytes) / Math.log(k));
-		return `${Number.parseFloat((bytes / k ** i).toFixed(2))} ${sizes[i]}`;
+		const n = Number(bytes);
+		if (!Number.isFinite(n) || n < 0) return "0 bytes";
+		if (n === 0) return "0 bytes";
+		const units = ["bytes", "KB", "MB", "GB"];
+		let i = 0;
+		let v = n;
+		while (v >= 1024 && i < units.length - 1) {
+			v /= 1024;
+			i++;
+		}
+		return (i === 0 ? v : v.toFixed(2)) + " " + units[i];
 	}
 
 	/**
diff --git a/gateway/sds_gateway/static/js/core/PageLifecycleManager.js b/gateway/sds_gateway/static/js/core/PageLifecycleManager.js
index cc6e03c0b..e3fa07f1d 100644
--- a/gateway/sds_gateway/static/js/core/PageLifecycleManager.js
+++ b/gateway/sds_gateway/static/js/core/PageLifecycleManager.js
@@ -82,6 +82,9 @@ class PageLifecycleManager {
 			case "capture-list":
 				this.initializeCaptureListPage();
 				break;
+			case "published-datasets-list":
+				this.initializePublishedDatasetsListPage();
+				break;
 			default:
 				console.warn(`Unknown page type: ${this.pageType}`);
 		}
@@ -165,6 +168,32 @@ class PageLifecycleManager {
 		this.initializeCaptureModals();
 	}
 
+	/**
+	 * Published datasets search page: pagination + dataset modals (same modal wiring as dataset list, no sort UI).
+	 */
+	initializePublishedDatasetsListPage() {
+		this.initializePagination();
+		this.initializeDatasetModals();
+	}
+
+
+	/**
+	 * Single DownloadActionManager for document-wide .web-download-btn / SDK buttons (not per modal).
+	 */
+	ensureDownloadActionManager() {
+		if (
+			this.downloadActionManager ||
+			!this.permissions ||
+			!window.DownloadActionManager
+		) {
+			return;
+		}
+		this.downloadActionManager = new window.DownloadActionManager({
+			permissions: this.permissions,
+		});
+		this.managers.push(this.downloadActionManager);
+	}
+
 	/**
 	 * Initialize search handlers
 	 */
@@ -269,6 +298,10 @@ class PageLifecycleManager {
 	 * Initialize dataset modals
 	 */
 	initializeDatasetModals() {
+		// TODO: Refactor this to align all modal initialization
+		// with a single manager instance per modal type.
+		// Plan to do this on a future PR.
+
 		// Pre-initialize all modals on the page with proper config to prevent Bootstrap auto-initialization errors
 		const allModals = document.querySelectorAll(".modal");
 		for (const modal of allModals) {
@@ -299,6 +332,7 @@ class PageLifecycleManager {
 
 		for (const modal of datasetModals) {
 			const itemUuid = modal.getAttribute("data-item-uuid");
+			const itemType = modal.getAttribute("data-item-type");
 
 			if (!itemUuid || !this.permissions) {
 				console.warn(
@@ -309,9 +343,9 @@ class PageLifecycleManager {
 
 			if (window.ShareActionManager) {
 				const shareManager = new window.ShareActionManager({
-					itemUuid: itemUuid,
-					itemType: "dataset",
 					permissions: this.permissions,
+					itemUuid: itemUuid,
+					itemType: itemType,
 				});
 				this.managers.push(shareManager);
 
@@ -321,28 +355,18 @@ class PageLifecycleManager {
 
 			if (window.VersioningActionManager && !modal.versioningActionManager) {
 				const versioningManager = new window.VersioningActionManager({
-					datasetUuid: itemUuid,
 					permissions: this.permissions,
+					datasetUuid: itemUuid,
 				});
 				this.managers.push(versioningManager);
 				modal.versioningActionManager = versioningManager;
 			}
 
-			if (window.DownloadActionManager) {
-				const downloadManager = new window.DownloadActionManager({
-					permissions: this.permissions,
-				});
-				this.managers.push(downloadManager);
-
-				// Store reference on modal
-				modal.downloadActionManager = downloadManager;
-			}
-
 			if (window.DetailsActionManager) {
 				const detailsManager = new window.DetailsActionManager({
 					permissions: this.permissions,
 					itemUuid: itemUuid,
-					itemType: "dataset",
+					itemType: itemType,
 				});
 				this.managers.push(detailsManager);
 
@@ -350,18 +374,25 @@ class PageLifecycleManager {
 				modal.detailsActionManager = detailsManager;
 			}
 		}
+
+		this.ensureDownloadActionManager();
 	}
 
 	/**
 	 * Initialize capture modals
 	 */
 	initializeCaptureModals() {
+		// TODO: Refactor this to align all modal initialization
+		// with a single manager instance per modal type.
+		// Plan to do this on a future PR.
+
 		const captureModals = document.querySelectorAll(
 			".modal[data-item-type='capture']",
 		);
 
 		for (const modal of captureModals) {
 			const itemUuid = modal.getAttribute("data-item-uuid");
+			const itemType = modal.getAttribute("data-item-type");
 
 			if (!itemUuid || !this.permissions) {
 				console.warn(
@@ -372,28 +403,18 @@ class PageLifecycleManager {
 
 			if (window.ShareActionManager) {
 				const shareManager = new window.ShareActionManager({
-					itemUuid: itemUuid,
-					itemType: "capture",
 					permissions: this.permissions,
+					itemUuid: itemUuid,
+					itemType: itemType,
 				});
 				this.managers.push(shareManager);
 
 				// Store reference on modal
 				modal.shareActionManager = shareManager;
 			}
-
-			if (window.DownloadActionManager) {
-				const downloadManager = new window.DownloadActionManager({
-					itemUuid: itemUuid,
-					itemType: "capture",
-					permissions: this.permissions,
-				});
-				this.managers.push(downloadManager);
-
-				// Store reference on modal
-				modal.downloadActionManager = downloadManager;
-			}
 		}
+
+		this.ensureDownloadActionManager();
 	}
 
 	/**
diff --git a/gateway/sds_gateway/static/js/file-list.js b/gateway/sds_gateway/static/js/file-list.js
index 3f5175077..6c660c27d 100644
--- a/gateway/sds_gateway/static/js/file-list.js
+++ b/gateway/sds_gateway/static/js/file-list.js
@@ -1,3 +1,9 @@
+/**
+ * TODO: This file has a lot of redundancy with manager files
+ * And needs to be deprecated. and have its functionality migrated
+ * to the new JS structure.
+ */
+
 /* File List Page JavaScript - Refactored to use Components */
 
 /**
@@ -575,24 +581,6 @@ class FileListCapturesTableManager extends CapturesTableManager {
 		this.searchButtonLoading = document.getElementById("search-btn-loading");
 	}
 
-	/**
-	 * Use web download modal (with temporal slider) when DownloadActionManager is available.
-	 */
-	handleDownloadCapture(button) {
-		if (window.currentDownloadManager && document.getElementById("webDownloadModal")) {
-			const captureUuid = button.getAttribute("data-capture-uuid");
-			const captureName = button.getAttribute("data-capture-name") || captureUuid;
-			if (captureUuid) {
-				window.currentDownloadManager.handleCaptureDownload(
-					captureUuid,
-					captureName,
-					button,
-				);
-			}
-			return;
-		}
-	}
-
 	/**
 	 * Override showLoading to toggle button contents instead of showing separate indicator
 	 */
diff --git a/gateway/sds_gateway/templates/users/components/dataset_list_table.html b/gateway/sds_gateway/templates/users/components/dataset_list_table.html
index ad45ff497..2257a7244 100644
--- a/gateway/sds_gateway/templates/users/components/dataset_list_table.html
+++ b/gateway/sds_gateway/templates/users/components/dataset_list_table.html
@@ -183,8 +183,8 @@ <h4 class="alert-heading">No datasets yet</h4>
                                             <li>
                                                 <button class="dropdown-item web-download-btn"
                                                         type="button"
-                                                        data-dataset-uuid="{{ dataset.uuid }}"
-                                                        data-dataset-name="{{ dataset.name }}">
+                                                        data-item-uuid="{{ dataset.uuid }}"
+                                                        data-item-type="dataset">
                                                     <i class="bi bi-download me-2"></i>Web Download
                                                 </button>
                                             </li>
diff --git a/gateway/sds_gateway/templates/users/dataset_list.html b/gateway/sds_gateway/templates/users/dataset_list.html
index baf0de549..4ead29d05 100644
--- a/gateway/sds_gateway/templates/users/dataset_list.html
+++ b/gateway/sds_gateway/templates/users/dataset_list.html
@@ -31,20 +31,7 @@ <h1 class="page-title">Datasets</h1>
         </div>
     </div>
     <!-- Modals to reveal on click; container is replaced on AJAX list refresh -->
-    <div id="dataset-modals-container">
-        {% for dataset in page_obj %}
-            {% include "users/partials/dataset_details_modal.html" with dataset=dataset %}
-            {% include "users/partials/web_download_modal.html" with item=dataset item_type="dataset" %}
-            {% include "users/partials/share_modal.html" with item=dataset item_type="dataset" %}
-            {% include "users/partials/sdk_download_modal.html" with dataset=dataset %}
-            {% if dataset.is_owner or dataset.permission_level == 'co-owner' %}
-                {% include "users/partials/dataset_version_control.html" with dataset=dataset %}
-                {% if not dataset.dataset.status == 'final' or not dataset.is_public %}
-                    {% include "users/partials/publish_dataset_modal.html" with dataset=dataset %}
-                {% endif %}
-            {% endif %}
-        {% endfor %}
-    </div>
+    {% include "users/components/dataset_list_modals.html" with page_obj=page_obj %}
 {% endblock content %}
 {% block javascript %}
     {# djlint:off #}
diff --git a/gateway/sds_gateway/templates/users/file_list.html b/gateway/sds_gateway/templates/users/file_list.html
index d3d9a77c0..6c6a830cb 100644
--- a/gateway/sds_gateway/templates/users/file_list.html
+++ b/gateway/sds_gateway/templates/users/file_list.html
@@ -369,8 +369,6 @@ <h5 class="modal-title" id="uploadResultModalLabel">Upload Result</h5>
     </div>
     <!-- Capture Details Modal -->
     {% include "users/partials/capture_modal.html" %}
-    <!-- Web Download Modal -->
-    {% include "users/partials/web_download_modal.html" with item_type="capture" capture=capture_obj %}
     <!-- Visualization Selection Modal -->
     {% if VISUALIZATIONS_ENABLED %}
         {% include "visualizations/partials/visualization_modal.html" with visualization_compatibility=visualization_compatibility %}
diff --git a/gateway/sds_gateway/templates/users/files.html b/gateway/sds_gateway/templates/users/files.html
index 63e84d774..9cc93386a 100644
--- a/gateway/sds_gateway/templates/users/files.html
+++ b/gateway/sds_gateway/templates/users/files.html
@@ -178,12 +178,19 @@ <h1 class="page-title">Files</h1>
                                                             </li>
                                                         {% endif %}
                                                         <li>
-                                                            <button class="dropdown-item download-capture-btn"
-                                                                    type="button"
-                                                                    data-capture-uuid="{{ item.uuid }}"
-                                                                    data-capture-name="{{ item.name }}">
-                                                                <i class="bi bi-download me-2"></i>Download
-                                                            </button>
+                                                            <button class="dropdown-item web-download-btn"
+                                                                type="button"
+                                                                data-item-uuid="{{ item.uuid }}"
+                                                                data-item-type="capture"
+                                                                data-length-of-capture-ms="{{ item.length_of_capture_ms|default:0 }}"
+                                                                data-file-cadence-ms="{{ item.file_cadence_ms|default:1000 }}"
+                                                                data-per-data-file-size="{{ item.data_files_info.per_data_file_size|default:0 }}"
+                                                                data-total-data-file-size="{{ item.data_files_info.total_size|default:0 }}"
+                                                                data-total-size="{{ item.total_file_size|default:0 }}"
+                                                                data-data-files-count="{{ item.data_files_info.count|default:0 }}"
+                                                                data-total-files-count="{{ item.files|length|default:0 }}"
+                                                                data-capture-start-epoch-sec="{{ item.capture_start_epoch_sec|default:0 }}"
+                                                            >Download</button>
                                                         </li>
                                                     {% elif item.type == 'file' %}
                                                         <!-- Individual file actions -->
diff --git a/gateway/sds_gateway/templates/users/partials/captures_page_table.html b/gateway/sds_gateway/templates/users/partials/captures_page_table.html
index 088b8c369..9aa0b6a30 100644
--- a/gateway/sds_gateway/templates/users/partials/captures_page_table.html
+++ b/gateway/sds_gateway/templates/users/partials/captures_page_table.html
@@ -137,15 +137,16 @@
                                         </li>
                                     {% endif %}
                                     <li>
-                                        <button class="dropdown-item download-capture-btn"
+                                        <button class="dropdown-item web-download-btn"
                                                 type="button"
-                                                data-capture-uuid="{{ cap.uuid }}"
-                                                data-capture-name="{{ cap.name|default:'' }}"
+                                                data-item-uuid="{{ cap.uuid }}"
+                                                data-item-type="capture"
                                                 data-length-of-capture-ms="{{ cap.length_of_capture_ms|default:0 }}"
                                                 data-file-cadence-ms="{{ cap.file_cadence_ms|default:1000 }}"
-                                                data-per-data-file-size="{{ cap.per_data_file_size|default:0 }}"
+                                                data-per-data-file-size="{{ cap.data_files_info.per_data_file_size|default:0 }}"
+                                                data-total-data-file-size="{{ cap.data_files_info.total_size|default:0 }}"
                                                 data-total-size="{{ cap.total_file_size|default:0 }}"
-                                                data-data-files-count="{{ cap.data_files_count|default:0 }}"
+                                                data-data-files-count="{{ cap.data_files_info.count|default:0 }}"
                                                 data-total-files-count="{{ cap.files|length|default:0 }}"
                                                 data-capture-start-epoch-sec="{{ cap.capture_start_epoch_sec|default:0 }}">Download</button>
                                     </li>
diff --git a/gateway/sds_gateway/templates/users/partials/search_published_datasets_tab.html b/gateway/sds_gateway/templates/users/partials/search_published_datasets_tab.html
index 4556109ad..573ac3589 100644
--- a/gateway/sds_gateway/templates/users/partials/search_published_datasets_tab.html
+++ b/gateway/sds_gateway/templates/users/partials/search_published_datasets_tab.html
@@ -114,9 +114,7 @@ <h4 class="alert-heading">No datasets found</h4>
                                     <ul class="dropdown-menu">
                                         <li>
                                             <button class="dropdown-item web-download-btn"
-                                                    type="button"
-                                                    data-dataset-uuid="{{ dataset.uuid }}"
-                                                    data-dataset-name="{{ dataset.name }}">
+                                                    type="button">
                                                 <i class="bi bi-download me-2"></i>Web Download
                                             </button>
                                         </li>