Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
85 changes: 47 additions & 38 deletions webapp/templates/dataset_label.html
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,9 @@ <h1 class="text-center mt-3" style="margin-bottom: 20px;">QUANTUM label</h1>
</ul>
</li>

<li><b>Color Gradient</b>: The base color of each category is assigned uniquely, while the dimensions inherit the same base color with varying opacity based on their score. As the score increases, the opacity of the color increases, making the slice more visible.</li>
<li><b>Color Gradient</b>: The base color of each category is assigned uniquely, while the dimensions inherit the same base color with varying opacity based on their score. As the score increases, the opacity of the color increases,
making the slice more visible.
</li>
<li><b>Stars & Score in Center</b>: The chart center displays the total DQ&U score and a star rating:
<ul>
<li>★☆☆☆☆ = 25% of DQ&U reached</li>
Expand Down Expand Up @@ -113,14 +115,14 @@ <h4>Dataset information</h4>
</div>

{% if assessment_percentage == 100 %}
<h5 class="text-success text-center"><b>This label shows a completed quality assessment.</b></h5>
<h5 class="text-success text-center"><b>This label shows a completed quality assessment.</b></h5>
{% else %}
<h5 class="text-warning text-center"><b>This is an ongoing evaluation; the displayed quality label is not final.</b></h5>
<h5 class="text-warning text-center"><b>This is an ongoing evaluation; the displayed quality label is not final.</b></h5>
{% endif %}


<div class="progress-container mb-2">
<div class="progress text-center opacity-75 mx-5" role="progressbar">
<div class="progress text-center opacity-75 mx-5" role="progressbar">
<div id="progress" class="progress-bar bg-warning" style="width: 0%"></div>
</div>
</div>
Expand Down Expand Up @@ -148,7 +150,7 @@ <h5 class="text-warning text-center"><b>This is an ongoing evaluation; the displ
});

</script>
</div>
</div>

<div class="col-md-2 col-sm-12"></div>
<div class="col-md-8 col-sm-12">
Expand All @@ -157,50 +159,57 @@ <h5 class="text-warning text-center"><b>This is an ongoing evaluation; the displ
{{ label | safe }}
</div>

<h2 class="text-center mt-5">Quality & Utility Assessment score</h2>
<div class="card card-body alert alert-warning mt-3">
<span>
The Maturity label and the DQ&U label are completely independent. Neither is calculated based on the other.
</span>
</div>

<h2 class="text-center mt-3">Quality & Utility Assessment score</h2>

<div class="mt-3">
<p class="display-2 text-center">
{{ stars | safe }}
</p>

<h2 style="margin-top: 20px; margin-bottom: 30px;" class="text-center"><a href="#" data-bs-toggle="modal" data-bs-target="#modal_finalScore">Total Q&U Score:</a> {{ score|floatformat:2 }} / 100 </h4>
<h2 style="margin-top: 20px; margin-bottom: 30px;" class="text-center"><a href="#" data-bs-toggle="modal" data-bs-target="#modal_finalScore">Total Q&U Score:</a> {{ score|floatformat:2 }} / 100 </h2>

<div class="modal fade" id="modal_finalScore" tabindex="-1">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="exampleModalLabel">
Stars & Final Score Calculation
</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class=" text-center modal-body">
<p>
<b>Stars Calculation:</b>
<br>
<p> ★☆☆☆☆ = 25% of DQ&U reached <br> ★★☆☆☆ = 45% of DQ&U reached <br> ★★★☆☆ = 60% of DQ&U reached <br> ★★★★☆ = 80% of DQ&U reached <br> ★★★★★ = ≥90% of DQ&U reached</p>
</p>
<hr>
<p>
<b>Final Score Calculation:</b>
<br>
</p>
<div class="text-center overflow-auto">
<p> The Total Score is a weighted average that measures the dataset's quality and utility. Each dimension's score is based on its importance (compared to the other dimensions) multiplied by the performance of its
metrics. The
dimension score is normalized by the total weight of all dimensions and then summed with all the other dimension scores.</p><br>
<p> \[\text{Total Score} =\frac{\sum_{i=1}^{n=12} \text{Dimension}_i^{\text{weight}} \times \left[\sum_{j=1}^{n=2} \left(\text{metric}_j^{\text{weight}} \times \text{metric value}_j \right) \right]}{\text{Total
Weight of
Dimensions}} \times 100\]</p>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>

<div class="modal fade" id="modal_finalScore" tabindex="-1">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="exampleModalLabel">
Stars & Final Score Calculation
</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class=" text-center modal-body">
<p>
<b>Stars Calculation:</b>
<br>
<p> ★☆☆☆☆ = 25% of DQ&U reached <br> ★★☆☆☆ = 45% of DQ&U reached <br> ★★★☆☆ = 60% of DQ&U reached <br> ★★★★☆ = 80% of DQ&U reached <br> ★★★★★ = ≥90% of DQ&U reached</p>
</p>
<hr>
<p>
<b>Final Score Calculation:</b>
<br>
</p>
<div class="text-center overflow-auto">
<p> The Total Score is a weighted average that measures the dataset's quality and utility. Each dimension's score is based on its importance (compared to the other dimensions) multiplied by the performance of its
metrics. The
dimension score is normalized by the total weight of all dimensions and then summed with all the other dimension scores.</p><br>
<p> \[\text{Total Score} =\frac{\sum_{i=1}^{n=12} \text{Dimension}_i^{\text{weight}} \times \left[\sum_{j=1}^{n=2} \left(\text{metric}_j^{\text{weight}} \times \text{metric value}_j \right) \right]}{\text{Total
Weight of
Dimensions}} \times 100\]</p>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>

<h2 class="text-center mt-5">Maturity score: {{ maturity_percentage }}% ({{ maturity_score }}/50)</h2>
Expand Down
6 changes: 6 additions & 0 deletions webapp/templates/dq_dashboard.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,12 @@

{% block content %}

<div class="card card-body alert alert-warning">
<span>
In the QUANTUM labelling tool, data catalogues and datasets are expected to be entered manually only during the piloting phase. In the future, this information will be automatically linked to existing metadata repositories and platforms across the EU.</b>
</span>
</div>

<h3 class="text-center mt-3 mb-3"> {{user.get_username}}'s DQ&U Dashboard</h3>

<div class="d-flex justify-content-center">
Expand Down
6 changes: 6 additions & 0 deletions webapp/templates/maturity_dashboard.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,12 @@

{% block content %}

<div class="card card-body alert alert-warning">
<span>
The Maturity label and the DQ&U label are completely independent. Neither is calculated based on the other.
</span>
</div>

<h3 class="text-center mt-3 mb-3"> {{user.get_username}}'s Maturity Dashboard</h3>

<div class="fluid-container mt-5"> <!-- class in Bootstrap ensures that the container is full-width and responsive. It is used to contain, pad, and (sometimes) center the content. -->
Expand Down