ui modifications on html components
This commit is contained in:
Luis Aleixo
parent
caeaa8c39e
commit
6581586982
2 changed files with 74 additions and 74 deletions
|
|
@ -211,7 +211,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal -->
|
||||
<!-- Natural Ventilation Modal -->
|
||||
<div class="modal fade" id="warning_modal" tabindex="-1" role="dialog" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
|
|
@ -300,9 +300,78 @@
|
|||
|
||||
</div>
|
||||
<br/>
|
||||
<div id="DIVfrom_fitting" style="display:none">
|
||||
|
||||
<div id="DIVfrom_fitting" class="split" style="display: none">
|
||||
<div>
|
||||
For the CO₂ fitting algorithm, the following input values will be considered:
|
||||
<ul>
|
||||
<li>Room volume (m³)</li>
|
||||
<li>Total number of occupants</li>
|
||||
<li>Presence transition times</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="align-self-center text-center">
|
||||
<button id="button_fit_data" type="button" class="btn btn-primary" style="width: 60%" data-target="#DIVCO2_data_dialog" data-keyboard="false" data-backdrop="static" onclick="validateFormInputs(this)">Fitting Algorithm</button>
|
||||
</div>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
<!-- CO2 Modal -->
|
||||
<div class="modal fade" id="DIVCO2_data_dialog" tabindex="-1" role="dialog" aria-labelledby="CO2_values_title" aria-hidden="true" data-backdrop="static">
|
||||
<div class="modal-dialog modal-lg" role="document" overflow: visible>
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="CO2_values_title">CO₂ Fitting Algorithm</h5>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="d-flex d-row justify-content-between">
|
||||
<h5 style="margin-top: auto; margin-bottom: auto">Upload an Excel file to preview in HTML Table</h5>
|
||||
<button type="button" class="btn btn-primary btn-sm" onclick="downloadTemplate()">Download template</button>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Input element to upload an excel file -->
|
||||
<input type="file" id="file_upload" />
|
||||
<button type="button" class="btn btn-primary btn-sm" onclick="uploadFile('{{ get_calculator_url() }}/co2-fit/plot');">Upload</button>
|
||||
<br>
|
||||
<br>
|
||||
<!-- table to display the excel data -->
|
||||
<table id="display_excel_data" border="1" style="width: 70%; margin-left: auto; margin-right: auto"></table>
|
||||
<input id="CO2_data" type="text" name="CO2_data" form="not-submitted" class="form-control d-none" placeholder='{"times": [...], "concentrations": [...]}' value="{}"><br>
|
||||
<div id="CO2_input_data_div" style="display: none">
|
||||
</div>
|
||||
<input type="text" class="form-control d-none" name="CO2_fitting_result" id="CO2_fitting_result">
|
||||
|
||||
<div id="DIVCO2_fitting_to_submit" style="display: none">
|
||||
<img id="CO2_data_plot"/><br>
|
||||
<strong>Ventilation scheme:</strong>
|
||||
<div>
|
||||
<input class="ml-2" type="radio" id="fitting_natural_ventilation" name="fitting_ventilation_type" value='fitting_natural_ventilation' checked="checked" data-enables="#DIVfitting_natural_ventilation">
|
||||
<label for="fitting_natural_ventilation">Natural</label>
|
||||
<input class="ml-2" type="radio" id="fitting_mechanical_ventilation" name="fitting_ventilation_type" value='fitting_mechanical_ventilation'>
|
||||
<label for="fitting_mechanical_ventilation">Mechanical</label>
|
||||
</div>
|
||||
|
||||
<div id="DIVfitting_natural_ventilation" class="form-group mb-0" style="display: none">
|
||||
<label for="fitting_ventilation_states">Please enter the ventilation state change times, separated by comma - e.g. [8.5, 10, 11.5, 17] </label>
|
||||
<input type="text" class="form-control" id="fitting_ventilation_states" name="fitting_ventilation_states" placeholder="e.g. [8.5, 10, 11.5, 17]"><br>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="DIVCO2_fitting_result" style="display: none">
|
||||
<h5 style="margin-top: auto; margin-bottom: auto">Fitting result</h5><br>
|
||||
<p id="exhalation_rate_fit"></p>
|
||||
<p>Ventilation values (ACH):</p><br>
|
||||
<!-- table to display the ventilation result data -->
|
||||
<table id="ventilation_rate_fit" border="1" style="width: 70%; margin-left: auto; margin-right: auto"></table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" id="disable_fitting_algorithm" class="btn btn-secondary dismiss_btn_frm_field" data-dismiss="modal" onclick="disableFittingAlgorithm()">Discard</button>
|
||||
<button type="button" id="generate_fitting_data" class="btn btn-primary close_btn_frm_field" onclick="submitFittingAlgorithm('{{ get_calculator_url() }}/co2-fit/')" disabled>Fit data</button>
|
||||
<button type="button" style="display: none" id="save_and_dismiss_dialog" class="btn btn-primary close_btn_frm_field" data-dismiss="modal">Use fit data</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div></br>
|
||||
<div class='sub_title'>HEPA filtration:</div>
|
||||
<div>
|
||||
<input type="radio" id="hepa_yes" name="hepa_option" value=1 onclick="require_fields(this)" data-enables="#DIVhepa_amount">
|
||||
|
|
@ -555,7 +624,7 @@
|
|||
|
||||
<!-- Lunch Options -->
|
||||
<div class="form-check">
|
||||
<input type="checkbox" id="infected_dont_have_breaks_with_exposed" class="tabbed form-check-input" name="infected_dont_have_breaks_with_exposed" value='1' onclick="toggle_split_breaks()">
|
||||
<input type="checkbox" id="infected_dont_have_breaks_with_exposed" class="tabbed form-check-input" name="infected_dont_have_breaks_with_exposed" value="0" onclick="toggle_split_breaks()">
|
||||
<label for="infected_dont_have_breaks_with_exposed" class="form-check-label col-sm-12">Input separate breaks for infected and exposed person(s)</label>
|
||||
|
||||
</div><br>
|
||||
|
|
@ -670,75 +739,6 @@
|
|||
<br style="clear:both;">
|
||||
<i>Coffee breaks are spread evenly throughout the day.</i>
|
||||
<br><br>
|
||||
|
||||
<div class="split">
|
||||
<strong>Use CO₂ concentration values:</strong>
|
||||
<div>
|
||||
<input class="ml-2" type="radio" id="CO2_data_no" name="CO2_data_option" value=0 checked="checked">
|
||||
<label for="CO2_data_no">No</label>
|
||||
<input class="ml-2" type="radio" id="CO2_data_yes" name="CO2_data_option" value=1 data-enables="#DIVCO2_data">
|
||||
<label for="CO2_data_yes">Yes</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="DIVCO2_data" class="split" style="display: none">
|
||||
<div>
|
||||
For the CO₂ fitting algorithm, the following input values will be considered:
|
||||
<ul>
|
||||
<li>Room volume (m³)</li>
|
||||
<li>Ventilation transition times</li>
|
||||
<li>Total number of occupants</li>
|
||||
<li>Presence transition times</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="align-self-center text-center">
|
||||
<button id="button_fit_data" type="button" class="btn btn-primary" style="width: 60%" data-toggle="modal" data-target="#DIVCO2_data_dialog" data-keyboard="false" data-backdrop="static" data-previous-vent="no_ventilation">Fit Data</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- CO2 Modal -->
|
||||
<div class="modal fade" id="DIVCO2_data_dialog" tabindex="-1" role="dialog" aria-labelledby="CO2_values_title" aria-hidden="true" data-backdrop="static">
|
||||
<div class="modal-dialog modal-lg" role="document" overflow: visible>
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="CO2_values_title">CO₂ Fitting Algorithm</h5>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="d-flex d-row justify-content-between">
|
||||
<h5 style="margin-top: auto; margin-bottom: auto">Upload an Excel file to preview in HTML Table</h5>
|
||||
<button type="button" class="btn btn-primary btn-sm" onclick="downloadTemplate()">Download template</button>
|
||||
</div>
|
||||
<br>
|
||||
<!-- Input element to upload an excel file -->
|
||||
<input type="file" id="file_upload" />
|
||||
<button type="button" class="btn btn-primary btn-sm" onclick="upload_file()">Upload</button>
|
||||
<br>
|
||||
<br>
|
||||
<!-- table to display the excel data -->
|
||||
<table id="display_excel_data" border="1" style="width: 70%; margin-left: auto; margin-right: auto"></table>
|
||||
<input id="formatted_data" type="text" name="CO2_data" form="not-submitted" class="form-control d-none" placeholder='{"times": [...], "concentrations": [...]}' ><br>
|
||||
<div id="CO2_input_data_div" style="display: none">
|
||||
{# <p>The following data will be considered:</p><br>
|
||||
<p id="CO2_input_data"></p> #}
|
||||
</div>
|
||||
<input type="text" class="form-control d-none" name="CO2_fitting_result" id="CO2_fitting_result">
|
||||
<div id="DIV_CO2_fitting_result" style="display: none">
|
||||
<h5 style="margin-top: auto; margin-bottom: auto">Fitting result</h5>
|
||||
<img id="CO2_data_plot" style="margin-top: 2%"/>
|
||||
<p id="exhalation_rate_fit"></p>
|
||||
<p>Ventilation values (ACH):</p><br>
|
||||
<!-- table to display the ventilation result data -->
|
||||
<table id="ventilation_rate_fit" border="1" style="width: 70%; margin-left: auto; margin-right: auto"></table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary dismiss_btn_frm_field" data-dismiss="modal" onclick="clear_fitting_algorithm()">Discard</button>
|
||||
<button type="button" id="generate_fitting_data" class="btn btn-primary close_btn_frm_field" onclick="submit_fitting_algorithm('{{ get_calculator_url() }}/co2-fit')" disabled>Fit data</button>
|
||||
<button type="button" style="display: none" id="save_and_dismiss_dialog" class="btn btn-primary close_btn_frm_field" data-dismiss="modal">Use fit data</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -595,7 +595,7 @@
|
|||
{% elif form.activity_type == "gym" %}
|
||||
Gym - For comparison only, all persons doing heavy physical exercise, breathing and not speaking.
|
||||
{% endif %}
|
||||
{% if form.CO2_data_option %}
|
||||
{% if form.ventilation_type == "from_fitting" %}
|
||||
<p style="margin-left: 30px">Exhalation rate from fitting algorithm - {{form.CO2_fitting_result['exhalation_rate'] | round(2, 'floor')}} m³/h</p>
|
||||
{% endif %}
|
||||
</p></li>
|
||||
|
|
|
|||
Loading…
Reference in a new issue