working dynamic columns

efficiency_module/efficiency.py

@@ -10,39 +10,36 @@ def efficiency():
 
 
 # build the report page for the exposure module
-@blueprint.route('/efficiency', methods=['POST'])
-def eff_post():
-
-    mass = float(request.form["mass"])
-    density = float(request.form["density"])
-    PolymerVolume = mass / density
-    SurfaceArea = float(request.form["area"])
-
-    SolventVolume = float(request.form["svol"])
-    ExtractionTime = float(request.form["time"])*3600.
-    iterations = int(request.form["iterations"])
-
-    ExtractionTime = ExtractionTime * iterations
-    SolventVolume = SolventVolume * iterations
-
-    #D = float(request.form["DiffCoeff"])
-    #K = float(request.form["PartCoeff"])
-
-    L = PolymerVolume / SurfaceArea
-
-    nterms = 5
-    M0 = 1.
-    K = np.array((1e-3, 1., 1e3))
-    D = np.array((1e-7, 1e-10, 1e-13))
-    ExtEff = np.zeros((3,3))
-    for i in range(3):
-        for j in range(3):
-            ExtEff[i,j] = PlaneSheetAnalytical(M0, D[i], K[j], PolymerVolume, SurfaceArea, SolventVolume, ExtractionTime, nterms)
-            print(ExtEff[i,j])
-
-    Conc = ExtEff * PolymerVolume / SolventVolume
-
-    print(Conc)
-
-    return render_template('efficiency_report.html', ExtEff = ExtEff, Conc=Conc)
+# @blueprint.route('/efficiency', methods=['POST'])
+# def eff_post():
+#
+#     mass = float(request.form["mass"])
+#     density = float(request.form["density"])
+#     PolymerVolume = mass / density
+#     SurfaceArea = float(request.form["area"])
+#
+#     SolventVolume = float(request.form["svol"])
+#     ExtractionTime = float(request.form["time"])*3600.
+#     iterations = int(request.form["iterations"])
+#
+#     ExtractionTime = ExtractionTime * iterations
+#     SolventVolume = SolventVolume * iterations
+#
+#     #D = float(request.form["DiffCoeff"])
+#     #K = float(request.form["PartCoeff"])
+#
+#     L = PolymerVolume / SurfaceArea
+#
+#     nterms = 5
+#     M0 = 1.
+#     K = np.array((1e-3, 1., 1e3))
+#     D = np.array((1e-7, 1e-10, 1e-13))
+#     ExtEff = np.zeros((3,3))
+#     for i in range(3):
+#         for j in range(3):
+#             ExtEff[i,j] = PlaneSheetAnalytical(M0, D[i], K[j], PolymerVolume, SurfaceArea, SolventVolume, ExtractionTime, nterms)
+#
+#     Conc = ExtEff * PolymerVolume / SolventVolume
+#
+#     return render_template('efficiency_report.html', ExtEff = ExtEff, Conc=Conc)
 

efficiency_module/templates/efficiency_index.html

@@ -8,6 +8,13 @@
   <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.min.js" integrity="sha384-VHvPCCyXqtD5DqJeNxl2dtTyhF78xXNXdkwX1CZeRusQfRKp+tA7hAShOK/B/fQ2" crossorigin="anonymous"></script>
   <link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='styles.css') }}">
 
+  <style>
+table, th, td {
+  border: 1px solid black;
+  border-collapse: collapse;
+}
+</style>
+
 </head>
 
 <img src="{{ url_for('static',filename='images/FDAlogo.png') }}" style="float: left;" height="100"/>
@@ -15,48 +22,84 @@
 <br clear="all" />
 
 <header>
-  <h1 style="text-align:center"><font color="#0070C0">CH</font>emical <font color="#0070C0">RIS</font>k calculator (CHRIS) - Extraction efficiency RST</h1>
+  <h1 style="text-align:center"><font color="#0070C0">CH</font>emical <font color="#0070C0">RIS</font>k calculator (CHRIS) - Extraction efficiency comparison RST</h1>
 </header>
 
+<script>
+      function addColumn(){
+
+        var i = document.getElementById('theTable').rows[0].cells.length;
+
+        $("#theTable tr:eq( 0 )").append("<td> <input type='number' step='any' value='1.0' min='0.00001' required id='mass'" + i + "> </td>");
+        $("#theTable tr:eq( 1 )").append("<td> <input type='number' step='any' value='1.0' min='0.00001' required id='density'" + i + "> </td>");
+        $("#theTable tr:eq( 2 )").append("<td> <input type='number' step='any' value='6.0' min='0.00001' required id='area'" + i + "> </td>");
+        $("#theTable tr:eq( 3 )").append("<td> <input type='number' step='any' value='1.0' min='0.00001' required id='svol'" + i + "> </td>");
+        $("#theTable tr:eq( 4 )").append("<td> <input type='number' step='1' value='1' min='1' onchange='this.value = parseInt(this.value);' required id='iterations'" + i + "> </td>");
+        $("#theTable tr:eq( 5 )").append("<td> <input type='number' step='any' value='1.0' min='0.00001' required id='time'" + i + "> </td>");
+        $("#theTable tr:eq( 6 )").append("<td> <input type='number' step='any' value='1e-8' min='1e-20' required id='D'" + i + "> </td>");
+        $("#theTable tr:eq( 7 )").append("<td> <input type='number' step='any' value='1.0' min='0.00001' required id='K'" + i + "> </td>");
+
+      };
+
+      function removeColumn(){
+
+        $('#theTable tr').find('td:last').remove();
+
+      };
+</script>
+
 <body>
 
 <form method="POST">
 
-  <!-- Test article input section -->
-
-  <h3> Test article <button type="button" class="Info_btn" data-toggle="modal" data-target="#ArticleModal">&#9432;</button> </h3>
-  Mass (g):
-  <input name="mass" id="mass" step="any" value="1.0" min="0.000001" type="number" required> <br>
-  Density (g/cm<sup>3</sup>):
-  <input name="density" id="density" step="any" value="1.0" min="0.01" type="number" required> <br>
-  Exposed surface area (cm<sup>2</sup>):
-  <input name="area" id="area" step="any" value="5.0" min="0.001" type="number" required><br>
-
-  <!-- Extraction conditions input section -->
-
-  <h3> Extraction conditions <button type="button" class="Info_btn" data-toggle="modal" data-target="#ExtractionModal">&#9432;</button> </h3>
-
-  Solvent volume (ml):
-  <input name="svol" id="svol" step="any" value="1.0" min="0.000001" type="number" required> <br>
-  Immersion time per iteration (h):
-  <input name="time" id="time" step="any" value="24.0" min="0.001" type="number" required> <br>
-  Number of iterations:
-  <input name="iterations" id="iterations" step="any" value="1" min="1" type="number" step="1" onchange="this.value = parseInt(this.value);" required> <br>
-
-  <!-- Material properties input section
-  <h3> Material properties <button type="button" class="Info_btn" data-toggle="modal" data-target="#MaterialModal">&#9432;</button> </h3>
-    Diffusion coefficient (D): <select name="DiffCoeff">
-        <option value="1e-7" selected>Fast (1e-7 cm2/s) </option>
-        <option value="1e-10">Medium (1e-10 cm2/s) </option>
-        <option value="1e-13">Slow (1e-13 cm2/s) </option>
-    </select> <br>
-    Partition coefficient (K): <select name="PartCoeff">
-        <option value="1e-3" selected>Low (1e-3) </option>
-        <option value="1">Medium (1) </option>
-        <option value="1e3">High (1e3) </option>
-    </select> <br> -->
-
-  <h3> Efficiency estimation </h3>
-  Click to calculate: <button type="submit">Submit</button>
+
+
+  <input type = "button" onclick = "javascript:addColumn()" value = "Add column" />
+  <input type = "button" onclick = "javascript:removeColumn()" value = "Remove column" />
+
+  <table id="theTable">
+  <tr>
+    <th> Test article mass (g)</th>
+    <td> <input name="mass1" id="mass1" step="any" value="1.0" min="0.000001" type="number" required> </td>
+    <td> <input name="mass2" id="mass2" step="any" value="1.0" min="0.000001" type="number" required> </td>
+  </tr>
+  <tr>
+    <th> Test article density (g/cm<sup>3</sup>) </th>
+    <td> <input name="density1" id="density1" step="any" value="1.0" min="0.01" type="number" required> </td>
+    <td> <input name="density2" id="density2" step="any" value="1.0" min="0.01" type="number" required> </td>
+  </tr>
+  <tr>
+    <th> Test article surface area (cm<sup>2</sup>) </th>
+    <td> <input name="area1" id="area1" step="any" value="6.0" min="0.001" type="number" required> </td>
+    <td> <input name="area2" id="area2" step="any" value="6.0" min="0.001" type="number" required> </td>
+  </tr>
+  <tr>
+    <th> Solvent volume (ml) </th>
+    <td> <input name="svol1" id="svol1" step="any" value="1.0" min="0.000001" type="number" required> </td>
+    <td> <input name="svol2" id="svol2" step="any" value="1.0" min="0.000001" type="number" required> </td>
+  </tr>
+  <tr>
+    <th> # of iterations </th>
+    <td> <input name="iterations1" id="iterations1" value="1" min="1" type="number" step="1" onchange="this.value = parseInt(this.value);" required> </td>
+    <td> <input name="iterations2" id="iterations2" value="1" min="1" type="number" step="1" onchange="this.value = parseInt(this.value);" required> </td>
+  </tr>
+  <tr>
+    <th> time per iteration (h) </th>
+    <td> <input name="time1" id="time1" step="any" value="24.0" min="0.001" type="number" required> </td>
+    <td> <input name="time2" id="time2" step="any" value="24.0" min="0.001" type="number" required> </td>
+  </tr>
+  <tr>
+    <th> Diffusion coefficient (cm<sup>2</sup>/s) </th>
+    <td> <input name="D1" id="D1" step="any" value="1e-8" min="1e-20" type="number" required> </td>
+    <td> <input name="D2" id="D2" step="any" value="1e-8" min="1e-20" type="number" required> </td>
+  </tr>
+  <tr>
+    <th> Partition coefficient </th>
+    <td> <input name="K1" id="K1" step="any" value="1" min="1e-3" type="number" required> </td>
+    <td> <input name="K2" id="K2" step="any" value="1" min="1e-3" type="number" required> </td>
+  </tr>
+  </table>
+
+  <br> <button type="submit">Calculate</button>
 </body>
 </html>