francois/HowBadIsMyBatch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactoring

Browse Source
This commit is contained in:
frankknoll
2023-04-15 23:24:12 +02:00
parent 630a2879fa
commit 89045d7d31
4 changed files with 30 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
docs/BatchCodeDetailsView.js
View File

@@ -2,6 +2,7 @@ class BatchCodeDetailsView {
#uiContainer; #uiContainer;
#headingElement; #headingElement;
#batchcodesSelectElement;
#adverseReactionReportsChartView; #adverseReactionReportsChartView;
#histogramChartView; #histogramChartView;
#chartWithSlider; #chartWithSlider;
@@ -9,6 +10,7 @@ class BatchCodeDetailsView {
constructor(uiContainer) { constructor(uiContainer) {
this.#uiContainer = uiContainer this.#uiContainer = uiContainer
this.#headingElement = this.#uiContainer.querySelector(".heading"); this.#headingElement = this.#uiContainer.querySelector(".heading");
this.#batchcodesSelectElement = new ElementWithSingleChangeEventListener(this.#uiContainer.querySelector("#batchcodesSelect"));
this.#adverseReactionReportsChartView = new AdverseReactionReportsChartView(this.#uiContainer.querySelector('#adverseReactionReportsChartView')); this.#adverseReactionReportsChartView = new AdverseReactionReportsChartView(this.#uiContainer.querySelector('#adverseReactionReportsChartView'));
this.#chartWithSlider = this.#uiContainer.querySelector('.chartWithSlider'); this.#chartWithSlider = this.#uiContainer.querySelector('.chartWithSlider');
this.#histogramChartView = new HistogramChartView(this.#chartWithSlider.querySelector("canvas")); this.#histogramChartView = new HistogramChartView(this.#chartWithSlider.querySelector("canvas"));
@@ -67,10 +69,9 @@ class BatchCodeDetailsView {
} }
#displaySelectBatchcodeCombination(histograms) { #displaySelectBatchcodeCombination(histograms) {
const selectBatchcodeCombinationElement = this.#uiContainer.querySelector("#selectBatchcodeCombination");
BatchcodeCombinationSelection.configureSelectBatchcodeCombinationElement( BatchcodeCombinationSelection.configureSelectBatchcodeCombinationElement(
{ {
selectBatchcodeCombinationElement: selectBatchcodeCombinationElement, batchcodesSelectElement: this.#batchcodesSelectElement,
histograms: histograms, histograms: histograms,
onSelect: histoDescr => this.#displayHistogram(histoDescr) onSelect: histoDescr => this.#displayHistogram(histoDescr)
}); });

16
docs/BatchcodeCombinationSelection.js
View File

@@ -1,20 +1,18 @@
class BatchcodeCombinationSelection { class BatchcodeCombinationSelection {
static configureSelectBatchcodeCombinationElement({ selectBatchcodeCombinationElement, histograms, onSelect }) { static configureSelectBatchcodeCombinationElement({ batchcodesSelectElement, histograms, onSelect }) {
const batchcodesSelect = selectBatchcodeCombinationElement.querySelector('#batchcodesSelect'); this.#setBatchcodeCombinationOptions(batchcodesSelectElement.element, histograms);
this.#setBatchcodeCombinationOptions(batchcodesSelect, histograms); batchcodesSelectElement.setSingleChangeEventListener(
batchcodesSelect.addEventListener(
'change',
event => { event => {
const histoDescr = histograms[event.target.value]; const histoDescr = histograms[event.target.value];
onSelect(histoDescr); onSelect(histoDescr);
}); });
onSelect(histograms[0]); onSelect(histograms[0]);
} }
static #setBatchcodeCombinationOptions(batchcodesSelect, histograms) { static #setBatchcodeCombinationOptions(batchcodesSelectElement, histograms) {
UIUtils.clear(batchcodesSelect); UIUtils.clear(batchcodesSelectElement);
this.#getBatchcodeCombinationOptions(histograms).forEach(option => batchcodesSelect.add(option)); this.#getBatchcodeCombinationOptions(histograms).forEach(option => batchcodesSelectElement.add(option));
} }
static #getBatchcodeCombinationOptions(histograms) { static #getBatchcodeCombinationOptions(histograms) {

18
docs/ElementWithSingleChangeEventListener.js Normal file
View File

@@ -0,0 +1,18 @@
class ElementWithSingleChangeEventListener {
element;
#changeEventListenerOfElement;
constructor(element) {
this.element = element;
}
setSingleChangeEventListener(singleChangeEventListener) {
const eventType = 'change';
if (this.#changeEventListenerOfElement !== undefined) {
this.element.removeEventListener(eventType, this.#changeEventListenerOfElement);
}
this.element.addEventListener(eventType, singleChangeEventListener);
this.#changeEventListenerOfElement = singleChangeEventListener;
}
}

3
docs/batchCodeTable.html
View File

@@ -30,6 +30,7 @@
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.0/dist/chart.umd.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.0/dist/chart.umd.min.js"></script>
<script src="./Utils.js"></script> <script src="./Utils.js"></script>
<script src="./UIUtils.js"></script> <script src="./UIUtils.js"></script>
<script src="./ElementWithSingleChangeEventListener.js"></script>
<script src="./GoogleAnalytics.js"></script> <script src="./GoogleAnalytics.js"></script>
<script src="./BatchCodeSelectInitializer.js"></script> <script src="./BatchCodeSelectInitializer.js"></script>
<script src="./HistoDescrsProvider.js"></script> <script src="./HistoDescrsProvider.js"></script>
@@ -49764,8 +49765,8 @@
</p> </p>
<div id="batchCodeDetails" style="width: 50%"> <div id="batchCodeDetails" style="width: 50%">
<h3 class="heading"></h3> <h3 class="heading"></h3>
<canvas id="adverseReactionReportsChartView"></canvas>
<div id="selectBatchcodeCombination"> <div id="selectBatchcodeCombination">
<canvas id="adverseReactionReportsChartView"></canvas>
<label>Select batchcode combination: <label>Select batchcode combination:
<select id="batchcodesSelect" name="batchcodes"> <select id="batchcodesSelect" name="batchcodes">
</select> </select>