{% include 'mfire/include/header.html' %}
   {% include 'mfire/include/topbar.html' %}
    {% include 'mfire/include/sidebar.html' %}
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <div class="container-fluid">

            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1>Mechanical ventilation</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="/mfire/dashboard/">Dashboard</a></li>
                        <li class="breadcrumb-item"><a href="#">Mechanical ventilation</a></li>
                        <li class="breadcrumb-item active"></li>
                    </ol>
                </div>
            </div>
        </div><!-- /.container-fluid -->
    </section>

    <!-- Main content -->
    <section class="content">

        <!-- Default box -->
        <div class="card">
            <!--<div class="card-header">-->
            <!--    <h3 class="card-title">Create Advertiser</h3>-->
            <!--    <div class="card-tools">-->
            <!--        <a href="/user/advertiser/advertiser_create/" class="btn btn-sm btn-primary"><i class="fas fa-long-arrow-alt-left"></i> Go Back</a>-->
            <!--    </div>-->
            <!--</div>-->
            <div class="card-body">

                <div class="row">
                    <div class="col-md-12">
                        <form method="post" action="/mfire/mechanical_ventilation/">
                            {% csrf_token %}

                            <div class="form-row">
                                <div class="form-group col-md-4">
                                    <label for="layerheight" class="">Layer Height (M)</label>
                                    <input type="text" name="layerheight" id="layerheight" class="form-control" required>
                                </div>
                                <div class="form-group col-md-4">
                                    <label for="fire_size" class="">Fire Size (KW)</label>
                                    <input type="text" name="fire_size" id="fire_size"  onchange="getInputValue();" class="form-control" required>
                                </div>
                                <div class="form-group col-md-4">
                                    <label for="pfrate" class="">plume flow rate (m_dot) (kg/s)</label>
                                    <input type="text" name="pfrate" id="pfrate" class="form-control" readonly>
                                </div>
                               
                                <div class="form-group col-md-4">
                                    <label for="HGLtemp" class="">Calculate HGL temp (T-a) (K)</label>
                                    <input type="text" name="HGLtemp" id="HGLtemp" class="form-control" value="293" readonly>
                                </div>

                                <div class="form-group col-md-4">
                                    <label for="firesizeQ" class="">Fire Size Q (KW)</label>
                                    <input type="text" name="firesizeQ" id="firesizeQ" class="form-control" value="1000" readonly>
                                </div>
                                
                                <div class="form-group col-md-4">
                                    <label for="specificheat" class="">Specific Heat (c_p) (kj/kg-k)</label>
                                    <input type="text" name="specificheat" id="specificheat" onchange="getInputValue();" value="1" class="form-control" readonly>
                                </div>

                                <div class="form-group col-md-4">
                                    <label for="heattransfercoeff" class="">Heat transfer Coeff. (h) (kW/m^2-k)</label>
                                    <input type="text" name="heattransfercoeff" id="heattransfercoeff" onchange="getInputValue();" value="0.033" class="form-control" readonly>
                                </div>
                                
                                <div class="form-group col-md-4">
                                    <label for="Compartmentlength" class="">Compartment length (M)   </label>
                                    <input type="text" name="Compartmentlength" id="Compartmentlength" onchange="getInputValue();" class="form-control" required>
                                </div>
                                <div class="form-group col-md-4">
                                    <label for="Compartmentwidth" class="">Compartment width (M)   </label>
                                    <input type="text" name="Compartmentwidth" id="Compartmentwidth" onchange="getInputValue();" class="form-control" required>
                                </div>
                                <div class="form-group col-md-4">
                                    <label for="Compartmentheight" class=""> Compartment height (M)  </label>
                                    <input type="text" name="Compartmentheight" id="Compartmentheight" onchange="getInputValue();" class="form-control" required>
                                </div>
                                <div class="form-group col-md-4">
                                    <label for="areaodwalls" class="">Area of walls (A_w) (m^2)  </label>
                                    <input type="text" name="areaodwalls" id="areaodwalls" onchange="getInputValue();" class="form-control" readonly>
                                </div>
                                <div class="form-group col-md-4">
                                    <label for="HCLTemparature" class="">HGL Temparature (T-g) (K)</label>
                                    <input type="text" name="HCLTemparature" id="HCLTemparature" onchange="getInputValue();" class="form-control" readonly>
                                </div>
                                
                                 <div class="form-group col-md-4">
                                    <label for="densityHGLrho" class="">Density Of HGL rho (kg/m^3)</label>
                                    <input type="text" name="densityHGLrho" id="densityHGLrho" onchange="getInputValue();"  class="form-control" readonly>
                                </div>

                                 <div class="form-group col-md-4">
                                    <label for="fanflowrate_v_e" class="">Fan flow rate (V-e) (m^3/s)</label>
                                    <input type="text" name="fanflowrate_v_e" id="fanflowrate_v_e" class="form-control" readonly>
                                </div>
                                
                                 <div class="form-group col-md-4">
                                    <label for="fanflowrate_ve" class="">Fan Flow Rate(Ve) (ft^3/min(CFM))</label>
                                    <input type="text" name="fanflowrate_ve" id="fanflowrate_ve"  class="form-control" readonly>
                                </div>

                            </div>
                            <button type="submit" class="btn btn-primary">Save</button>

                        </form>
                    </div>
                </div>

            </div>
            <!-- /.card-body -->
        </div>
        <!-- /.card -->

    </section>
    <!-- /.content -->
</div>
<!-- /.content-wrapper -->

<script>
function getInputValue(){
    var layerheight = document.getElementById("layerheight").value;
    var fire_size = document.getElementById("fire_size").value;
    var mp = 0.076*(Math.pow(fire_size,1/3)*Math.pow(layerheight,5/3));
    document.getElementById("pfrate").value = mp;
    
    var Compartmentlength = document.getElementById("Compartmentlength").value;
    var Compartmentwidth = document.getElementById("Compartmentwidth").value;
    var Compartmentheight = document.getElementById("Compartmentheight").value;

    var areaodwalls = Compartmentlength*Compartmentwidth*Compartmentheight;
    document.getElementById("areaodwalls").value = areaodwalls;
    
    var HGLtemp = document.getElementById("HGLtemp").value;
    var firesizeQ = document.getElementById("firesizeQ").value;
    var specificheat = document.getElementById("specificheat").value;
    var heattransfercoeff = document.getElementById("heattransfercoeff").value;
    
    var mp = document.getElementById("pfrate").value;
    var areaodwalls = document.getElementById("areaodwalls").value;
    
    var tg = HGLtemp+firesizeQ/(specificheat*mp+heattransfercoeff*areaodwalls);

    document.getElementById("HCLTemparature").value = tg;
    
    var Pg=353/tg
    document.getElementById("densityHGLrho").value = Pg;
    
    var fanflowrate_v_e = mp/Pg
    document.getElementById("fanflowrate_v_e").value = fanflowrate_v_e;

    var ve =(fanflowrate_v_e*Math.pow(3.28,3)*60);
    document.getElementById("fanflowrate_ve").value = ve;
}


</script>
{% include 'mfire/include/footer.html' %}