merge changes

1 files changed, 698 insertions, 0 deletions

diff --git a/gn2/wqflask/templates/mapping_results.html b/gn2/wqflask/templates/mapping_results.html
new file mode 100644
index 00000000..0e084ba7
--- /dev/null
+++ b/gn2/wqflask/templates/mapping_results.html
@@ -0,0 +1,698 @@
+{% extends "base.html" %}
+{% block title %}Mapping Results{% endblock %}
+{% block css %}
+    <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='DataTables/css/jquery.dataTables.css') }}" />
+    
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
+    <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='purescript-genome-browser/css/purescript-genetics-browser.css') }}" />
+
+    <link rel="stylesheet" type="text/css" href="/static/new/css/marker_regression.css" />
+    <link rel="stylesheet" type="text/css" href="static/new/css/show_trait.css" />
+
+{% endblock %}
+{% from "base_macro.html" import header %}
+{% block content %}
+    <div class="container">
+        <form method="post" target="_blank" action="/run_mapping" name="marker_regression" id="marker_regression_form">
+        <input type="hidden" name="temp_uuid" value="{{ temp_uuid }}">
+        {% if temp_trait is defined %}
+        <input type="hidden" name="temp_trait" value="{{ temp_trait }}">
+        {% endif %}
+        <input type="hidden" name="inputs_hash" value="{{ hash_of_inputs }}">
+        <input type="hidden" name="group" value="{{ dataset.group.name }}">
+        <input type="hidden" name="species" value="{{ dataset.group.species }}">
+        <input type="hidden" name="trait_id" value="{{ this_trait.name }}">
+        <input type="hidden" name="dataset" value="{{ dataset.name }}">
+        <input type="hidden" name="genofile" value="{{ genofile_string }}">
+        <input type="hidden" name="geno_db_exists" value="{{ geno_db_exists }}">
+        <input type="hidden" name="first_run" value="{{ first_run }}">
+        {% if output_files is defined %}
+        <input type="hidden" name="output_files" value="{{ output_files }}">
+        {% endif %}
+        {% if reaper_version is defined %}
+        <input type="hidden" name="reaper_version" value="{{ reaper_version }}">
+        {% endif %}
+        <input type="hidden" name="results_path" value="{{ mapping_results_path }}">
+        <input type="hidden" name="method" value="{{ mapping_method }}">
+        <input type="hidden" name="sample_vals" value="{{ sample_vals }}">
+        <input type="hidden" name="vals_hash" value="{{ vals_hash }}">
+        <input type="hidden" name="n_samples" value="{{ n_samples }}">
+        <input type="hidden" name="maf" value="{{ maf }}">
+        <input type="hidden" name="use_loco" value="{{ use_loco }}">
+        <input type="hidden" name="selected_chr" value="{{ selectedChr }}">
+        <input type="hidden" name="mapping_scale" value="{{ plotScale }}">
+        <input type="hidden" name="manhattan_plot" value="{{ manhattan_plot }}">
+        {% if manhattan_plot == True %}
+        <input type="hidden" name="color_scheme" value="alternating">
+        {% endif %}
+        <input type="hidden" name="num_perm" value="{{ nperm }}">
+        <input type="hidden" name="perm_info" value="">
+        {% if categorical_vars is defined %}
+        <input type="hidden" name="categorical_vars" value="{{ categorical_vars|join(',') }}">
+        {% endif %}
+        {% if perm_strata is defined %}
+        <input type="hidden" name="perm_strata" value="True">
+        {% endif %}
+        <input type="hidden" name="num_bootstrap" value="{{ nboot }}">
+        <input type="hidden" name="do_control" value="{{ doControl }}">
+        <input type="hidden" name="control_marker" value="{{ controlLocus }}">
+        <input type="hidden" name="covariates" value="{{ covariates }}">
+        <input type="hidden" name="mapmethod_rqtl_geno" value="{{ mapmethod_rqtl_geno }}">
+        <input type="hidden" name="mapmodel_rqtl_geno" value="{{ mapmodel_rqtl_geno }}">
+        <input type="hidden" name="pair_scan" value="{{ pair_scan }}">
+        <input type="hidden" name="transform" value="{{ transform }}">
+        <input type="hidden" name="tool_used" value="Mapping">
+        <input type="hidden" name="wanted_inputs" value="">
+        <input type="hidden" name="form_url" value="/run_mapping">
+        
+        <div class="container" style="width: 1200px; float: left;">
+          <div class="col-xs-4" style="word-wrap: normal;">
+              <h2>Map Viewer: Whole Genome</h2><br>
+              <b>Population:</b> {{ dataset.group.species|capitalize }} {{ dataset.group.name }}<br>
+              <b>Database:</b> {{ dataset.fullname }}<br>
+              {% if dataset.type == "ProbeSet" %}<b>Trait ID:</b>{% else %}<b>Record ID:</b>{% endif %} <a href="/show_trait?trait_id={{ this_trait.name }}&dataset={{ dataset.name }}">{{ this_trait.display_name }}</a><br>
+              <b>Trait Hash: </b> {{ vals_hash }}<br>
+              {% if dataset.type == "ProbeSet" %}
+              <b>Gene Symbol:</b> <i>{{ this_trait.symbol }}</i><br>
+              <b>Location:</b> Chr {{ this_trait.chr }} @ {{ this_trait.mb }} Mb<br>
+              {% endif %}
+              {% if genofile_string != "" %}
+              <b>Genotypes:</b> {{ genofile_string.split(":")[1] }}<br>
+              {% endif %}
+              <b>Current Date/Time:</b> {{ current_datetime }}<br>
+              <br>
+              <button class="btn btn-default export_mapping_results"><span class="glyphicon glyphicon-download-alt"></span>Map Data</button>
+              <br><br>
+              <div class="input-group">
+                <input type="text" class="form-control" name="mappingLink" size="75"></input>
+                <div class="input-group-btn">
+                  <button class="btn btn-default share-results" type="button">Copy and Share</button>
+                </div>
+              </div>
+          </div>
+          <div id="gn1_map_options" class="col-xs-6" style="outline: 3px double #AAAAAA; padding: 10px; margin: 10px;">
+            <div class="col-xs-8" style="padding: 0px;">
+              <table>
+                <tr>
+                  <td><b>Chr:&nbsp;</b></td>
+                  <td style="padding: 5px;">
+                    <select name="chromosomes" size="1">
+                        {% for chr in ChrList %}
+                        <option value="{{ chr[1] }}" {% if (chr[1] + 1) == selectedChr %}selected{% endif %}>{{ chr[0] }}</option>
+                        {% endfor %}
+                    </select>&nbsp;
+                    <button type="button" class="btn btn-primary" style="padding-bottom: 2px; padding-top: 2px;" onclick="javascript:remap();">Remap</button>
+                  </td>
+                </tr>
+                <tr>
+                  <td ><b>View:&nbsp;</b></td>
+                  <td style="padding: 5px;">
+                    <input type="text" name="startMb" size="7" value="{% if startMb != -1 %}{{ startMb }}{% endif %}"> to <input type="text" name="endMb" size="7" value="{% if endMb != -1 %}{{ endMb }}{% endif %}">
+                  </td>
+                </tr>
+                <tr>
+                  <td><b>Units:&nbsp;</b></td>
+                  <td style="padding: 5px;">
+                    <label class="radio-inline">
+                      <input type="radio" name="LRSCheck" value="LRS" {% if LRS_LOD == "LRS" %}checked{% endif %}>LRS
+                    </label>
+                    <label class="radio-inline">
+                      <input type="radio" name="LRSCheck" value="{% if LRS_LOD == "-logP" %}-logP{% else %}LOD{% endif %}" {% if LRS_LOD == "LOD" or LRS_LOD == "-logP" %}checked{% endif %}>{% if LRS_LOD == "-logP" %}-logP{% else %}LOD{% endif %}
+                    </label>
+                    <a href="https://genenetwork.org/glossary.html#LOD" target="_blank">
+                      <sup style="color:#f00"> ?</sup>
+                    </a>
+                  </td>
+                </tr>
+                <tr>
+                  <td></td>
+                  <td style="padding: 5px;">
+                    <input type="text" name="lrsMax" value="{{ '%0.1f' | format(lrsMax|float) }}" size="3"> <span style="font-size: 12px;">units on the y-axis (0 for default)</span>   
+                  </td>
+                </tr>
+                <tr>
+                  <td><b>Width:&nbsp;</b></td>
+                  <td style="padding: 5px;">
+                    <input type="text" name="graphWidth" value="{% if graphWidth is defined %}{{ graphWidth }}{% else %}1600{% endif %}" size="5"><span style="font-size: 12px;"> pixels (minimum=900)</span>
+                  </td>
+                </tr>
+              </table>
+              {% if manhattan_plot == True and selectedChr == -1 %}
+              <table style="margin-top: 10px;">
+                <tr>
+                  <td>
+                    <b>Manhattan Plot Color Scheme:&nbsp;</b>
+                  </td>
+                  <td>
+                    <select id="color_scheme">
+                      <option value="alternating" {% if color_scheme == "alternating" %}selected{% endif %}>Alternating</option>
+                      <option value="varied" {% if color_scheme == "varied" %}selected{% endif %}>Varied by Chr</option>
+                      <option value="single" {% if color_scheme == "single" %}selected{% endif %}>Single Color</option>
+                    </select>
+                  </td>
+                  <td>
+                    <input name="manhattan_single_color" type="hidden" id="point_color" value={% if manhattan_single_color %}{{ manhattan_single_color }}{% else %}"#D9D9D9"{% endif %}>
+                    <button style="display: none; margin-left: 5px;" id="point_color_picker" class="jscolor {valueElement: 'point_color'}">Choose Color</button>
+                  </td>
+                </tr>
+              </table>
+              {% endif %}
+            </div>
+            <div class="col-xs-4" style="padding: 0px;">
+                  {% if (mapping_method == "reaper" or mapping_method == "rqtl_geno") and nperm > 0 %}
+                  <input type="checkbox" name="permCheck" class="checkbox" style="display: inline; margin-top: 0px;" {% if permChecked|upper == "ON" %}value="ON" checked{% endif %}> <span style="font-size: 12px;">Permutation Test 
+                    <a href="http://genenetwork.org/glossary.html#Permutation" target="_blank">
+                      <sup style="color:#f00"> ?</sup>
+                    </a>
+                  <br>
+                  {% endif %}
+                  {% if mapping_method == "reaper" and nboot > 0 %}
+                  <input type="checkbox" name="bootCheck" class="checkbox" style="display: inline; margin-top: 0px;" {% if bootChecked|upper == "ON" %}value="ON" checked{% endif %}> <span style="font-size: 12px;">Bootstrap Test 
+                    <a href="http://genenetwork.org/glossary.html#bootstrap" target="_blank">
+                      <sup style="color:#f00"> ?</sup>
+                    </a>
+                  <br>
+                  {% endif %}
+                  {% if mapping_method == "reaper" %}
+                  <input type="checkbox" name="additiveCheck" class="checkbox" style="display: inline; margin-top: 0px;" {% if additiveChecked|upper == "ON" %}value="ON" checked{% endif %}> <span style="font-size: 12px;">Allele Effects
+                    <a href="http://genenetwork.org/glossary.html#additive" target="_blank">
+                      <sup style="color:#f00"> ?</sup>
+                    </a>
+                  <br>
+                  {% endif %}
+                  <input type="checkbox" name="showSNP" class="checkbox" style="display: inline; margin-top: 0px;" {% if SNPChecked|upper == "ON" %}value="ON" checked{% endif %}> <span style="font-size: 12px;">SNP Track </span>
+                    <a href="http://genenetwork.org/glossary.html#snpSeismograph" target="_blank">
+                      <sup style="color:#f00"> ?</sup>
+                    </a>
+                    <span style="color:red;">*</span>
+                  <br>
+                  <input type="checkbox" name="showGenes" class="checkbox" style="display: inline; margin-top: 0px;" {% if geneChecked|upper == "ON" %}value="ON" checked{% endif %}> <span style="font-size: 12px;">Gene Track </span> <span style="color:red;">*</span><br>
+                  {% if plotScale != "morgan" %}
+                  <input type="checkbox" name="haplotypeAnalystCheck" class="checkbox" style="display: inline; margin-top: 0px;" {% if haplotypeAnalystChecked|upper == "ON" %}value="ON" checked{% endif %}> <span style="font-size: 12px;">Haplotype Tracks </span> <span style="color:red;">*</span><br>
+                  {% endif %}
+                  <input type="checkbox" name="viewLegend" class="checkbox" style="display: inline; margin-top: 0px;" {% if legendChecked|upper == "ON" %}value="ON" checked{% endif %}> <span style="font-size: 12px;">Legend </span><br>
+                  <input type="checkbox" name="showHomology" class="checkbox" style="display: inline; margin-top: 0px;" {% if homologyChecked|upper == "ON" %}value="ON" checked{% endif %}> <span style="font-size: 12px;">Human Chromosomes <a href="http://hgdownload.cse.ucsc.edu/goldenpath/hg38/liftOver/"><sup style="color:#f00" title="Human Syntenic Chromosomes taken from HG38 (Human Genome 38)"> ?</sup></a></span>
+                  <br>
+                  <span style="color:red;">*</span> <span style="font-size: 12px;">only apply to single chromosome physical mapping</span>
+            </div>
+          </div>
+        </div>
+ 
+        <div class="tabbable" style="width: 100%; overflow-x: auto; margin: 10px; float: left;">
+          <ul class="nav nav-tabs">
+            <li id="gn1_map_tab">
+              <a href="#gn1_map" data-toggle="tab" aria-expanded="true">GN1 Map</a>
+            </li>
+            {% if mapping_method == "gemma" or mapping_method == "reaper" %}
+            <li id="browser_tab">
+                <a href="#browser_holder" data-toggle="tab" aria-expanded="true">Genome Browser</a>
+            </li>
+            {% endif %}
+          </ul>
+          <div class="tab-content">
+            <div class="tab-pane active" id="gn1_map">
+              <div class="qtlcharts">
+                  {{ gifmap|safe }}
+                  <img src="/generated/{{ filename }}.png" usemap="#WebQTLImageMap">
+                  {% if additiveChecked|upper == "ON" %}
+                  <br>
+                  <span style="white-space: nowrap;">A positive additive coefficient (green line) indicates that {{ dataset.group.parlist[1] }} alleles increase trait values. In contrast, a negative additive coefficient (orange line) indicates that {{ dataset.group.parlist[0] }} alleles increase trait values.</span>
+                  {% endif %}
+              </div>
+            </div>
+            {% if mapping_method == "gemma" or mapping_method == "reaper" %}
+            <div class="tab-pane" id="browser_holder" style="height: 600px;">
+                <div id="browser" style="margin-right: 20px; width: 90%;">
+                    <div id="controls">
+                        <button id="scrollLeft"  type="button" >
+                          <i class="fas fa-arrow-left"></i>
+                        </button>
+                        <button id="scrollRight" type="button" >
+                          <i class="fas fa-arrow-right"></i>
+                        </button>
+                        <button id="zoomOut" type="button" >
+                          <i class="fas fa-search-minus"></i>
+                        </button>
+                        <button id="zoomIn"  type="button" >
+                          <i class="fas fa-search-plus"></i>
+                        </button>
+                        <button id="reset"  type="button" >Reset</button>
+                    </div>
+                    <div id="infoBox"></div>
+                </div>
+            </div>
+            {% endif %}
+          </div>
+        </div>
+        <div style="float: left;">
+            {% if nperm > 0 and permChecked == "ON" %}
+            <br><br>
+            <div id="perm_histogram" class="barchart"></div>
+            <br><br>
+            Total of {{ nperm }} permutations&nbsp;&nbsp;<a href="javascript:;" id="download_perm" target="_blank" >Download Permutation Results</a>
+            <br>
+            {% endif %}
+        </div>
+
+        </form>
+        {% if selectedChr == -1 %}
+        <div class="container" style="padding-left: 30px; margin-top: 50px; position: relative; float: left;">
+          <h2>Mapping Statistics</h2>
+        <br />
+        <button class="btn btn-default" id="select_all"><span class="glyphicon glyphicon-ok"></span> Select All</button>
+        <button class="btn btn-default" id="deselect_all"><span class="glyphicon glyphicon-remove"></span> Deselect All</button>
+        <button class="btn btn-default" id="invert"><span class="glyphicon glyphicon-resize-vertical"></span> Invert</button>
+        {% if geno_db_exists == "True" %}<button class="btn btn-success" id="add" disabled><span class="glyphicon glyphicon-plus-sign"></span> Add</button>{% endif %}
+        <button class="btn btn-default export_mapping_results" ><span class="glyphicon glyphicon-download"></span> Download</span></button>
+        <br />
+        <br />
+          <div id="trait_table_container" style="width:{% if 'additive' in trimmed_markers[0] %}600{% else %}550{% endif %}px;">
+            <table class="table-hover table-striped cell-border no-footer" id='trait_table' style="float: left;">
+              <tbody>
+               <td colspan="100%" align="center"><br><b><font size="15">Loading...</font></b><br></td>
+              </tbody>
+            </table>
+          </div>
+        </div>
+        {% elif selectedChr != -1 and plotScale =="physic" and (dataset.group.species == 'mouse' or dataset.group.species == 'rat') %}
+        <div style="width: 100%;">
+          <h2>Interval Analyst</h2>
+          <div id="table_container">
+          <table id="trait_table" class="table-hover table-striped cell-border dataTable" style="float: left; width:100%;">
+            <thead>
+              <tr>
+                {% for header in gene_table_header %}
+                <th>{{ header|safe }}</th>
+                {% endfor %}
+              </tr>
+            </thead>
+            <tbody>
+              {% for row in gene_table_body %}
+              <tr>
+                {% for n in range(row|length) %}
+                {% if n == 0 %}
+                <td align="center" style="padding: 1px 0px 1px 0px;">{{ row[n]|safe }}</td>
+                {% else %}
+                <td>{{ row[n]|safe }}</td>
+                {% endif %}
+                {% endfor %}
+              </tr>
+              {% endfor %}
+            </tbody>
+          </table>
+          </div>
+        </div>
+        {% endif %}
+    </div>
+
+    <!-- End of body -->
+
+{% endblock %}
+
+{% block js %}  
+
+    <script type="text/javascript" src="{{ url_for('js', filename='d3js/d3.min.js') }}"></script>
+    <script type="text/javascript" src="{{ url_for('js', filename='js_alt/md5.min.js') }}"></script>
+    <script type="text/javascript" src="{{ url_for('js', filename='js_alt/underscore.min.js') }}"></script>
+    <script type="text/javascript" src="{{ url_for('js', filename='underscore-string/underscore.string.min.js') }}"></script>
+    <script type="text/javascript" src="{{ url_for('js', filename='d3-tip/d3-tip.js') }}"></script>
+    <script type="text/javascript" src="{{ url_for('js', filename='plotly/plotly.min.js') }}"></script>
+    {% if manhattan_plot == True and selectedChr == -1 %}
+    <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='jscolor/jscolor.js') }}"></script>
+
+    {% endif %}
+
+    <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/scroller/js/dataTables.scroller.min.js') }}"></script>
+
+    <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/plugins/sorting/scientific.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="{{ url_for('js', filename='purescript-genome-browser/js/purescript-genetics-browser.js') }}"></script>
+
+    <script>
+        var js_data = {{ js_data | safe }};
+        var markersJson = {{ trimmed_markers|safe }};
+    </script>
+
+    <script language="javascript" type="text/javascript" src="/static/new/javascript/search_results.js"></script>
+    <script language="javascript" type="text/javascript" src="/static/new/javascript/table_functions.js"></script>
+    <script language="javascript" type="text/javascript" src="/static/new/javascript/create_datatable.js"></script>
+    {% if mapping_method == "gemma" or mapping_method == "reaper" %}
+    <script language="javascript" type="text/javascript" src="/static/new/javascript/init_genome_browser.js"></script>
+    {% endif %}
+
+    <script type="text/javascript" charset="utf-8">
+        $(document).ready( function () {
+            {% if selectedChr == -1 %}
+            tableId = "trait_table"
+
+            columnDefs = [
+              {
+                'data': null,
+                'width': "5px",
+                'orderDataType': "dom-checkbox",
+                'targets': 0,
+                'render': function(data, type, row, meta) {
+                  return '<input type="checkbox" name="selectCheck" class="checkbox trait_checkbox" value="'+ data.hmac + '">'
+                }
+              },
+              {
+                'title': "Row",
+                'type': "natural",
+                'width': "35px",
+                'searchable': false,
+                'orderable': false,
+                'targets': 1,
+                'render': function(data, type, row, meta) {
+                    return meta.row
+                }
+              },
+              {
+                'title': "Marker",
+                'type': "natural",
+                'width': "20%",
+                'targets': 2,
+                {% if geno_db_exists == "True" %}
+                'data': null,
+                'render': function(data, type, row, meta) {
+                  return '<a target="_blank" href="/show_trait?trait_id=' + data.name + '&dataset={{ dataset.group.name }}Geno">' + data.name + '</a>'
+                }
+                {% else %}
+                'data': "name"
+                {% endif %}
+              },
+              {
+                'title': "<div style='text-align: right;'>{{ LRS_LOD }}</div>",
+                'type': "natural",
+                'width': "60px",
+                'targets': 3,
+                'orderSequence': [ "desc", "asc"],
+                'data': null,
+                'render': function(data, type, row, meta) {
+                  {% if (LRS_LOD == "LOD") or (LRS_LOD == "-logP") %}
+                  if ('lod_score' in data){
+                    return String(parseFloat(data.lod_score).toFixed(2))
+                  } else {
+                    return String((parseFloat(data.lrs_value) / 4.61).toFixed(2))
+                  }
+                  {% else %}
+                  if ('lod_score' in data){
+                    return String((parseFloat(data.lod_score) * 4.61).toFixed(2))
+                  } else {
+                    return String(parseFloat(data.lrs_value).toFixed(2))
+                  }
+                  {% endif %}
+                }
+              },
+              {
+                'title': "<div style='text-align: right;'>Position ({% if plotScale == 'physic' %}Mb{% else %}cM{% endif %})</div>",
+                'type': 'natural',
+                'targets': 4,
+                'data': "display_pos"
+              },
+              {% if 'additive' in trimmed_markers[0] %}
+              {
+                'title': "<div style='text-align: right;'>Add Eff</div>",
+                'type': "natural",
+                'targets': 5,
+                'data': null,
+                'render': function(data, type, row, meta) {
+                  {% if geno_db_exists == "True" %}
+                  return '<a target"_blank" href="corr_scatter_plot?method=pearson&dataset_1={{ dataset.group.name }}Geno&dataset_2={{ dataset.name }}&trait_1=' + data.name + '&trait_2={{ this_trait.name }}&cached_trait=trait_2&dataid={{ dataid }}">' + String(parseFloat(data.additive).toFixed(3)) + '</a>'
+                  {% else %}
+                  return String(parseFloat(data.additive).toFixed(3))
+                  {% endif %}
+                }
+              },
+              {% endif %}
+              {% if ('dominance' in trimmed_markers[0]) and (dataset.group.genetic_type != "riset") %}
+              {
+                'title': "<div style='text-align: right;'>Add Eff</div>",
+                'type': "natural",
+                'targets': {% if ('additive' in trimmed_markers[0]) %}6{% else %}5{% endif %},
+                'data': null,
+                'render': function(data, type, row, meta) {
+                  return String(parseFloat(data.dominance).toFixed(2))
+                }
+              }
+              {% endif %}
+            ]
+
+            tableSettings = {
+              "createdRow": function ( row, data, index ) {
+                $('td', row).eq(0).attr("style", "text-align: center; padding: 0px 10px 2px 10px;");
+                $('td', row).eq(1).attr("align", "right");
+                $('td', row).eq(1).attr('data-export', index+1);
+                $('td', row).eq(2).attr('data-export', $('td', row).eq(2).text());
+                $('td', row).eq(3).attr("align", "right");
+                $('td', row).eq(3).attr('data-export', $('td', row).eq(3).text());
+                $('td', row).eq(4).attr("align", "right");
+                $('td', row).eq(4).attr('data-export', $('td', row).eq(4).text());
+                {% if 'additive' in trimmed_markers[0] %}
+                $('td', row).eq(5).attr("align", "right");
+                $('td', row).eq(5).attr('data-export', $('td', row).eq(5).text());
+                {% endif %}
+                {% if 'dominance' in trimmed_markers[0] %}
+                $('td', row).eq(6).attr("align", "right");
+                $('td', row).eq(6).attr('data-export', $('td', row).eq(6).text());
+                {% endif %}
+              },
+              "language": {
+                "info": "Showing from _START_ to _END_ of " + js_data.total_markers + " records",
+              },
+              "order": [[1, "asc" ]],
+              "scrollY": "1000px",
+              "scroller": true
+            }
+
+            create_table(tableId, markersJson, columnDefs, tableSettings)
+
+            {% elif selectedChr != -1 and plotScale =="physic" and (dataset.group.species == 'mouse' or dataset.group.species == 'rat') %}
+            $('#trait_table').dataTable( {
+              "drawCallback": function( settings ) {
+                  $('#trait_table tr').off().on("click", function(event) {
+                    if (event.target.type !== 'checkbox' && event.target.tagName.toLowerCase() !== 'a') {
+                      var obj =$(this).find('input');
+                      obj.prop('checked', !obj.is(':checked'));
+                    }
+                    if ($(this).hasClass("selected") && event.target.tagName.toLowerCase() !== 'a'){
+                      $(this).removeClass("selected")
+                    } else if (event.target.tagName.toLowerCase() !== 'a') {
+                      $(this).addClass("selected")
+                    }
+                  });
+                },
+                "createdRow": function ( row, data, index ) {
+                  $('td', row).eq(1).attr("align", "right");
+                  $('td', row).eq(3).attr("align", "right");
+                  $('td', row).eq(4).attr("align", "right");
+                  $('td', row).eq(5).attr("align", "right");
+                  $('td', row).eq(6).attr("align", "right");
+                  $('td', row).eq(7).attr("align", "right");
+                  $('td', row).eq(8).attr("align", "center");
+                  $('td', row).eq(9).attr("align", "right");
+                },
+                "columns": [
+                    { "orderDataType": "dom-checkbox" },
+                    { "type": "natural"},
+                    { "type": "natural" , "orderDataType": "dom-inner-text" },
+                    { "type": "natural" , "orderDataType": "dom-inner-text" },
+                    { "type": "natural" , "orderDataType": "dom-inner-text" },
+                    { "type": "natural" , "orderDataType": "dom-inner-text" },
+                    { "type": "natural" },
+                    { "type": "natural-minus-na" },
+                    { "type": "natural-minus-na" },
+                    { "type": "natural-minus-na" , "orderDataType": "dom-inner-text" },
+                    { "type": "natural" }
+                ],
+                "columnDefs": [ {
+                    "targets": 0,
+                    "sortable": false
+                }],
+                "order": [[3, "asc" ]],
+                "sDom": "RZtir",
+                "iDisplayLength": -1,
+                "autoWidth": false,
+                "deferRender": true,
+                "bSortClasses": false,
+                "scrollCollapse": false,
+                "paging": false
+            } );
+            {% endif %}
+
+            $('#vector_map_tab').click(function(){
+                $('div#gn1_map_options').hide();
+            });
+
+            $('#gn1_map_tab').click(function(){
+                $('div#gn1_map_options').show();
+            });
+
+        });
+
+        var mapping_input_list = ['temp_uuid', 'trait_id', 'dataset', 'tool_used', 'form_url', 'method', 'transform', 'trimmed_markers', 'selected_chr', 'chromosomes', 'mapping_scale', 'sample_vals',
+                            'score_type', 'suggestive', 'significant', 'num_perm', 'permCheck', 'perm_output', 'perm_strata', 'categorical_vars', 'num_bootstrap', 'bootCheck', 'bootstrap_results',
+                            'LRSCheck', 'covariates', 'maf', 'use_loco', 'manhattan_plot', 'color_scheme', 'manhattan_single_color', 'control_marker', 'do_control', 'genofile',
+                            'pair_scan', 'startMb', 'endMb', 'graphWidth', 'lrsMax', 'additiveCheck', 'showSNP', 'showHomology', 'showGenes', 'viewLegend', 'haplotypeAnalystCheck',
+                            'mapmethod_rqtl_geno', 'mapmodel_rqtl_geno', 'temp_trait', 'group', 'species', 'reaper_version', 'primary_samples', 'n_samples']
+
+        $('input[name=wanted_inputs]').val(mapping_input_list.join(","));
+
+        chrView = function(this_chr, chr_mb_list) {
+            $('input[name=selected_chr]').val(this_chr)
+            $('input[name=chr_mb_list]').val(chr_mb_list)
+
+            $('#marker_regression_form').attr('action', '/loading');
+            $('#marker_regression_form').submit();
+        };
+
+        rangeView = function(this_chr, start_mb, end_mb) {
+            $('input[name=selected_chr]').val(this_chr)
+            $('input[name=startMb]').val(start_mb)
+            $('input[name=endMb]').val(end_mb)
+            //$('input[name=mb_range]').val(start_mb + "," + end_mb)
+
+            $('#marker_regression_form').attr('action', '/loading');
+            $('#marker_regression_form').submit();
+        };
+
+        remap = function() { 
+            $('input[name=selected_chr]').val($('select[name=chromosomes]').val());
+            $('input[name=color_scheme]').val($('select#color_scheme').val());
+            $('#marker_regression_form').attr('action', '/loading');
+            return $('#marker_regression_form').submit(); 
+        };
+
+        {% if manhattan_plot == True and selectedChr == -1 %}
+        $('#color_scheme').change(function(){
+          if ($(this).val() == "single"){
+            $('#point_color_picker').show();
+          } else {
+            $('#point_color_picker').hide();
+          }
+        });
+        {% endif %}
+
+        {% if mapping_method != "gemma" and mapping_method != "plink" and nperm > 0 and permChecked == "ON" %}
+        $('#download_perm').click(function(){
+          perm_info_dict = {
+            perm_data: js_data.perm_results,
+            num_perm: "{{ nperm }}",
+            trait_name: "{{ this_trait.display_name }}",
+            trait_description: `{{ this_trait.description_display }}`,
+            cofactors: "{{ covariates }}",
+            n_samples: {{ n_samples }},
+            n_genotypes: {{ qtl_results|length }},
+            {% if genofile_string is defined %}
+            genofile: "{{ genofile_string }}",
+            {% else %}
+            genofile: "",
+            {% endif %}
+            units_linkage: "{{ LRS_LOD }}",
+            strat_cofactors: js_data.categorical_vars
+          }
+          json_perm_data = JSON.stringify(perm_info_dict);
+
+          $('input[name=perm_info]').val(json_perm_data);
+          $('#marker_regression_form').attr('action', '/export_perm_data');
+          return $('#marker_regression_form').submit();
+        });
+
+        modebar_options = {
+          modeBarButtonsToAdd:[{
+            name: 'Export as SVG',
+            icon: Plotly.Icons.disk,
+            click: function(gd) {
+              Plotly.downloadImage(gd, {format: 'svg'})
+            }
+          }],
+          modeBarButtonsToRemove:['toImage', 'sendDataToCloud', 'hoverClosest', 'hoverCompare', 'hoverClosestCartesian', 'hoverCompareCartesian', 'lasso2d', 'toggleSpikelines'],
+          displaylogo: false
+          //modeBarButtons:['toImage2', 'zoom2d', 'pan2d', 'select2d', 'zoomIn2d', 'zoomOut2d', 'autoScale2d', 'resetScale2d'],
+        }
+
+        perm_data = js_data.perm_results
+        var hist_trace = {
+            x: perm_data,
+            type: 'histogram'
+        };
+        histogram_data = [hist_trace];
+        histogram_layout = {
+          bargap: 0.05,
+          title: "<b>Histogram of Permutation Test</b>",
+          xaxis: {
+                  autorange: true,
+                  title: "<b>{{ LRS_LOD }}</b>",
+                  titlefont: {
+                    family: "arial",
+                    size: 20
+                  },
+                  ticklen: 4,
+                  tickfont: {
+                    size: 16
+                  }
+                },
+          yaxis: {
+                  autorange: true,
+                  title: "<b>Count</b>",
+                  titlefont: {
+                    family: "arial",
+                    size: 20
+                  },
+                  showline: true,
+                  ticklen: 4,
+                  tickfont: {
+                    size: 16
+                  },
+                  automargin: true
+                },
+          width: 500,
+          height: 300,
+          margin: {
+              l: 70,
+              r: 30,
+              t: 100,
+              b: 50
+          }
+        };
+
+        Plotly.newPlot('perm_histogram', histogram_data, histogram_layout, modebar_options);
+        {% endif %}
+
+        export_mapping_results = function() {
+            $('#marker_regression_form').attr('action', '/export_mapping_results');
+            return $('#marker_regression_form').submit();
+        }
+
+        $('.export_mapping_results').click(export_mapping_results);
+
+        $('#browser_tab').click(function() {
+          $('#gn1_map_options').css("display", "none")
+        })
+        $('#gn1_map_tab').click(function() {
+          $('#gn1_map_options').css("display", "block")
+        })
+
+        hash = $('input[name=inputs_hash]').val();
+        mappingLink = window.location.origin + "/run_mapping/"+ hash;
+        $('input[name=mappingLink]').width(mappingLink.length*0.95 + "ch")
+        $('input[name=mappingLink]').val(mappingLink);
+        $('.share-results').click(function() {
+            $.ajax({
+                method: "POST",
+                url: "/cache_mapping_inputs",
+                data: {
+                    inputs_hash: hash
+                },
+                success: function() {
+                  document.querySelector("input[name='mappingLink']").select();
+                  document.execCommand('copy');
+                }
+            });
+        })
+
+    </script>
+
+{% endblock %}
+