diff options
9 files changed, 298 insertions, 20 deletions
diff --git a/wqflask/wqflask/static/new/javascript/get_covariates_from_collection.js b/wqflask/wqflask/static/new/javascript/get_covariates_from_collection.js new file mode 100644 index 00000000..c267b045 --- /dev/null +++ b/wqflask/wqflask/static/new/javascript/get_covariates_from_collection.js @@ -0,0 +1,238 @@ +// Generated by CoffeeScript 1.8.0 +var add_trait_data, assemble_into_json, back_to_collections, collection_click, collection_list, color_by_trait, create_trait_data_csv, get_this_trait_vals, get_trait_data, process_traits, selected_traits, submit_click, this_trait_data, trait_click, + __indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; }; + +console.log("before get_traits_from_collection"); + +collection_list = null; + +this_trait_data = null; + +selected_traits = {}; + +collection_click = function() { + var this_collection_url; + console.log("Clicking on:", $(this)); + this_collection_url = $(this).find('.collection_name').prop("href"); + this_collection_url += "&json"; + console.log("this_collection_url", this_collection_url); + collection_list = $("#collections_holder").html(); + return $.ajax({ + dataType: "json", + url: this_collection_url, + success: process_traits + }); +}; + +submit_click = function() { + var all_vals, sample, samples, scatter_matrix, this_trait_vals, trait, trait_names, trait_vals_csv, traits, _i, _j, _len, _len1, _ref; + selected_traits = {}; + traits = []; + $('#collections_holder').find('input[type=checkbox]:checked').each(function() { + var this_dataset, this_trait, this_trait_url; + this_trait = $(this).parents('tr').find('.trait').text(); + console.log("this_trait is:", this_trait); + this_dataset = $(this).parents('tr').find('.dataset').text(); + console.log("this_dataset is:", this_dataset); + this_trait_url = "/trait/get_sample_data?trait=" + this_trait + "&dataset=" + this_dataset; + return $.ajax({ + dataType: "json", + url: this_trait_url, + async: false, + success: add_trait_data + }); + }); + console.log("SELECTED_TRAITS IS:", selected_traits); + trait_names = []; + samples = $('input[name=allsamples]').val().split(" "); + all_vals = []; + this_trait_vals = get_this_trait_vals(samples); + all_vals.push(this_trait_vals); + _ref = Object.keys(selected_traits); + for (_i = 0, _len = _ref.length; _i < _len; _i++) { + trait = _ref[_i]; + trait_names.push(trait); + this_trait_vals = []; + for (_j = 0, _len1 = samples.length; _j < _len1; _j++) { + sample = samples[_j]; + if (__indexOf.call(Object.keys(selected_traits[trait]), sample) >= 0) { + this_trait_vals.push(parseFloat(selected_traits[trait][sample])); + } else { + this_trait_vals.push(null); + } + } + all_vals.push(this_trait_vals); + } + trait_vals_csv = create_trait_data_csv(selected_traits); + scatter_matrix = new ScatterMatrix(trait_vals_csv); + scatter_matrix.render(); + return $.colorbox.close(); +}; + +create_trait_data_csv = function(selected_traits) { + var all_vals, index, sample, sample_vals, samples, this_trait_vals, trait, trait_names, trait_vals_csv, _i, _j, _k, _l, _len, _len1, _len2, _len3, _ref; + trait_names = []; + trait_names.push($('input[name=trait_id]').val()); + samples = $('input[name=allsamples]').val().split(" "); + all_vals = []; + this_trait_vals = get_this_trait_vals(samples); + all_vals.push(this_trait_vals); + _ref = Object.keys(selected_traits); + for (_i = 0, _len = _ref.length; _i < _len; _i++) { + trait = _ref[_i]; + trait_names.push(trait); + this_trait_vals = []; + for (_j = 0, _len1 = samples.length; _j < _len1; _j++) { + sample = samples[_j]; + if (__indexOf.call(Object.keys(selected_traits[trait]), sample) >= 0) { + this_trait_vals.push(parseFloat(selected_traits[trait][sample])); + } else { + this_trait_vals.push(null); + } + } + all_vals.push(this_trait_vals); + } + console.log("all_vals:", all_vals); + trait_vals_csv = trait_names.join(","); + trait_vals_csv += "\n"; + for (index = _k = 0, _len2 = samples.length; _k < _len2; index = ++_k) { + sample = samples[index]; + if (all_vals[0][index] === null) { + continue; + } + sample_vals = []; + for (_l = 0, _len3 = all_vals.length; _l < _len3; _l++) { + trait = all_vals[_l]; + sample_vals.push(trait[index]); + } + trait_vals_csv += sample_vals.join(","); + trait_vals_csv += "\n"; + } + return trait_vals_csv; +}; + +trait_click = function() { + var dataset, this_trait_url, trait; + console.log("Clicking on:", $(this)); + trait = $(this).parent().find('.trait').text(); + dataset = $(this).parent().find('.dataset').text(); + console.log("BEFORE COVAR:", trait + ":" + dataset) + $('input[name=covariates]').val(trait + ":" + dataset) + console.log("AFTER COVAR:", $('input[name=covariates]').val()) + return $.colorbox.close(); + // this_trait_url = "/trait/get_sample_data?trait=" + trait + "&dataset=" + dataset; + // console.log("this_trait_url", this_trait_url); + // $.ajax({ + // dataType: "json", + // url: this_trait_url, + // success: get_trait_data + // }); + // return $.colorbox.close(); +}; + +add_trait_data = function(trait_data, textStatus, jqXHR) { + var trait_name, trait_sample_data; + trait_name = trait_data[0]; + trait_sample_data = trait_data[1]; + selected_traits[trait_name] = trait_sample_data; + return console.log("selected_traits:", selected_traits); +}; + +get_trait_data = function(trait_data, textStatus, jqXHR) { + var sample, samples, this_trait_vals, trait_sample_data, vals, _i, _len; + console.log("trait:", trait_data[0]); + trait_sample_data = trait_data[1]; + console.log("trait_sample_data:", trait_sample_data); + samples = $('input[name=allsamples]').val().split(" "); + vals = []; + for (_i = 0, _len = samples.length; _i < _len; _i++) { + sample = samples[_i]; + if (__indexOf.call(Object.keys(trait_sample_data), sample) >= 0) { + vals.push(parseFloat(trait_sample_data[sample])); + } else { + vals.push(null); + } + } + if ($('input[name=samples]').length < 1) { + $('#hidden_inputs').append('<input type="hidden" name="samples" value="[' + samples.toString() + ']" />'); + } + $('#hidden_inputs').append('<input type="hidden" name="vals" value="[' + vals.toString() + ']" />'); + this_trait_vals = get_this_trait_vals(samples); + console.log("THE LENGTH IS:", $('input[name=vals]').length); + return color_by_trait(trait_sample_data); +}; + +get_this_trait_vals = function(samples) { + var sample, this_trait_vals, this_val, this_vals_json, _i, _len; + this_trait_vals = []; + for (_i = 0, _len = samples.length; _i < _len; _i++) { + sample = samples[_i]; + this_val = parseFloat($("input[name='value:" + sample + "']").val()); + if (!isNaN(this_val)) { + this_trait_vals.push(this_val); + } else { + this_trait_vals.push(null); + } + } + console.log("this_trait_vals:", this_trait_vals); + this_vals_json = '[' + this_trait_vals.toString() + ']'; + return this_trait_vals; +}; + +assemble_into_json = function(this_trait_vals) { + var json_data, json_ids, num_traits, samples; + num_traits = $('input[name=vals]').length; + samples = $('input[name=samples]').val(); + json_ids = samples; + json_data = '[' + this_trait_vals; + $('input[name=vals]').each((function(_this) { + return function(index, element) { + return json_data += ',' + $(element).val(); + }; + })(this)); + json_data += ']'; + return [json_ids, json_data]; +}; + +color_by_trait = function(trait_sample_data, textStatus, jqXHR) { + console.log('in color_by_trait:', trait_sample_data); + return root.bar_chart.color_by_trait(trait_sample_data); +}; + +process_traits = function(trait_data, textStatus, jqXHR) { + var the_html, trait, _i, _len; + console.log('in process_traits with trait_data:', trait_data); + the_html = "<button id='back_to_collections' class='btn btn-inverse btn-small'>"; + the_html += "<i class='icon-white icon-arrow-left'></i> Back </button>"; + the_html += " <button id='submit' class='btn btn-primary btn-small'> Submit </button>"; + the_html += "<table class='table table-hover'>"; + the_html += "<thead><tr><th></th><th>Record</th><th>Data Set</th><th>Description</th><th>Mean</th></tr></thead>"; + the_html += "<tbody>"; + for (_i = 0, _len = trait_data.length; _i < _len; _i++) { + trait = trait_data[_i]; + the_html += "<tr class='trait_line'>"; + the_html += "<td class='select_trait'><input type='checkbox' name='selectCheck' class='checkbox edit_sample_checkbox'></td>"; + the_html += "<td class='trait'>" + trait.name + "</td>"; + the_html += "<td class='dataset'>" + trait.dataset + "</td>"; + the_html += "<td>" + trait.description + "</td>"; + the_html += "<td>" + (trait.mean || ' ') + "</td></tr>"; + } + the_html += "</tbody>"; + the_html += "</table>"; + the_html += "<script type='text/javascript' src='/static/new/javascript/get_covariates_from_collection.js'></script>" + $("#collections_holder").html(the_html); + return $('#collections_holder').colorbox.resize(); +}; + +back_to_collections = function() { + console.log("collection_list:", collection_list); + $("#collections_holder").html(collection_list); + $(document).on("click", ".collection_line", collection_click); + return $('#collections_holder').colorbox.resize(); +}; + +console.log("inside get_traits_from_collection"); +$(".collection_line").on("click", collection_click); +$("#submit").on("click", submit_click); +$(".trait").on("click", trait_click); +$("#back_to_collections").on("click", back_to_collections);
\ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/get_traits_from_collection.js b/wqflask/wqflask/static/new/javascript/get_traits_from_collection.js index bcd83889..4abb0735 100644 --- a/wqflask/wqflask/static/new/javascript/get_traits_from_collection.js +++ b/wqflask/wqflask/static/new/javascript/get_traits_from_collection.js @@ -215,6 +215,7 @@ process_traits = function(trait_data, textStatus, jqXHR) { } the_html += "</tbody>"; the_html += "</table>"; + the_html += "<script type='text/javascript' src='/static/new/javascript/get_traits_from_collection.js'></script>" $("#collections_holder").html(the_html); return $('#collections_holder').colorbox.resize(); }; diff --git a/wqflask/wqflask/static/new/javascript/scatter-matrix.js b/wqflask/wqflask/static/new/javascript/scatter-matrix.js index 278a93bc..31cb384b 100644 --- a/wqflask/wqflask/static/new/javascript/scatter-matrix.js +++ b/wqflask/wqflask/static/new/javascript/scatter-matrix.js @@ -60,7 +60,7 @@ ScatterMatrix.prototype.render = function () { .style({'float':'left', 'margin-right':'50px'}) var svg = container.append('div') .attr('class', 'scatter-matrix-svg') - .style({'float':'right'}) + .style({'float':'left'}) .html('<em>Loading data...</em>'); this.onData(function() { diff --git a/wqflask/wqflask/static/new/javascript/show_trait.js b/wqflask/wqflask/static/new/javascript/show_trait.js index bb1af326..f232c6eb 100644 --- a/wqflask/wqflask/static/new/javascript/show_trait.js +++ b/wqflask/wqflask/static/new/javascript/show_trait.js @@ -74,6 +74,11 @@ return open_trait_selection(); }; })(this)); + d3.select("#select_covariate").on("click", (function(_this) { + return function() { + return open_covariate_selection(); + }; + })(this)); d3.select("#clear_compare_trait").on("click", (function(_this) { return function() { return $('.scatter-matrix-container').remove(); @@ -84,7 +89,28 @@ return function() { $.colorbox({ inline: true, - href: "#collections_holder" + href: "#collections_holder", + onComplete: function(){ + console.log("before get script") + $.getScript("/static/new/javascript/get_traits_from_collection.js"); + console.log("after get script") + } + }); + return $('a.collection_name').attr('onClick', 'return false'); + }; + })(this)); + }; + open_covariate_selection = function() { + return $('#collections_holder').load('/collections/list?select_covariates #collections_list', (function(_this) { + return function() { + $.colorbox({ + inline: true, + href: "#collections_holder", + onComplete: function(){ + console.log("before get script") + $.getScript("/static/new/javascript/get_covariates_from_collection.js"); + console.log("after get script") + } }); return $('a.collection_name').attr('onClick', 'return false'); }; diff --git a/wqflask/wqflask/templates/collections/list.html b/wqflask/wqflask/templates/collections/list.html index b1284895..cc60ecff 100644 --- a/wqflask/wqflask/templates/collections/list.html +++ b/wqflask/wqflask/templates/collections/list.html @@ -65,7 +65,11 @@ {% endfor %} </tbody> </table> - + {% if "color_by_trait" in params %} + <script language="javascript" type="text/javascript" src="/static/new/javascript/get_traits_from_collection.js"></script> + {% else %} + <script language="javascript" type="text/javascript" src="/static/new/javascript/get_covariates_from_collection.js"></script> + {% endif %} </div> </div> @@ -84,9 +88,6 @@ <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/dataTables.naturalSort.js"></script> <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/extensions/dataTables.colResize.js"></script> <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/extensions/dataTables.colReorder.js"></script> - {% if "color_by_trait" in params %} - <script type="text/javascript" src="/static/new/javascript/get_traits_from_collection.js"></script> - {% endif %} <script> $('#trait_table').dataTable( { "drawCallback": function( settings ) { diff --git a/wqflask/wqflask/templates/gsearch_gene.html b/wqflask/wqflask/templates/gsearch_gene.html index c1f039c7..c2f687fd 100644 --- a/wqflask/wqflask/templates/gsearch_gene.html +++ b/wqflask/wqflask/templates/gsearch_gene.html @@ -28,7 +28,7 @@ </form> <br /> <div style="width: 2000px;"> - <table width="2000px" id="trait_table" class="table table-hover table-striped nowrap" style="float: left;"> + <table width="2000px" id="trait_table" class="display dataTable nowrap" style="float: left;"> <thead> <tr> <th></th> @@ -155,9 +155,14 @@ "order": [[1, "asc" ]], "sDom": "tir", "autoWidth": false, - "bDeferRender": true, - "scrollY": "800px", - "scrollCollapse": false + "deferRender": true, + "bSortClasses": false, + "scrollY": "600px", + "scrollCollapse": true, + "scroller": true, + "scrollX": true, + "paging": false, + "orderClasses": true } ); console.timeEnd("Creating table"); diff --git a/wqflask/wqflask/templates/gsearch_pheno.html b/wqflask/wqflask/templates/gsearch_pheno.html index 46a80a09..7a8ca07b 100644 --- a/wqflask/wqflask/templates/gsearch_pheno.html +++ b/wqflask/wqflask/templates/gsearch_pheno.html @@ -28,7 +28,7 @@ </form> <br /> <div> - <table id="trait_table" class="table table-hover table-striped nowrap" style="float: left;"> + <table id="trait_table" class="display dataTable nowrap" style="float: left;"> <thead> <tr> <th></th> @@ -148,9 +148,14 @@ "order": [[1, "asc" ]], "sDom": "tir", "autoWidth": false, - "bDeferRender": true, - "scrollY": "800px", - "scrollCollapse": false + "deferRender": true, + "bSortClasses": false, + "scrollY": "600px", + "scrollCollapse": true, + "scroller": true, + "scrollX": true, + "paging": false, + "orderClasses": true } ); console.timeEnd("Creating table"); }); diff --git a/wqflask/wqflask/templates/show_trait.html b/wqflask/wqflask/templates/show_trait.html index 5a880647..7c4dbc60 100644 --- a/wqflask/wqflask/templates/show_trait.html +++ b/wqflask/wqflask/templates/show_trait.html @@ -42,6 +42,7 @@ <input type="hidden" name="temp_uuid" id="temp_uuid" value="{{ temp_uuid }}"> <input type="hidden" name="genofile" value=""> + <input type="hidden" name="covariates" value=""> <div class="container"> <div class="panel-group" id="accordion"> @@ -140,11 +141,10 @@ <script type="text/javascript" src="/static/new/javascript/scatterplot.js"></script> <script type="text/javascript" src="/static/new/javascript/scatter-matrix.js"></script> <script type="text/javascript" src="/static/new/javascript/draw_probability_plot.js"></script> - <script type="text/javascript" src="/static/new/javascript/compare_traits_scatterplot.js"></script> - + <script type="text/javascript" src="/static/new/javascript/compare_traits_scatterplot.js"></script> + <script type="text/javascript" src="/static/new/javascript/show_trait_mapping_tools.js"></script> <script type="text/javascript" src="/static/new/javascript/show_trait.js"></script> - <script type="text/javascript" src="/static/new/javascript/get_traits_from_collection.js"></script> <script type="text/javascript" src="/static/new/javascript/validation.js"></script> <script language="javascript" type="text/javascript" src="/static/new/packages/jsPDF/libs/FileSaver.js/FileSaver.js"></script> <script language="javascript" type="text/javascript" src="/static/new/packages/jsPDF/libs/Blob.js/BlobBuilder.js"></script> diff --git a/wqflask/wqflask/templates/show_trait_statistics.html b/wqflask/wqflask/templates/show_trait_statistics.html index 1fc470ff..d4a8c1f7 100644 --- a/wqflask/wqflask/templates/show_trait_statistics.html +++ b/wqflask/wqflask/templates/show_trait_statistics.html @@ -13,12 +13,12 @@ <li> <a href="#probability_plot" data-toggle="tab">Probability Plot</a> </li> - <!-- {% if g.user_session.user_ob %} <li> <a href="#scatterplot_matrix" data-toggle="tab">Scatterplot Matrix</a> </li> {% endif %} + <!-- <li> <a href="#box_plot_tab" data-toggle="tab">Box Plot</a> </li>--> @@ -119,7 +119,8 @@ </div> </div> -<!-- <div class="tab-pane" id="box_plot_tab"> +<!-- + <div class="tab-pane" id="box_plot_tab"> {% if sample_groups|length > 1 %} <select class="box_plot_samples_group"> {% for group, pretty_group in sample_group_types.items() %} @@ -132,6 +133,7 @@ <div id="box_plot"></div> </div> </div> +--> {% if g.user_session.user_ob %} <div class="tab-pane" id="scatterplot_matrix"> @@ -147,7 +149,7 @@ <div id="comparison_scatterplot" class="qtlcharts"></div> </div> </div> - {% endif %}--> + {% endif %} </div> </div> <!--</div>--> |