From bf884a99be54bdb1936049a79ae986095706524d Mon Sep 17 00:00:00 2001
From: Dmytro Trotsko <dmytrotsko@gmail.com>
Date: Mon, 28 Oct 2024 21:07:31 +0200
Subject: [PATCH 1/5] Typo fix

---
 src/templates/signal_sets/signal_sets.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/templates/signal_sets/signal_sets.html b/src/templates/signal_sets/signal_sets.html
index b6fc123..766883d 100644
--- a/src/templates/signal_sets/signal_sets.html
+++ b/src/templates/signal_sets/signal_sets.html
@@ -95,7 +95,7 @@ <h2 class="accordion-header" id="flush-heading_{{ form.available_geographies.aut
                                     data-mdb-toggle="collapse"
                                     data-mdb-target="#flush-collapse_{{ form.available_geographies.auto_id }}"
                                     aria-expanded="false"
-                                    aria-controls="flush-collapse_{{ form.availableavailable_geographies_geography.auto_id }}">
+                                    aria-controls="flush-collapse_{{ form.available_geographies.auto_id }}">
                                     Geo-level
                                     <a
                                         tabindex="0"
@@ -380,7 +380,7 @@ <h2 class="accordion-header" id="flush-heading_{{ form.temporal_granularity.auto
                                     </td>
                                     <td class="clickable-table-cell"
                                         onClick="location.href='{% url 'signal_set' pk=signal_set.id %}';">
-                                        {{ signal_set.reporing_lag }}
+                                        {{ signal_set.reporting_lag }}
                                         <br>
                                     </td>
                                     <td class="clickable-table-cell"

From b63a374b45d1411b854c5361c77bfe63bd04a3cd Mon Sep 17 00:00:00 2001
From: Dmytro Trotsko <dmytrotsko@gmail.com>
Date: Mon, 28 Oct 2024 21:10:11 +0200
Subject: [PATCH 2/5] Expanded 'Related Signals' Section

---
 .../signal_sets/signal_set_detail.html        | 61 ++++++++++++++++---
 1 file changed, 52 insertions(+), 9 deletions(-)

diff --git a/src/templates/signal_sets/signal_set_detail.html b/src/templates/signal_sets/signal_set_detail.html
index e948a72..15144cd 100644
--- a/src/templates/signal_sets/signal_set_detail.html
+++ b/src/templates/signal_sets/signal_set_detail.html
@@ -201,18 +201,60 @@ <h5>About this Signal Set </h5>
                                     <th scope="row">Link to data dictionary</th>
                                     <td>{{ signalset.link_to_dictionary }}</td>
                                 </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+    <h5>Related signals</h5>
+    <section>
+        <div class="row">
+            <div class="card">
+                <div class="card-body">
+                    <div class="table-responsive" data-fl-scrolls='{"orientation": "horizontal"}'>
+                        <table class="table table-hover">
+                            <thead>
                                 <tr>
-                                    <th scope="row">Related signals</th>
-                                    <td>
-                                        {% for signal in signalset.signals.all %}
-                                        <a href="{% url 'signal' pk=signal.id %}" target="_blank">
-                                            <span class="badge rounded-pill bg-dark">
-                                                {{ signal.name }}
-                                            </span>
-                                        </a>
+                                    <th scope="col">Display Name</th>
+                                    <th scope="col">Name</th>
+                                    <th scope="col">Active</th>
+                                    <th scope="col">Description</th>
+                                    <th scope="col">Pathogen</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                {% for signal in signalset.signals.all %}
+                                <tr>
+                                    <td class="clickable-table-cell"
+                                        onClick="location.href='{% url 'signal' pk=signal.id %}';">
+                                        {{ signal.display_name }}
+                                    </td>
+                                    <td class="clickable-table-cell"
+                                        onClick="location.href='{% url 'signal' pk=signal.id %}';">
+                                        {{ signal.name }}
+                                    </td>
+                                    <td class="clickable-table-cell"
+                                        onClick="location.href='{% url 'signal' pk=signal.id %}';">
+                                        {% if signal.active == True%}
+                                        <i class="fas fa-circle" style="color:green;"></i>
+                                        {% else %}
+                                        <i class="fas fa-circle" style="color:red;"></i>
+                                        {% endif %}
+                                    </td>
+                                    <td class="clickable-table-cell"
+                                        onClick="location.href='{% url 'signal' pk=signal.id %}';">
+                                        {{ signal.description }}
+                                    </td>
+                                    <td class="clickable-table-cell"
+                                        onClick="location.href='{% url 'signal' pk=signal.id %}';">
+                                        {% for pathogen in signal.pathogen.all %}
+                                            {{ pathogen }}
                                         {% endfor %}
                                     </td>
                                 </tr>
+                                {% endfor %}
                             </tbody>
                         </table>
                     </div>
@@ -220,8 +262,9 @@ <h5>About this Signal Set </h5>
             </div>
         </div>
     </section>
-
+    <h5>Plot / Export data</h5>
     <script>
+        
         if (!library)
             var library = {};
 

From 9e804e3007c5e343edc91dbd6fa3109390eb3077 Mon Sep 17 00:00:00 2001
From: Dmytro Trotsko <dmytrotsko@gmail.com>
Date: Tue, 29 Oct 2024 13:46:56 +0200
Subject: [PATCH 3/5] Added RestAPI to return information about signals

---
 src/rest_api/__init__.py             |  0
 src/rest_api/admin.py                |  3 +++
 src/rest_api/apps.py                 |  6 ++++++
 src/rest_api/migrations/__init__.py  |  0
 src/rest_api/models.py               |  3 +++
 src/rest_api/serializers.py          | 22 +++++++++++++++++++
 src/rest_api/urls.py                 |  9 ++++++++
 src/rest_api/views.py                | 32 ++++++++++++++++++++++++++++
 src/signal_documentation/settings.py |  1 +
 src/signal_documentation/urls.py     |  7 +++++-
 src/templates/signals/signals.html   |  1 +
 11 files changed, 83 insertions(+), 1 deletion(-)
 create mode 100644 src/rest_api/__init__.py
 create mode 100644 src/rest_api/admin.py
 create mode 100644 src/rest_api/apps.py
 create mode 100644 src/rest_api/migrations/__init__.py
 create mode 100644 src/rest_api/models.py
 create mode 100644 src/rest_api/serializers.py
 create mode 100644 src/rest_api/urls.py
 create mode 100644 src/rest_api/views.py

diff --git a/src/rest_api/__init__.py b/src/rest_api/__init__.py
new file mode 100644
index 0000000..e69de29
diff --git a/src/rest_api/admin.py b/src/rest_api/admin.py
new file mode 100644
index 0000000..8c38f3f
--- /dev/null
+++ b/src/rest_api/admin.py
@@ -0,0 +1,3 @@
+from django.contrib import admin
+
+# Register your models here.
diff --git a/src/rest_api/apps.py b/src/rest_api/apps.py
new file mode 100644
index 0000000..7cf57ef
--- /dev/null
+++ b/src/rest_api/apps.py
@@ -0,0 +1,6 @@
+from django.apps import AppConfig
+
+
+class RestApiConfig(AppConfig):
+    default_auto_field = 'django.db.models.BigAutoField'
+    name = 'rest_api'
diff --git a/src/rest_api/migrations/__init__.py b/src/rest_api/migrations/__init__.py
new file mode 100644
index 0000000..e69de29
diff --git a/src/rest_api/models.py b/src/rest_api/models.py
new file mode 100644
index 0000000..71a8362
--- /dev/null
+++ b/src/rest_api/models.py
@@ -0,0 +1,3 @@
+from django.db import models
+
+# Create your models here.
diff --git a/src/rest_api/serializers.py b/src/rest_api/serializers.py
new file mode 100644
index 0000000..140cd71
--- /dev/null
+++ b/src/rest_api/serializers.py
@@ -0,0 +1,22 @@
+from rest_framework.serializers import ModelSerializer, SlugRelatedField
+
+from signals.models import Signal
+
+
+class SignalSerializer(ModelSerializer):
+    """
+    Serializer for the Signal model.
+    """
+
+    source = SlugRelatedField(read_only=True, slug_field="name")
+    signal_type = SlugRelatedField(read_only=True, slug_field="name")
+    available_geography = SlugRelatedField(many=True, read_only=True, slug_field="name")
+
+    class Meta:
+        model = Signal
+        fields = [
+            "name",
+            "source",
+            "signal_type",
+            "available_geography",
+        ]
diff --git a/src/rest_api/urls.py b/src/rest_api/urls.py
new file mode 100644
index 0000000..5131457
--- /dev/null
+++ b/src/rest_api/urls.py
@@ -0,0 +1,9 @@
+from django.urls import path
+from django.urls.resolvers import URLPattern
+
+from rest_api.views import api_signal_detail_view
+
+
+urlpatterns: list[URLPattern] = [
+    path("signal/<int:pk>", api_signal_detail_view, name="api_signal_detail"),
+]
diff --git a/src/rest_api/views.py b/src/rest_api/views.py
new file mode 100644
index 0000000..3ea36d3
--- /dev/null
+++ b/src/rest_api/views.py
@@ -0,0 +1,32 @@
+from rest_framework.decorators import api_view
+from rest_framework.response import Response
+
+from rest_api.serializers import SignalSerializer
+from signals.models import Signal
+
+
+@api_view(
+    [
+        "GET",
+    ]
+)
+def api_signal_detail_view(request, pk):
+    """
+    API view for getting a single Signal object.
+
+    Args:
+        request: The request object.
+        pk: The primary key of the Signal object.
+
+    Returns:
+        Response: The response object.
+    """
+
+    try:
+        signal = Signal.objects.get(pk=pk)
+    except Signal.DoesNotExist:
+        return Response(status=404)
+
+    if request.method == "GET":
+        serializer = SignalSerializer(signal)
+        return Response(serializer.data)
diff --git a/src/signal_documentation/settings.py b/src/signal_documentation/settings.py
index 35f4dac..54ce77f 100644
--- a/src/signal_documentation/settings.py
+++ b/src/signal_documentation/settings.py
@@ -105,6 +105,7 @@
     'datasources',
     'signals',
     'signal_sets',
+    'rest_api',
 ]
 
 INSTALLED_APPS: list[str] = DEFAULT_APPS + EXTERNAL_APPS + LOCAL_APPS
diff --git a/src/signal_documentation/urls.py b/src/signal_documentation/urls.py
index 00bb3e7..bc4dc06 100644
--- a/src/signal_documentation/urls.py
+++ b/src/signal_documentation/urls.py
@@ -47,9 +47,14 @@
     ),
     # datasources
     path(
-        f"{settings.MAIN_PAGE}/datasources/" if settings.MAIN_PAGE else "datasources",
+        f"{settings.MAIN_PAGE}/datasources/" if settings.MAIN_PAGE else "datasources/",
         include("datasources.urls"),
     ),
+    # rest_api
+    path(
+        f"{settings.MAIN_PAGE}/rest_api/" if settings.MAIN_PAGE else "rest_api/",
+        include("rest_api.urls"),
+    ),
     path("__debug__/", include("debug_toolbar.urls")),
 ]
 
diff --git a/src/templates/signals/signals.html b/src/templates/signals/signals.html
index fe0fbb7..4d87ac7 100644
--- a/src/templates/signals/signals.html
+++ b/src/templates/signals/signals.html
@@ -314,6 +314,7 @@ <h2 class="accordion-header" id="flush-heading_id_signal_availability">
                                     <td class="clickable-table-cell"
                                         onClick="location.href='{% url 'signal' pk=signal.id %}';">
                                         {{ signal.name }}
+                                        {% url 'api_signal_detail' pk=signal.id %}
                                     </td>
                                     <td class="clickable-table-cell"
                                         onClick="location.href='{% url 'signal' pk=signal.id %}';">

From a2d5ed808d448ce082718a99e251a9bb18233540 Mon Sep 17 00:00:00 2001
From: Dmytro Trotsko <dmytrotsko@gmail.com>
Date: Thu, 31 Oct 2024 12:46:08 +0200
Subject: [PATCH 4/5] Added data preview/plot/export section to the signal set
 detailed view page

---
 src/rest_api/serializers.py                   |  19 +-
 src/rest_api/urls.py                          |   7 +-
 src/rest_api/views.py                         |  31 +-
 src/signal_sets/views.py                      |  25 +-
 .../signal_sets/signal_set_detail.html        | 315 ++++++++++++++++++
 5 files changed, 385 insertions(+), 12 deletions(-)

diff --git a/src/rest_api/serializers.py b/src/rest_api/serializers.py
index 140cd71..04425cf 100644
--- a/src/rest_api/serializers.py
+++ b/src/rest_api/serializers.py
@@ -1,6 +1,6 @@
 from rest_framework.serializers import ModelSerializer, SlugRelatedField
 
-from signals.models import Signal
+from signals.models import Signal, Geography
 
 
 class SignalSerializer(ModelSerializer):
@@ -14,9 +14,14 @@ class SignalSerializer(ModelSerializer):
 
     class Meta:
         model = Signal
-        fields = [
-            "name",
-            "source",
-            "signal_type",
-            "available_geography",
-        ]
+        fields = ["name", "source", "signal_type", "available_geography", "time_type"]
+
+
+class AvailableGeographySerializer(ModelSerializer):
+    """
+    Serializer for the AvailableGeography model.
+    """
+
+    class Meta:
+        model = Geography
+        fields = ["name", "display_name"]
diff --git a/src/rest_api/urls.py b/src/rest_api/urls.py
index 5131457..40fe263 100644
--- a/src/rest_api/urls.py
+++ b/src/rest_api/urls.py
@@ -1,9 +1,12 @@
 from django.urls import path
 from django.urls.resolvers import URLPattern
 
-from rest_api.views import api_signal_detail_view
+from rest_api.views import api_signal_detail_view, api_available_geography_view
 
 
 urlpatterns: list[URLPattern] = [
-    path("signal/<int:pk>", api_signal_detail_view, name="api_signal_detail"),
+    path("rest_api/signal/<int:pk>", api_signal_detail_view, name="api_signal_detail"),
+    path("rest_api/signal/", api_signal_detail_view, name="api_signal_detail"),
+    path("rest_api/geo_level/<int:pk>", api_available_geography_view, name="api_available_geography_detail"),
+    path("rest_api/geo_level/", api_available_geography_view, name="api_available_geography_detail")
 ]
diff --git a/src/rest_api/views.py b/src/rest_api/views.py
index 3ea36d3..8b26593 100644
--- a/src/rest_api/views.py
+++ b/src/rest_api/views.py
@@ -1,8 +1,8 @@
 from rest_framework.decorators import api_view
 from rest_framework.response import Response
 
-from rest_api.serializers import SignalSerializer
-from signals.models import Signal
+from rest_api.serializers import SignalSerializer, AvailableGeographySerializer
+from signals.models import Signal, Geography
 
 
 @api_view(
@@ -30,3 +30,30 @@ def api_signal_detail_view(request, pk):
     if request.method == "GET":
         serializer = SignalSerializer(signal)
         return Response(serializer.data)
+
+
+@api_view(
+    [
+        "GET",
+    ]
+)
+def api_available_geography_view(request, pk):
+    """
+    API view for getting a single Geography.
+
+    Args:
+        request: The request object.
+        pk: The primary key of the Geography object.
+
+    Returns:
+        Response: The response object.
+    """
+
+    try:
+        geography = Geography.objects.get(pk=pk)
+    except Geography.DoesNotExist:
+        return Response(status=404)
+
+    if request.method == "GET":
+        serializer = AvailableGeographySerializer(geography)
+        return Response(serializer.data)
diff --git a/src/signal_sets/views.py b/src/signal_sets/views.py
index 716e10a..de2245d 100644
--- a/src/signal_sets/views.py
+++ b/src/signal_sets/views.py
@@ -1,9 +1,12 @@
 import logging
 from typing import Any, Dict
 
+from django.conf import settings
 from django.db.models.query import QuerySet
 from django.views.generic import ListView, DetailView
 
+
+from signals.models import Geography
 from signal_sets.models import SignalSet
 from signal_sets.filters import SignalSetFilter
 from signal_sets.forms import SignalSetFilterForm
@@ -40,7 +43,9 @@ def get_url_params(self):
                 else None
             ),
             "data_source": [el for el in self.request.GET.getlist("data_source")],
-            "temporal_granularity": [el for el in self.request.GET.getlist("temporal_granularity")],
+            "temporal_granularity": [
+                el for el in self.request.GET.getlist("temporal_granularity")
+            ],
         }
         url_params_str = ""
         for param_name, param_value in url_params_dict.items():
@@ -72,4 +77,22 @@ class SignalSetDetailedView(DetailView):
 
     def get_context_data(self, **kwargs: Any) -> dict[str, Any]:
         context: Dict[str, Any] = super().get_context_data(**kwargs)
+        context["epivis_url"] = settings.EPIVIS_URL
+        context["data_export_url"] = settings.DATA_EXPORT_URL
+        context["covidcast_url"] = settings.COVIDCAST_URL
+        context["data_source"] = (
+            self.object.signals.all()
+            .values_list("source__name", flat=True)
+            .distinct()
+            .order_by()
+            .first()
+        )
+        context["available_geographies"] = Geography.objects.filter(
+            id__in=self.object.signals.all()
+            .values_list("available_geography")
+            .distinct()
+            .order_by()
+        )
+        context["time_type"] = self.object.signals.all().values_list("time_type", flat=True).distinct().order_by().first()
+
         return context
diff --git a/src/templates/signal_sets/signal_set_detail.html b/src/templates/signal_sets/signal_set_detail.html
index 15144cd..51bc1e9 100644
--- a/src/templates/signal_sets/signal_set_detail.html
+++ b/src/templates/signal_sets/signal_set_detail.html
@@ -263,6 +263,102 @@ <h5>Related signals</h5>
         </div>
     </section>
     <h5>Plot / Export data</h5>
+    <section class="section">
+        <div class="row">
+            <div class="card">
+                <div class="card-body">
+                    <form class="margin-top-1rem" onsubmit="submitMode(event)" id="dataForm">
+                        <div class="row">
+                            <div class="col-2">
+                                <label class="form-label"
+                                    >Select mode:</label
+                                >
+                            </div>
+                            <div class="col-10">
+                                <div class="form-check form-check-inline">
+                                    <input class="form-check-input" type="radio" name="modes" id="preview" value="preview" checked>
+                                    <label class="form-check-label" for="preview">Preview data</label>
+                                </div>
+                                <div class="form-check form-check-inline">
+                                    <input class="form-check-input" type="radio" name="modes" id="epivis" value="epivis">
+                                    <label class="form-check-label" for="epivis">Plot data</label>
+                                </div>
+                                <div class="form-check form-check-inline">
+                                    <input class="form-check-input" type="radio" name="modes" id="export" value="export">
+                                    <label class="form-check-label" for="export">Export data</label>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="row margin-top-1rem">
+                            <div class="col-2">
+                                <label for="signal" class="form-label"
+                                    >Data Signal:</label
+                                >
+                            </div>
+                            <div class="col-10">
+                                <select id="signal" name="signal" class="form-select">
+                                    {% for signal in signalset.signals.all %}
+                                        <option>{{ signal.name }}</option>
+                                    {% endfor %}
+                                </select>
+                            </div>
+                        </div>
+                        <div class="row margin-top-1rem">
+                            <div class="col-2">
+                                <label for="geographic_type" class="form-label"
+                                    >Geographic Type:</label
+                                >
+                            </div>
+                            <div class="col-10">
+                                <select id="geographic_type" name="geographic_type" class="form-select">
+                                    <option selected>Choose...</option>
+                                    {% for geography in available_geographies %}
+                                    <option value="{{ geography.name }}">{{ geography }}</option>
+                                    {% endfor %}
+                                </select>
+                            </div>
+                        </div>
+                        <div class="row margin-top-1rem">
+                            <div class="col-2">
+                                <label for="geographic_value" class="col-form-label">Geographic Value:</label>
+                            </div>
+                            <div class="col-10">
+                                <select id="geographic_value" name="geographic_value" class="form-select" multiple="multiple"></select>
+                            </div>
+                        </div>
+                        <div class="row margin-top-1rem" name="choose_date">
+                            <div class="col-2">
+                                <label for="start_date" class="form-label">
+                                    Start Date:
+                                </label>
+                            </div>
+                            <div class="col-10">
+                                <input type="date" class="form-control" id="start_date" name="start_date">
+                            </div>
+                        </div>
+                        <div class="row margin-top-1rem" name="choose_date">
+                            <div class="col-2">
+                                <label for="end_date" class="form-label">
+                                    End Date:
+                                </label>
+                            </div>
+                            <div class="col-10">
+                                <input type="date" class="form-control" id="end_date" name="end_date">
+                            </div>
+                        </div>
+                        <div class="row">
+                            <button type="submit" value="Submit" class="btn btn-primary margin-top-1rem">
+                                Submit
+                            </button>
+                        </div>
+                        <div class="row margin-top-1rem">
+                            <pre class="margin-top-1rem"><code id="modeSubmitResult"></code></pre>
+                        </div>
+                    </form>
+                </div>
+            </div>
+        </div>
+    </section>
     <script>
         
         if (!library)
@@ -303,6 +399,225 @@ <h5>Plot / Export data</h5>
                 button.innerHTML = 'Read less <i class="bi bi-arrow-bar-up"></i>';
             }
         }
+
+        var geoValues = [];
+    var currentMode = 'preview';
+
+    function getFilteredGeographicValues(geographicType) {
+        var data = geoValues.reduce((data, geoValue) => {
+            if (geoValue.geoType === geographicType) {
+                data.push(geoValue);
+            }
+            return data;
+        }, []);
+        return data;
+    }
+
+    function initGeographicValueSelect(mode, geographicType = null) {
+        var maximumSelectionLength = 1;
+        if (mode === 'epivis') {
+            maximumSelectionLength = 1;
+        } else {
+            maximumSelectionLength = 10;
+        }
+        if (geographicType) {
+            var data = getFilteredGeographicValues(geographicType);
+        } else {
+            data = [];
+        }
+
+
+        $('#geographic_value').select2({
+            data: data,
+            minimumInputLength: 0,
+            maximumSelectionLength: maximumSelectionLength,
+        });
+    }
+
+    document.getElementById('geographic_type').addEventListener("change", (event) => {
+        $('#geographic_value').empty();
+        $('#modeSubmitResult').html('');
+        initGeographicValueSelect(currentMode, event.target.value);
+    })
+
+    function handleModeChange(mode) {
+        document.getElementById("dataForm").reset();
+        $('#geographic_value').empty();
+        $('#modeSubmitResult').html('');
+
+        var choose_dates = document.getElementsByName('choose_date');
+        //var time_type = document.getElementById('timeTypeDiv');
+
+        if (mode === 'epivis') {
+            currentMode = 'epivis';
+            choose_dates.forEach((el) => {
+                el.style.display = 'none';
+            });
+            $('#modeSubmitResult').html('');
+            //time_type.style.display = 'none';
+        } else if (mode === 'export') {
+            currentMode = 'export';
+            choose_dates.forEach((el) => {
+                el.style.display = 'flex';
+            });
+            $('#modeSubmitResult').html('');
+            //time_type.style.display = 'none';
+        } else {
+            currentMode = 'preview';
+            choose_dates.forEach((el) => {
+                el.style.display = 'flex';
+            });
+            //time_type.style.display = 'flex';
+        }
+        document.getElementsByName("modes").forEach((el) => {
+            if (currentMode === el.value) {
+                el.checked = true;
+            }
+        });
+    }
+
+    document.getElementsByName('modes').forEach((el) => {
+        el.addEventListener('change', (event) => {
+            currentMode = event.target.value;
+            initGeographicValueSelect(currentMode)
+            handleModeChange(currentMode);
+        });
+    });
+
+
+    $(document).ready(function () {
+        {% for geography in available_geographies %}
+            {% for unit in geography.geography_units.all %}
+                geoValues.push({'id': '{{ unit.geo_id }}', 'geoType': '{{ unit.geography.name }}', 'text': '{{ unit.display_name }}'});
+            {% endfor %}
+        {% endfor %}
+
+        $('#geographic_value').select2({
+            data: [],
+            minimumInputLength: 0,
+            maximumSelectionLength: 1,
+        });
+    });
+
+    $("#warning-alert").hide();
+
+    function showWarningAlert(warningMessage) {
+        $("#warning-alert").html(warningMessage);
+        $("#warning-alert").fadeTo(2000, 500).slideUp(1000, function() {
+            $("#warning-alert").slideUp(1000);
+        });
+    }
+
+    function getDateYearWeek(date) {
+        const currentDate =
+            (typeof date === 'object') ? date : new Date();
+        const januaryFirst =
+            new Date(currentDate.getFullYear(), 0, 1);
+        const daysToNextMonday =
+            (januaryFirst.getDay() === 1) ? 0 :
+            (7 - januaryFirst.getDay()) % 7;
+        const nextMonday =
+            new Date(currentDate.getFullYear(), 0,
+            januaryFirst.getDate() + daysToNextMonday);
+
+        var weekNumber = (currentDate < nextMonday) ? 52 :
+        (currentDate > nextMonday ? Math.ceil(
+        (currentDate - nextMonday) / (24 * 3600 * 1000) / 7) : 1);
+
+        if (weekNumber < 10) {
+            weekNumber = `0${weekNumber}`;
+        }
+
+        const year = currentDate.getFullYear()
+
+        return `${year}${weekNumber}`;
+    }
+
+    function submitMode(event) {
+        event.preventDefault();
+
+        const dataSource = "{{ data_source }}";
+        const timeType = "{{ time_type }}";
+        var dataSignal = document.getElementById('signal').value;
+        var geographicType = document.getElementById('geographic_type').value;
+        {% comment %} var timeType = "{{ signal.time_type }}"; {% endcomment %}
+        // geographicValue is a comma separated string of geographic values. type can be string or integer
+        // in case of string, it should be converted to lowercase
+        // else it will be treated as integer
+        var geographicValue = $('#geographic_value').select2('data').map((el) => (typeof el.id === 'string') ? el.id.toLowerCase() : el.id).join(',');
+
+        if (geographicType === 'Choose...' || geographicValue === '') {
+            showWarningAlert("Geographic Type or Geographic Value is not selected.");
+            return;
+        }
+
+        if (currentMode === 'epivis') {
+            var epiVisUrl = "{{ epivis_url }}";
+            var urlParamsEncoded = btoa(`{"datasets":[{"color":"#415742","title":"value","params":{"_endpoint":"covidcast","data_source":"${dataSource}","signal":"${dataSignal}","time_type":"${timeType}","geo_type":"${geographicType}","geo_value":"${geographicValue}"}}]}`);
+
+            epiVisUrl += `#${urlParamsEncoded}`;
+            window.open(epiVisUrl, '_blank').focus();
+        } else if (currentMode === 'export') {
+            var startDate = document.getElementById('start_date').value;
+            var endDate = document.getElementById('end_date').value;
+
+            if (timeType === "week") {
+                startDate = getDateYearWeek(new Date(startDate));
+                endDate = getDateYearWeek(new Date(endDate));
+            };
+
+            var dataExportUrl = "{{ data_export_url }}";
+
+            if (startDate === '' || endDate === '') {
+                showWarningAlert("Start Date or End Date is not selected.")
+                return;
+            }
+
+            dataExportUrl += `?signal=${dataSource}:${dataSignal}&start_day=${startDate}&end_day=${endDate}&geo_type=${geographicType}&geo_values=${geographicValue}`;
+            $('#modeSubmitResult').html(`Manually fetch data: \n\nwget --content-disposition "${dataExportUrl}"`);
+            window.open(dataExportUrl, '_blank').focus();
+        } else {
+            //var timeType = document.getElementById('time_type').value;
+
+            var startDate = document.getElementById('start_date').value;
+            var endDate = document.getElementById('end_date').value;
+
+            if (timeType === "week") {
+                startDate = getDateYearWeek(new Date(startDate));
+                endDate = getDateYearWeek(new Date(endDate));
+            };
+
+            var requestSent = false;
+
+            if (!requestSent) {
+                $.ajax({
+                    url: '{{ covidcast_url }}',
+                    type: 'GET',
+                    data: {
+                        'time_type': timeType,
+                        'time_values': `${startDate}--${endDate}`,
+                        'data_source': dataSource,
+                        'signal': dataSignal,
+                        'geo_type': geographicType,
+                        'geo_values': geographicValue
+                    },
+                    success: function (result) {
+                        // Update the page with the response data.
+                        // This depends on the structure of your response data.
+                        // For example, if the response data is a string:
+                        if (result["epidata"].length > 1) {
+                            result = { epidata: result["epidata"].slice(0, 3), result: result["result"], message: result["message"] }
+                        } else {
+                            result = { epidata: result["epidata"], result: result["result"], message: result["message"] }
+                        }
+                        console.log('Request sent to: ' + this.url);
+                        $('#modeSubmitResult').html(library.json.prettyPrint(result));
+                    }
+                });
+                requestSent = true;
+            };
+        }
+    }
     </script>
 </main>
 

From 649cf00b7f6b5ee97a018a2a7e49e2d6aadd86a4 Mon Sep 17 00:00:00 2001
From: Dmytro Trotsko <dmytrotsko@gmail.com>
Date: Fri, 1 Nov 2024 17:04:29 +0200
Subject: [PATCH 5/5] Some UI adjustments

---
 .../signal_sets/signal_set_detail.html        | 317 ++++++++----------
 src/templates/signal_sets/signal_sets.html    |   4 -
 src/templates/signals/signals.html            |   1 -
 3 files changed, 139 insertions(+), 183 deletions(-)

diff --git a/src/templates/signal_sets/signal_set_detail.html b/src/templates/signal_sets/signal_set_detail.html
index 51bc1e9..4d1f09b 100644
--- a/src/templates/signal_sets/signal_set_detail.html
+++ b/src/templates/signal_sets/signal_set_detail.html
@@ -37,46 +37,9 @@ <h5>{{ signalset.maintainer_name }} <br> ({{ signalset.maintainer_email }})</h5>
                             <h5>{{ signalset.data_source }}</h5>
                         </div>
                     </div>
-                </div>
-            </div>
-        </div>
-    </section>
-    <h5>About this Signal Set </h5>
-    <section class="section signal">
-        <div class="row">
-            <div class="card">
-                <div class="card-body">
-                    <div class="row margin-top-1rem">
+                    <div class="row">
                         <table class="table table-striped">
                             <tbody>
-                                <tr>
-                                    <th scope="row">Source</th>
-                                    <td>{{ signalset.data_source }}</td>
-                                </tr>
-                                <tr>
-                                    <th scope="row">Signal Set Name</th>
-                                    <td>{{ signalset.name }}</td>
-                                </tr>
-                                <tr>
-                                    <th scope="row">Maintainer</th>
-                                    <td>{{ signalset.maintainer_name }} ({{ signalset.maintainer_email }})</td>
-                                </tr>
-                                {% if signalset.organization %}
-                                <tr>
-                                    <th scope="row">Organization</th>
-                                    <td>{{ signalset.organization }}</td>
-                                </tr>
-                                {% endif %}
-                                <tr>
-                                    <th scope="row">Language</th>
-                                    <td>{{ signalset.language }}</td>
-                                </tr>
-                                {% if signalset.version_number %}
-                                <tr>
-                                    <th scope="row">Signal Set Name</th>
-                                    <td>{{ signalset.name }}</td>
-                                </tr>
-                                {% endif %}
                                 {% if signalset.origin_datasource != 'n/a' %}
                                 <tr>
                                     <th scope="row">Source dataset from which data was derived (for aggregates or processed data) </th>
@@ -97,10 +60,6 @@ <h5>About this Signal Set </h5>
                                         </ul>
                                     </td>
                                 </tr>
-                                <tr>
-                                    <th scope="row">Type(s) of data*</th>
-                                    <td>{{ signalset.data_type }}</td>
-                                </tr>
                                 <tr>
                                     <th scope="row">Geographic Scope*</th>
                                     <td>{{ signalset.geographic_scope }}</td>
@@ -208,157 +167,159 @@ <h5>About this Signal Set </h5>
             </div>
         </div>
     </section>
-    <h5>Related signals</h5>
-    <section>
-        <div class="row">
-            <div class="card">
-                <div class="card-body">
-                    <div class="table-responsive" data-fl-scrolls='{"orientation": "horizontal"}'>
-                        <table class="table table-hover">
-                            <thead>
-                                <tr>
-                                    <th scope="col">Display Name</th>
-                                    <th scope="col">Name</th>
-                                    <th scope="col">Active</th>
-                                    <th scope="col">Description</th>
-                                    <th scope="col">Pathogen</th>
-                                </tr>
-                            </thead>
-                            <tbody>
-                                {% for signal in signalset.signals.all %}
-                                <tr>
-                                    <td class="clickable-table-cell"
-                                        onClick="location.href='{% url 'signal' pk=signal.id %}';">
-                                        {{ signal.display_name }}
-                                    </td>
-                                    <td class="clickable-table-cell"
-                                        onClick="location.href='{% url 'signal' pk=signal.id %}';">
-                                        {{ signal.name }}
-                                    </td>
-                                    <td class="clickable-table-cell"
-                                        onClick="location.href='{% url 'signal' pk=signal.id %}';">
-                                        {% if signal.active == True%}
-                                        <i class="fas fa-circle" style="color:green;"></i>
-                                        {% else %}
-                                        <i class="fas fa-circle" style="color:red;"></i>
-                                        {% endif %}
-                                    </td>
-                                    <td class="clickable-table-cell"
-                                        onClick="location.href='{% url 'signal' pk=signal.id %}';">
-                                        {{ signal.description }}
-                                    </td>
-                                    <td class="clickable-table-cell"
-                                        onClick="location.href='{% url 'signal' pk=signal.id %}';">
-                                        {% for pathogen in signal.pathogen.all %}
-                                            {{ pathogen }}
-                                        {% endfor %}
-                                    </td>
-                                </tr>
-                                {% endfor %}
-                            </tbody>
-                        </table>
+    {% if signalset.signals.all|length > 0%}
+        <h5>Related signals</h5>
+        <section>
+            <div class="row">
+                <div class="card">
+                    <div class="card-body">
+                        <div class="table-responsive" data-fl-scrolls='{"orientation": "horizontal"}'>
+                            <table class="table table-hover">
+                                <thead>
+                                    <tr>
+                                        <th scope="col">Display Name</th>
+                                        <th scope="col">Name</th>
+                                        <th scope="col">Active</th>
+                                        <th scope="col">Description</th>
+                                        <th scope="col">Pathogen</th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                    {% for signal in signalset.signals.all %}
+                                    <tr>
+                                        <td class="clickable-table-cell"
+                                            onClick="location.href='{% url 'signal' pk=signal.id %}';">
+                                            {{ signal.display_name }}
+                                        </td>
+                                        <td class="clickable-table-cell"
+                                            onClick="location.href='{% url 'signal' pk=signal.id %}';">
+                                            {{ signal.name }}
+                                        </td>
+                                        <td class="clickable-table-cell"
+                                            onClick="location.href='{% url 'signal' pk=signal.id %}';">
+                                            {% if signal.active == True%}
+                                            <i class="fas fa-circle" style="color:green;"></i>
+                                            {% else %}
+                                            <i class="fas fa-circle" style="color:red;"></i>
+                                            {% endif %}
+                                        </td>
+                                        <td class="clickable-table-cell"
+                                            onClick="location.href='{% url 'signal' pk=signal.id %}';">
+                                            {{ signal.description }}
+                                        </td>
+                                        <td class="clickable-table-cell"
+                                            onClick="location.href='{% url 'signal' pk=signal.id %}';">
+                                            {% for pathogen in signal.pathogen.all %}
+                                                {{ pathogen }}
+                                            {% endfor %}
+                                        </td>
+                                    </tr>
+                                    {% endfor %}
+                                </tbody>
+                            </table>
+                        </div>
                     </div>
                 </div>
             </div>
-        </div>
-    </section>
-    <h5>Plot / Export data</h5>
-    <section class="section">
-        <div class="row">
-            <div class="card">
-                <div class="card-body">
-                    <form class="margin-top-1rem" onsubmit="submitMode(event)" id="dataForm">
-                        <div class="row">
-                            <div class="col-2">
-                                <label class="form-label"
-                                    >Select mode:</label
-                                >
-                            </div>
-                            <div class="col-10">
-                                <div class="form-check form-check-inline">
-                                    <input class="form-check-input" type="radio" name="modes" id="preview" value="preview" checked>
-                                    <label class="form-check-label" for="preview">Preview data</label>
+        </section>
+        <h5>Plot / Export data</h5>
+        <section class="section">
+            <div class="row">
+                <div class="card">
+                    <div class="card-body">
+                        <form class="margin-top-1rem" onsubmit="submitMode(event)" id="dataForm">
+                            <div class="row">
+                                <div class="col-2">
+                                    <label class="form-label"
+                                        >Select mode:</label
+                                    >
                                 </div>
-                                <div class="form-check form-check-inline">
-                                    <input class="form-check-input" type="radio" name="modes" id="epivis" value="epivis">
-                                    <label class="form-check-label" for="epivis">Plot data</label>
+                                <div class="col-10">
+                                    <div class="form-check form-check-inline">
+                                        <input class="form-check-input" type="radio" name="modes" id="preview" value="preview" checked>
+                                        <label class="form-check-label" for="preview">Preview data</label>
+                                    </div>
+                                    <div class="form-check form-check-inline">
+                                        <input class="form-check-input" type="radio" name="modes" id="epivis" value="epivis">
+                                        <label class="form-check-label" for="epivis">Plot data</label>
+                                    </div>
+                                    <div class="form-check form-check-inline">
+                                        <input class="form-check-input" type="radio" name="modes" id="export" value="export">
+                                        <label class="form-check-label" for="export">Export data</label>
+                                    </div>
                                 </div>
-                                <div class="form-check form-check-inline">
-                                    <input class="form-check-input" type="radio" name="modes" id="export" value="export">
-                                    <label class="form-check-label" for="export">Export data</label>
-                                </div>
-                            </div>
-                        </div>
-                        <div class="row margin-top-1rem">
-                            <div class="col-2">
-                                <label for="signal" class="form-label"
-                                    >Data Signal:</label
-                                >
-                            </div>
-                            <div class="col-10">
-                                <select id="signal" name="signal" class="form-select">
-                                    {% for signal in signalset.signals.all %}
-                                        <option>{{ signal.name }}</option>
-                                    {% endfor %}
-                                </select>
-                            </div>
-                        </div>
-                        <div class="row margin-top-1rem">
-                            <div class="col-2">
-                                <label for="geographic_type" class="form-label"
-                                    >Geographic Type:</label
-                                >
                             </div>
-                            <div class="col-10">
-                                <select id="geographic_type" name="geographic_type" class="form-select">
-                                    <option selected>Choose...</option>
-                                    {% for geography in available_geographies %}
-                                    <option value="{{ geography.name }}">{{ geography }}</option>
-                                    {% endfor %}
-                                </select>
+                            <div class="row margin-top-1rem">
+                                <div class="col-2">
+                                    <label for="signal" class="form-label"
+                                        >Data Signal:</label
+                                    >
+                                </div>
+                                <div class="col-10">
+                                    <select id="signal" name="signal" class="form-select">
+                                        {% for signal in signalset.signals.all %}
+                                            <option>{{ signal.name }}</option>
+                                        {% endfor %}
+                                    </select>
+                                </div>
                             </div>
-                        </div>
-                        <div class="row margin-top-1rem">
-                            <div class="col-2">
-                                <label for="geographic_value" class="col-form-label">Geographic Value:</label>
+                            <div class="row margin-top-1rem">
+                                <div class="col-2">
+                                    <label for="geographic_type" class="form-label"
+                                        >Geographic Type:</label
+                                    >
+                                </div>
+                                <div class="col-10">
+                                    <select id="geographic_type" name="geographic_type" class="form-select">
+                                        <option selected>Choose...</option>
+                                        {% for geography in available_geographies %}
+                                        <option value="{{ geography.name }}">{{ geography }}</option>
+                                        {% endfor %}
+                                    </select>
+                                </div>
                             </div>
-                            <div class="col-10">
-                                <select id="geographic_value" name="geographic_value" class="form-select" multiple="multiple"></select>
+                            <div class="row margin-top-1rem">
+                                <div class="col-2">
+                                    <label for="geographic_value" class="col-form-label">Geographic Value:</label>
+                                </div>
+                                <div class="col-10">
+                                    <select id="geographic_value" name="geographic_value" class="form-select" multiple="multiple"></select>
+                                </div>
                             </div>
-                        </div>
-                        <div class="row margin-top-1rem" name="choose_date">
-                            <div class="col-2">
-                                <label for="start_date" class="form-label">
-                                    Start Date:
-                                </label>
+                            <div class="row margin-top-1rem" name="choose_date">
+                                <div class="col-2">
+                                    <label for="start_date" class="form-label">
+                                        Start Date:
+                                    </label>
+                                </div>
+                                <div class="col-10">
+                                    <input type="date" class="form-control" id="start_date" name="start_date">
+                                </div>
                             </div>
-                            <div class="col-10">
-                                <input type="date" class="form-control" id="start_date" name="start_date">
+                            <div class="row margin-top-1rem" name="choose_date">
+                                <div class="col-2">
+                                    <label for="end_date" class="form-label">
+                                        End Date:
+                                    </label>
+                                </div>
+                                <div class="col-10">
+                                    <input type="date" class="form-control" id="end_date" name="end_date">
+                                </div>
                             </div>
-                        </div>
-                        <div class="row margin-top-1rem" name="choose_date">
-                            <div class="col-2">
-                                <label for="end_date" class="form-label">
-                                    End Date:
-                                </label>
+                            <div class="row">
+                                <button type="submit" value="Submit" class="btn btn-primary margin-top-1rem">
+                                    Submit
+                                </button>
                             </div>
-                            <div class="col-10">
-                                <input type="date" class="form-control" id="end_date" name="end_date">
+                            <div class="row margin-top-1rem">
+                                <pre class="margin-top-1rem"><code id="modeSubmitResult"></code></pre>
                             </div>
-                        </div>
-                        <div class="row">
-                            <button type="submit" value="Submit" class="btn btn-primary margin-top-1rem">
-                                Submit
-                            </button>
-                        </div>
-                        <div class="row margin-top-1rem">
-                            <pre class="margin-top-1rem"><code id="modeSubmitResult"></code></pre>
-                        </div>
-                    </form>
+                        </form>
+                    </div>
                 </div>
             </div>
-        </div>
-    </section>
+        </section>
+    {% endif %}
     <script>
         
         if (!library)
diff --git a/src/templates/signal_sets/signal_sets.html b/src/templates/signal_sets/signal_sets.html
index 766883d..464c257 100644
--- a/src/templates/signal_sets/signal_sets.html
+++ b/src/templates/signal_sets/signal_sets.html
@@ -253,7 +253,6 @@ <h2 class="accordion-header" id="flush-heading_{{ form.temporal_granularity.auto
                         <table class="table table-hover">
                             <thead>
                                 <tr>
-                                    <th scope="col"></th>
                                     <th scope="col">Name</th>
                                     <th scope="col">Description of data*</th>
                                     <th scope="col">Name of maintainer/key contact*</th>
@@ -289,9 +288,6 @@ <h2 class="accordion-header" id="flush-heading_{{ form.temporal_granularity.auto
                             <tbody>
                                 {% for signal_set in signal_sets %}
                                 <tr>
-                                    <td>
-                                        <input type="checkbox" name="id" value="{{ signal_set.id }}">
-                                    </td>
                                     <td class="clickable-table-cell"
                                         onClick="location.href='{% url 'signal_set' pk=signal_set.id %}';">
                                         {{ signal_set.name }}
diff --git a/src/templates/signals/signals.html b/src/templates/signals/signals.html
index 4d87ac7..fe0fbb7 100644
--- a/src/templates/signals/signals.html
+++ b/src/templates/signals/signals.html
@@ -314,7 +314,6 @@ <h2 class="accordion-header" id="flush-heading_id_signal_availability">
                                     <td class="clickable-table-cell"
                                         onClick="location.href='{% url 'signal' pk=signal.id %}';">
                                         {{ signal.name }}
-                                        {% url 'api_signal_detail' pk=signal.id %}
                                     </td>
                                     <td class="clickable-table-cell"
                                         onClick="location.href='{% url 'signal' pk=signal.id %}';">