handlich vaccines in UI

This commit is contained in:
frankknoll
2023-10-13 20:57:18 +02:00
parent f28ee6e400
commit 7b78a6f449
7 changed files with 259 additions and 17 deletions

View File

@@ -31,15 +31,23 @@
<script src="./js/PageInitializer.js"></script>
<script src="./js/PrrByVaccineProvider.js"></script>
<script src="./js/PrrByVaccineTable.js"></script>
<script src="./js/PrrBySymptomTable.js"></script>
<script src="./js/PrrByVaccineTableView.js"></script>
<script src="./js/PrrBySymptomTableView.js"></script>
<script>
document.addEventListener(
"DOMContentLoaded",
event => {
PageInitializer.initializePage(
{
symptom: {
symptomSelectElement: $('#symptomSelect'),
prrByVaccineTableElement: $('#prrByVaccineTable')
},
vaccine: {
vaccineSelectElement: $('#vaccineSelect'),
prrBySymptomTableElement: $('#prrBySymptomTable')
}
}
);
});
@@ -63,7 +71,7 @@
</div>
<div class="clearfix"></div>
<div class="row">
<div>
<div class="col-xs-12 col-sm-6">
<div class="x_panel">
<div class="x_title">
<h3>Worst Vaccines</h3>
@@ -17681,6 +17689,128 @@
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6">
<div class="x_panel">
<div class="x_title">
<h3>Strongest Symptoms</h3>
<div class="clearfix"></div>
</div>
<div class="x_content">
<div style="margin-bottom: 20px;">
<label>Select Vaccine:</label>
<select id="vaccineSelect" name="vaccine">
<option disabled="" hidden="" selected="" value="">Select Vaccine</option>
<option value="6VAX-F">6VAX-F</option>
<option value="ADEN_4_7">ADEN_4_7</option>
<option value="ANTH">ANTH</option>
<option value="BCG">BCG</option>
<option value="CEE">CEE</option>
<option value="CHOL">CHOL</option>
<option value="COVID19">COVID19</option>
<option value="COVID19-2">COVID19-2</option>
<option value="DF">DF</option>
<option value="DPP">DPP</option>
<option value="DT">DT</option>
<option value="DTAP">DTAP</option>
<option value="DTAPH">DTAPH</option>
<option value="DTAPHEPBIP">DTAPHEPBIP</option>
<option value="DTAPIPV">DTAPIPV</option>
<option value="DTAPIPVHIB">DTAPIPVHIB</option>
<option value="DTIPV">DTIPV</option>
<option value="DTOX">DTOX</option>
<option value="DTP">DTP</option>
<option value="DTPHEP">DTPHEP</option>
<option value="DTPHIB">DTPHIB</option>
<option value="DTPIHI">DTPIHI</option>
<option value="DTPIPV">DTPIPV</option>
<option value="DTPPHIB">DTPPHIB</option>
<option value="DTPPVHBHPB">DTPPVHBHPB</option>
<option value="EBZR">EBZR</option>
<option value="FLU(H1N1)">FLU(H1N1)</option>
<option value="FLU3">FLU3</option>
<option value="FLU4">FLU4</option>
<option value="FLUA3">FLUA3</option>
<option value="FLUA4">FLUA4</option>
<option value="FLUC3">FLUC3</option>
<option value="FLUC4">FLUC4</option>
<option value="FLUN(H1N1)">FLUN(H1N1)</option>
<option value="FLUN3">FLUN3</option>
<option value="FLUN4">FLUN4</option>
<option value="FLUR3">FLUR3</option>
<option value="FLUR4">FLUR4</option>
<option value="FLUX">FLUX</option>
<option value="FLUX(H1N1)">FLUX(H1N1)</option>
<option value="H5N1">H5N1</option>
<option value="HBHEPB">HBHEPB</option>
<option value="HBPV">HBPV</option>
<option value="HEP">HEP</option>
<option value="HEPA">HEPA</option>
<option value="HEPAB">HEPAB</option>
<option value="HEPATYP">HEPATYP</option>
<option value="HIBV">HIBV</option>
<option value="HPV2">HPV2</option>
<option value="HPV4">HPV4</option>
<option value="HPV9">HPV9</option>
<option value="HPVX">HPVX</option>
<option value="IPV">IPV</option>
<option value="JEV">JEV</option>
<option value="JEV1">JEV1</option>
<option value="JEVX">JEVX</option>
<option value="LYME">LYME</option>
<option value="MEA">MEA</option>
<option value="MEN">MEN</option>
<option value="MENB">MENB</option>
<option value="MENHIB">MENHIB</option>
<option value="MER">MER</option>
<option value="MM">MM</option>
<option value="MMR">MMR</option>
<option value="MMRV">MMRV</option>
<option value="MNC">MNC</option>
<option value="MNQ">MNQ</option>
<option value="MNQHIB">MNQHIB</option>
<option value="MU">MU</option>
<option value="MUR">MUR</option>
<option value="OPV">OPV</option>
<option value="PER">PER</option>
<option value="PLAGUE">PLAGUE</option>
<option value="PNC">PNC</option>
<option value="PNC10">PNC10</option>
<option value="PNC13">PNC13</option>
<option value="PNC15">PNC15</option>
<option value="PNC20">PNC20</option>
<option value="PPV">PPV</option>
<option value="RAB">RAB</option>
<option value="RUB">RUB</option>
<option value="RV">RV</option>
<option value="RV1">RV1</option>
<option value="RV5">RV5</option>
<option value="RVX">RVX</option>
<option value="SMALL">SMALL</option>
<option value="SMALLMNK">SMALLMNK</option>
<option value="SSEV">SSEV</option>
<option value="TBE">TBE</option>
<option value="TD">TD</option>
<option value="TDAP">TDAP</option>
<option value="TDAPIPV">TDAPIPV</option>
<option value="TTOX">TTOX</option>
<option value="TYP">TYP</option>
<option value="UNK">UNK</option>
<option value="VARCEL">VARCEL</option>
<option value="VARZOS">VARZOS</option>
<option value="YF">YF</option>
</select>
</div>
<table class="display" id="prrBySymptomTable">
<thead>
<tr>
<th>Symptom</th>
<th>Proportional Reporting Ratio > 1</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
</div>
<div class="clearfix"></div>
</div>

View File

@@ -1,22 +1,37 @@
class PageInitializer {
static initializePage({ symptomSelectElement, prrByVaccineTableElement }) {
static initializePage({ symptom, vaccine }) {
PageInitializer.#configureSymptom(symptom);
PageInitializer.#configureVaccine(vaccine);
}
static #configureSymptom({ symptomSelectElement, prrByVaccineTableElement }) {
const prrByVaccineTableView = new PrrByVaccineTableView(prrByVaccineTableElement);
PageInitializer.#initializeSymptomSelectElement(
PageInitializer.#initializeSelectElement(
{
symptomSelectElement: symptomSelectElement,
onSymptomSelected: symptom => prrByVaccineTableView.displayPrrByVaccineTable4Symptom(symptom)
selectElement: symptomSelectElement,
onValueSelected: symptom => prrByVaccineTableView.displayPrrByVaccineTable4Symptom(symptom),
minimumInputLength: 4
});
}
static #initializeSymptomSelectElement({ symptomSelectElement, onSymptomSelected }) {
symptomSelectElement.select2({ minimumInputLength: 4 });
symptomSelectElement.on(
static #configureVaccine({ vaccineSelectElement, prrBySymptomTableElement }) {
const prrBySymptomTableView = new PrrBySymptomTableView(prrBySymptomTableElement);
PageInitializer.#initializeSelectElement(
{
selectElement: vaccineSelectElement,
onValueSelected: vaccine => prrBySymptomTableView.displayPrrBySymptomTable4Vaccine(vaccine),
minimumInputLength: 0
});
}
static #initializeSelectElement({ selectElement, onValueSelected, minimumInputLength }) {
selectElement.select2({ minimumInputLength: minimumInputLength });
selectElement.on(
'select2:select',
function (event) {
const symptom = event.params.data.id;
onSymptomSelected(symptom);
const value = event.params.data.id;
onValueSelected(value);
});
symptomSelectElement.select2('open');
}
}

View File

@@ -0,0 +1,72 @@
class PrrBySymptomTable {
#tableElement;
#table;
#sumPrrs;
constructor(tableElement) {
this.#tableElement = tableElement;
}
initialize() {
this.#table = this.#createEmptyTable();
}
display(prrBySymptom) {
const symptom_prr_pairs = Object.entries(prrBySymptom);
this.#setTableRows(symptom_prr_pairs);
}
#createEmptyTable() {
return this.#tableElement.DataTable(
{
search:
{
return: false
},
processing: true,
deferRender: true,
order: [[this.#getColumnIndex('Proportional Reporting Ratio > 1'), "desc"]],
columnDefs:
[
{
searchable: false,
targets: [this.#getColumnIndex('Proportional Reporting Ratio > 1')]
},
{
render: prr =>
NumberWithBarElementFactory
.createNumberWithBarElement(
{
number: prr,
barLenInPercent: prr / this.#sumPrrs * 100
})
.outerHTML,
targets: [this.#getColumnIndex('Proportional Reporting Ratio > 1')]
}
]
});
}
#getColumnIndex(columnName) {
switch (columnName) {
case 'Symptom':
return 0;
case 'Proportional Reporting Ratio > 1':
return 1;
}
}
#setTableRows(symptom_prr_pairs) {
this.#sumPrrs = this.#getSumPrrs(symptom_prr_pairs);
this.#table
.clear()
.rows.add(symptom_prr_pairs)
.draw();
}
#getSumPrrs(symptom_prr_pairs) {
const prrs = symptom_prr_pairs.map(symptom_prr_pair => symptom_prr_pair[1])
return Utils.sum(prrs);
}
}

View File

@@ -0,0 +1,15 @@
class PrrBySymptomTableView {
#prrBySymptomTable;
constructor(prrBySymptomTableElement) {
this.#prrBySymptomTable = new PrrBySymptomTable(prrBySymptomTableElement);
this.#prrBySymptomTable.initialize();
}
displayPrrBySymptomTable4Vaccine(vaccine) {
PrrByVaccineProvider
.getPrrBySymptom(vaccine)
.then(prrBySymptom => this.#prrBySymptomTable.display(prrBySymptom));
}
}

View File

@@ -3,4 +3,8 @@ class PrrByVaccineProvider {
static getPrrByVaccine(symptom) {
return fetch(`../data/ProportionalReportingRatios/symptoms/${symptom}.json`).then(response => response.json());
}
static getPrrBySymptom(vaccine) {
return fetch(`../data/ProportionalReportingRatios/vaccines/${vaccine}.json`).then(response => response.json());
}
}

View File

@@ -439,8 +439,8 @@
"outputs": [],
"source": [
"from SymptomsCausedByVaccines.HtmlUpdater import updateHtmlFile\n",
"from src.SymptomsCausedByVaccines.PrrSeriesFactory import PrrSeriesFactory\n",
"from src.SymptomsCausedByVaccines.PrrSeriesTransformer import PrrSeriesTransformer\n",
"from SymptomsCausedByVaccines.PrrSeriesFactory import PrrSeriesFactory\n",
"from SymptomsCausedByVaccines.PrrSeriesTransformer import PrrSeriesTransformer\n",
"from SymptomsCausedByVaccines.ProportionalReportingRatiosPersister import saveProportionalReportingRatios\n",
"import os\n",
"import pandas as pd"
@@ -537,6 +537,7 @@
"source": [
"updateHtmlFile(\n",
" symptoms = list(prrByVaccineAndSymptom.columns),\n",
" vaccines = list(prrByVaccineAndSymptom.index),\n",
" htmlFile = \"../docs/SymptomsCausedByVaccines/index.html\")"
]
}

View File

@@ -1,16 +1,21 @@
from bs4 import BeautifulSoup
from HtmlTransformerUtil import HtmlTransformerUtil
from DateProvider import DateProvider
from SymptomsCausedByVaccines.HtmlUtils import getSymptomOptions
from SymptomsCausedByVaccines.HtmlUtils import getSymptomOptions, getVaccineOptions
from SymptomsCausedByVaccines.OptionsSetter import OptionsSetter
def updateHtmlFile(symptoms, htmlFile):
def updateHtmlFile(symptoms, vaccines, htmlFile):
_saveOptions(
options = getSymptomOptions(symptoms),
htmlFile = htmlFile,
selectElementId = 'symptomSelect')
_saveOptions(
options = getVaccineOptions(vaccines),
htmlFile = htmlFile,
selectElementId = 'vaccineSelect')
def _saveOptions(options, htmlFile, selectElementId):
HtmlTransformerUtil().applySoupTransformerToFile(
file=htmlFile,