Skip to content

Commit b406ea6

Browse files
dmytrotskodmytrotsko
committed
OKRS24-198 Added init data export feature.
1 parent 65a4f2e commit b406ea6

File tree

6 files changed

+218
-125
lines changed

6 files changed

+218
-125
lines changed

‎src/assets/css/custom.css

+4
Original file line numberDiff line numberDiff line change
@@ -115,6 +115,10 @@
115115
border: none!important;
116116
}
117117

118+
.select2-container--default .select2-selection--multiple {
119+
border: none!important;
120+
}
121+
118122
.select2-container--default .select2-selection--single .select2-selection__arrow {
119123
display: none!important;
120124
}

‎src/signal_documentation/settings.py

+1
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@
2424
from sentry_sdk.integrations.redis import RedisIntegration
2525

2626
EPIVIS_URL = "https://deploy-preview-36--cmu-delphi-epivis.netlify.app/"
27+
DATA_EXPORT_URL = "https://api.covidcast.cmu.edu/epidata/covidcast/csv"
2728

2829
SENTRY_DSN = os.environ.get('SENTRY_DSN')
2930
if SENTRY_DSN:

‎src/signals/views.py

+1
Original file line numberDiff line numberDiff line change
@@ -102,6 +102,7 @@ def get_context_data(self, **kwargs) -> Dict[str, Any]:
102102

103103
context: Dict[str, Any] = super().get_context_data(**kwargs)
104104
context["epivis_url"] = settings.EPIVIS_URL
105+
context["data_export_url"] = settings.DATA_EXPORT_URL
105106
return context
106107

107108

‎src/templates/signals/epivis_block.html

-124
This file was deleted.

‎src/templates/signals/epivis_export_data_block.html

+211
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,211 @@
1+
<h5>Plot / Export data</h5>
2+
<section class="section">
3+
<div class="row">
4+
<div class="card">
5+
<div class="card-body">
6+
<form class="margin-top-1rem" onsubmit="submitMode(event)" id="epivis-form">
7+
<div class="row">
8+
<div class="col-2">
9+
<label class="form-label"
10+
>Select mode:</label
11+
>
12+
</div>
13+
<div class="col-10">
14+
<div class="form-check form-check-inline">
15+
<input class="form-check-input" type="radio" name="modes" id="epivis" value="epivis" checked>
16+
<label class="form-check-label" for="epivis">Plot data</label>
17+
</div>
18+
<div class="form-check form-check-inline">
19+
<input class="form-check-input" type="radio" name="modes" id="export" value="export">
20+
<label class="form-check-label" for="export">Export data</label>
21+
</div>
22+
</div>
23+
</div>
24+
<div class="row margin-top-1rem">
25+
<div class="col-2">
26+
<label for="source" class="form-label"
27+
>Data Source:</label
28+
>
29+
</div>
30+
<div class="col-10">
31+
<select id="source" name="source" class="form-select" disabled>
32+
<option selected>{{ signal.source.name }}</option>
33+
</select>
34+
</div>
35+
</div>
36+
<div class="row margin-top-1rem">
37+
<div class="col-2">
38+
<label for="signal" class="form-label"
39+
>Data Signal:</label
40+
>
41+
</div>
42+
<div class="col-10">
43+
<select id="signal" name="signal" class="form-select" disabled>
44+
<option selected>{{ signal.name }}</option>
45+
</select>
46+
</div>
47+
</div>
48+
<div class="row margin-top-1rem">
49+
<div class="col-2">
50+
<label for="geographic_type" class="form-label"
51+
>Geographic Type:</label
52+
>
53+
</div>
54+
<div class="col-10">
55+
<select id="geographic_type" name="geographic_type" class="form-select">
56+
<option selected>Choose...</option>
57+
{% for geography in signal.available_geography.all %}
58+
<option>{{ geography }}</option>
59+
{% endfor %}
60+
</select>
61+
</div>
62+
</div>
63+
<div class="row margin-top-1rem">
64+
<div class="col-2">
65+
<label for="geographic_value" class="col-form-label">Geographic Value:</label>
66+
</div>
67+
<div class="col-10">
68+
<select id="geographic_value" name="geographic_value" class="form-select" multiple="multiple"></select>
69+
</div>
70+
</div>
71+
<div class="row margin-top-1rem" name="choose_date" style="display: none;">
72+
<div class="col-2">
73+
<label for="start_date" class="form-label">
74+
Start Date:
75+
</label>
76+
</div>
77+
<div class="col-10">
78+
<input type="date" class="form-control" id="start_date" name="start_date">
79+
</div>
80+
</div>
81+
<div class="row margin-top-1rem" name="choose_date" style="display: none;">
82+
<div class="col-2">
83+
<label for="end_date" class="form-label">
84+
End Date:
85+
</label>
86+
</div>
87+
<div class="col-10">
88+
<input type="date" class="form-control" id="end_date" name="end_date">
89+
</div>
90+
</div>
91+
<div class="row">
92+
<button type="submit" value="Submit" class="btn btn-primary margin-top-1rem">
93+
Submit
94+
</button>
95+
</div>
96+
</form>
97+
</div>
98+
</div>
99+
</div>
100+
</section>
101+
<script>
102+
$(document).ready(function () {
103+
$('#geographic_value').select2({
104+
ajax: {
105+
url: '{% url 'geography_units_api' %}',
106+
dataType: 'json',
107+
data: function (params) {
108+
var geographic_type = document.getElementById('geographic_type');
109+
return {
110+
geography__name: geographic_type.value,
111+
term: params.term,
112+
limit: 50
113+
};
114+
},
115+
processResults: function (data) {
116+
return {
117+
results: $.map(data.results, function (item) {
118+
if (typeof item.geo_id === 'string') {
119+
return {
120+
text: item.display_name,
121+
id: item.geo_id.toLowerCase()
122+
}
123+
} else {
124+
return {
125+
text: item.display_name,
126+
id: item.geo_id
127+
}
128+
}
129+
})
130+
};
131+
}
132+
},
133+
minimumInputLength: 0,
134+
maximumSelectionLength: 1,
135+
});
136+
});
137+
138+
document.getElementById('geographic_type').addEventListener("change", (event) => {
139+
$('#geographic_value').val(null).trigger('change');
140+
})
141+
142+
document.getElementsByName('modes').forEach((el) => {
143+
el.addEventListener('change', (event) => {
144+
$('#geographic_value').val(null).trigger('change');
145+
if (event.target.value === 'epivis') {
146+
$('#geographic_value').select2('destroy');
147+
$('#geographic_value').select2({ maximumSelectionLength: 1 })
148+
} else {
149+
$('#geographic_value').select2('destroy');
150+
$('#geographic_value').select2({ maximumSelectionLength: 5 })
151+
}
152+
//handleModeChange(event.target);
153+
});
154+
});
155+
156+
var currentMode = 'epivis';
157+
158+
function handleModeChange(el) {
159+
var choose_dates = document.getElementsByName('choose_date');
160+
if (el.value === 'epivis') {
161+
currentMode = 'epivis';
162+
choose_dates.forEach((el) => {
163+
el.style.display = 'none';
164+
});
165+
} else {
166+
currentMode = 'export';
167+
choose_dates.forEach((el) => {
168+
el.style.display = 'flex';
169+
});
170+
}
171+
}
172+
173+
174+
function submitMode(event) {
175+
event.preventDefault();
176+
177+
var dataSource = document.getElementById('source').value;
178+
var dataSignal = document.getElementById('signal').value;
179+
var geographicType = document.getElementById('geographic_type').value;
180+
var geographicValue = $('#geographic_value').select2('data').map((el) => el.id).join(',');
181+
182+
if (geographicType === 'Choose...' || geographicValue === '') {
183+
alert('Please select Geographic Type and Geographic Value!');
184+
return;
185+
}
186+
187+
/*if (currentMode === 'epivis') {
188+
var epiVisUrl = "{{ epivis_url }}";
189+
var urlParamsEncoded = btoa(`{"datasets":[{"color":"#415742","title":"value","params":{"_endpoint":"covidcast","data_source":"${dataSource}","signal":"${dataSignal}","time_type":"day","geo_type":"${geographicType}","geo_value":"${geographicValue}"}}]}`);
190+
191+
epiVisUrl += `#${urlParamsEncoded}`;
192+
window.open(epiVisUrl, '_blank').focus();
193+
194+
} else {
195+
var startDate = document.getElementById('start_date').value;
196+
var endDate = document.getElementById('end_date').value;
197+
198+
var dataExportUrl = "{{ data_export_url }}";
199+
200+
if (startDate === '' || endDate === '') {
201+
alert('Please select start and end date');
202+
return;
203+
}
204+
205+
dataExportUrl += `?signal=${dataSource}:${dataSignal}&start_day=${startDate}&end_day=${endDate}&geo_type=${geographicType}&geo_values=${geographicValue}`;
206+
207+
}*/
208+
209+
210+
}
211+
</script>

‎src/templates/signals/signal_detail.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -221,7 +221,7 @@ <h5>Response Example</h5>
221221
</div>
222222
</section>
223223
{% endif %}
224-
{% include "signals/epivis_block.html"%}
224+
{% include "signals/epivis_export_data_block.html"%}
225225
<h5>Related links</h5>
226226
<section class="section">
227227
<div class="row">

0 commit comments

Comments
 (0)