Mercurial > repos > tduigou > rptools_rpviz

<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Required meta tags -->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="./css/bootstrap.min.css">

    <!-- AG Grid scripts and CSS-->
    <script src="./js/ag-grid-community.min.noStyle.js"></script>
    <link rel="stylesheet" href="./css/ag-grid.min.css">
    <link rel="stylesheet" href="./css/ag-theme-alpine.min.css">
    <!-- AG Chart scripts -->
    <script src="./js/ag-charts-community.min.js"></script>
    <script src="./js/data.js"></script>

    <title>rpReport</title>
</head>

<body>
    <div class="container">
      <div class="row d-print-none">
        <div class="col">
          <div id="myGrid" style="width: 100%; height: 400px;" class="ag-theme-alpine"></div>
        </div>
      </div>
      <!-- Selected row(s) only schown on print display -->
      <div class="row d-none d-print-block">
        <div class="col">
          <div id="selectedRowOnPrint" class="table-responsive"></div>
        </div>
      </div>

      <div class="row">
        <div class="col">
          <p class="h4 bg-light text-center">Pathway details</p>
        </div>
      </div>
      <div class="row gy-2">
        <div class="col-md-6">
          <div class="accordion" id="thermodynamic_chart_panel">
            <div class="accordion-item">
              <h2 class="accordion-header" id="headingTwo">
                  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo">
                    Thermodynamic profile chart
                  </button>
              </h2>
              <div id="collapseTwo" class="accordion-collapse collapse">
                <div class="accordion-body">
                  <!-- Thermodynamique profile chart here -->
                  <div id="dfG_prime_chart" style="height:300px"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="accordion" id="rule_score_chart_panel">
            <div class="accordion-item">
              <h2 class="accordion-header" id="headingThree">
                  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree">
                    Rule score chart
                  </button>
              </h2>
              <div id="collapseThree" class="accordion-collapse collapse">
                <div class="accordion-body">
                  <!-- Pathway rule score chart here -->
                  <div id="rule_score_chart" style="height:300px"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="accordion" id="ec_code_panel">
            <div class="accordion-item">
              <h2 class="accordion-header" id="headingOne">
                <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne">
                      EC number(s)
                </button>
              </h2>
              <div id="collapseOne" class="accordion-collapse collapse">
                <div class="accordion-body">
                  <!-- Retropathway ec_codes list here -->
                  <div id="ec_code_details"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="row d-none" id="comparative_chart_panel">
        <div class="col">
          <div class="accordion">
            <div class="accordion-item">
              <h2 class="accordion-header" id="headingFour">
                  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFour">
                    Comparative charts
                  </button>
              </h2>
              <div id="collapseFour" class="accordion-collapse collapse show">
                <div class="accordion-body">
                  <!-- Comparative charts here -->
                  <div class="row">
                    <div class="col-md-6" id="global_score_compar_chart" style="height:300px"></div>
                    <div class="col-md-6" id="fba_compar_chart" style="height:300px"></div>
                    <div class="col-md-6" id="dfg_compar_chart" style="height:300px"></div>
                    <div class="col-md-6" id="rule_score_compar_chart" style="height:300px"></div>
                    <div class="col-md-6" id="reactions_nb_compar_chart" style="height:300px"></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <script src="./js/main.js"></script>

    <!-- Bootstrap Bundle (includes Popper) -->
    <script src="./js/bootstrap.bundle.min.js"></script>

</body>
</html>
author	tduigou
date	Wed, 24 Jul 2024 08:42:46 +0000
parents	bf6f117ef632
children