diff options
| -rw-r--r-- | wqflask/wqflask/templates/mapping_results.html | 47 |
1 files changed, 42 insertions, 5 deletions
diff --git a/wqflask/wqflask/templates/mapping_results.html b/wqflask/wqflask/templates/mapping_results.html index 28d93542..9542c29d 100644 --- a/wqflask/wqflask/templates/mapping_results.html +++ b/wqflask/wqflask/templates/mapping_results.html @@ -40,6 +40,9 @@ <input type="hidden" name="use_loco" value="{{ use_loco }}"> <input type="hidden" name="selected_chr" value="{{ selectedChr }}"> <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=""> <input type="hidden" name="perm_strata" value="{{ perm_strata }}"> @@ -55,7 +58,7 @@ <input type="hidden" name="wanted_inputs" value=""> <input type="hidden" name="form_url" value="/run_mapping"> - <div class="container"> + <div class="container" style="min-width: 1400px;"> <div class="col-xs-5"> <h2>Map Viewer: Whole Genome</h2><br> <b>Population:</b> {{ dataset.group.species|capitalize }} {{ dataset.group.name }}<br> @@ -77,7 +80,7 @@ <table> <tr> <td><b>Chr: </b></td> - <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> @@ -87,7 +90,7 @@ </td> </tr> <tr> - <td><b>View: </b></td> + <td ><b>View: </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> @@ -114,11 +117,31 @@ </tr> <tr> <td><b>Width: </b></td> - <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: </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 %} @@ -328,6 +351,9 @@ <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="/static/new/js_external/plotly-latest.min.js"></script> + {% if manhattan_plot == True and selectedChr == -1 %} + <script type="text/javascript" src="/static/new/js_external/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="https://cdn.datatables.net/buttons/1.0.0/js/dataTables.buttons.min.js"></script> @@ -423,7 +449,7 @@ var mapping_input_list = ['temp_uuid', 'trait_id', 'dataset', 'tool_used', 'form_url', 'method', 'transform', 'trimmed_markers', 'selected_chr', 'chromosomes', 'mapping_scale', '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', 'control_marker', 'control_marker_db', 'do_control', 'genofile', + 'LRSCheck', 'covariates', 'maf', 'use_loco', 'manhattan_plot', 'color_scheme', 'manhattan_single_color', 'control_marker', 'control_marker_db', 'do_control', 'genofile', 'pair_scan', 'startMb', 'endMb', 'graphWidth', 'lrsMax', 'additiveCheck', 'showSNP', 'showGenes', 'viewLegend', 'haplotypeAnalystCheck', 'mapmethod_rqtl_geno', 'mapmodel_rqtl_geno', 'temp_trait', 'group', 'species', 'reaper_version', 'primary_samples', 'n_samples'] @@ -449,10 +475,21 @@ 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" %} $('#download_perm').click(function(){ perm_info_dict = { |