diff options
| -rw-r--r-- | wqflask/wqflask/templates/test_correlation_page.html | 140 | ||||
| -rw-r--r-- | wqflask/wqflask/views.py | 2 |
2 files changed, 141 insertions, 1 deletions
diff --git a/wqflask/wqflask/templates/test_correlation_page.html b/wqflask/wqflask/templates/test_correlation_page.html new file mode 100644 index 00000000..051d84db --- /dev/null +++ b/wqflask/wqflask/templates/test_correlation_page.html @@ -0,0 +1,140 @@ +{% extends "base.html" %} +{% block title %}Correlation Results{% endblock %} +{% block css %} + <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='DataTables/css/jquery.dataTables.css') }}" /> + <link rel="stylesheet" type="text/css" href="{{ url_for('js', filename='DataTablesExtensions/buttonsBootstrap/css/buttons.bootstrap.css') }}" /> + <link rel="stylesheet" type="text/css" href="{{ url_for('js', filename='DataTablesExtensions/buttonStyles/css/buttons.dataTables.min.css') }}"> + <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css"> + <link rel="stylesheet" type="text/css" href="/static/new/css/trait_list.css" /> + <link rel="stylesheet" type="text/css" href="/static/new/css/show_trait.css" /> + + <style type="text/css"> + .td-styles{ + height: 40px; + text-align: center; + } + .trait_col { + font-weight:bolder; + text-align: center; + } + table th { + font-weight: bolder; + text-transform: uppercase; + } + .correlation-title { + padding:25px 10px; + } + .correlation-title h3 span { + font-weight: bolder; + } + </style> +{% endblock %} + +{% block content %} + +<div class="correlation-title"> + <h3>Correlation Results for <span>Dataset_name</span> against <span><a href="">trait_name</a></span> for the top <span>all</span>Results</h3> +</div> + <table id="example" class="display" width="100%"> + <thead> + <tr > + <th>index</th> + <th>trait_name</th> + <th>Sample r</th> + <th>Sample p(r)</th> + <th>N</th> + </tr> + </thead> + </table> + +{% endblock %} + +{% block js %} +<script type="text/javascript" src="{{ url_for('js', filename='js_alt/md5.min.js') }}"></script> +<script type="text/javascript" src="/static/new/javascript/search_results.js"></script> + +<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='js_alt/underscore.min.js') }}"></script> +<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='jszip/jszip.min.js') }}"></script> +<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='js_alt/underscore.min.js') }}"></script> +<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTables/js/jquery.dataTables.min.js') }}"></script> +<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/buttons/js/dataTables.buttons.min.js') }}"></script> +<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/buttons/js/buttons.html5.min.js') }}"></script> +<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/plugins/sorting/natural.js') }}"></script> +<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/js/all.min.js"></script> +<script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/scroller/js/dataTables.scroller.min.js') }}"></script> +<script type="text/javascript"> + console.log("running this script") + let correlationResults = {{correlation_results|safe}} + // document.querySelector(".content").innerHTML =correlationResults + // parse the data + let counter = 0; + correlationResults =correlationResults.map((trait_object)=>{ + let trait_name = Object.keys(trait_object)[0] + let new_dict = { + "index":counter, + "trait_name":trait_name, + ...trait_object[trait_name] + } + counter++; + return new_dict; + }) + +</script> + +<script type="text/javascript"> + $(document).ready(function() { + $('#example').DataTable( { + "data": correlationResults, + "columns": [ + { "data": "index","width":"120px","title":"Index" }, + { "data": "trait_name","title":"TraitName"}, + { "data": "corr_coeffient"}, + { "data": "p_value"}, + { "data": "num_overlap"} + ], + "columnDefs": [ + + {className:"trait_col",targets:1}, + {className: "td-styles", targets: "_all"}, + { + orderable: false, + className: 'select-checkbox', + targets: 0 + }, + { + "targets":1, + "render":(data,type,row)=>{ + let urlLink = "/show_trait?trait_id=1453207_at&dataset=HC_M2_0606_P" + let traitLink = `<a href=${urlLink}>${data}</a>` + return traitLink + }, + } + + ], + select: { + style:'os', + selector: 'td:first-child' + } + } ); +} ); + + + + // console.log(corr_data) + // $('#example').DataTable( { + // "data": corr_data, + // "columns": [ + // {"data":"other"}, + // {"data":"trait_name"} + // ] + // "columns": [ + // { "data": "index" }, + // { "data": "trait_name"}, + // { "data": "corr_coeffient"}, + // { "data": "p_value"}, + // { "data": "num_overlap"} + // ] + // } ); +</script> + +{% endblock %}
\ No newline at end of file diff --git a/wqflask/wqflask/views.py b/wqflask/wqflask/views.py index 2c239425..3d4376e2 100644 --- a/wqflask/wqflask/views.py +++ b/wqflask/wqflask/views.py @@ -885,7 +885,7 @@ def corr_compute_page(): initial_time = time.time() correlation_results = compute_correlation(request.form) print(">>>>Time taken by this endpoint",time.time()-initial_time) - return render_template("demo_correlation_page.html",correlation_results=correlation_results[1:20]) + return render_template("test_correlation_page.html",correlation_results=correlation_results[0:50]) @app.route("/corr_matrix", methods=('POST',)) def corr_matrix_page(): |