ui modifications

caimira/apps/calculator/defaults.py

@@ -22,6 +22,8 @@ DEFAULTS = {
     'ceiling_height': 0.,
     'conditional_probability_plot': False,
     'conditional_probability_viral_loads': False,
+    'CO2_data': '{}',
+    'CO2_data_option': '{}',
     'exposed_coffee_break_option': 'coffee_break_0',
     'exposed_coffee_duration': 5,
     'exposed_finish': '17:30',

caimira/apps/calculator/model_generator.py

@@ -37,6 +37,8 @@ class FormData:
     ceiling_height: float
     conditional_probability_plot: bool
     conditional_probability_viral_loads: bool
+    CO2_data: dict
+    CO2_data_option: bool
     exposed_coffee_break_option: str
     exposed_coffee_duration: int
     exposed_finish: minutes_since_midnight

caimira/apps/calculator/static/js/form.js

@@ -493,6 +493,20 @@ function on_coffee_break_option_change() {
   }
 }
 
+function on_CO2_data_option_change() {
+  CO2_data_options = $('input[type=radio][name=CO2_data_option]');
+  CO2_data_options.each(function (index){
+    if (this.checked) {
+      getChildElement($(this)).show();
+      require_fields(this);
+    } 
+    else {
+      getChildElement($(this)).hide();
+      require_fields(this);
+    }
+  })
+}
+
 /* -------UI------- */
 
 function show_disclaimer() {
@@ -1039,6 +1053,12 @@ $(document).ready(function () {
   // Call the function now to handle forward/back button presses in the browser.
   on_coffee_break_option_change();
 
+  // When the CO2_data_option changes we want to make its respective
+  // children show/hide.
+  $("input[type=radio][name=CO2_data_option]").change(on_CO2_data_option_change);
+  // Call the function now to handle forward/back button presses in the browser.
+  on_CO2_data_option_change();
+
   // Setup the maximum number of people at page load (to handle back/forward),
   // and update it when total people is changed.
   validateMaxInfectedPeople();

caimira/apps/templates/base/calculator.form.html.j2

@@ -185,13 +185,30 @@
     <hr width="80%">
 
     <!-- Ventilation Options -->
+    
     <b>Ventilation data:</b>
     <div data-tooltip="The available means of venting / filtration of indoor spaces.">
         <span class="tooltip_text">?</span>
     </div>
     
-    <br>
+    <div class="split mt-3">
+    <div>Use CO₂ concentration values:</div>
+      <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='form-group row' style="display:none">
+      <div class="col-sm-3"><label class="col-form-label col-form-label-sm">CO2 Data:</label><br></div>
+      <input type="text" name="CO2_data" class="form-control form-control-sm col-sm-6" placeholder='{"times": [...], "concentrations": [...]}' >
+    </div>
+
+    <hr width="80%">
+    
+    <div id="ventilation_data">
       <div class='sub_title'>Ventilation type:</div>
       
       <div class="split">
@@ -306,6 +323,7 @@
           <div class="col-md-5"><input type="number" step="any" id="hepa_amount" class="non_zero form-control" name="hepa_amount" placeholder="Flow rate" min="0" data-has-radio="#hepa_yes"></div>
         </div>
       <hr width="80%">
+    </div>
 
     <b>Face masks:</b>
     <div data-tooltip="Masks worn at workstations or removed when a 2m physical distance is respected and proper venting is ensured.">