1 files changed, 142 insertions, 0 deletions
diff --git a/gn2/wqflask/templates/wgcna_setup.html b/gn2/wqflask/templates/wgcna_setup.html
new file mode 100644
index 00000000..d7acd5f2
--- /dev/null
+++ b/gn2/wqflask/templates/wgcna_setup.html
@@ -0,0 +1,142 @@
+{% extends "base.html" %}
+{% block title %}WCGNA analysis{% endblock %}
+{% block content %}
+<!-- Start of body -->
+<style type="text/css">
+
+#terminal {
+    margin-top: 10px;
+}
+
+</style>
+
+<link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='xterm/xterm.min.css') }}" />
+
+<div class="container">
+    <div class="col-md-5">
+        <h1 class="mx-3 my-2 "> WGCNA analysis parameters</h1>
+        {% if request.form['trait_list'].split(",")|length < 4 %} <div class="alert alert-danger" role="alert">
+            <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
+            <span class="sr-only">Error:</span>
+            <h2>Too few phenotypes as input</h2>
+            Please make sure you select enough phenotypes / genes to perform WGCNA. Your collection needs to contain at least 4 different phenotypes. You provided {{request.form['trait_list'].split(',')|length}} phenotypes as input.
+    </div>
+    {% else %}
+    <form class="col-md-12" action="/wgcna_results" method="post" class="form-horizontal" id="wgcna_form">
+        <input type="hidden" name="trait_list" id="trait_list" value="{{request.form['trait_list']}}">
+        <div class="form-group row ">
+            <label for="SoftThresholds" class="col-md-3 col-form-label col-form-label-sm">Soft threshhold</label>
+            <div class="col-md-9">
+                <input type="text" class="form-control form-control-md" value="1,2,3,4,5,6,7,8,9" id="SoftThresholds" name="SoftThresholds">
+            </div>
+        </div>
+        <div class="form-group row ">
+            <label for="MinModuleSize" class="col-md-3 col-form-label col-form-label-sm">Minimum module size:</label>
+            <div class="col-md-9">
+                <input type="text" class="form-control form-control-md" id="MinModuleSize" value="30" name="MinModuleSize">
+            </div>
+        </div>
+
+        <div class="form-group row">
+          <label for="TOMtype" class="col-md-3 col-form-label col-form-label-sm">TOMtype:</label>
+          <div class="col-md-9">
+            <select class="form-control" id="TOMtype" name="TOMtype">
+            <option value="unsigned">unsigned</option>
+            <option value="signed">signed</option>
+          </select>
+          </div>
+
+        </div>
+        <div class="form-group row ">
+            <label for="mergeCutHeight" class="col-md-3 col-form-label col-form-label-sm">mergeCutHeight:</label>
+            <div class="col-md-9">
+                <input type="text" class="form-control form-control-md" id="mergeCutHeight" value="0.25" name="mergeCutHeight">
+            </div>
+        </div>
+
+        <div class="form-group row">
+          <label for="corType" class="col-md-3 col-form-label col-form-label-sm">corType:</label>
+          <div class="col-md-9">
+            <select class="form-control  col-md-9" id="corType" name="corType">
+            <option value="pearson">pearson</option>
+            <option value="bicor">bicor</option>
+          </select>
+          </div>
+
+        </div>
+        <div class="form-group">
+            <div class="text-center">
+                <input type="submit" class="btn btn-primary" value="Run WGCNA using these settings" />
+            </div>
+        </div>
+
+
+
+    </form>
+    {% endif %}
+</div>
+<div class="col-md-7">
+        <div id="terminal" class="mt-2">
+        </div>
+</div>
+</div>
+
+<script src="{{ url_for('js', filename='xterm/xterm.min.js') }}" type="text/javascript"></script>
+<script src="{{ url_for('js', filename='jquery/jquery.min.js') }}" type="text/javascript"></script>
+<script src="https://cdn.jsdelivr.net/npm/xterm-addon-fit@0.5.0/lib/xterm-addon-fit.min.js"></script>
+
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+let term = new Terminal({
+    cursorBlink: true,
+    lineHeight: 1.3,
+    scrollback: true,
+    macOptionIsMeta: true
+});
+
+let termDebugs = {
+    general: "Computation process to be displayed here....",
+    success: "Computation in process ......",
+    fail: "Too few phenotypes as input must be >=4"
+}
+
+const fitAddon = new FitAddon.FitAddon()
+term.loadAddon(fitAddon)
+
+term.open(document.getElementById('terminal'));
+term.setOption('theme', {
+    background: '#300a24'
+});
+term.writeln(termDebugs.general)
+
+wgcnaForm = document.querySelector("#wgcna_form")
+
+fitAddon.fit()
+term.onData((data) => {
+    term.write(data)
+})
+
+
+if (wgcnaForm) {
+} else {
+    term.writeln(termDebugs.fail)
+}
+
+$(document).on('submit', '#wgcna_form', function(e) {
+    term.writeln(termDebugs.success)
+
+    e.preventDefault();
+    var form = $(this);
+    $.ajax({
+        type: 'POST',
+        url: '/wgcna_results',
+        data: form.serialize(),
+        success: function(data) {
+            document.write(data)
+        }
+    })
+})
+})
+
+</script>
+{% endblock %}
\ No newline at end of file