From ebfbd730ef30389f1484e2a134cbff7e10712e88 Mon Sep 17 00:00:00 2001 From: Pjotr Prins Date: Wed, 13 Feb 2019 12:34:00 +0000 Subject: Remove all coffee files --- .../wqflask/static/new/javascript/bar_chart.coffee | 275 ----------- .../wqflask/static/new/javascript/box_plot.coffee | 57 --- .../static/new/javascript/chr_lod_chart.coffee | 286 ------------ .../new/javascript/chr_manhattan_plot.coffee | 295 ------------ .../javascript/compare_traits_scatterplot.coffee | 145 ------ .../static/new/javascript/corr_matrix.coffee | 275 ----------- .../static/new/javascript/corr_scatter_plot.coffee | 67 --- .../new/javascript/create_corr_matrix.coffee | 42 -- .../static/new/javascript/create_heatmap.coffee | 18 - .../static/new/javascript/create_lodchart.coffee | 50 -- .../new/javascript/create_manhattan_plot.coffee | 82 ---- .../static/new/javascript/curvechart.coffee | 335 ------------- .../new/javascript/draw_corr_scatterplot.coffee | 37 -- .../new/javascript/draw_probability_plot.coffee | 94 ---- .../javascript/get_traits_from_collection.coffee | 228 --------- .../wqflask/static/new/javascript/histogram.coffee | 141 ------ .../new/javascript/iplotMScanone_noeff.coffee | 193 -------- .../wqflask/static/new/javascript/lod_chart.coffee | 517 --------------------- .../static/new/javascript/lodheatmap.coffee | 265 ----------- wqflask/wqflask/static/new/javascript/login.coffee | 42 -- .../wqflask/static/new/javascript/panelutil.coffee | 356 -------------- .../static/new/javascript/password_strength.coffee | 33 -- .../static/new/javascript/scatterplot.coffee | 430 ----------------- .../static/new/javascript/search_results.coffee | 86 ---- .../static/new/javascript/show_trait.coffee | 476 ------------------- .../new/javascript/show_trait_mapping_tools.coffee | 241 ---------- wqflask/wqflask/static/new/javascript/stats.coffee | 71 --- .../wqflask/static/new/javascript/thank_you.coffee | 4 - .../static/new/javascript/validation.coffee | 42 -- .../wqflask/static/new/javascript/validation.js | 17 +- 30 files changed, 1 insertion(+), 5199 deletions(-) delete mode 100644 wqflask/wqflask/static/new/javascript/bar_chart.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/box_plot.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/chr_lod_chart.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/chr_manhattan_plot.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/compare_traits_scatterplot.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/corr_matrix.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/corr_scatter_plot.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/create_corr_matrix.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/create_heatmap.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/create_lodchart.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/create_manhattan_plot.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/curvechart.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/draw_corr_scatterplot.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/draw_probability_plot.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/get_traits_from_collection.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/histogram.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/iplotMScanone_noeff.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/lod_chart.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/lodheatmap.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/login.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/panelutil.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/password_strength.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/scatterplot.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/search_results.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/show_trait.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/stats.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/thank_you.coffee delete mode 100644 wqflask/wqflask/static/new/javascript/validation.coffee diff --git a/wqflask/wqflask/static/new/javascript/bar_chart.coffee b/wqflask/wqflask/static/new/javascript/bar_chart.coffee deleted file mode 100644 index 7558de80..00000000 --- a/wqflask/wqflask/static/new/javascript/bar_chart.coffee +++ /dev/null @@ -1,275 +0,0 @@ -root = exports ? this - -class Bar_Chart - constructor: (sample_lists) -> - @sample_lists = {} - l1 = @sample_lists['samples_primary'] = sample_lists[0] or [] - l2 = @sample_lists['samples_other'] = sample_lists[1] or [] - - l1_names = (x.name for x in l1) - l3 = l1.concat((x for x in l2 when x.name not in l1_names)) - @sample_lists['samples_all'] = l3 - longest_sample_name_len = d3.max(sample.name.length for sample in l3) - @margin = { - top: 20, - right: 20, - bottom: longest_sample_name_len * 6, - left: 40 - } - - @attributes = (key for key of sample_lists[0][0]["extra_attributes"]) - @sample_attr_vals = (@extra(s) for s in @sample_lists['samples_all']\ - when s.value != null) - @get_distinct_attr_vals() - @get_attr_color_dict(@distinct_attr_vals) - @attribute_name = "None" - - @sort_by = "name" - @chart = null - - @select_attribute_box = $ "#color_attribute" - - d3.select("#color_attribute").on("change", => - @attribute_name = @select_attribute_box.val() - @rebuild_bar_graph() - ) - - $(".sort_by_value").on("click", => - console.log("sorting by value") - @sort_by = "value" - @rebuild_bar_graph() - ) - - $(".sort_by_name").on("click", => - console.log("sorting by name") - @sort_by = "name" - @rebuild_bar_graph() - ) - - d3.select("#color_by_trait").on("click", => - @open_trait_selection() - ) - - value: (sample) -> - @value_dict[sample.name].value - - variance: (sample) -> - @value_dict[sample.name].variance - - extra: (sample) -> - attr_vals = {} - for attribute in @attributes - attr_vals[attribute] = sample["extra_attributes"][attribute] - attr_vals - - # takes a dict: name -> value and rebuilds the graph - redraw: (samples_dict, selected_group) -> - @value_dict = samples_dict[selected_group] - @raw_data = (x for x in @sample_lists[selected_group] when\ - x.name of @value_dict and @value(x) != null) - @rebuild_bar_graph() - - rebuild_bar_graph: -> - raw_data = @raw_data.slice() - if @sort_by == 'value' - raw_data = raw_data.sort((x, y) => @value(x) - @value(y)) - console.log("raw_data: ", raw_data) - - h = 600 - container = $("#bar_chart_container") - container.height(h + @margin.top + @margin.bottom) - if @chart is null - @chart = nv.models.multiBarChart() - .height(h) - .errorBarColor(=> 'red') - .reduceXTicks(false) - .staggerLabels(false) - .showControls(false) - .showLegend(false) - - # show value, sd, and attributes in tooltip - @chart.multibar.dispatch.on('elementMouseover.tooltip', - (evt) => - evt.value = @chart.x()(evt.data); - evt['series'] = [{ - key: 'Value', - value: evt.data.y, - color: evt.color - }]; - if evt.data.yErr - evt['series'].push({key: 'SE', value: evt.data.yErr}) - if evt.data.attr - for k, v of evt.data.attr - evt['series'].push({key: k, value: v}) - @chart.tooltip.data(evt).hidden(false); - ) - - @chart.tooltip.valueFormatter((d, i) -> d) - - nv.addGraph(() => - @remove_legend() - values = ({x: s.name, y: @value(s), yErr: @variance(s) or 0,\ - attr: s.extra_attributes}\ - for s in raw_data) - - if @attribute_name != "None" - @color_dict = @attr_color_dict[@attribute_name] - @chart.barColor((d) => @color_dict[d.attr[@attribute_name]]) - @add_legend() - else - @chart.barColor(=> 'steelblue') - - @chart.width(raw_data.length * 20) - @chart.yDomain([0.9 * _.min((d.y - 1.5 * d.yErr for d in values)), - 1.05 * _.max((d.y + 1.5 * d.yErr for d in values))]) - console.log("values: ", values) - d3.select("#bar_chart_container svg") - .datum([{values: values}]) - .style('width', raw_data.length * 20 + 'px') - .transition().duration(1000) - .call(@chart) - - d3.select("#bar_chart_container .nv-x") - .selectAll('.tick text') - .style("font-size", "12px") - .style("text-anchor", "end") - .attr("dx", "-.8em") - .attr("dy", "-.3em") - .attr("transform", (d) => - return "rotate(-90)" - ) - - return @chart - ) - - get_attr_color_dict: (vals) -> - @attr_color_dict = {} - @is_discrete = {} - @minimum_values = {} - @maximum_values = {} - console.log("vals:", vals) - for own key, distinct_vals of vals - @min_val = d3.min(distinct_vals) - @max_val = d3.max(distinct_vals) - this_color_dict = {} - discrete = distinct_vals.length < 10 - if discrete - color = d3.scale.category10() - for value, i in distinct_vals - this_color_dict[value] = color(i) - else - console.log("distinct_values:", distinct_vals) - #Check whether all values are numbers, and if they are get a corresponding - #color gradient - if _.every(distinct_vals, (d) => - if isNaN(d) - return false - else - return true - ) - color_range = d3.scale.linear() - .domain([@min_val, @max_val]) - .range([0,255]) - for value, i in distinct_vals - console.log("color_range(value):", parseInt(color_range(value))) - this_color_dict[value] = d3.rgb(parseInt(color_range(value)),0, 0) - #this_color_dict[value] = d3.rgb("lightblue").darker(color_range(parseInt(value))) - #this_color_dict[value] = "rgb(0, 0, " + color_range(parseInt(value)) + ")" - @attr_color_dict[key] = this_color_dict - @is_discrete[key] = discrete - @minimum_values[key] = @min_val - @maximum_values[key] = @max_val - - get_distinct_attr_vals: () -> - # FIXME: this has quadratic behaviour, may cause issues with many samples and continuous attributes - @distinct_attr_vals = {} - for sample in @sample_attr_vals - for attribute of sample - if not @distinct_attr_vals[attribute] - @distinct_attr_vals[attribute] = [] - if sample[attribute] not in @distinct_attr_vals[attribute] - @distinct_attr_vals[attribute].push(sample[attribute]) - #console.log("distinct_attr_vals:", @distinct_attr_vals) - - add_legend: => - if @is_discrete[@attribute_name] - @add_legend_discrete() - else - @add_legend_continuous() - - remove_legend: => - $(".legend").remove() - $("#legend-left,#legend-right,#legend-colors").empty() - - add_legend_continuous: => - $('#legend-left').html(@minimum_values[@attribute_name]) - $('#legend-right').html(@maximum_values[@attribute_name]) - svg_html = ' \ - \ - \ - \ - \ - \ - \ - ' - console.log("svg_html:", svg_html) - $('#legend-colors').html(svg_html) - - add_legend_discrete: => - legend_span = d3.select('#bar_chart_legend') - .append('div').style('word-wrap', 'break-word') - .attr('class', 'legend').selectAll('span') - .data(@distinct_attr_vals[@attribute_name]) - .enter().append('span').style({'word-wrap': 'normal', 'display': 'inline-block'}) - - legend_span.append('span') - .style("background-color", (d) => - return @attr_color_dict[@attribute_name][d] - ) - .style({'display': 'inline-block', 'width': '15px', 'height': '15px',\ - 'margin': '0px 5px 0px 15px'}) - legend_span.append('span').text((d) => return d).style('font-size', '20px') - - open_trait_selection: () -> - $('#collections_holder').load('/collections/list?color_by_trait #collections_list', => - $.colorbox( - inline: true - href: "#collections_holder" - ) - #Removes the links from the collection names, because clicking them would leave the page - #instead of loading the list of traits in the colorbox - $('a.collection_name').attr( 'onClick', 'return false' ) - #$('.collection_name').each (index, element) => - # console.log("contents:", $(element).contents()) - # $(element).contents().unwrap() - ) - - color_by_trait: (trait_sample_data) -> - console.log("BXD1:", trait_sample_data["BXD1"]) - console.log("trait_sample_data:", trait_sample_data) - trimmed_samples = @trim_values(trait_sample_data) - distinct_values = {} - distinct_values["collection_trait"] = @get_distinct_values(trimmed_samples) - #@get_attr_color_dict(distinct_values) - @get_trait_color_dict(trimmed_samples, distinct_values) - console.log("TRAIT_COLOR_DICT:", @trait_color_dict) - console.log("SAMPLES:", @samples) - # TODO - - trim_values: (trait_sample_data) -> - trimmed_samples = {} - for sample in @sample_names - if sample of trait_sample_data - trimmed_samples[sample] = trait_sample_data[sample] - console.log("trimmed_samples:", trimmed_samples) - return trimmed_samples - - get_distinct_values: (samples) -> - distinct_values = _.uniq(_.values(samples)) - console.log("distinct_values:", distinct_values) - return distinct_values - #distinct_values = [] - #for sample in samples - # if samples[sample] in distinct_values - -root.Bar_Chart = Bar_Chart diff --git a/wqflask/wqflask/static/new/javascript/box_plot.coffee b/wqflask/wqflask/static/new/javascript/box_plot.coffee deleted file mode 100644 index edd5e968..00000000 --- a/wqflask/wqflask/static/new/javascript/box_plot.coffee +++ /dev/null @@ -1,57 +0,0 @@ -root = exports ? this - -class Box_Plot - constructor: (@sample_list, @sample_group) -> - @get_samples() - - @margin = {top: 10, right: 50, bottom: 20, left: 50} - @plot_width = 200 - @margin.left - @margin.right - @plot_height = 500 - @margin.top - @margin.bottom - - @min = d3.min(@sample_vals) - @max = d3.max(@sample_vals) - - @svg = @create_svg() - @enter_data() - - - get_samples: () -> - @sample_vals = (sample.value for sample in @sample_list when sample.value != null) - - create_svg: () -> - svg = d3.box() - .whiskers(@inter_quartile_range(1.5)) - .width(@plot_width - 30) - .height(@plot_height - 30) - .domain([@min, @max]) - return svg - - enter_data: () -> - d3.select("#box_plot").selectAll("svg") - .data([@sample_vals]) - .enter().append("svg:svg") - .attr("class", "box") - .attr("width", @plot_width) - .attr("height", @plot_height) - .append("svg:g") - .call(@svg) - - inter_quartile_range: (k) -> - return (d, i) => - console.log("iqr d:", d) - q1 = d.quartiles[0] - q3 = d.quartiles[2] - inter_quartile_range = (q3 - q1) * k - console.log("iqr:", inter_quartile_range) - i = 0 - j = d.length - console.log("d[-1]:", d[1]) - console.log("q1 - iqr:", q1 - inter_quartile_range) - i++ while (d[i] < q1 - inter_quartile_range) - j-- while (d[j] > q3 + inter_quartile_range) - #while (d[++i] < q1 - inter_quartile_range - #while d[--j] > q3 + inter_quartile_range - console.log("[i, j]", [i, j]) - return [i, j] - -root.Box_Plot = Box_Plot \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/chr_lod_chart.coffee b/wqflask/wqflask/static/new/javascript/chr_lod_chart.coffee deleted file mode 100644 index e00694be..00000000 --- a/wqflask/wqflask/static/new/javascript/chr_lod_chart.coffee +++ /dev/null @@ -1,286 +0,0 @@ -class Chr_Lod_Chart - - constructor: (@plot_height, @plot_width, @chr, manhattanPlot) -> - @manhattanPlot = manhattanPlot - @qtl_results = js_data.qtl_results - console.log("qtl_results are:", @qtl_results) - console.log("chr is:", @chr) - - @get_max_chr() - - @filter_qtl_results() - console.log("filtered results:", @these_results) - @get_qtl_count() - - @x_coords = [] - @y_coords = [] - @marker_names = [] - - console.time('Create coordinates') - @create_coordinates() - console.log("@x_coords: ", @x_coords) - console.log("@y_coords: ", @y_coords) - console.timeEnd('Create coordinates') - - # Buffer to allow for the ticks/labels to be drawn - @x_buffer = @plot_width/30 - @y_buffer = @plot_height/20 - - @x_max = d3.max(@x_coords) - @y_max = d3.max(@y_coords) * 1.2 - - @y_threshold = @get_lod_threshold() - - @svg = @create_svg() - - @plot_coordinates = _.zip(@x_coords, @y_coords, @marker_names) - console.log("coordinates:", @plot_coordinates) - - @plot_height -= @y_buffer - - @create_scales() - - console.time('Create graph') - @create_graph() - console.timeEnd('Create graph') - - get_max_chr: () -> - @max_chr = 0 - for key of js_data.chromosomes - console.log("key is:", key) - if parseInt(key) > @max_chr - @max_chr = parseInt(key) - - filter_qtl_results: () -> - @these_results = [] - this_chr = 100 - for result in @qtl_results - if result.chr == "X" - this_chr = @max_chr - else - this_chr = result.chr - console.log("this_chr is:", this_chr) - console.log("@chr[0] is:", parseInt(@chr[0])) - if this_chr > parseInt(@chr[0]) - break - if parseInt(this_chr) == parseInt(@chr[0]) - @these_results.push(result) - - get_qtl_count: () -> - high_qtl_count = 0 - for result in @these_results - if result.lod_score > 1 - high_qtl_count += 1 - console.log("high_qtl_count:", high_qtl_count) - - #if high_qtl_count > 10000 - @y_axis_filter = 2 - #else if high_qtl_count > 1000 - # @y_axis_filter = 1 - #else - # @y_axis_filter = 0 - - create_coordinates: () -> - for result in @these_results - @x_coords.push(parseFloat(result.Mb)) - @y_coords.push(result.lod_score) - @marker_names.push(result.name) - - create_svg: () -> - svg = d3.select("#topchart") - .append("svg") - .attr("class", "chr_manhattan_plot") - .attr("width", @plot_width+@x_buffer) - .attr("height", @plot_height+@y_buffer) - .append("g") - return svg - - create_scales: () -> - @x_scale = d3.scale.linear() - .domain([0, @chr[1]]) - .range([@x_buffer, @plot_width]) - @y_scale = d3.scale.linear() - .domain([0, @y_max]) - .range([@plot_height, @y_buffer]) - - get_lod_threshold: () -> - if @y_max/2 > 2 - return @y_max/2 - else - return 2 - - create_graph: () -> - @add_border() - @add_x_axis() - @add_y_axis() - @add_title() - @add_back_button() - if @manhattanPlot - @add_plot_points() - else - @add_path() - - add_border: () -> - border_coords = [[@y_buffer, @plot_height, @x_buffer, @x_buffer], - [@y_buffer, @plot_height, @plot_width, @plot_width], - [@y_buffer, @y_buffer, @x_buffer, @plot_width], - [@plot_height, @plot_height, @x_buffer, @plot_width]] - - @svg.selectAll("line") - .data(border_coords) - .enter() - .append("line") - .attr("y1", (d) => - return d[0] - ) - .attr("y2", (d) => - return d[1] - ) - .attr("x1", (d) => - return d[2] - ) - .attr("x2", (d) => - return d[3] - ) - .style("stroke", "#000") - - add_x_axis: () -> - @xAxis = d3.svg.axis() - .scale(@x_scale) - .orient("bottom") - .ticks(20) - - @xAxis.tickFormat((d) => - d3.format("d") #format as integer - return (d) - ) - - @svg.append("g") - .attr("class", "x_axis") - .attr("transform", "translate(0," + @plot_height + ")") - .call(@xAxis) - .selectAll("text") - .attr("text-anchor", "right") - .attr("font-size", "12px") - .attr("dx", "-1.6em") - .attr("transform", (d) => - return "translate(-12,0) rotate(-90)" - ) - - add_y_axis: () -> - @yAxis = d3.svg.axis() - .scale(@y_scale) - .orient("left") - .ticks(5) - - @svg.append("g") - .attr("class", "y_axis") - .attr("transform", "translate(" + @x_buffer + ",0)") - .call(@yAxis) - - add_title: () -> - @svg.append("text") - .attr("class", "title") - .text("Chr " + @chr[0]) - .attr("x", (d) => - return (@plot_width + @x_buffer)/2 - ) - .attr("y", @y_buffer + 20) - .attr("dx", "0em") - .attr("text-anchor", "middle") - .attr("font-family", "sans-serif") - .attr("font-size", "18px") - .attr("fill", "black") - - add_back_button: () -> - $("#return_to_full_view").show().click => @return_to_full_view() - - add_path: () -> - line_function = d3.svg.line() - .x( (d) => return @x_scale(d[0])) - .y( (d) => return @y_scale(d[1])) - .interpolate("linear") - - line_graph = @svg.append("path") - .attr("d", line_function(@plot_coordinates)) - .attr("stroke", "blue") - .attr("stroke-width", 1) - .attr("fill", "none") - - add_plot_points: () -> - @plot_point = @svg.selectAll("circle") - .data(@plot_coordinates) - .enter() - .append("circle") - .attr("cx", (d) => - return @x_scale(d[0]) - ) - .attr("cy", (d) => - return @y_scale(d[1]) - ) - .attr("r", (d) => - #if d[1] > 2 - # return 3 - #else - return 2 - ) - .attr("fill", (d) => - #if d[1] > 2 - # return "white" - #else - return "black" - ) - .attr("stroke", "black") - .attr("stroke-width", "1") - .attr("id", (d) => - return "point_" + String(d[2]) - ) - .classed("circle", true) - .on("mouseover", (d) => - console.log("d3.event is:", d3.event) - console.log("d is:", d) - this_id = "point_" + String(d[2]) - d3.select("#" + this_id).classed("d3_highlight", true) - .attr("r", 5) - .attr("stroke", "none") - .attr("fill", "blue") - .call(@show_marker_in_table(d)) - ) - .on("mouseout", (d) => - this_id = "point_" + String(d[2]) - d3.select("#" + this_id).classed("d3_highlight", false) - .attr("r", (d) => - #if d[1] > 2 - # return 3 - #else - return 2 - ) - .attr("fill", (d) => - #if d[1] > 2 - # return "white" - #else - return "black" - ) - .attr("stroke", "black") - .attr("stroke-width", "1") - ) - .append("svg:title") - .text((d) => - return d[2] - ) - - return_to_full_view: () -> - $("#return_to_full_view").hide() - $('#topchart').remove() - $('#chart_container').append('
') - create_lod_chart() - - show_marker_in_table: (marker_info) -> - console.log("in show_marker_in_table") - ### Searches for the select marker in the results table below ### - if marker_info - marker_name = marker_info[2] - $("#qtl_results_filter").find("input:first").val(marker_name).change() - #else - # marker_name = "" - #$("#qtl_results_filter").find("input:first").val(marker_name).change() diff --git a/wqflask/wqflask/static/new/javascript/chr_manhattan_plot.coffee b/wqflask/wqflask/static/new/javascript/chr_manhattan_plot.coffee deleted file mode 100644 index b1d2305e..00000000 --- a/wqflask/wqflask/static/new/javascript/chr_manhattan_plot.coffee +++ /dev/null @@ -1,295 +0,0 @@ -class Chr_Manhattan_Plot - - constructor: (@plot_height, @plot_width, @chr, manhattanPlot) -> - @qtl_results = js_data.qtl_results - console.log("qtl_results are:", @qtl_results) - console.log("chr is:", @chr) - - @get_max_chr() - - @filter_qtl_results() - console.log("filtered results:", @these_results) - @get_qtl_count() - - @x_coords = [] - @y_coords = [] - @marker_names = [] - - console.time('Create coordinates') - @create_coordinates() - console.log("@x_coords: ", @x_coords) - console.log("@y_coords: ", @y_coords) - console.timeEnd('Create coordinates') - - # Buffer to allow for the ticks/labels to be drawn - @x_buffer = @plot_width/30 - @y_buffer = @plot_height/20 - - @x_max = d3.max(@x_coords) - @y_max = d3.max(@y_coords) * 1.2 - - @y_threshold = @get_lod_threshold() - - @svg = @create_svg() - - @plot_coordinates = _.zip(@x_coords, @y_coords, @marker_names) - console.log("coordinates:", @plot_coordinates) - - @plot_height -= @y_buffer - - @create_scales() - - console.time('Create graph') - @create_graph() - console.timeEnd('Create graph') - - get_max_chr: () -> - @max_chr = 0 - for key of js_data.chromosomes - console.log("key is:", key) - if parseInt(key) > @max_chr - @max_chr = parseInt(key) - - filter_qtl_results: () -> - @these_results = [] - this_chr = 100 - for result in @qtl_results - if result.chr == "X" - this_chr = @max_chr - else - this_chr = result.chr - console.log("this_chr is:", this_chr) - console.log("@chr[0] is:", parseInt(@chr[0])) - if this_chr > parseInt(@chr[0]) - break - if parseInt(this_chr) == parseInt(@chr[0]) - @these_results.push(result) - - get_qtl_count: () -> - high_qtl_count = 0 - for result in @these_results - if result.lod_score > 1 - high_qtl_count += 1 - console.log("high_qtl_count:", high_qtl_count) - - #if high_qtl_count > 10000 - @y_axis_filter = 2 - #else if high_qtl_count > 1000 - # @y_axis_filter = 1 - #else - # @y_axis_filter = 0 - - create_coordinates: () -> - for result in @these_results - @x_coords.push(parseFloat(result.Mb)) - @y_coords.push(result.lod_score) - @marker_names.push(result.name) - - create_svg: () -> - svg = d3.select("#topchart") - .append("svg") - .attr("class", "chr_manhattan_plot") - .attr("width", @plot_width+@x_buffer) - .attr("height", @plot_height+@y_buffer) - .append("g") - return svg - - create_scales: () -> - @x_scale = d3.scale.linear() - .domain([0, @chr[1]]) - .range([@x_buffer, @plot_width]) - @y_scale = d3.scale.linear() - .domain([0, @y_max]) - .range([@plot_height, @y_buffer]) - - get_lod_threshold: () -> - if @y_max/2 > 2 - return @y_max/2 - else - return 2 - - create_graph: () -> - @add_border() - @add_x_axis() - @add_y_axis() - @add_title() - @add_back_button() - if manhattanPlot - @add_plot_points() - else - @add_path() - - add_border: () -> - border_coords = [[@y_buffer, @plot_height, @x_buffer, @x_buffer], - [@y_buffer, @plot_height, @plot_width, @plot_width], - [@y_buffer, @y_buffer, @x_buffer, @plot_width], - [@plot_height, @plot_height, @x_buffer, @plot_width]] - - @svg.selectAll("line") - .data(border_coords) - .enter() - .append("line") - .attr("y1", (d) => - return d[0] - ) - .attr("y2", (d) => - return d[1] - ) - .attr("x1", (d) => - return d[2] - ) - .attr("x2", (d) => - return d[3] - ) - .style("stroke", "#000") - - add_x_axis: () -> - @xAxis = d3.svg.axis() - .scale(@x_scale) - .orient("bottom") - .ticks(20) - - @xAxis.tickFormat((d) => - d3.format("d") #format as integer - return (d) - ) - - @svg.append("g") - .attr("class", "x_axis") - .attr("transform", "translate(0," + @plot_height + ")") - .call(@xAxis) - .selectAll("text") - .attr("text-anchor", "right") - .attr("font-size", "12px") - .attr("dx", "-1.6em") - .attr("transform", (d) => - return "translate(-12,0) rotate(-90)" - ) - - add_y_axis: () -> - @yAxis = d3.svg.axis() - .scale(@y_scale) - .orient("left") - .ticks(5) - - @svg.append("g") - .attr("class", "y_axis") - .attr("transform", "translate(" + @x_buffer + ",0)") - .call(@yAxis) - - add_title: () -> - @svg.append("text") - .attr("class", "title") - .text("Chr " + @chr[0]) - .attr("x", (d) => - return (@plot_width + @x_buffer)/2 - ) - .attr("y", @y_buffer + 20) - .attr("dx", "0em") - .attr("text-anchor", "middle") - .attr("font-family", "sans-serif") - .attr("font-size", "18px") - .attr("fill", "black") - - add_back_button: () -> - @svg.append("text") - .attr("class", "back") - .text("Return to full view") - .attr("x", @x_buffer*2) - .attr("y", @y_buffer/2) - .attr("dx", "0em") - .attr("text-anchor", "middle") - .attr("font-family", "sans-serif") - .attr("font-size", "18px") - .attr("cursor", "pointer") - .attr("fill", "black") - .on("click", @return_to_full_view) - - add_path: () -> - line_function = d3.svg.line() - .x( (d) => return @x_scale(d[0])) - .y( (d) => return @y_scale(d[1])) - .interpolate("linear") - - line_graph = @svg.append("path") - .attr("d", line_function(@plot_coordinates)) - .attr("stroke", "blue") - .attr("stroke-width", 1) - .attr("fill", "none") - - add_plot_points: () -> - @plot_point = @svg.selectAll("circle") - .data(@plot_coordinates) - .enter() - .append("circle") - .attr("cx", (d) => - return @x_scale(d[0]) - ) - .attr("cy", (d) => - return @y_scale(d[1]) - ) - .attr("r", (d) => - #if d[1] > 2 - # return 3 - #else - return 2 - ) - .attr("fill", (d) => - #if d[1] > 2 - # return "white" - #else - return "black" - ) - .attr("stroke", "black") - .attr("stroke-width", "1") - .attr("id", (d) => - return "point_" + String(d[2]) - ) - .classed("circle", true) - .on("mouseover", (d) => - console.log("d3.event is:", d3.event) - console.log("d is:", d) - this_id = "point_" + String(d[2]) - d3.select("#" + this_id).classed("d3_highlight", true) - .attr("r", 5) - .attr("stroke", "none") - .attr("fill", "blue") - .call(@show_marker_in_table(d)) - ) - .on("mouseout", (d) => - this_id = "point_" + String(d[2]) - d3.select("#" + this_id).classed("d3_highlight", false) - .attr("r", (d) => - #if d[1] > 2 - # return 3 - #else - return 2 - ) - .attr("fill", (d) => - #if d[1] > 2 - # return "white" - #else - return "black" - ) - .attr("stroke", "black") - .attr("stroke-width", "1") - ) - .append("svg:title") - .text((d) => - return d[2] - ) - - return_to_full_view: () -> - $('#topchart').remove() - $('#chart_container').append('
') - create_manhattan_plot() - - show_marker_in_table: (marker_info) -> - console.log("in show_marker_in_table") - ### Searches for the select marker in the results table below ### - if marker_info - marker_name = marker_info[2] - $("#qtl_results_filter").find("input:first").val(marker_name).change() - #else - # marker_name = "" - #$("#qtl_results_filter").find("input:first").val(marker_name).change() diff --git a/wqflask/wqflask/static/new/javascript/compare_traits_scatterplot.coffee b/wqflask/wqflask/static/new/javascript/compare_traits_scatterplot.coffee deleted file mode 100644 index 64400c7d..00000000 --- a/wqflask/wqflask/static/new/javascript/compare_traits_scatterplot.coffee +++ /dev/null @@ -1,145 +0,0 @@ -root = exports ? this - -root.create_scatterplot = (json_ids, json_data) -> - - console.log("TESTING2") - - h = 400 - w = 500 - margin = {left:60, top:40, right:40, bottom: 40, inner:5} - halfh = (h+margin.top+margin.bottom) - totalh = halfh*2 - halfw = (w+margin.left+margin.right) - totalw = halfw*2 - - # Example 1: simplest use - #d3.json "data.json", (data) -> - mychart = scatterplot().xvar(0) - .yvar(1) - .xlab("X") - .ylab("Y") - .height(h) - .width(w) - .margin(margin) - - data = json_data - indID = json_ids - #slope = js_data.slope - #intercept = js_data.intercept - - d3.select("div#comparison_scatterplot") - .datum({data:data, indID:indID}) - .call(mychart) - - # animate points - mychart.pointsSelect() - .on "mouseover", (d) -> - d3.select(this).attr("r", mychart.pointsize()*3) - .on "mouseout", (d) -> - d3.select(this).attr("r", mychart.pointsize()) - -root.create_scatterplots = (trait_names, json_ids, json_data) -> - - #There are various places where 1 is subtracted from the number of traits; this is because - #we don't want to show a first graph consisting of the trait vs itself. There might be a better - #way to deal with this. - - console.log("json_data:", json_data) - console.log("trait_names:", trait_names) - - num_traits = json_data.length - console.log("num_traits:", num_traits) - - h = 300 - w = 400 - margin = {left:60, top:40, right:40, bottom: 40, inner:5} - halfh = (h+margin.top+margin.bottom) - totalh = halfh*(num_traits-1) - #totalh = halfh*2 - halfw = (w+margin.left+margin.right) - #totalw = halfw*2 - totalw = halfw - - xvar = [] - yvar = [] - xshift = [] - yshift = [] - for i in [0..num_traits-1] - xvar.push(i) - yvar.push(0) - xshift.push(0) - yshift.push(halfh*i) - - console.log("xvar:", xvar) - console.log("yvar:", yvar) - - # Example 2: three scatterplots within one SVG, with brushing - #d3.json "data.json", (data) -> - #xvar = [1, 2, 2] - #yvar = [0, 0, 1] - #console.log("num_traits_array:", xvar) - #xshift = [0, halfw, halfw] - #yshift = [0, 0, halfh] - #xshift = [0, 0] - #yshift = [0, halfh] - - svg = d3.select("div#comparison_scatterplot") - .append("svg") - .attr("height", totalh) - .attr("width", totalw) - - mychart = [] - chart = [] - for i in [1..num_traits-1] - mychart[i-1] = scatterplot().xvar(xvar[i]) - .yvar(yvar[i]) - .nxticks(6) - .height(h) - .width(w) - .margin(margin) - .pointsize(4) - .xlab("#{trait_names[i-1]}") - .ylab("#{trait_names[0]}") - .title("#{trait_names[0]} vs. #{trait_names[i-1]}") - - data = json_data - indID = json_ids - - chart[i-1] = svg.append("g").attr("id", "chart#{i-1}") - .attr("transform", "translate(#{xshift[i]},#{yshift[i-1]})") - chart[i-1].datum({data:data, indID:indID}).call(mychart[i-1]) - - brush = [] - brushstart = (i) -> - () -> - for j in [0..num_traits-2] - chart[j].call(brush[j].clear()) if j != i - svg.selectAll("circle").attr("opacity", 0.6).classed("selected", false) - - brushmove = (i) -> - () -> - svg.selectAll("circle").classed("selected", false) - e = brush[i].extent() - chart[i].selectAll("circle") - .classed("selected", (d,j) -> - circ = d3.select(this) - cx = circ.attr("cx") - cy = circ.attr("cy") - selected = e[0][0] <= cx and cx <= e[1][0] and - e[0][1] <= cy and cy <= e[1][1] - svg.selectAll("circle.pt#{j}").classed("selected", true) if selected - selected) - - brushend = () -> - svg.selectAll("circle").attr("opacity", 1) - - xscale = d3.scale.linear().domain([margin.left,margin.left+w]).range([margin.left,margin.left+w]) - yscale = d3.scale.linear().domain([margin.top,margin.top+h]).range([margin.top,margin.top+h]) - - for i in [0..num_traits-2] - brush[i] = d3.svg.brush().x(xscale).y(yscale) - .on("brushstart", brushstart(i)) - .on("brush", brushmove(i)) - .on("brushend", brushend) - - chart[i].call(brush[i]) \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/corr_matrix.coffee b/wqflask/wqflask/static/new/javascript/corr_matrix.coffee deleted file mode 100644 index 4ecee1d4..00000000 --- a/wqflask/wqflask/static/new/javascript/corr_matrix.coffee +++ /dev/null @@ -1,275 +0,0 @@ -# iplotCorr.coffee -# -# Left panel is a heat map of a correlation matrix; hover over pixels -# to see the values; click to see the corresponding scatterplot on the right - -root = exports ? this - -iplotCorr = (data, chartOpts) -> - - # data is an object with 7 components - # data.indID vector of character strings, of length n, with IDs for individuals - # data.var vector of character strings, of length p, with variable names - # data.corr matrix of correlation values, of dim q x r, with q and r each <= p - # data.rows vector of indicators, of length q, with values in {0, 1, ..., p-1}, - # for each row in data.corr, it says which is the corresponding column in data.dat - # data.cols vector of indicators, of length r, with values in {0, 1, ..., p-1} - # for each column in data.corr, it says which is the corresponding column in data.dat - # data.dat numeric matrix, of dim n x p, with data to be plotted in scatterplots - # rows correspond to data.indID and columns to data.var - # data.group numeric vector, of length n, with values in {1, ..., k}, - # used as categories for coloring points in the scatterplot - - # chartOpts start - height = chartOpts?.height ? 450 # height of each panel in pixels - width = chartOpts?.width ? height # width of each panel in pixels - margin = chartOpts?.margin ? {left:70, top:40, right:5, bottom: 70, inner:5} # margins in pixels (left, top, right, bottom, inner) - corcolors = chartOpts?.corcolors ? ["darkslateblue", "white", "crimson"] # heat map colors (same length as `zlim`) - zlim = chartOpts?.zlim ? [-1, 0, 1] # z-axis limits - rectcolor = chartOpts?.rectcolor ? d3.rgb(230, 230, 230) # color of background rectangle - cortitle = chartOpts?.cortitle ? "" # title for heatmap panel - scattitle = chartOpts?.scattitle ? "" # title for scatterplot panel - scatcolors = chartOpts?.scatcolors ? null # vector of point colors for scatterplot - # chartOpts end - chartdivid = chartOpts?.chartdivid ? 'chart' - - totalh = height + margin.top + margin.bottom - totalw = (width + margin.left + margin.right)*2 - - svg = d3.select("div##{chartdivid}") - .append("svg") - .attr("height", totalh) - .attr("width", totalw) - - # panel for correlation image - corrplot = svg.append("g") - .attr("id", "corplot") - .attr("transform", "translate(#{margin.left},#{margin.top})") - - # panel for scatterplot - scatterplot = svg.append("g") - .attr("id", "scatterplot") - .attr("transform", "translate(#{margin.left*2+margin.right+width},#{margin.top})") - - # no. data points - nind = data.indID.length - nvar = data.var.length - ncorrX = data.cols.length - ncorrY = data.rows.length - - corXscale = d3.scale.ordinal().domain(d3.range(ncorrX)).rangeBands([0, width]) - corYscale = d3.scale.ordinal().domain(d3.range(ncorrY)).rangeBands([height, 0]) - corZscale = d3.scale.linear().domain(zlim).range(corcolors) - pixel_width = corXscale(1)-corXscale(0) - pixel_height = corYscale(0)-corYscale(1) - - # create list with correlations - corr = [] - for i of data.corr - for j of data.corr[i] - corr.push({row:i, col:j, value:data.corr[i][j]}) - - - # gray background on scatterplot - scatterplot.append("rect") - .attr("height", height) - .attr("width", width) - .attr("fill", rectcolor) - .attr("stroke", "black") - .attr("stroke-width", 1) - .attr("pointer-events", "none") - - corr_tip = d3.tip() - .attr('class', 'd3-tip') - .html((d) -> d3.format(".2f")(d.value)) - .direction('e') - .offset([0,10]) - corrplot.call(corr_tip) - - - cells = corrplot.selectAll("empty") - .data(corr) - .enter().append("rect") - .attr("class", "cell") - .attr("x", (d) -> corXscale(d.col)) - .attr("y", (d) -> corYscale(d.row)) - .attr("width", corXscale.rangeBand()) - .attr("height", corYscale.rangeBand()) - .attr("fill", (d) -> corZscale(d.value)) - .attr("stroke", "none") - .attr("stroke-width", 2) - .on("mouseover", (d) -> - d3.select(this).attr("stroke", "black") - corr_tip.show(d) - corrplot.append("text").attr("class","corrlabel") - .attr("x", corXscale(d.col)+pixel_width/2) - .attr("y", height+margin.bottom*0.2) - .text(data.var[data.cols[d.col]]) - .attr("dominant-baseline", "middle") - .attr("text-anchor", "middle") - corrplot.append("text").attr("class","corrlabel") - .attr("y", corYscale(d.row)+pixel_height/2) - .attr("x", -margin.left*0.1) - .text(data.var[data.rows[d.row]]) - .attr("dominant-baseline", "middle") - .attr("text-anchor", "end")) - .on("mouseout", (d) -> - corr_tip.hide(d) - d3.selectAll("text.corrlabel").remove() - d3.select(this).attr("stroke","none")) - .on("click",(d) -> drawScatter(d.col, d.row)) - - # colors for scatterplot - nGroup = d3.max(data.group) - if !(scatcolors?) or scatcolors.length < nGroup - if nGroup == 1 - scatcolors = [ d3.rgb(150, 150, 150) ] - else if nGroup <= 3 - scatcolors = ["crimson", "green", "darkslateblue"] - else - if nGroup <= 10 - colorScale = d3.scale.category10() - else - colorScale = d3.scale.category20() - scatcolors = (colorScale(i) for i of d3.range(nGroup)) - - scat_tip = d3.tip() - .attr('class', 'd3-tip') - .html((d,i) -> data.indID[i]) - .direction('e') - .offset([0,10]) - scatterplot.call(scat_tip) - - drawScatter = (i,j) -> - d3.selectAll("circle.points").remove() - d3.selectAll("text.axes").remove() - d3.selectAll("line.axes").remove() - console.log("data.dat:", data.dat) - console.log("data.cols:", data.cols) - xScale = d3.scale.linear() - .domain(d3.extent(data.dat[data.cols[i]])) - .range([margin.inner, width-margin.inner]) - yScale = d3.scale.linear() - .domain(d3.extent(data.dat[data.rows[j]])) - .range([height-margin.inner, margin.inner]) - # axis labels - scatterplot.append("text") - .attr("id", "xaxis") - .attr("class", "axes") - .attr("x", width/2) - .attr("y", height+margin.bottom*0.7) - .text(data.var[data.cols[i]]) - .attr("dominant-baseline", "middle") - .attr("text-anchor", "middle") - .attr("fill", "slateblue") - scatterplot.append("text") - .attr("id", "yaxis") - .attr("class", "axes") - .attr("x", -margin.left*0.8) - .attr("y", height/2) - .text(data.var[data.rows[j]]) - .attr("dominant-baseline", "middle") - .attr("text-anchor", "middle") - .attr("transform", "rotate(270,#{-margin.left*0.8},#{height/2})") - .attr("fill", "slateblue") - # axis scales - xticks = xScale.ticks(5) - yticks = yScale.ticks(5) - scatterplot.selectAll("empty") - .data(xticks) - .enter() - .append("text") - .attr("class", "axes") - .text((d) -> formatAxis(xticks)(d)) - .attr("x", (d) -> xScale(d)) - .attr("y", height+margin.bottom*0.3) - .attr("dominant-baseline", "middle") - .attr("text-anchor", "middle") - scatterplot.selectAll("empty") - .data(yticks) - .enter() - .append("text") - .attr("class", "axes") - .text((d) -> formatAxis(yticks)(d)) - .attr("x", -margin.left*0.1) - .attr("y", (d) -> yScale(d)) - .attr("dominant-baseline", "middle") - .attr("text-anchor", "end") - scatterplot.selectAll("empty") - .data(xticks) - .enter() - .append("line") - .attr("class", "axes") - .attr("x1", (d) -> xScale(d)) - .attr("x2", (d) -> xScale(d)) - .attr("y1", 0) - .attr("y2", height) - .attr("stroke", "white") - .attr("stroke-width", 1) - scatterplot.selectAll("empty") - .data(yticks) - .enter() - .append("line") - .attr("class", "axes") - .attr("y1", (d) -> yScale(d)) - .attr("y2", (d) -> yScale(d)) - .attr("x1", 0) - .attr("x2", width) - .attr("stroke", "white") - .attr("stroke-width", 1) - # the points - scatterplot.selectAll("empty") - .data(d3.range(nind)) - .enter() - .append("circle") - .attr("class", "points") - .attr("cx", (d) -> xScale(data.dat[data.cols[i]][d])) - .attr("cy", (d) -> yScale(data.dat[data.rows[j]][d])) - .attr("r", (d) -> - x = data.dat[data.cols[i]][d] - y = data.dat[data.rows[j]][d] - if x? and y? then 3 else null) - .attr("stroke", "black") - .attr("stroke-width", 1) - .attr("fill", (d) -> scatcolors[data.group[d]-1]) - .on("mouseover", scat_tip.show) - .on("mouseout", scat_tip.hide) - - # boxes around panels - corrplot.append("rect") - .attr("height", height) - .attr("width", width) - .attr("fill", "none") - .attr("stroke", "black") - .attr("stroke-width", 1) - .attr("pointer-events", "none") - - scatterplot.append("rect") - .attr("height", height) - .attr("width", width) - .attr("fill", "none") - .attr("stroke", "black") - .attr("stroke-width", 1) - .attr("pointer-events", "none") - - # text above - corrplot.append("text") - .text(cortitle) - .attr("id", "corrtitle") - .attr("x", width/2) - .attr("y", -margin.top/2) - .attr("dominant-baseline", "middle") - .attr("text-anchor", "middle") - - scatterplot.append("text") - .text(scattitle) - .attr("id", "scattitle") - .attr("x", width/2) - .attr("y", -margin.top/2) - .attr("dominant-baseline", "middle") - .attr("text-anchor", "middle") - - d3.select("div#caption") - .style("opacity", 1) - -root.corr_matrix = iplotCorr \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/corr_scatter_plot.coffee b/wqflask/wqflask/static/new/javascript/corr_scatter_plot.coffee deleted file mode 100644 index 29a0e8f7..00000000 --- a/wqflask/wqflask/static/new/javascript/corr_scatter_plot.coffee +++ /dev/null @@ -1,67 +0,0 @@ -root = exports ? this - -class Scatter_Plot - constructor: () -> - data = new Array() - samples_1 = js_data.samples_1 - samples_2 = js_data.samples_2 - i = 0 - for samplename of samples_1 - sample1 = samples_1[samplename] - sample2 = samples_2[samplename] - data[i++] = [sample1.value, sample2.value] - margin = - top: 100 - right: 15 - bottom: 60 - left: 60 - - width = js_data.width - margin.left - margin.right - height = js_data.height - margin.top - margin.bottom - minx = d3.min(data, (d) -> - d[0] - ) * 0.95 - maxx = d3.max(data, (d) -> - d[0] - ) * 1.05 - miny = d3.min(data, (d) -> - d[1] - ) * 0.95 - maxy = d3.max(data, (d) -> - d[1] - ) * 1.05 - x = d3.scale.linear().domain([minx, maxx]).range([0, width]) - y = d3.scale.linear().domain([miny, maxy]).range([height, 0]) - chart = d3.select("#scatter_plot").append("svg:svg").attr("width", width + margin.right + margin.left).attr("height", height + margin.top + margin.bottom).attr("class", "chart") - main = chart.append("g").attr("transform", "translate(" + margin.left + "," + margin.top + ")").attr("width", width).attr("height", height).attr("class", "main") - - # draw the x axis - xAxis = d3.svg.axis().scale(x).orient("bottom") - main.append("g").attr("transform", "translate(0," + height + ")").attr("class", "main axis date").call xAxis - - # draw the y axis - yAxis = d3.svg.axis().scale(y).orient("left") - main.append("g").attr("transform", "translate(0,0)").attr("class", "main axis date").call yAxis - g = main.append("svg:g") - g.selectAll("scatter-dots").data(data).enter().append("svg:circle").attr("cx", (d) -> - x d[0] - ).attr("cy", (d) -> - y d[1] - ).attr("fill", js_data.circle_color).attr "r", js_data.circle_radius - main.append("line").attr("x1", x(minx)).attr("y1", y(js_data.slope * minx + js_data.intercept)).attr("x2", x(maxx * 0.995)).attr("y2", y(js_data.slope * maxx * 0.995 + js_data.intercept)).style("stroke", js_data.line_color).style "stroke-width", js_data.line_width - chart.append("text").attr("x", width / 2).attr("y", margin.top / 2 - 25).text "Sample Correlation Scatterplot" - text = "" - text += "N=" + js_data.num_overlap - chart.append("text").attr("x", margin.left).attr("y", margin.top / 2 - 5).text text - text = "" - text += "r=" + js_data.r_value + "\t" - text += "p(r)=" + js_data.p_value - chart.append("text").attr("x", margin.left).attr("y", margin.top / 2 + 15).text text - text = "" - text += "slope=" + js_data.slope + "\t" - text += "intercept=" + js_data.intercept - chart.append("text").attr("x", margin.left).attr("y", margin.top / 2 + 35).text text - chart.append("text").attr("x", width / 2).attr("y", height + margin.top + 35).text js_data.trait_1 - chart.append("text").attr("x", 20).attr("y", height / 2 + margin.top + 30).attr("transform", "rotate(-90 20," + (height / 2 + margin.top + 30) + ")").text js_data.trait_2 - -root.Scatter_Plot = Scatter_Plot diff --git a/wqflask/wqflask/static/new/javascript/create_corr_matrix.coffee b/wqflask/wqflask/static/new/javascript/create_corr_matrix.coffee deleted file mode 100644 index 88b392d0..00000000 --- a/wqflask/wqflask/static/new/javascript/create_corr_matrix.coffee +++ /dev/null @@ -1,42 +0,0 @@ -root = exports ? this - -$ -> - console.log("js_data:", js_data) - - chartOpts = get_options() - data = get_data() - console.log(data) - - mychart = corr_matrix(data, chartOpts) - - -get_options = -> - #h = 450 - #w = 450 - #margin = {left:70, top:40, right:5, bottom: 70, inner:5} - # - chartOpts = - cortitle: "Correlation Matrix" - scattitle: "Scatterplot" - h: 450 - w: 450 - margin: {left:100, top:40, right:5, bottom: 70, inner:5} - - return chartOpts - -get_data = -> - data = {} - data.var = js_data.traits - data.group = js_data.groups - data.indID = js_data.samples - data.dat = js_data.sample_data - data.corr = js_data.corr_results - data.cols = js_data.cols - data.rows = js_data.rows - - - return data - - - - \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/create_heatmap.coffee b/wqflask/wqflask/static/new/javascript/create_heatmap.coffee deleted file mode 100644 index d3f9fb09..00000000 --- a/wqflask/wqflask/static/new/javascript/create_heatmap.coffee +++ /dev/null @@ -1,18 +0,0 @@ -create_heatmap = () -> - - h = 500 - w = 1200 - - mychart = lodheatmap().height(h) - .width(w) - #.zthresh(1) - - data = js_data.json_data - - console.log("data:", data) - - d3.select("div#chart") - .datum(data) - .call(mychart) - -create_heatmap() \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/create_lodchart.coffee b/wqflask/wqflask/static/new/javascript/create_lodchart.coffee deleted file mode 100644 index 88003f4e..00000000 --- a/wqflask/wqflask/static/new/javascript/create_lodchart.coffee +++ /dev/null @@ -1,50 +0,0 @@ -create_lod_chart = -> - h = 500 - w = 1200 - margin = {left:60, top:40, right:40, bottom: 40, inner:5} - halfh = (h+margin.top+margin.bottom) - totalh = halfh*2 - totalw = (w+margin.left+margin.right) - if 'additive' of js_data - additive = js_data.additive - else - additive = false - - console.log("js_data:", js_data) - - # simplest use - #d3.json "data.json", (data) -> - mychart = lodchart().lodvarname("lod.hk") - .height(h) - .width(w) - .margin(margin) - .ylab(js_data.result_score_type + " score") - .manhattanPlot(js_data.manhattan_plot) - #.additive(additive) - - data = js_data.json_data - - d3.select("div#topchart") - .datum(data) - .call(mychart) - - # grab chromosome rectangles; color pink on hover - chrrect = mychart.chrSelect() - chrrect.on "mouseover", -> - d3.select(this).attr("fill", "#E9CFEC") - .on "mouseout", (d,i) -> - d3.select(this).attr("fill", -> - return "#F1F1F9" if i % 2 - "#FBFBFF") - - # animate points at markers on click - mychart.markerSelect() - .on "click", (d) -> - r = d3.select(this).attr("r") - d3.select(this) - .transition().duration(500).attr("r", r*3) - .transition().duration(500).attr("r", r) - -$ -> - root.create_lod_chart = create_lod_chart - diff --git a/wqflask/wqflask/static/new/javascript/create_manhattan_plot.coffee b/wqflask/wqflask/static/new/javascript/create_manhattan_plot.coffee deleted file mode 100644 index a4c41227..00000000 --- a/wqflask/wqflask/static/new/javascript/create_manhattan_plot.coffee +++ /dev/null @@ -1,82 +0,0 @@ -create_manhattan_plot = -> - h = 500 - w = 1200 - margin = {left:60, top:40, right:40, bottom: 40, inner:5} - halfh = (h+margin.top+margin.bottom) - totalh = halfh*2 - totalw = (w+margin.left+margin.right) - - console.log("js_data:", js_data) - - # simplest use - #d3.json "data.json", (data) -> - mychart = lodchart().lodvarname("lod.hk") - .height(h) - .width(w) - .margin(margin) - .ylab("LOD score") - .manhattanPlot(js_data.manhattan_plot) - - data = js_data.json_data - - d3.select("div#topchart") - .datum(data) - .call(mychart) - - # grab chromosome rectangles; color pink on hover - chrrect = mychart.chrSelect() - chrrect.on "mouseover", -> - d3.select(this).attr("fill", "#E9CFEC") - .on "mouseout", (d,i) -> - d3.select(this).attr("fill", -> - return "#F1F1F9" if i % 2 - "#FBFBFF") - - # animate points at markers on click - mychart.markerSelect() - .on "click", (d) -> - r = d3.select(this).attr("r") - d3.select(this) - .transition().duration(500).attr("r", r*3) - .transition().duration(500).attr("r", r) - -create_manhattan_plot() - -$("#export").click => - #Get d3 SVG element - svg = $("#topchart").find("svg")[0] - - #Extract SVG text string - svg_xml = (new XMLSerializer).serializeToString(svg) - console.log("svg_xml:", svg_xml) - - #Set filename - filename = "manhattan_plot_" + js_data.this_trait - - #Make a form with the SVG data - form = $("#exportform") - form.find("#data").val(svg_xml) - form.find("#filename").val(filename) - form.submit() - -$("#export_pdf").click => - - #$('#topchart').remove() - #$('#chart_container').append('
') - #create_interval_map() - - #Get d3 SVG element - svg = $("#topchart").find("svg")[0] - - #Extract SVG text string - svg_xml = (new XMLSerializer).serializeToString(svg) - console.log("svg_xml:", svg_xml) - - #Set filename - filename = "manhattan_plot_" + js_data.this_trait - - #Make a form with the SVG data - form = $("#exportpdfform") - form.find("#data").val(svg_xml) - form.find("#filename").val(filename) - form.submit() diff --git a/wqflask/wqflask/static/new/javascript/curvechart.coffee b/wqflask/wqflask/static/new/javascript/curvechart.coffee deleted file mode 100644 index 7ed4359a..00000000 --- a/wqflask/wqflask/static/new/javascript/curvechart.coffee +++ /dev/null @@ -1,335 +0,0 @@ -# curvechart: reuseable chart with many curves - -curvechart = () -> - width = 800 - height = 500 - margin = {left:60, top:40, right:40, bottom: 40, inner:5} - axispos = {xtitle:25, ytitle:30, xlabel:5, ylabel:5} - titlepos = 20 - xlim = null - ylim = null - nxticks = 5 - xticks = null - nyticks = 5 - yticks = null - rectcolor = "#e6e6e6" - strokecolor = null - strokecolorhilit = null - strokewidth = 2 - strokewidthhilit = 2 - title = "" - xlab = "X" - ylab = "Y" - rotate_ylab = null - yscale = d3.scale.linear() - xscale = d3.scale.linear() - curvesSelect = null - commonX = true - - ## the main function - chart = (selection) -> - selection.each (data) -> - - # grab indID if it's there - # if no indID, create a vector of them - indID = data?.indID ? null - indID = indID ? [1..data.data.length] - - # groups of colors - group = data?.group ? (1 for i of data.data) - ngroup = d3.max(group) - group = (g-1 for g in group) # changed from (1,2,3,...) to (0,1,2,...) - - # default light stroke colors - strokecolor = strokecolor ? selectGroupColors(ngroup, "pastel") - strokecolor = expand2vector(strokecolor, ngroup) - - # default dark stroke colors - strokecolorhilit = strokecolorhilit ? selectGroupColors(ngroup, "dark") - strokecolorhilit = expand2vector(strokecolorhilit, ngroup) - - # reorganize data? - if commonX # reorganize data - data = ({x:data.x, y:data.data[i]} for i of data.data) - else - data = data.data - - xlim = xlim ? d3.extent(pullVarAsArray(data, "x")) - ylim = ylim ? d3.extent(pullVarAsArray(data, "y")) - - # reorganize again - for i of data - tmp = data[i] - data[i] = [] - for j of tmp.x - data[i].push({x:tmp.x[j], y:tmp.y[j]}) unless !tmp.x[j]? or !tmp.y[j]? - - # Select the svg element, if it exists. - svg = d3.select(this).selectAll("svg").data([data]) - - # Otherwise, create the skeletal chart. - gEnter = svg.enter().append("svg").append("g") - - # Update the outer dimensions. - svg.attr("width", width+margin.left+margin.right) - .attr("height", height+margin.top+margin.bottom) - - g = svg.select("g") - - # box - g.append("rect") - .attr("x", margin.left) - .attr("y", margin.top) - .attr("height", height) - .attr("width", width) - .attr("fill", rectcolor) - .attr("stroke", "none") - - # scales - xrange = [margin.left+margin.inner, margin.left+width-margin.inner] - yrange = [margin.top+height-margin.inner, margin.top+margin.inner] - xscale.domain(xlim).range(xrange) - yscale.domain(ylim).range(yrange) - xs = d3.scale.linear().domain(xlim).range(xrange) - ys = d3.scale.linear().domain(ylim).range(yrange) - - # if yticks not provided, use nyticks to choose pretty ones - yticks = yticks ? ys.ticks(nyticks) - xticks = xticks ? xs.ticks(nxticks) - - # title - titlegrp = g.append("g").attr("class", "title") - .append("text") - .attr("x", margin.left + width/2) - .attr("y", margin.top - titlepos) - .text(title) - - # x-axis - xaxis = g.append("g").attr("class", "x axis") - xaxis.selectAll("empty") - .data(xticks) - .enter() - .append("line") - .attr("x1", (d) -> xscale(d)) - .attr("x2", (d) -> xscale(d)) - .attr("y1", margin.top) - .attr("y2", margin.top+height) - .attr("fill", "none") - .attr("stroke", "white") - .attr("stroke-width", 1) - .style("pointer-events", "none") - xaxis.selectAll("empty") - .data(xticks) - .enter() - .append("text") - .attr("x", (d) -> xscale(d)) - .attr("y", margin.top+height+axispos.xlabel) - .text((d) -> formatAxis(xticks)(d)) - xaxis.append("text").attr("class", "title") - .attr("x", margin.left+width/2) - .attr("y", margin.top+height+axispos.xtitle) - .text(xlab) - - # y-axis - rotate_ylab = rotate_ylab ? (ylab.length > 1) - yaxis = g.append("g").attr("class", "y axis") - yaxis.selectAll("empty") - .data(yticks) - .enter() - .append("line") - .attr("y1", (d) -> yscale(d)) - .attr("y2", (d) -> yscale(d)) - .attr("x1", margin.left) - .attr("x2", margin.left+width) - .attr("fill", "none") - .attr("stroke", "white") - .attr("stroke-width", 1) - .style("pointer-events", "none") - yaxis.selectAll("empty") - .data(yticks) - .enter() - .append("text") - .attr("y", (d) -> yscale(d)) - .attr("x", margin.left-axispos.ylabel) - .text((d) -> formatAxis(yticks)(d)) - yaxis.append("text").attr("class", "title") - .attr("y", margin.top+height/2) - .attr("x", margin.left-axispos.ytitle) - .text(ylab) - .attr("transform", if rotate_ylab then "rotate(270,#{margin.left-axispos.ytitle},#{margin.top+height/2})" else "") - - indtip = d3.tip() - .attr('class', 'd3-tip') - .html((d) -> indID[d]) - .direction('e') - .offset([0,10]) - svg.call(indtip) - - curve = d3.svg.line() - .x((d) -> xscale(d.x)) - .y((d) -> yscale(d.y)) - - curves = g.append("g").attr("id", "curves") - curvesSelect = - curves.selectAll("empty") - .data(d3.range(data.length)) - .enter() - .append("path") - .datum((d) -> data[d]) - .attr("d", curve) - .attr("class", (d,i) -> "path#{i}") - .attr("fill", "none") - .attr("stroke", (d,i) -> strokecolor[group[i]]) - .attr("stroke-width", strokewidth) - .on "mouseover.panel", (d,i) -> - d3.select(this).attr("stroke", strokecolorhilit[group[i]]).moveToFront() - circle = d3.select("circle#hiddenpoint#{i}") - indtip.show(i, circle.node()) - .on "mouseout.panel", (d,i) -> - d3.select(this).attr("stroke", strokecolor[group[i]]).moveToBack() - indtip.hide() - - # grab the last non-null point from each curve - lastpoint = ({x:null, y:null} for i of data) - for i of data - for v in data[i] - lastpoint[i] = v if v.x? and v.y? - - pointsg = g.append("g").attr("id", "invisiblepoints") - points = pointsg.selectAll("empty") - .data(lastpoint) - .enter() - .append("circle") - .attr("id", (d,i) -> "hiddenpoint#{i}") - .attr("cx", (d) -> xscale(d.x)) - .attr("cy", (d) -> yscale(d.y)) - .attr("r", 1) - .attr("opacity", 0) - - # box - g.append("rect") - .attr("x", margin.left) - .attr("y", margin.top) - .attr("height", height) - .attr("width", width) - .attr("fill", "none") - .attr("stroke", "black") - .attr("stroke-width", "none") - - ## configuration parameters - chart.width = (value) -> - return width if !arguments.length - width = value - chart - - chart.height = (value) -> - return height if !arguments.length - height = value - chart - - chart.margin = (value) -> - return margin if !arguments.length - margin = value - chart - - chart.axispos = (value) -> - return axispos if !arguments.length - axispos = value - chart - - chart.titlepos = (value) -> - return titlepos if !arguments.length - titlepos - chart - - chart.xlim = (value) -> - return xlim if !arguments.length - xlim = value - chart - - chart.nxticks = (value) -> - return nxticks if !arguments.length - nxticks = value - chart - - chart.xticks = (value) -> - return xticks if !arguments.length - xticks = value - chart - - chart.ylim = (value) -> - return ylim if !arguments.length - ylim = value - chart - - chart.nyticks = (value) -> - return nyticks if !arguments.length - nyticks = value - chart - - chart.yticks = (value) -> - return yticks if !arguments.length - yticks = value - chart - - chart.rectcolor = (value) -> - return rectcolor if !arguments.length - rectcolor = value - chart - - chart.strokecolor = (value) -> - return strokecolor if !arguments.length - strokecolor = value - chart - - chart.strokecolorhilit = (value) -> - return strokecolorhilit if !arguments.length - strokecolorhilit = value - chart - - chart.strokewidth = (value) -> - return strokewidth if !arguments.length - strokewidth = value - chart - - chart.strokewidthhilit = (value) -> - return strokewidthhilit if !arguments.length - strokewidthhilit = value - chart - - chart.commonX = (value) -> - return commonX if !arguments.length - commonX = value - chart - - chart.title = (value) -> - return title if !arguments.length - title = value - chart - - chart.xlab = (value) -> - return xlab if !arguments.length - xlab = value - chart - - chart.ylab = (value) -> - return ylab if !arguments.length - ylab = value - chart - - chart.rotate_ylab = (value) -> - return rotate_ylab if !arguments.length - rotate_ylab = value - chart - - chart.yscale = () -> - return yscale - - chart.xscale = () -> - return xscale - - chart.curvesSelect = () -> - return curvesSelect - - # return the chart function - chart \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/draw_corr_scatterplot.coffee b/wqflask/wqflask/static/new/javascript/draw_corr_scatterplot.coffee deleted file mode 100644 index 057c4ee2..00000000 --- a/wqflask/wqflask/static/new/javascript/draw_corr_scatterplot.coffee +++ /dev/null @@ -1,37 +0,0 @@ -# illustration of use of the scatterplot function - -h = 400 -w = 500 -margin = {left:60, top:40, right:40, bottom: 40, inner:5} -halfh = (h+margin.top+margin.bottom) -totalh = halfh*2 -halfw = (w+margin.left+margin.right) -totalw = halfw*2 - -# Example 1: simplest use -#d3.json "data.json", (data) -> -mychart = scatterplot().xvar(0) - .yvar(1) - .xlab(js_data.trait_1) - .ylab(js_data.trait_2) - .height(h) - .width(w) - .margin(margin) - -data = js_data.data -indID = js_data.indIDs -slope = js_data.slope -intercept = js_data.intercept - -console.log("THE DATA IS:", data) - -d3.select("div#chart1") - .datum({data:data, indID:indID, slope:slope, intercept:intercept}) - .call(mychart) - -# animate points -mychart.pointsSelect() - .on "mouseover", (d) -> - d3.select(this).attr("r", mychart.pointsize()*3) - .on "mouseout", (d) -> - d3.select(this).attr("r", mychart.pointsize()) \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/draw_probability_plot.coffee b/wqflask/wqflask/static/new/javascript/draw_probability_plot.coffee deleted file mode 100644 index 09ab3bc4..00000000 --- a/wqflask/wqflask/static/new/javascript/draw_probability_plot.coffee +++ /dev/null @@ -1,94 +0,0 @@ -root = exports ? this - -# calculations here use the same formulae as scipy.stats.probplot -get_z_scores = (n) -> - # order statistic medians (Filliben's approximation) - osm_uniform = new Array(n) - osm_uniform[n - 1] = Math.pow(0.5, 1.0 / n) - osm_uniform[0] = 1 - osm_uniform[n - 1] - for i in [1 .. (n - 2)] - osm_uniform[i] = (i + 1 - 0.3175) / (n + 0.365) - - return (jStat.normal.inv(x, 0, 1) for x in osm_uniform) - -# samples is {'samples_primary': {'name1': value1, ...}, -# 'samples_other': {'nameN': valueN, ...}, -# 'samples_all': {'name1': value1, ...}} -redraw_prob_plot = (samples, sample_group) -> - h = 600 - w = 600 - margin = {left:60, top:40, right:40, bottom: 40, inner:5} - totalh = h + margin.top + margin.bottom - totalw = w + margin.left + margin.right - - container = $("#prob_plot_container") - container.width(totalw) - container.height(totalh) - - nv.addGraph(() => - chart = nv.models.scatterChart() - .width(w) - .height(h) - .showLegend(true) - .color(d3.scale.category10().range()) - - # size settings are quite counter-intuitive in NVD3! - chart.pointRange([50,50]) # (50 is the area, not radius) - - chart.legend.updateState(false) - - chart.xAxis - .axisLabel("Theoretical quantiles") - .tickFormat(d3.format('.02f')) - - chart.yAxis - .axisLabel("Sample quantiles") - .tickFormat(d3.format('.02f')) - - chart.tooltipContent((obj) => - return '' + obj.point.name + '' - ) - - all_samples = samples[sample_group] - names = (x for x in _.keys(all_samples) when all_samples[x] != null) - sorted_names = names.sort((x, y) => all_samples[x].value - all_samples[y].value) - sorted_values = (all_samples[x].value for x in sorted_names) - sw_result = ShapiroWilkW(sorted_values) - W = sw_result.w.toFixed(3) - pvalue = sw_result.p.toFixed(3) - pvalue_str = if pvalue > 0.05 then\ - pvalue.toString()\ - else\ - ""+pvalue+"" - test_str = "Shapiro-Wilk test statistic is #{W} (p = #{pvalue_str})" - - z_scores = get_z_scores(sorted_values.length) - slope = jStat.stdev(sorted_values) - intercept = jStat.mean(sorted_values) - - make_data = (group_name) -> - return { - key: js_data.sample_group_types[group_name], - slope: slope, - intercept: intercept, - values: ({x: z_score, y: value, name: sample}\ - for [z_score, value, sample] in\ - _.zip(get_z_scores(sorted_values.length), - sorted_values, - sorted_names)\ - when sample of samples[group_name]) - } - - data = [make_data('samples_primary'), make_data('samples_other')] - console.log("THE DATA IS:", data) - d3.select("#prob_plot_container svg") - .datum(data) - .call(chart) - - $("#prob_plot_title").html("

Normal probability plot

"+test_str) - $("#prob_plot_container .nv-legendWrap").toggle(sample_group == "samples_all") - - return chart - ) - -root.redraw_prob_plot_impl = redraw_prob_plot diff --git a/wqflask/wqflask/static/new/javascript/get_traits_from_collection.coffee b/wqflask/wqflask/static/new/javascript/get_traits_from_collection.coffee deleted file mode 100644 index 07be824f..00000000 --- a/wqflask/wqflask/static/new/javascript/get_traits_from_collection.coffee +++ /dev/null @@ -1,228 +0,0 @@ -console.log("before get_traits_from_collection") - -# Going to be used to hold collection list -# So we can repopulate it when the back button is clicked -collection_list = null -this_trait_data = null - -selected_traits = {} - -collection_click = () -> - 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() - $.ajax( - dataType: "json", - url: this_collection_url, - success: process_traits - ) - -submit_click = () -> - - selected_traits = {} - - traits = [] - $('#collections_holder').find('input[type=checkbox]:checked').each -> - this_trait = $(@).parents('tr').find('.trait').text() - console.log("this_trait is:", this_trait) - this_dataset = $(@).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 - $.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) - - for trait in Object.keys(selected_traits) - trait_names.push(trait) - - this_trait_vals = [] - for sample in samples - if sample in Object.keys(selected_traits[trait]) - 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() - - - #create_scatterplots(trait_names, samples, all_vals) - - $.colorbox.close() - -create_trait_data_csv = (selected_traits) -> - 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) - - for trait in Object.keys(selected_traits) - trait_names.push(trait) - - this_trait_vals = [] - for sample in samples - if sample in Object.keys(selected_traits[trait]) - 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 sample, index in samples - if all_vals[0][index] == null - continue - sample_vals = [] - for trait in all_vals - sample_vals.push(trait[index]) - trait_vals_csv += sample_vals.join(",") - trait_vals_csv += "\n" - - #console.log("trait_vals_csv:", trait_vals_csv) - - return trait_vals_csv - -trait_click = () -> - console.log("Clicking on:", $(this)) - trait = $(this).parent().find('.trait').text() - dataset = $(this).parent().find('.dataset').text() - 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 - ) - $.colorbox.close() - -add_trait_data = (trait_data, textStatus, jqXHR) -> - trait_name = trait_data[0] - trait_sample_data = trait_data[1] - selected_traits[trait_name] = trait_sample_data - console.log("selected_traits:", selected_traits) - -get_trait_data = (trait_data, textStatus, jqXHR) -> - #trait_list = $('input[name=compare_traits]') - #console.log("trait_list:", trait_list.val()) - 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 sample in samples - if sample in Object.keys(trait_sample_data) - vals.push(parseFloat(trait_sample_data[sample])) - else - vals.push(null) - - #console.log("sorted_samples:", samples) - #console.log("sorted_vals:", vals) - - if $('input[name=samples]').length < 1 - $('#hidden_inputs').append('') - $('#hidden_inputs').append('') - - this_trait_vals = get_this_trait_vals(samples) - - #json_data = assemble_into_json(this_trait_vals_json) - - #console.log("json_data[1]:", json_data[1]) - - console.log("THE LENGTH IS:", $('input[name=vals]').length) - #if $('input[name=vals]').length == 1 - # create_scatterplot(samples, [this_trait_vals, vals]) - - color_by_trait(trait_sample_data) - -get_this_trait_vals = (samples) -> - this_trait_vals = [] - for sample in samples - 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 = (this_trait_vals) -> - num_traits = $('input[name=vals]').length - samples = $('input[name=samples]').val() - json_ids = samples - - json_data = '[' + this_trait_vals - - $('input[name=vals]').each (index, element) => - json_data += ',' + $(element).val() - json_data += ']' - - return [json_ids, json_data] - -color_by_trait = (trait_sample_data, textStatus, jqXHR) -> - #trait_sample_data = trait_sample_data - console.log('in color_by_trait:', trait_sample_data) - root.bar_chart.color_by_trait(trait_sample_data) - -process_traits = (trait_data, textStatus, jqXHR) -> - console.log('in process_traits with trait_data:', trait_data) - - the_html = "" - the_html += " " - - the_html += "" - the_html += "" - the_html += "" - for trait in trait_data - the_html += "" - the_html += "" - the_html += "" - the_html += "" - the_html += "" - the_html += "" - the_html += "" - the_html += "
RecordData SetDescriptionMean
#{ trait.name }#{ trait.dataset }#{ trait.description }#{ trait.mean or ' ' }
" - - $("#collections_holder").html(the_html) - $('#collections_holder').colorbox.resize() - -back_to_collections = () -> - console.log("collection_list:", collection_list) - $("#collections_holder").html(collection_list) - - $(document).on("click", ".collection_line", collection_click) - $('#collections_holder').colorbox.resize() - -$ -> - console.log("inside get_traits_from_collection") - - $(document).on("click", ".collection_line", collection_click) - $(document).on("click", "#submit", submit_click) - $(document).on("click", ".trait", trait_click) - $(document).on("click", "#back_to_collections", back_to_collections) - diff --git a/wqflask/wqflask/static/new/javascript/histogram.coffee b/wqflask/wqflask/static/new/javascript/histogram.coffee deleted file mode 100644 index 68d9b5a2..00000000 --- a/wqflask/wqflask/static/new/javascript/histogram.coffee +++ /dev/null @@ -1,141 +0,0 @@ -root = exports ? this - -class Histogram - constructor: (@sample_list, @sample_group) -> - @sort_by = "name" - @format_count = d3.format(",.0f") #a formatter for counts - - @margin = {top: 10, right: 30, bottom: 30, left: 30} - @plot_width = 960 - @margin.left - @margin.right - @plot_height = 500 - @margin.top - @margin.bottom - - @x_buffer = @plot_width/20 - @y_buffer = @plot_height/20 - @plot_height -= @y_buffer - - @get_sample_vals(@sample_list) - @redraw(@sample_vals) - - redraw: (@sample_vals) -> - @y_min = d3.min(@sample_vals) - @y_max = d3.max(@sample_vals) * 1.1 - - @create_x_scale() - @get_histogram_data() - @create_y_scale() - - $("#histogram").empty() - @svg = @create_svg() - @create_graph() - - get_sample_vals: (sample_list) -> - @sample_vals = (sample.value for sample in sample_list when sample.value != null) - - create_svg: () -> - svg = d3.select("#histogram") - .append("svg") - .attr("class", "histogram") - .attr("width", @plot_width + @margin.left + @margin.right) - .attr("height", @plot_height + @margin.top + @margin.bottom) - .append("g") - .attr("transform", "translate(" + @margin.left + "," + @margin.top + ")") - - return svg - - create_x_scale: () -> - console.log("min/max:", d3.min(@sample_vals) + "," + d3.max(@sample_vals)) - x0 = Math.max(-d3.min(@sample_vals), d3.max(@sample_vals)) - #if (d3.min(@sample_vals) < 0) - # min_domain = d3.min(@sample_vals) - #else - # min_domain = 0 - @x_scale = d3.scale.linear() - .domain([d3.min(@sample_vals), d3.max(@sample_vals)]) - .range([0, @plot_width]) - .nice() - - get_histogram_data: () -> - console.log("sample_vals:", @sample_vals) - n_bins = Math.sqrt(@sample_vals.length) - @histogram_data = d3.layout.histogram() - .bins(@x_scale.ticks(n_bins))(@sample_vals) - console.log("histogram_data:", @histogram_data[0]) - - create_y_scale: () -> - @y_scale = d3.scale.linear() - .domain([0, d3.max(@histogram_data, (d) => return d.y )]) - .range([@plot_height, 0]) - - create_graph: () -> - @add_x_axis() - @add_y_axis() - @add_bars() - - add_x_axis: () -> - x_axis = d3.svg.axis() - .scale(@x_scale) - .orient("bottom"); - - @svg.append("g") - .attr("class", "x axis") - .attr("transform", "translate(0," + @plot_height + ")") - .call(x_axis) - - #add_y_axis: () -> - # y_axis = d3.svg.axis() - # .scale(@y_scale) - # .orient("left") - # .ticks(5) - # - # @svg.append("g") - # .attr("class", "y axis") - # #.attr("transform", "translate(0," + @plot_width + ")") - # .call(y_axis) - - - add_y_axis: () -> - yAxis = d3.svg.axis() - .scale(@y_scale) - .orient("left") - .ticks(5) - - @svg.append("g") - .attr("class", "y axis") - .call(yAxis) - .append("text") - .attr("transform", "rotate(-90)") - .attr("y", 6) - .attr("dy", ".71em") - .style("text-anchor", "end") - - add_bars: () -> - console.log("bar_width:", @x_scale(@histogram_data[0].dx)) - bar = @svg.selectAll(".bar") - .data(@histogram_data) - .enter().append("g") - .attr("class", "bar") - .attr("transform", (d) => - return "translate(" + @x_scale(d.x) + "," + @y_scale(d.y) + ")") - - rect_width = @x_scale(@histogram_data[0].x + @histogram_data[0].dx) - - @x_scale(@histogram_data[0].x) - - bar.append("rect") - .attr("x", 1) - .attr("width", rect_width - 1) - .attr("height", (d) => - return @plot_height - @y_scale(d.y) - ) - bar.append("text") - .attr("dy", ".75em") - .attr("y", 6) - .attr("x", rect_width / 2) - .attr("text-anchor", "middle") - .style("fill", "#fff") - .text((d) => - bar_height = @plot_height - @y_scale(d.y) - if bar_height > 20 - return @format_count(d.y) - ) - -root.Histogram = Histogram diff --git a/wqflask/wqflask/static/new/javascript/iplotMScanone_noeff.coffee b/wqflask/wqflask/static/new/javascript/iplotMScanone_noeff.coffee deleted file mode 100644 index 63ded023..00000000 --- a/wqflask/wqflask/static/new/javascript/iplotMScanone_noeff.coffee +++ /dev/null @@ -1,193 +0,0 @@ -# iplotMScanone_noeff: image of lod curves linked to plot of lod curves -# Karl W Broman - -iplotMScanone_noeff = (lod_data, times, chartOpts) -> - - # chartOpts start - wleft = chartOpts?.wleft ? 1000 # width of left panels in pixels - wright = chartOpts?.wright ? 500 # width of right panel in pixels - htop = chartOpts?.htop ? 350 # height of top panels in pixels - hbot = chartOpts?.hbot ? 350 # height of bottom panel in pixels - margin = chartOpts?.margin ? {left:100, top:40, right:40, bottom: 40, inner:5} # margins in pixels (left, top, right, bottom, inner) - axispos = chartOpts?.axispos ? {xtitle:25, ytitle:30, xlabel:5, ylabel:5} # position of axis labels in pixels (xtitle, ytitle, xlabel, ylabel) - titlepos = chartOpts?.titlepos ? 20 # position of chart title in pixels - chrGap = chartOpts?.chrGap ? 8 # gap between chromosomes in pixels - darkrect = chartOpts?.darkrect ? "#C8C8C8" # color of darker background rectangle - lightrect = chartOpts?.lightrect ? "#E6E6E6" # color of lighter background rectangle - nullcolor = chartOpts?.nullcolor ? "#E6E6E6" # color for pixels with null values - colors = chartOpts?.colors ? ["slateblue", "white", "crimson"] # heat map colors - zlim = chartOpts?.zlim ? null # z-axis limits - zthresh = chartOpts?.zthresh ? null # lower z-axis threshold for display in heat map - lod_ylab = chartOpts?.lod_ylab ? "" # y-axis label for LOD heatmap (also used as x-axis label on effect plot) - linecolor = chartOpts?.linecolor ? "darkslateblue" # color of lines - linewidth = chartOpts?.linewidth ? 2 # width of lines - nxticks = chartOpts?.nxticks ? 5 # no. ticks in x-axis on right-hand panel, if quantitative scale - xticks = chartOpts?.xticks ? null # tick positions in x-axis on right-hand panel, if quantitative scale - lod_labels = chartOpts?.lod_labels ? null # optional vector of strings, for LOD column labels - # chartOpts end - chartdivid = chartOpts?.chartdivid ? 'chart' - - totalh = htop + hbot + 2*(margin.top + margin.bottom) - totalw = wleft + wright + 2*(margin.left + margin.right) - - # if quant scale, use times as labels; otherwise use lod_data.lodnames - unless lod_labels? - lod_labels = if times? then (formatAxis(times, extra_digits=1)(x) for x in times) else lod_data.lodnames - - mylodheatmap = lodheatmap().height(htop) - .width(wleft) - .margin(margin) - .axispos(axispos) - #.titlepos(titlepos) - #.chrGap(chrGap) - #.rectcolor(lightrect) - #.colors(colors) - #.zlim(zlim) - #.zthresh(zthresh) - #.quantScale(times) - #.lod_labels(lod_labels) - #.ylab(lod_ylab) - #.nullcolor(nullcolor) - - svg = d3.select("div##{chartdivid}") - .append("svg") - .attr("height", totalh) - .attr("width", totalw) - - g_heatmap = svg.append("g") - .attr("id", "heatmap") - .datum(lod_data) - .call(mylodheatmap) - - mylodchart = lodchart().height(hbot) - .width(wleft) - .margin(margin) - .axispos(axispos) - .titlepos(titlepos) - .chrGap(chrGap) - .linecolor("none") - .pad4heatmap(true) - .darkrect(darkrect) - .lightrect(lightrect) - .ylim([0, d3.max(mylodheatmap.zlim())]) - .pointsAtMarkers(false) - - g_lodchart = svg.append("g") - .attr("transform", "translate(0,#{htop+margin.top+margin.bottom})") - .attr("id", "lodchart") - .datum(lod_data) - .call(mylodchart) - - # function for lod curve path - lodcurve = (chr, lodcolumn) -> - d3.svg.line() - .x((d) -> mylodchart.xscale()[chr](d)) - .y((d,i) -> mylodchart.yscale()(Math.abs(lod_data.lodByChr[chr][i][lodcolumn]))) - - # plot lod curves for selected lod column - lodchart_curves = null - plotLodCurve = (lodcolumn) -> - g_lodchart.selectAll("g#curves").remove() - lodchart_curves = g_lodchart.append("g").attr("id", "lodcurves") - for chr in lod_data.chrnames - lodchart_curves.append("path") - .datum(lod_data.posByChr[chr[0]]) - .attr("d", lodcurve(chr[0], lodcolumn)) - .attr("stroke", linecolor) - .attr("fill", "none") - .attr("stroke-width", linewidth) - .style("pointer-events", "none") - - # rearrange data for curves of time x LOD - lod4curves = {data:[]} - for pos of lod_data.pos - y = (Math.abs(lod_data[lodcolumn][pos]) for lodcolumn in lod_data.lodnames) - x = (+i for i of lod_data.lodnames) - lod4curves.data.push({x:x, y:y}) - - #mycurvechart = curvechart().height(htop) - # .width(wright) - # .margin(margin) - # .axispos(axispos) - # .titlepos(titlepos) - # .xlab(lod_ylab) - # .ylab("LOD score") - # .strokecolor("none") - # .rectcolor(lightrect) - # .xlim([-0.5, lod_data.lodnames.length-0.5]) - # .ylim([0, d3.max(mylodheatmap.zlim())]) - # .nxticks(0) - # .commonX(false) - # - #g_curvechart = svg.append("g") - # .attr("transform", "translate(#{wleft+margin.top+margin.bottom},0)") - # .attr("id", "curvechart") - # .datum(lod4curves) - # .call(mycurvechart) - # - ## add X axis - #if times? # use quantitative axis - # xscale = d3.scale.linear().range(mycurvechart.xscale().range()) - # xscale.domain([times[0], times[times.length-1]]) - # xticks = xticks ? xscale.ticks(nxticks) - # curvechart_xaxis = g_curvechart.select("g.x.axis") - # curvechart_xaxis.selectAll("empty") - # .data(xticks) - # .enter() - # .append("line") - # .attr("x1", (d) -> xscale(d)) - # .attr("x2", (d) -> xscale(d)) - # .attr("y1", margin.top) - # .attr("y2", margin.top+htop) - # .attr("fill", "none") - # .attr("stroke", "white") - # .attr("stroke-width", 1) - # .style("pointer-events", "none") - # curvechart_xaxis.selectAll("empty") - # .data(xticks) - # .enter() - # .append("text") - # .attr("x", (d) -> xscale(d)) - # .attr("y", margin.top+htop+axispos.xlabel) - # .text((d) -> formatAxis(xticks)(d)) - #else # qualitative axis - # curvechart_xaxis = g_curvechart.select("g.x.axis") - # .selectAll("empty") - # .data(lod_labels) - # .enter() - # .append("text") - # .attr("id", (d,i) -> "xaxis#{i}") - # .attr("x", (d,i) -> mycurvechart.xscale()(i)) - # .attr("y", margin.top+htop+axispos.xlabel) - # .text((d) -> d) - # .attr("opacity", 0) - - # hash for [chr][pos] -> posindex - #posindex = {} - #curindex = 0 - #for chr in lod_data.chrnames - # posindex[chr] = {} - # for pos in lod_data.posByChr[chr] - # posindex[chr][pos] = curindex - # curindex += 1 - - #mycurvechart.curvesSelect() - # .on("mouseover.panel", null) - # .on("mouseout.panel", null) - # - mylodheatmap.cellSelect() - .on "mouseover", (d) -> - plotLodCurve(d.lodindex) - g_lodchart.select("g.title text").text("#{lod_labels[d.lodindex]}") - #g_curvechart.selectAll("path.path#{posindex[d.chr][d.pos]}").attr("stroke", linecolor) - p = d3.format(".1f")(d.pos) - #g_curvechart.select("g.title text").text("#{d.chr}@#{p}") - #g_curvechart.select("text#xaxis#{d.lodindex}").attr("opacity", 1) unless times? - .on "mouseout", (d) -> - lodchart_curves.remove() - g_lodchart.select("g.title text").text("") - #g_curvechart.selectAll("path.path#{posindex[d.chr][d.pos]}").attr("stroke", null) - #g_curvechart.select("g.title text").text("") - #g_curvechart.select("text#xaxis#{d.lodindex}").attr("opacity", 0) unless times? - -iplotMScanone_noeff(lod_data = js_data.json_data) \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/lod_chart.coffee b/wqflask/wqflask/static/new/javascript/lod_chart.coffee deleted file mode 100644 index 55ffdce0..00000000 --- a/wqflask/wqflask/static/new/javascript/lod_chart.coffee +++ /dev/null @@ -1,517 +0,0 @@ -lodchart = () -> - width = 800 - height = 500 - margin = {left:60, top:40, right:40, bottom: 40, inner:5} - axispos = {xtitle:25, ytitle:30, xlabel:5, ylabel:5} - titlepos = 20 - manhattanPlot = false - additive = false - ylim = null - additive_ylim = null - nyticks = 5 - yticks = null - additive_yticks = null - chrGap = 8 - darkrect = "#F1F1F9" - lightrect = "#FBFBFF" - lodlinecolor = "darkslateblue" - additivelinecolor = "red" - linewidth = 2 - suggestivecolor = "gainsboro" - significantcolor = "#EBC7C7" - pointcolor = "#E9CFEC" # pink - pointsize = 0 # default = no visible points at markers - pointstroke = "black" - title = "" - xlab = "Chromosome" - ylab = "LRS score" - additive_ylab = "Additive Effect" - rotate_ylab = null - yscale = d3.scale.linear() - additive_yscale = d3.scale.linear() - xscale = null - pad4heatmap = false - lodcurve = null - lodvarname = null - markerSelect = null - chrSelect = null - pointsAtMarkers = true - - - ## the main function - chart = (selection) -> - selection.each (data) -> - - #console.log("data:", data) - - if manhattanPlot == true - pointcolor = "darkslateblue" - pointsize = 2 - - lodvarname = lodvarname ? data.lodnames[0] - data[lodvarname] = (Math.abs(x) for x in data[lodvarname]) # take absolute values - ylim = ylim ? [0, d3.max(data[lodvarname])] - if additive - data['additive'] = (Math.abs(x) for x in data['additive']) - additive_ylim = additive_ylim ? [0, d3.max(data['additive'])] - - lodvarnum = data.lodnames.indexOf(lodvarname) - - # Select the svg element, if it exists. - svg = d3.select(this).selectAll("svg").data([data]) - - # Otherwise, create the skeletal chart. - gEnter = svg.enter().append("svg").append("g") - - # Update the outer dimensions. - svg.attr("width", width+margin.left+margin.right) - .attr("height", height+margin.top+margin.bottom) - - # Update the inner dimensions. - g = svg.select("g") - - # box - g.append("rect") - .attr("x", margin.left) - .attr("y", margin.top) - .attr("height", height) - .attr("width", width) - .attr("fill", darkrect) - .attr("stroke", "none") - - yscale.domain(ylim) - .range([height+margin.top, margin.top+margin.inner]) - - # if yticks not provided, use nyticks to choose pretty ones - yticks = yticks ? yscale.ticks(nyticks) - - #if data['additive'].length > 0 - if additive - additive_yscale.domain(additive_ylim) - .range([height+margin.top, margin.top+margin.inner + height/2]) - - additive_yticks = additive_yticks ? additive_yscale.ticks(nyticks) - - # reorganize lod,pos by chromosomes - reorgLodData(data, lodvarname) - - # add chromosome scales (for x-axis) - data = chrscales(data, width, chrGap, margin.left, pad4heatmap) - xscale = data.xscale - - # chr rectangles - chrSelect = - g.append("g").attr("class", "chrRect") - .selectAll("empty") - .data(data.chrnames) - .enter() - .append("rect") - .attr("id", (d) -> "chrrect#{d[0]}") - .attr("x", (d,i) -> - return data.chrStart[i] if i==0 and pad4heatmap - data.chrStart[i]-chrGap/2) - .attr("width", (d,i) -> - return data.chrEnd[i] - data.chrStart[i]+chrGap/2 if (i==0 or i+1 == data.chrnames.length) and pad4heatmap - data.chrEnd[i] - data.chrStart[i]+chrGap) - .attr("y", margin.top) - .attr("height", height) - .attr("fill", (d,i) -> - return darkrect if i % 2 - - lightrect) - .attr("stroke", "none") - .on("click", (d) -> - console.log("d is:", d) - redraw_plot(d) - ) - - # x-axis labels - xaxis = g.append("g").attr("class", "x axis") - xaxis.selectAll("empty") - .data(data.chrnames) - .enter() - .append("text") - .text((d) -> d[0]) - .attr("x", (d,i) -> (data.chrStart[i]+data.chrEnd[i])/2) - .attr("y", margin.top+height+axispos.xlabel) - .attr("dominant-baseline", "hanging") - .attr("text-anchor", "middle") - .attr("cursor", "pointer") - .on("click", (d) -> - redraw_plot(d) - ) - - xaxis.append("text").attr("class", "title") - .attr("y", margin.top+height+axispos.xtitle) - .attr("x", margin.left+width/2) - .attr("fill", "slateblue") - .text(xlab) - - - redraw_plot = (chr_ob) -> - #console.log("chr_name is:", chr_ob[0]) - #console.log("chr_length is:", chr_ob[1]) - $('#topchart').remove() - $('#chart_container').append('
') - chr_plot = new Chr_Lod_Chart(600, 1200, chr_ob, manhattanPlot) - - # y-axis - rotate_ylab = rotate_ylab ? (ylab.length > 1) - yaxis = g.append("g").attr("class", "y axis") - yaxis.selectAll("empty") - .data(yticks) - .enter() - .append("line") - .attr("y1", (d) -> yscale(d)) - .attr("y2", (d) -> yscale(d)) - .attr("x1", margin.left) - .attr("x2", margin.left+7) - .attr("fill", "none") - .attr("stroke", "white") - .attr("stroke-width", 1) - .style("pointer-events", "none") - - yaxis.selectAll("empty") - .data(yticks) - .enter() - .append("text") - .attr("y", (d) -> yscale(d)) - .attr("x", margin.left-axispos.ylabel) - .attr("fill", "blue") - .attr("dominant-baseline", "middle") - .attr("text-anchor", "end") - .text((d) -> formatAxis(yticks)(d)) - - yaxis.append("text").attr("class", "title") - .attr("y", margin.top+height/2) - .attr("x", margin.left-axispos.ytitle) - .text(ylab) - .attr("transform", if rotate_ylab then "rotate(270,#{margin.left-axispos.ytitle},#{margin.top+height/2})" else "") - .attr("text-anchor", "middle") - .attr("fill", "slateblue") - - #if data['additive'].length > 0 - if additive - rotate_additive_ylab = rotate_additive_ylab ? (additive_ylab.length > 1) - additive_yaxis = g.append("g").attr("class", "y axis") - additive_yaxis.selectAll("empty") - .data(additive_yticks) - .enter() - .append("line") - .attr("y1", (d) -> additive_yscale(d)) - .attr("y2", (d) -> additive_yscale(d)) - .attr("x1", margin.left + width) - .attr("x2", margin.left + width - 7) - .attr("fill", "none") - .attr("stroke", "white") - .attr("stroke-width", 1) - .style("pointer-events", "none") - - additive_yaxis.selectAll("empty") - .data(additive_yticks) - .enter() - .append("text") - .attr("y", (d) -> additive_yscale(d)) - .attr("x", (d) -> margin.left + width + axispos.ylabel + 20) - .attr("fill", "green") - .attr("dominant-baseline", "middle") - .attr("text-anchor", "end") - .text((d) -> formatAxis(additive_yticks)(d)) - - additive_yaxis.append("text").attr("class", "title") - .attr("y", margin.top+1.5*height) - .attr("x", margin.left + width + axispos.ytitle) - .text(additive_ylab) - .attr("transform", if rotate_additive_ylab then "rotate(270,#{margin.left + width + axispos.ytitle}, #{margin.top+height*1.5})" else "") - .attr("text-anchor", "middle") - .attr("fill", "green") - - if 'suggestive' of data - suggestive_bar = g.append("g").attr("class", "suggestive") - suggestive_bar.selectAll("empty") - .data([data.suggestive]) - .enter() - .append("line") - .attr("y1", (d) -> yscale(d)) - .attr("y2", (d) -> yscale(d)) - .attr("x1", margin.left) - .attr("x2", margin.left+width) - .attr("fill", "none") - .attr("stroke", suggestivecolor) - .attr("stroke-width", 5) - .style("pointer-events", "none") - - suggestive_bar = g.append("g").attr("class", "significant") - suggestive_bar.selectAll("empty") - .data([data.significant]) - .enter() - .append("line") - .attr("y1", (d) -> yscale(d)) - .attr("y2", (d) -> yscale(d)) - .attr("x1", margin.left) - .attr("x2", margin.left+width) - .attr("fill", "none") - .attr("stroke", significantcolor) - .attr("stroke-width", 5) - .style("pointer-events", "none") - - if manhattanPlot == false - # lod curves by chr - lodcurve = (chr, lodcolumn) -> - d3.svg.line() - .x((d) -> xscale[chr](d)) - .y((d,i) -> yscale(data.lodByChr[chr][i][lodcolumn])) - - if additive - additivecurve = (chr, lodcolumn) -> - d3.svg.line() - .x((d) -> xscale[chr](d)) - .y((d,i) -> additive_yscale(data.additiveByChr[chr][i][lodcolumn])) - - curves = g.append("g").attr("id", "curves") - - for chr in data.chrnames - if chr.indexOf(data['chr']) - curves.append("path") - .datum(data.posByChr[chr[0]]) - .attr("d", lodcurve(chr[0], lodvarnum)) - .attr("stroke", lodlinecolor) - .attr("fill", "none") - .attr("stroke-width", linewidth) - .style("pointer-events", "none") - - if additive - for chr in data.chrnames - if chr.indexOf(data['chr']) - curves.append("path") - .datum(data.posByChr[chr[0]]) - .attr("d", additivecurve(chr[0], lodvarnum)) - .attr("stroke", additivelinecolor) - .attr("fill", "none") - .attr("stroke-width", 1) - .style("pointer-events", "none") - - # points at markers - console.log("before pointsize") - if pointsize > 0 - console.log("pointsize > 0 !!!") - markerpoints = g.append("g").attr("id", "markerpoints_visible") - markerpoints.selectAll("empty") - .data(data.markers) - .enter() - .append("circle") - .attr("cx", (d) -> xscale[d.chr](d.pos)) - .attr("cy", (d) -> yscale(d.lod)) - .attr("r", pointsize) - .attr("fill", pointcolor) - .attr("stroke", pointstroke) - .attr("pointer-events", "hidden") - - # title - titlegrp = g.append("g").attr("class", "title") - .append("text") - .attr("x", margin.left+width/2) - .attr("y", margin.top-titlepos) - .text(title) - - # another box around edge - g.append("rect") - .attr("x", margin.left) - .attr("y", margin.top) - .attr("height", height) - .attr("width", () -> - return(data.chrEnd[-1..][0]-margin.left) if pad4heatmap - data.chrEnd[-1..][0]-margin.left+chrGap/2) - .attr("fill", "none") - .attr("stroke", "black") - .attr("stroke-width", "none") - - if pointsAtMarkers - # these hidden points are what gets selected...a bit larger - hiddenpoints = g.append("g").attr("id", "markerpoints_hidden") - - markertip = d3.tip() - .attr('class', 'd3-tip') - .html((d) -> - [d.name, " LRS = #{d3.format('.2f')(d.lod)}"]) - .direction("e") - .offset([0,10]) - svg.call(markertip) - - markerSelect = - hiddenpoints.selectAll("empty") - .data(data.markers) - .enter() - .append("circle") - .attr("cx", (d) -> xscale[d.chr](d.pos)) - .attr("cy", (d) -> yscale(d.lod)) - .attr("id", (d) -> d.name) - .attr("r", d3.max([pointsize*2, 3])) - .attr("opacity", 0) - .attr("fill", pointcolor) - .attr("stroke", pointstroke) - .attr("stroke-width", "1") - .on "mouseover.paneltip", (d) -> - d3.select(this).attr("opacity", 1) - markertip.show(d) - .on "mouseout.paneltip", -> - d3.select(this).attr("opacity", 0) - .call(markertip.hide) - - ## configuration parameters - chart.width = (value) -> - return width unless arguments.length - width = value - chart - - chart.height = (value) -> - return height unless arguments.length - height = value - chart - - chart.margin = (value) -> - return margin unless arguments.length - margin = value - chart - - chart.titlepos = (value) -> - return titlepos unless arguments.length - titlepos - chart - - chart.axispos = (value) -> - return axispos unless arguments.length - axispos = value - chart - - chart.manhattanPlot = (value) -> - return manhattanPlot unless arguments.length - manhattanPlot = value - chart - - chart.ylim = (value) -> - return ylim unless arguments.length - ylim = value - chart - - #if data['additive'].length > 0 - chart.additive_ylim = (value) -> - return additive_ylim unless arguments.length - additive_ylim = value - chart - - chart.nyticks = (value) -> - return nyticks unless arguments.length - nyticks = value - chart - - chart.yticks = (value) -> - return yticks unless arguments.length - yticks = value - chart - - chart.chrGap = (value) -> - return chrGap unless arguments.length - chrGap = value - chart - - chart.darkrect = (value) -> - return darkrect unless arguments.length - darkrect = value - chart - - chart.lightrect = (value) -> - return lightrect unless arguments.length - lightrect = value - chart - - chart.linecolor = (value) -> - return linecolor unless arguments.length - linecolor = value - chart - - chart.linewidth = (value) -> - return linewidth unless arguments.length - linewidth = value - chart - - chart.pointcolor = (value) -> - return pointcolor unless arguments.length - pointcolor = value - chart - - chart.pointsize = (value) -> - return pointsize unless arguments.length - pointsize = value - chart - - chart.pointstroke = (value) -> - return pointstroke unless arguments.length - pointstroke = value - chart - - chart.title = (value) -> - return title unless arguments.length - title = value - chart - - chart.xlab = (value) -> - return xlab unless arguments.length - xlab = value - chart - - chart.ylab = (value) -> - return ylab unless arguments.length - ylab = value - chart - - chart.rotate_ylab = (value) -> - return rotate_ylab if !arguments.length - rotate_ylab = value - chart - - chart.lodvarname = (value) -> - return lodvarname unless arguments.length - lodvarname = value - chart - - chart.pad4heatmap = (value) -> - return pad4heatmap unless arguments.length - pad4heatmap = value - chart - - chart.pointsAtMarkers = (value) -> - return pointsAtMarkers unless arguments.length - pointsAtMarkers = value - chart - - chart.yscale = () -> - return yscale - - chart.additive = () -> - return additive - - #if data['additive'].length > 0 - chart.additive_yscale = () -> - return additive_yscale - - chart.xscale = () -> - return xscale - - if manhattanPlot == false - chart.lodcurve = () -> - return lodcurve - - #if data['additive'].length > 0 - chart.additivecurve = () -> - return additivecurve - - chart.markerSelect = () -> - return markerSelect - - chart.chrSelect = () -> - return chrSelect - - # return the chart function - chart - diff --git a/wqflask/wqflask/static/new/javascript/lodheatmap.coffee b/wqflask/wqflask/static/new/javascript/lodheatmap.coffee deleted file mode 100644 index 5f3716bc..00000000 --- a/wqflask/wqflask/static/new/javascript/lodheatmap.coffee +++ /dev/null @@ -1,265 +0,0 @@ -# lodheatmap: reuseable panel with heat map of LOD curves - -lodheatmap = () -> - width = 1200 - height = 600 - margin = {left:100, top:40, right:40, bottom: 40} - axispos = {xtitle:25, ytitle:30, xlabel:5, ylabel:5} - chrGap = 8 - titlepos = 20 - rectcolor = d3.rgb(230, 230, 230) - colors = ["slateblue", "black", "yellow"] - title = "" - xlab = "Chromosome" - ylab = "" - rotate_ylab = null - zlim = null - zthresh = null - xscale = d3.scale.linear() - yscale = d3.scale.linear() - zscale = d3.scale.linear() - cellSelect = null - - ## the main function - chart = (selection) -> - selection.each (data) -> - - data = reorgLodData(data) - data = chrscales(data, width, chrGap, margin.left, true) - xscale = data.xscale - - nlod = data.lodnames.length - yscale.domain([-0.5, nlod-0.5]).range([margin.top+height, margin.top]) - rectHeight = yscale(0)-yscale(1) - - xLR = {} - #console.log("data.posByChr:", data.posByChr["2"]) - #console.log("data.chrnames:", data.chrnames) - for chr in data.chrnames - #console.log("posByChr:", data.posByChr) - #console.log("chr is:", chr) - xLR[chr[0]] = getLeftRight(data.posByChr[chr[0]]) - - #console.log("xLR:", xLR) - - # z-axis (color) limits; if not provided, make symmetric about 0 - zmin = 0 - zmax = 0 - for lodcol in data.lodnames - extent = d3.extent(data[lodcol]) - zmin = extent[0] if extent[0] < zmin - zmax = extent[1] if extent[1] > zmax - zmax = -zmin if -zmin > zmax - zlim = zlim ? [-zmax, 0, zmax] - if zlim.length != colors.length - console.log("zlim.length (#{zlim.length}) != colors.length (#{colors.length})") - zscale.domain(zlim).range(colors) - - zthresh = zthresh ? zmin - 1 - - data.cells = [] - for chr_ob in data.chrnames - chr = chr_ob[0] - #console.log("xLR[chr]:", xLR[chr]) - for pos, i in data.posByChr[chr] - for lod,j in data.lodByChr[chr][i] - if lod >= zthresh or lod <= -zthresh - data.cells.push({z: lod, left: (xscale[chr](pos) + xscale[chr](xLR[chr][pos].left) )/2, - right: (xscale[chr](pos) + xscale[chr](xLR[chr][pos].right) )/2, lodindex:j, chr:chr, pos:pos}) - - # Select the svg element, if it exists. - svg = d3.select(this).selectAll("svg").data([data]) - - # Otherwise, create the skeletal chart. - gEnter = svg.enter().append("svg").append("g") - - # Update the outer dimensions. - svg.attr("width", width+margin.left+margin.right) - .attr("height", height+margin.top+margin.bottom) - - g = svg.select("g") - - # boxes - g.append("g").attr("id", "boxes").selectAll("empty") - .data(data.chrnames) - .enter() - .append("rect") - .attr("id", (d) -> "box#{d[0]}") - .attr("x", (d,i) -> data.chrStart[i]) - .attr("y", (d) -> margin.top) - .attr("height", height) - .attr("width", (d,i) -> data.chrEnd[i] - data.chrStart[i]) - .attr("fill", rectcolor) - .attr("stroke", "none") - - # title - titlegrp = g.append("g").attr("class", "title") - .append("text") - .attr("x", margin.left + width/2) - .attr("y", margin.top - titlepos) - .text(title) - - # x-axis - xaxis = g.append("g").attr("class", "x axis") - xaxis.selectAll("empty") - .data(data.chrnames) - .enter() - .append("text") - .attr("x", (d,i) -> (data.chrStart[i] + data.chrEnd[i])/2) - .attr("y", margin.top+height+axispos.xlabel) - .text((d) -> d[0]) - xaxis.append("text").attr("class", "title") - .attr("x", margin.left+width/2) - .attr("y", margin.top+height+axispos.xtitle) - .text(xlab) - - # y-axis - rotate_ylab = rotate_ylab ? (ylab.length > 1) - yaxis = g.append("g").attr("class", "y axis") - yaxis.append("text").attr("class", "title") - .attr("y", margin.top+height/2) - .attr("x", margin.left-axispos.ytitle) - .text(ylab) - .attr("transform", if rotate_ylab then "rotate(270,#{margin.left-axispos.ytitle},#{margin.top+height/2})" else "") - yaxis.selectAll("empty") - .data(data.lodnames) - .enter() - .append("text") - .attr("id", (d,i) -> "yaxis#{i}") - .attr("y", (d,i) -> yscale(i)) - .attr("x", margin.left-axispos.ylabel) - .text((d) -> d) - .attr("opacity", 0) - - celltip = d3.tip() - .attr('class', 'd3-tip') - .html((d) -> - z = d3.format(".2f")(Math.abs(d.z)) - p = d3.format(".1f")(d.pos) - "#{d.chr}@#{p} → #{z}") - .direction('e') - .offset([0,10]) - svg.call(celltip) - - cells = g.append("g").attr("id", "cells") - cellSelect = - cells.selectAll("empty") - .data(data.cells) - .enter() - .append("rect") - .attr("x", (d) -> d.left) - .attr("y", (d) -> yscale(d.lodindex)-rectHeight/2) - .attr("width", (d) -> d.right - d.left) - .attr("height", rectHeight) - .attr("class", (d,i) -> "cell#{i}") - .attr("fill", (d) -> zscale(d.z)) - .attr("stroke", "none") - .attr("stroke-width", "1") - .on("mouseover.paneltip", (d) -> - yaxis.select("text#yaxis#{d.lodindex}").attr("opacity", 1) - d3.select(this).attr("stroke", "black") - celltip.show(d)) - .on("mouseout.paneltip", (d) -> - yaxis.select("text#yaxis#{d.lodindex}").attr("opacity", 0) - d3.select(this).attr("stroke", "none") - celltip.hide()) - - # boxes - g.append("g").attr("id", "boxes").selectAll("empty") - .data(data.chrnames) - .enter() - .append("rect") - .attr("id", (d) -> "box#{d}") - .attr("x", (d,i) -> data.chrStart[i]) - .attr("y", (d) -> margin.top) - .attr("height", height) - .attr("width", (d,i) -> data.chrEnd[i] - data.chrStart[i]) - .attr("fill", "none") - .attr("stroke", "black") - .attr("stroke-width", "none") - - ## configuration parameters - chart.width = (value) -> - return width if !arguments.length - width = value - chart - - chart.height = (value) -> - return height if !arguments.length - height = value - chart - - chart.margin = (value) -> - return margin if !arguments.length - margin = value - chart - - chart.axispos = (value) -> - return axispos if !arguments.length - axispos = value - chart - - chart.titlepos = (value) -> - return titlepos if !arguments.length - titlepos - chart - - chart.rectcolor = (value) -> - return rectcolor if !arguments.length - rectcolor = value - chart - - chart.colors = (value) -> - return colors if !arguments.length - colors = value - chart - - chart.title = (value) -> - return title if !arguments.length - title = value - chart - - chart.xlab = (value) -> - return xlab if !arguments.length - xlab = value - chart - - chart.ylab = (value) -> - return ylab if !arguments.length - ylab = value - chart - - chart.rotate_ylab = (value) -> - return rotate_ylab if !arguments.length - rotate_ylab = value - chart - - chart.zthresh = (value) -> - return zthresh if !arguments.length - zthresh = value - chart - - chart.zlim = (value) -> - return zlim if !arguments.length - zlim = value - chart - - chart.chrGap = (value) -> - return chrGap if !arguments.length - chrGap = value - chart - - chart.xscale = () -> - return xscale - - chart.yscale = () -> - return yscale - - chart.zscale = () -> - return zscale - - chart.cellSelect = () -> - return cellSelect - - # return the chart function - chart \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/login.coffee b/wqflask/wqflask/static/new/javascript/login.coffee deleted file mode 100644 index 15dafd9a..00000000 --- a/wqflask/wqflask/static/new/javascript/login.coffee +++ /dev/null @@ -1,42 +0,0 @@ -$ -> - - - modalize = (event) -> - event.preventDefault() - console.log("in modal_replace:", $(this).attr("href")) - $.colorbox( - open: true - href: this.href - onComplete: -> - $(".focused").focus() - ) - - - - $(document).one("click", ".modalize", modalize) - console.log("Modalized click!!!") - - form_success = (data) -> - $.colorbox( - open: true - html: data - onComplete: -> - $("form").on("submit", submit_form) - ) - - - submit_form = (event) -> - event.preventDefault() - submit_to = $(this).attr('action') - data = $(this).serialize() - console.log("submit_to is:", submit_to) - $.ajax( - type: "POST" - url: submit_to - data: data - dataType: "html" - success: form_success - ) - - - $("#colorbox form").on("submit", submit_form) diff --git a/wqflask/wqflask/static/new/javascript/panelutil.coffee b/wqflask/wqflask/static/new/javascript/panelutil.coffee deleted file mode 100644 index f7b51457..00000000 --- a/wqflask/wqflask/static/new/javascript/panelutil.coffee +++ /dev/null @@ -1,356 +0,0 @@ -# A variety of utility functions used by the different panel functions - -# determine rounding of axis labels -formatAxis = (d, extra_digits=0) -> - d = d[1] - d[0] - ndig = Math.floor( Math.log(d % 10) / Math.log(10) ) - ndig = 0 if ndig > 0 - ndig = Math.abs(ndig) + extra_digits - d3.format(".#{ndig}f") - -# unique values of array (ignore nulls) -unique = (x) -> - output = {} - output[v] = v for v in x when v - output[v] for v of output - -# Pull out a variable (column) from a two-dimensional array -pullVarAsArray = (data, variable) -> - v = [] - for i of data - v = v.concat data[i][variable] - v - - -# reorganize lod/pos by chromosome -# lodvarname==null -> case for multiple LOD columns (lodheatmap) -# lodvarname provided -> case for one LOD column (lodchart) -reorgLodData = (data, lodvarname=null) -> - data.posByChr = {} - data.lodByChr = {} - - for chr,i in data.chrnames - if data.chr.indexOf(chr[0]) - data.posByChr[chr[0]] = [] - data.lodByChr[chr[0]] = [] - for pos, j in data.pos - if data.chr[j].toString() == chr[0] - data.posByChr[chr[0]].push(pos) - data.lodnames = [data.lodnames] unless Array.isArray(data.lodnames) - lodval = (data[lodcolumn][j] for lodcolumn in data.lodnames) - data.lodByChr[chr[0]].push(lodval) - - #console.log("data.posByChr:", data.posByChr) - - if lodvarname? - data.markers = [] - for marker,i in data.markernames - if marker != "" - data.markers.push({name:marker, chr:data.chr[i], pos:data.pos[i], lod:data[lodvarname][i]}) - - data - -# calculate chromosome start/end + scales, for heat map -chrscales = (data, width, chrGap, leftMargin, pad4heatmap) -> - # start and end of chromosome positions - chrStart = [] - chrEnd = [] - chrLength = [] - totalChrLength = 0 - maxd = 0 - for chr in data.chrnames - d = maxdiff(data.posByChr[chr[0]]) - maxd = d if d > maxd - - rng = d3.extent(data.posByChr[chr[0]]) - chrStart.push(rng[0]) - chrEnd.push(rng[1]) - L = rng[1] - rng[0] - chrLength.push(L) - totalChrLength += L - - # adjust lengths for heatmap - if pad4heatmap - data.recwidth = maxd - chrStart = chrStart.map (x) -> x-maxd/2 - chrEnd = chrEnd.map (x) -> x+maxd/2 - chrLength = chrLength.map (x) -> x+maxd - totalChrLength += (chrLength.length*maxd) - - # break up x axis into chromosomes by length, with gaps - data.chrStart = [] - data.chrEnd = [] - cur = leftMargin - cur += chrGap/2 unless pad4heatmap - data.xscale = {} - for chr,i in data.chrnames - data.chrStart.push(cur) - w = Math.round((width-chrGap*(data.chrnames.length-pad4heatmap))/totalChrLength*chrLength[i]) - data.chrEnd.push(cur + w) - cur = data.chrEnd[i] + chrGap - # x-axis scales, by chromosome - data.xscale[chr[0]] = d3.scale.linear() - .domain([chrStart[i], chrEnd[i]]) - .range([data.chrStart[i], data.chrEnd[i]]) - - # return data with new stuff added - data - - -# reorganize lod/pos by chromosome -# lodvarname==null -> case for multiple LOD columns (lodheatmap) -# lodvarname provided -> case for one LOD column (lodchart) -#reorgLodData = (data, lodvarname=null) -> -# data.posByChr = {} -# data.lodByChr = {} -# -# #console.log("data.chr", data.chr) -# #console.log("data.chrnames:", data.chrnames) -# the_chr = "0" -# for chr,i in data.chrnames -# data.posByChr[chr] = [] -# data.lodByChr[chr] = [] -# for pos,j in data.pos -# console.log("data.chr[j][0]:", data.chr[j][0]) -# if data.chr[j][0] == chr -# console.log("IS EQUAL") -# data.posByChr[chr].push(pos) -# data.lodnames = [data.lodnames] unless Array.isArray(data.lodnames) -# lodval = (data[lodcolumn][j] for lodcolumn in data.lodnames) -# data.lodByChr[chr].push(lodval) -# -# if lodvarname? -# data.markers = [] -# for marker,i in data.markernames -# if marker != "" -# data.markers.push({name:marker, chr:data.chr[i][0], pos:data.pos[i], lod:data[lodvarname][i]}) -# -# data - -# calculate chromosome start/end + scales, for heat map -#chrscales = (data, width, chrGap, leftMargin, pad4heatmap) -> -# # start and end of chromosome positions -# chrStart = [] -# chrEnd = [] -# chrLength = [] -# totalChrLength = 0 -# maxd = 0 -# for chr in data.chrnames -# d = maxdiff(data.posByChr[chr]) -# maxd = d if d > maxd -# -# rng = d3.extent(data.posByChr[chr]) -# chrStart.push(rng[0]) -# chrEnd.push(rng[1]) -# L = rng[1] - rng[0] -# chrLength.push(L) -# totalChrLength += L -# -# # adjust lengths for heatmap -# if pad4heatmap -# data.recwidth = maxd -# chrStart = chrStart.map (x) -> x-maxd/2 -# chrEnd = chrEnd.map (x) -> x+maxd/2 -# chrLength = chrLength.map (x) -> x+maxd -# totalChrLength += (chrLength.length*maxd) -# -# # break up x axis into chromosomes by length, with gaps -# data.chrStart = [] -# data.chrEnd = [] -# cur = leftMargin -# cur += chrGap/2 unless pad4heatmap -# data.xscale = {} -# for chr,i in data.chrnames -# data.chrStart.push(cur) -# w = Math.round((width-chrGap*(data.chrnames.length-pad4heatmap))/totalChrLength*chrLength[i]) -# data.chrEnd.push(cur + w) -# cur = data.chrEnd[i] + chrGap -# # x-axis scales, by chromosome -# data.xscale[chr] = d3.scale.linear() -# .domain([chrStart[i], chrEnd[i]]) -# .range([data.chrStart[i], data.chrEnd[i]]) -# -# # return data with new stuff added -# data - -# Select a set of categorical colors -# ngroup is positive integer -# palette = "dark" or "pastel" -selectGroupColors = (ngroup, palette) -> - return [] if ngroup == 0 - - if palette == "dark" - return ["slateblue"] if ngroup == 1 - return ["MediumVioletRed", "slateblue"] if ngroup == 2 - return colorbrewer.Set1[ngroup] if ngroup <= 9 - return d3.scale.category20().range()[0...ngroup] - else - return ["#bebebe"] if ngroup == 1 - return ["lightpink", "lightblue"] if ngroup == 2 - return colorbrewer.Pastel1[ngroup] if ngroup <= 9 - # below is rough attempt to make _big_ pastel palette - return ["#8fc7f4", "#fed7f8", "#ffbf8e", "#fffbb8", - "#8ce08c", "#d8ffca", "#f68788", "#ffd8d6", - "#d4a7fd", "#f5f0f5", "#cc968b", "#f4dcd4", - "#f3b7f2", "#f7f6f2", "#bfbfbf", "#f7f7f7", - "#fcfd82", "#fbfbcd", "#87feff", "#defaf5"][0...ngroup] - -# expand element/array (e.g., of colors) to a given length -# single elment -> array, then repeated to length n -expand2vector = (input, n) -> - return input unless input? # return null if null - return input if Array.isArray(input) and input.length >= n - input = [input] unless Array.isArray(input) - input = (input[0] for i of d3.range(n)) if input.length == 1 and n > 1 - input - -# median of a vector -median = (x) -> - return null if !x? - n = x.length - x.sort((a,b) -> a-b) - if n % 2 == 1 - return x[(n-1)/2] - (x[n/2] + x[(n/2)-1])/2 - -# given a vector of x's, return hash with values to left and right, and the differences -getLeftRight = (x) -> - n = x.length - x.sort( (a,b) -> a-b ) - - xdif = [] - result = {} - for v in x - result[v] = {} - - for i in [1...n] - #console.log("result:", result) - xdif.push(x[i]-x[i-1]) - result[x[i]].left = x[i-1] - for i in [0...(n-1)] - result[x[i]].right = x[i+1] - - xdif = median(xdif) - result.mediandiff = xdif - - result[x[0]].left = x[0]-xdif - result[x[n-1]].right = x[n-1]+xdif - result.extent = [x[0]-xdif/2, x[n-1]+xdif/2] - - result - -# maximum difference between adjacent values in a vector -maxdiff = (x) -> - return null if x.length < 2 - result = x[1] - x[0] - return result if x.length < 3 - for i in [2...x.length] - d = x[i] - x[i-1] - result = d if d > result - result - -# matrix extent, min max -matrixMin = (mat) -> - result = mat[0][0] - for i of mat - for j of mat[i] - result = mat[i][j] if result > mat[i][j] - result - -matrixMax = (mat) -> - result = mat[0][0] - for i of mat - for j of mat[i] - result = mat[i][j] if result < mat[i][j] - result - -matrixMaxAbs = (mat) -> - result = Math.abs(mat[0][0]) - for i of mat - for j of mat[i] - result = Math.abs(mat[i][j]) if result < mat[i][j] - result - -matrixExtent = (mat) -> [matrixMin(mat), matrixMax(mat)] - -d3.selection.prototype.moveToFront = () -> - this.each () -> this.parentNode.appendChild(this) - -d3.selection.prototype.moveToBack = () -> - this.each () -> - firstChild = this.parentNode.firstchild - this.parentNode.insertBefore(this, firstChild) if firstChild - -forceAsArray = (x) -> - return x unless x? # if null, return null - return x if Array.isArray(x) - [x] - -# any values in vec that appear in missing are made null -missing2null = (vec, missingvalues=['NA', '']) -> - vec.map (value) -> if missingvalues.indexOf(value) > -1 then null else value - -# display error at top of page -displayError = (message) -> - if d3.select("div.error").empty() # no errors yet - d3.select("body") - .insert("div", ":first-child") - .attr("class", "error") - d3.select("div.error") - .append("p") - .text(message) - -# sum values in an array -sumArray = (vec) -> (vec.reduce (a,b) -> a+b) - -# calculate cross-tabulation -calc_crosstab = (data) -> - nrow = data.ycat.length - ncol = data.xcat.length - - result = ((0 for col in [0..ncol]) for row in [0..nrow]) # matrix of 0's - - # count things up - for i of data.x - result[data.y[i]][data.x[i]] += 1 - - # row and column sums - rs = rowSums(result) - cs = colSums(result) - - # fill in column sums - for i in [0...ncol] - result[nrow][i] = cs[i] - - # fill in row sums - for i in [0...nrow] - result[i][ncol] = rs[i] - - # fill in total - result[nrow][ncol] = sumArray(rs) - - result - -# rowSums: the sums for each row -rowSums = (mat) -> (sumArray(x) for x in mat) - -# transpose: matrix transpose -transpose = (mat) -> ((mat[i][j] for i in [0...mat.length]) for j in [0...mat[0].length]) - -# colSums = the sums for each column -colSums = (mat) -> rowSums(transpose(mat)) - -# log base 2 -log2 = (x) -> - return(x) unless x? - Math.log(x)/Math.log(2.0) - -# log base 10 -log10 = (x) -> - return(x) unless x? - Math.log(x)/Math.log(10.0) - -# absolute value, preserving nulls -abs = (x) -> - return(x) unless x? - Math.abs(x) \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/password_strength.coffee b/wqflask/wqflask/static/new/javascript/password_strength.coffee deleted file mode 100644 index 0bee5836..00000000 --- a/wqflask/wqflask/static/new/javascript/password_strength.coffee +++ /dev/null @@ -1,33 +0,0 @@ -$ -> - - - $("#password").keyup -> - passtext = $(this).val() - result = zxcvbn(passtext) - if passtext.length < 6 - $("#password_strength").html('') - $("#password_alert").fadeOut() - else - word = word_score(result.score) - crack_time = result.crack_time_display - if crack_time == "instant" - crack_time = "a second" - display = "This is #{word} password. It can be cracked in #{crack_time}." - $("#password_strength").html(display) - $("#password_alert").fadeIn() - - - - word_score = (num_score) -> - num_score = parseInt(num_score) - console.log("num_score is:", num_score) - mapping = - 0: "a terrible" - 1: "a bad" - 2: "a mediocre" - 3: "a good" - 4: "an excellent" - console.log("mapping is:", mapping) - result = mapping[num_score] - console.log("result is:", result) - return result \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/scatterplot.coffee b/wqflask/wqflask/static/new/javascript/scatterplot.coffee deleted file mode 100644 index 008ab925..00000000 --- a/wqflask/wqflask/static/new/javascript/scatterplot.coffee +++ /dev/null @@ -1,430 +0,0 @@ -root = exports ? this - -scatterplot = () -> - width = 800 - height = 600 - margin = {left:60, top:40, right:40, bottom: 40, inner:5} - axispos = {xtitle:25, ytitle:45, xlabel:5, ylabel:5} - titlepos = 20 - xNA = {handle:true, force:false, width:15, gap:10} - yNA = {handle:true, force:false, width:15, gap:10} - xlim = null - ylim = null - nxticks = 5 - xticks = null - nyticks = 5 - yticks = null - rectcolor = d3.rgb(230, 230, 230) - pointcolor = null - pointstroke = "black" - pointsize = 3 # default = no visible points at markers - title = "Correlation Scatterplot" - xlab = "X" - ylab = "Y" - rotate_ylab = null - yscale = d3.scale.linear() - xscale = d3.scale.linear() - xvar = 0 - yvar = 1 - pointsSelect = null - dataByInd = false - - ## the main function - chart = (selection) -> - selection.each (data) -> - - if dataByInd - x = data.data.map (d) -> d[xvar] - y = data.data.map (d) -> d[yvar] - else # reorganize data - x = data.data[xvar] - y = data.data[yvar] - - console.log("x:", x) - console.log("y:", y) - - - # grab indID if it's there - # if no indID, create a vector of them - indID = data?.indID ? null - indID = indID ? [1..x.length] - - console.log("indID:", indID) - - # groups of colors - group = data?.group ? (1 for i in x) - ngroup = d3.max(group) - group = (g-1 for g in group) # changed from (1,2,3,...) to (0,1,2,...) - - # colors of the points in the different groups - pointcolor = pointcolor ? selectGroupColors(ngroup, "dark") - pointcolor = expand2vector(pointcolor, ngroup) - - # if all (x,y) not null - xNA.handle = false if x.every (v) -> (v?) and !xNA.force - yNA.handle = false if y.every (v) -> (v?) and !yNA.force - if xNA.handle - paneloffset = xNA.width + xNA.gap - panelwidth = width - paneloffset - else - paneloffset = 0 - panelwidth = width - if yNA.handle - panelheight = height - (yNA.width + yNA.gap) - else - panelheight = height - - xlim = xlim ? d3.extent(x) - ylim = ylim ? d3.extent(y) - - # I'll replace missing values something smaller than what's observed - na_value = d3.min(x.concat y) - 100 - - # Select the svg element, if it exists. - svg = d3.select(this).selectAll("svg").data([data]) - - # Otherwise, create the skeletal chart. - gEnter = svg.enter().append("svg").append("g") - - # Update the outer dimensions. - svg.attr("width", width+margin.left+margin.right) - .attr("height", height+margin.top+margin.bottom) - - g = svg.select("g") - - # box - g.append("rect") - .attr("x", paneloffset+margin.left) - .attr("y", margin.top) - .attr("height", panelheight) - .attr("width", panelwidth) - .attr("fill", rectcolor) - .attr("stroke", "none") - if xNA.handle - g.append("rect") - .attr("x", margin.left) - .attr("y", margin.top) - .attr("height", panelheight) - .attr("width", xNA.width) - .attr("fill", rectcolor) - .attr("stroke", "none") - if xNA.handle and yNA.handle - g.append("rect") - .attr("x", margin.left) - .attr("y", margin.top+height - yNA.width) - .attr("height", yNA.width) - .attr("width", xNA.width) - .attr("fill", rectcolor) - .attr("stroke", "none") - if yNA.handle - g.append("rect") - .attr("x", margin.left+paneloffset) - .attr("y", margin.top+height-yNA.width) - .attr("height", yNA.width) - .attr("width", panelwidth) - .attr("fill", rectcolor) - .attr("stroke", "none") - - # simple scales (ignore NA business) - xrange = [margin.left+paneloffset+margin.inner, margin.left+paneloffset+panelwidth-margin.inner] - yrange = [margin.top+panelheight-margin.inner, margin.top+margin.inner] - xscale.domain(xlim).range(xrange) - yscale.domain(ylim).range(yrange) - xs = d3.scale.linear().domain(xlim).range(xrange) - ys = d3.scale.linear().domain(ylim).range(yrange) - - # "polylinear" scales to handle missing values - if xNA.handle - xscale.domain([na_value].concat xlim) - .range([margin.left + xNA.width/2].concat xrange) - x = x.map (e) -> if e? then e else na_value - if yNA.handle - yscale.domain([na_value].concat ylim) - .range([height+margin.top-yNA.width/2].concat yrange) - y = y.map (e) -> if e? then e else na_value - - minx = xlim[0] - maxx = xlim[1] - - # if yticks not provided, use nyticks to choose pretty ones - yticks = yticks ? ys.ticks(nyticks) - xticks = xticks ? xs.ticks(nxticks) - - # title - titlegrp = g.append("g").attr("class", "title") - .append("text") - .attr("x", margin.left + width/2) - .attr("y", margin.top - titlepos) - .text(title) - - # x-axis - xaxis = g.append("g").attr("class", "x axis") - xaxis.selectAll("empty") - .data(xticks) - .enter() - .append("line") - .attr("x1", (d) -> xscale(d)) - .attr("x2", (d) -> xscale(d)) - .attr("y1", margin.top) - .attr("y2", margin.top+height) - .attr("fill", "none") - .attr("stroke", "white") - .attr("stroke-width", 1) - .style("pointer-events", "none") - xaxis.selectAll("empty") - .data(xticks) - .enter() - .append("text") - .attr("x", (d) -> xscale(d)) - .attr("y", margin.top+height+axispos.xlabel) - .text((d) -> formatAxis(xticks)(d)) - xaxis.append("text").attr("class", "title") - .attr("x", margin.left+width/2) - .attr("y", margin.top+height+axispos.xtitle) - .text(xlab) - if xNA.handle - xaxis.append("text") - .attr("x", margin.left+xNA.width/2) - .attr("y", margin.top+height+axispos.xlabel) - .text("N/A") - - # y-axis - rotate_ylab = rotate_ylab ? (ylab.length > 1) - yaxis = g.append("g").attr("class", "y axis") - yaxis.selectAll("empty") - .data(yticks) - .enter() - .append("line") - .attr("y1", (d) -> yscale(d)) - .attr("y2", (d) -> yscale(d)) - .attr("x1", margin.left) - .attr("x2", margin.left+width) - .attr("fill", "none") - .attr("stroke", "white") - .attr("stroke-width", 1) - .style("pointer-events", "none") - yaxis.selectAll("empty") - .data(yticks) - .enter() - .append("text") - .attr("y", (d) -> yscale(d)) - .attr("x", margin.left-axispos.ylabel) - .text((d) -> formatAxis(yticks)(d)) - yaxis.append("text").attr("class", "title") - .attr("y", margin.top+height/2) - .attr("x", margin.left-axispos.ytitle) - .text(ylab) - .attr("transform", if rotate_ylab then "rotate(270,#{margin.left-axispos.ytitle},#{margin.top+height/2})" else "") - if yNA.handle - yaxis.append("text") - .attr("x", margin.left-axispos.ylabel) - .attr("y", margin.top+height-yNA.width/2) - .text("N/A") - - indtip = d3.tip() - .attr('class', 'd3-tip') - .html((d,i) -> indID[i]) - .direction('e') - .offset([0,10]) - svg.call(indtip) - - - if js_data.slope and js_data.intercept - g.append("line") - .attr("x1", xscale(minx) - margin.inner) - .attr('y1', yscale(js_data.slope*minx+js_data.intercept)) - .attr("x2", xscale(maxx*1) + margin.inner) - .attr("y2", yscale(slope*maxx*1+intercept)) - .style("stroke", "black") - .style("stroke-width", 2) - - points = g.append("g").attr("id", "points") - pointsSelect = - points.selectAll("empty") - .data(d3.range(x.length)) - .enter() - .append("circle") - .attr("cx", (d,i) -> xscale(x[i])) - .attr("cy", (d,i) -> yscale(y[i])) - .attr("class", (d,i) -> "pt#{i}") - .attr("r", pointsize) - .attr("fill", (d,i) -> pointcolor[group[i]]) - .attr("stroke", pointstroke) - .attr("stroke-width", "1") - .attr("opacity", (d,i) -> - return 1 if (x[i]? or xNA.handle) and (y[i]? or yNA.handle) - return 0) - .on("mouseover.paneltip", indtip.show) - .on("mouseout.paneltip", indtip.hide) - - # box - g.append("rect") - .attr("x", margin.left+paneloffset) - .attr("y", margin.top) - .attr("height", panelheight) - .attr("width", panelwidth) - .attr("fill", "none") - .attr("stroke", "black") - .attr("stroke-width", "none") - if xNA.handle - g.append("rect") - .attr("x", margin.left) - .attr("y", margin.top) - .attr("height", panelheight) - .attr("width", xNA.width) - .attr("fill", "none") - .attr("stroke", "black") - .attr("stroke-width", "none") - if xNA.handle and yNA.handle - g.append("rect") - .attr("x", margin.left) - .attr("y", margin.top+height - yNA.width) - .attr("height", yNA.width) - .attr("width", xNA.width) - .attr("fill", "none") - .attr("stroke", "black") - .attr("stroke-width", "none") - if yNA.handle - g.append("rect") - .attr("x", margin.left+paneloffset) - .attr("y", margin.top+height-yNA.width) - .attr("height", yNA.width) - .attr("width", panelwidth) - .attr("fill", "none") - .attr("stroke", "black") - .attr("stroke-width", "none") - - ## configuration parameters - chart.width = (value) -> - return width if !arguments.length - width = value - chart - - chart.height = (value) -> - return height if !arguments.length - height = value - chart - - chart.margin = (value) -> - return margin if !arguments.length - margin = value - chart - - chart.axispos = (value) -> - return axispos if !arguments.length - axispos = value - chart - - chart.titlepos = (value) -> - return titlepos if !arguments.length - titlepos - chart - - chart.xlim = (value) -> - return xlim if !arguments.length - xlim = value - chart - - chart.nxticks = (value) -> - return nxticks if !arguments.length - nxticks = value - chart - - chart.xticks = (value) -> - return xticks if !arguments.length - xticks = value - chart - - chart.ylim = (value) -> - return ylim if !arguments.length - ylim = value - chart - - chart.nyticks = (value) -> - return nyticks if !arguments.length - nyticks = value - chart - - chart.yticks = (value) -> - return yticks if !arguments.length - yticks = value - chart - - chart.rectcolor = (value) -> - return rectcolor if !arguments.length - rectcolor = value - chart - - chart.pointcolor = (value) -> - return pointcolor if !arguments.length - pointcolor = value - chart - - chart.pointsize = (value) -> - return pointsize if !arguments.length - pointsize = value - chart - - chart.pointstroke = (value) -> - return pointstroke if !arguments.length - pointstroke = value - chart - - chart.dataByInd = (value) -> - return dataByInd if !arguments.length - dataByInd = value - chart - - chart.title = (value) -> - return title if !arguments.length - title = value - chart - - chart.xlab = (value) -> - return xlab if !arguments.length - xlab = value - chart - - chart.ylab = (value) -> - return ylab if !arguments.length - ylab = value - chart - - chart.rotate_ylab = (value) -> - return rotate_ylab if !arguments.length - rotate_ylab = value - chart - - chart.xvar = (value) -> - return xvar if !arguments.length - xvar = value - chart - - chart.yvar = (value) -> - return yvar if !arguments.length - yvar = value - chart - - chart.xNA = (value) -> - return xNA if !arguments.length - xNA = value - chart - - chart.yNA = (value) -> - return yNA if !arguments.length - yNA = value - chart - - chart.yscale = () -> - return yscale - - chart.xscale = () -> - return xscale - - chart.pointsSelect = () -> - return pointsSelect - - # return the chart function - chart - -root.scatterplot = scatterplot diff --git a/wqflask/wqflask/static/new/javascript/search_results.coffee b/wqflask/wqflask/static/new/javascript/search_results.coffee deleted file mode 100644 index e0cfc61a..00000000 --- a/wqflask/wqflask/static/new/javascript/search_results.coffee +++ /dev/null @@ -1,86 +0,0 @@ -$ -> - # These are also used by collections view - # So the name search_results in the filename is misleading - - checked_traits = null - - select_all = -> - console.log("selected_all") - $(".trait_checkbox").prop('checked', true) - - deselect_all = -> - $(".trait_checkbox").prop('checked', false) - - invert = -> - $(".trait_checkbox").trigger('click') - - add = -> - traits = $("#trait_table input:checked").map(-> return $(this).val()).get() - console.log("checked length is:", traits.length) - console.log("checked is:", traits) - $.colorbox({href:"/collections/add?traits=#{traits}"}) - - removed_traits = -> - # After we've removed the traits from the database we get rid of them in the table - console.log('in removed_traits with checked_traits:', checked_traits) - checked_traits.closest("tr").fadeOut() - - - change_buttons = -> - buttons = ["#add", "#remove"] - num_checked = $('.trait_checkbox:checked').length - console.log("num_checked is:", num_checked) - if (num_checked == 0) - for button in buttons - $(button).prop("disabled", true) - else - for button in buttons - $(button).prop("disabled", false) - - - if (num_checked > 1) - console.log("in loop") - for item in buttons - console.log(" processing item:", item) - text = $(item).html() - #if text.indexOf("Records") == -1 - # text = text.replace("Record", "Records") - # $(item).html(text) - else - console.log("in loop") - for item in buttons - console.log(" processing item:", item) - text = $(item).html() - #text = text.replace("Records", "Record") - #$(item).html(text) - - - # remove is only used by collections view - remove = -> - checked_traits = $("#trait_table input:checked") - traits = checked_traits.map(-> - return $(this).val()).get() - console.log("checked length is:", traits.length) - console.log("checked is:", traits) - uc_id = $("#uc_id").val() - console.log("uc.id is:", uc_id) - # Todo: Consider adding a failure message - $.ajax( - type: "POST" - url: "/collections/remove" - data: - uc_id: uc_id - traits: traits - success: removed_traits - ) - - - - $("#select_all").click(select_all) - $("#deselect_all").click(deselect_all) - $("#invert").click(invert) - $("#add").click(add) - $("#remove").click(remove) - - $('.trait_checkbox').click(change_buttons) - $('.btn').click(change_buttons) diff --git a/wqflask/wqflask/static/new/javascript/show_trait.coffee b/wqflask/wqflask/static/new/javascript/show_trait.coffee deleted file mode 100644 index 91aa15ba..00000000 --- a/wqflask/wqflask/static/new/javascript/show_trait.coffee +++ /dev/null @@ -1,476 +0,0 @@ -console.log("start_b") - -#root = exports ? this - -# this is our isNumber, do not confuse with the underscore.js one -is_number = (o) -> - return ! isNaN (o-0) && o != null - -Stat_Table_Rows = [ - { - vn: "n_of_samples" - pretty: "N of Samples" - digits: 0 - }, - { - vn: "mean" - pretty: "Mean" - digits: 2 - }, - { - vn: "median" - pretty: "Median" - digits: 2 - }, - { - vn: "std_error" - pretty: "Standard Error (SE)" - digits: 2 - }, - { - vn: "std_dev" - pretty: "Standard Deviation (SD)" - digits: 2 - }, - { - vn: "min" - pretty: "Minimum" - digits: 2 - }, - { - vn: "max" - pretty: "Maximum" - digits: 2 - }, - { - vn: "range" - pretty: "Range (log2)" - digits: 2 - }, - { - vn: "range_fold" - pretty: "Range (fold)" - digits: 2 - }, - { - vn: "interquartile" - pretty: "Interquartile Range" - url: "/glossary.html#Interquartile" - digits: 2 - } - ] - -$ -> - - add = -> - trait = $("input[name=trait_hmac]").val() - console.log("trait is:", trait) - $.colorbox({href:"/collections/add?traits=#{trait}"}) - - $('#add_to_collection').click(add) - - sample_lists = js_data.sample_lists - sample_group_types = js_data.sample_group_types - - d3.select("#select_compare_trait").on("click", => - $('.scatter-matrix-container').remove() - open_trait_selection() - ) - - d3.select("#clear_compare_trait").on("click", => - $('.scatter-matrix-container').remove() - ) - - open_trait_selection = () -> - $('#collections_holder').load('/collections/list?color_by_trait #collections_list', => - $.colorbox( - inline: true - href: "#collections_holder" - ) - #Removes the links from the collection names, because clicking them would leave the page - #instead of loading the list of traits in the colorbox - $('a.collection_name').attr( 'onClick', 'return false' ) - ) - - hide_tabs = (start) -> - for x in [start..10] - $("#stats_tabs" + x).hide() - - - # Changes stats table between all, bxd only and non-bxd, etc. - stats_mdp_change = -> - selected = $(this).val() - hide_tabs(0) - $("#stats_tabs" + selected).show() - - - change_stats_value = (sample_sets, category, value_type, decimal_places, effects) -> - id = "#" + process_id(category, value_type) - console.log("the_id:", id) - in_box = $(id).html - - current_value = parseFloat($(in_box)).toFixed(decimal_places) - - the_value = sample_sets[category][value_type]() - console.log("After running sample_sets, the_value is:", the_value) - if decimal_places > 0 - title_value = the_value.toFixed(decimal_places * 2) - the_value = the_value.toFixed(decimal_places) - else - title_value = null - - console.log("*-* the_value:", the_value) - console.log("*-* current_value:", current_value) - if the_value != current_value - console.log("object:", $(id).html(the_value)) - if effects - $(id).html(the_value).effect("highlight") - else - $(id).html(the_value) - - # We go ahead and always change the title value if we have it - if title_value - $(id).attr('title', title_value) - - - update_stat_values = (sample_sets)-> - show_effects = $(".tab-pane.active").attr("id") == "stats_tab" - for category in ['samples_primary', 'samples_other', 'samples_all'] - for row in Stat_Table_Rows - console.log("Calling change_stats_value") - change_stats_value(sample_sets, category, row.vn, row.digits, show_effects) - - redraw_histogram = -> - root.histogram.redraw((x.value for x in _.values(root.selected_samples[root.histogram_group]))) - - redraw_bar_chart = -> - root.bar_chart.redraw(root.selected_samples, root.bar_chart_group) - - redraw_prob_plot = -> - root.redraw_prob_plot_impl(root.selected_samples, root.prob_plot_group) - - make_table = -> - header = " " - console.log("js_data.sample_group_types:", js_data.sample_group_types) - for own key, value of js_data.sample_group_types - console.log("aa key:", key) - console.log("aa value:", value) - the_id = process_id("column", key) - header += """#{ value }""" - header += "" - console.log("windex header is:", header) - - #console.log("rows are:", rows) - the_rows = "" - #console.log("length of rows:", rows.length) - for row in Stat_Table_Rows - console.log("rowing") - row_line = """""" - if row.url? - row_line += """#{ row.pretty }""" - else - row_line += """#{ row.pretty }""" - console.log("box - js_data.sample_group_types:", js_data.sample_group_types) - for own key, value of js_data.sample_group_types - console.log("apple key:", key) - the_id = process_id(key, row.vn) - console.log("the_id:", the_id) - row_line += """foo""" - row_line += """""" - console.log("row line:", row_line) - the_rows += row_line - the_rows += "" - table = header + the_rows - console.log("table is:", table) - $("#stats_table").append(table) - - - process_id = (values...) -> - ### Make an id or a class valid javascript by, for example, eliminating spaces ### - processed = "" - for value in values - console.log("value:", value) - value = value.replace(" ", "_") - if processed.length - processed += "-" - processed += value - return processed - - edit_data_change = -> - already_seen = {} - sample_sets = - samples_primary: new Stats([]) - samples_other: new Stats([]) - samples_all: new Stats([]) - - root.selected_samples = # maps: sample name -> value - samples_primary: {} - samples_other: {} - samples_all: {} - - console.log("at beginning:", sample_sets) - - tables = ['samples_primary', 'samples_other'] - for table in tables - rows = $("#" + table).find('tr') - for row in rows - name = $(row).find('.edit_sample_sample_name').html() - name = $.trim(name) - real_value = $(row).find('.edit_sample_value').val() - #console.log("real_value:", real_value) - - checkbox = $(row).find(".edit_sample_checkbox") - checked = $(checkbox).prop('checked') - - if checked and is_number(real_value) and real_value != "" - #console.log("in the iffy if") - real_value = parseFloat(real_value) - - sample_sets[table].add_value(real_value) - - real_variance = $(row).find('.edit_sample_se').val() - if (is_number(real_variance)) - real_variance = parseFloat(real_variance) - else - real_variance = null - real_dict = {value: real_value, variance: real_variance} - root.selected_samples[table][name] = real_dict - - #console.log("checking name of:", name) - if not (name of already_seen) - #console.log("haven't seen") - sample_sets['samples_all'].add_value(real_value) - root.selected_samples['samples_all'][name] = real_dict - already_seen[name] = true - console.log("towards end:", sample_sets) - update_stat_values(sample_sets) - - console.log("redrawing histogram") - redraw_histogram() - - console.log("redrawing bar chart") - redraw_bar_chart() - - console.log("redrawing probability plot") - redraw_prob_plot() - - show_hide_outliers = -> - console.log("FOOBAR in beginning of show_hide_outliers") - label = $('#show_hide_outliers').val() - console.log("lable is:", label) - if label == "Hide Outliers" - $('#show_hide_outliers').val("Show Outliers") - else if label == "Show Outliers" - console.log("Found Show Outliers") - $('#show_hide_outliers').val("Hide Outliers") - console.log("Should be now Hide Outliers") - - ##Calculate Correlations Code - - on_corr_method_change = -> - console.log("in beginning of on_corr_method_change") - corr_method = $('select[name=corr_method]').val() - console.log("corr_method is:", corr_method) - $('.correlation_desc').hide() - $('#' + corr_method + "_r_desc").show().effect("highlight") - if corr_method == "lit" - $("#corr_sample_method_options").hide() - else - $("#corr_sample_method_options").show() - - $('select[name=corr_method]').change(on_corr_method_change) - - ##End Calculate Correlations Code - - ##Populate Samples Attribute Values Code - - create_value_dropdown = (value) -> - return """""" - - populate_sample_attributes_values_dropdown = -> - console.log("in beginning of psavd") - $('#attribute_values').empty() - sample_attributes = {} - for own key, attribute_info of js_data.attribute_names - sample_attributes[attribute_info.name] = attribute_info.distinct_values - console.log("[visa] attributes is:", sample_attributes) - selected_attribute = $('#exclude_menu').val().replace("_", " ") - console.log("selected_attribute is:", selected_attribute) - for value in sample_attributes[selected_attribute] - $(create_value_dropdown(value)) - .appendTo($('#attribute_values')) - - # Must run once at beginning - if js_data.attribute_names.length > 0 - populate_sample_attributes_values_dropdown() - $('#exclude_menu').change(populate_sample_attributes_values_dropdown) - - ##End Populate Samples Attribute Values Codess - - ##Block Samples By Attribute Value Code - block_by_attribute_value = -> - attribute_name = $('#exclude_menu').val() - exclude_by_value = $('#attribute_values').val() - - cell_class = ".column_name-#{attribute_name}" - $(cell_class).each (index, element) => - if $.trim($(element).text()) == exclude_by_value - row = $(element).parent('tr') - $(row).find(".trait_value_input").val("x") - - $('#exclude_group').click(block_by_attribute_value) - - ##End Block Samples By Attribute Value Code - - ##Block Samples By Index Code - - block_by_index = -> - index_string = $('#remove_samples_field').val() - index_list = [] - for index_set in index_string.split(",") - if index_set.indexOf('-') != -1 - try - start_index = parseInt(index_set.split("-")[0]) - end_index = parseInt(index_set.split("-")[1]) - index_list.push(index) for index in [start_index..end_index] - catch error - alert("Syntax error") - else - #try - index = parseInt(index_set) - console.log("index:", index) - index_list.push(index) - #catch(erro) - # alert("Syntax error") - console.log("index_list:", index_list) - for index in index_list - if $('#block_group').val() == "primary" - console.log("block_group:", $('#block_group').val()) - console.log("row:", $('#Primary_'+index.toString())) - $('#Primary_'+index.toString()).find('.trait_value_input').val("x") - else if $('#block_group').val() == "other" - console.log("block_group:", $('#block_group').val()) - console.log("row:", $('#Other_'+index.toString())) - $('#Other_'+index.toString()).find('.trait_value_input').val("x") - - $('#block_by_index').click(block_by_index) - - ##End Block Samples By Index Code - - ##Hide Sample Rows With No Value (value of 'x') Code - - hide_no_value = -> - $('.value_se').each (_index, element) => - if $(element).find('.trait_value_input').val() == 'x' - $(element).hide() - - $('#hide_no_value').click(hide_no_value) - - ##End Hide Sample Rows With No Value Code - - ##Block Outliers Code - block_outliers = -> - $('.outlier').each (_index, element) => - $(element).find('.trait_value_input').val('x') - - $('#block_outliers').click(block_outliers) - - ##End Block Outliers Code - - ##Reset Table Values Code - reset_samples_table = -> - $('.trait_value_input').each (_index, element) => - console.log("value is:", $(element).val()) - $(element).val($(element).data('value')) - console.log("data-value is:", $(element).data('value')) - $(element).parents('.value_se').show() - - $('#reset').click(reset_samples_table) - - ##End Reset Table Values Code - - ##Get Sample Data From Table Code - - get_sample_table_data = (table_name) -> - samples = [] - $('#' + table_name).find('.value_se').each (_index, element) => - row_data = {} - row_data.name = $.trim($(element).find('.column_name-Sample').text()) - row_data.value = $(element).find('.edit_sample_value').val() - if $(element).find('.edit_sample_se').length != -1 - row_data.se = $(element).find('.edit_sample_se').val() - for own key, attribute_info of js_data.attribute_names - row_data[attribute_info.name] = $.trim($(element).find( - '.column_name-'+attribute_info.name.replace(" ", "_")).text()) - console.log("row_data is:", row_data) - samples.push(row_data) - return samples - - ##End Get Sample Data from Table Code - - ##Export Sample Table Data Code - - export_sample_table_data = -> - sample_data = {} - sample_data.primary_samples = get_sample_table_data('samples_primary') - sample_data.other_samples = get_sample_table_data('samples_other') - console.log("sample_data is:", sample_data) - json_sample_data = JSON.stringify(sample_data) - console.log("json_sample_data is:", json_sample_data) - - $('input[name=export_data]').val(json_sample_data) - console.log("export_data is", $('input[name=export_data]').val()) - - format = $('#export_format').val() - if format == "excel" - $('#trait_data_form').attr('action', '/export_trait_excel') - else - $('#trait_data_form').attr('action', '/export_trait_csv') - console.log("action is:", $('#trait_data_form').attr('action')) - - $('#trait_data_form').submit() - - $('#export').click(export_sample_table_data) - - ##End Export Sample Table Data Code - - - console.log("before registering block_outliers") - $('#block_outliers').click(block_outliers) - console.log("after registering block_outliers") - - _.mixin(_.str.exports()); # Add string fuctions directly to underscore - - root.histogram_group = 'samples_primary' - root.histogram = new Histogram(sample_lists[0]) - $('.histogram_samples_group').val(root.histogram_group) - $('.histogram_samples_group').change -> - root.histogram_group = $(this).val() - redraw_histogram() - - root.bar_chart_group = 'samples_primary' - root.bar_chart = new Bar_Chart(sample_lists) - $('.bar_chart_samples_group').val(root.bar_chart_group) - $('.bar_chart_samples_group').change -> - root.bar_chart_group = $(this).val() - redraw_bar_chart() - - root.prob_plot_group = 'samples_primary' - $('.prob_plot_samples_group').val(root.prob_plot_group) - $('.prob_plot_samples_group').change -> - root.prob_plot_group = $(this).val() - redraw_prob_plot() - - make_table() - edit_data_change() # Set the values at the beginning - - $('#edit_sample_lists').change(edit_data_change) - - # bind additional handlers for pushing data updates - $('#block_by_index').click(edit_data_change) - $('#exclude_group').click(edit_data_change) - $('#block_outliers').click(edit_data_change) - $('#reset').click(edit_data_change) - - #$("#all-mean").html('foobar8') - console.log("end") diff --git a/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee b/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee deleted file mode 100644 index d14fb98c..00000000 --- a/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee +++ /dev/null @@ -1,241 +0,0 @@ -submit_special = -> - # Add submit_special class plus a data-url field to any button - # And it will submit to that url - # No js changes necessary - console.log("In submit_special") - console.log("this is:", this) - console.log("$(this) is:", $(this)) - url = $(this).data("url") - console.log("url is:", url) - $("#trait_data_form").attr("action", url); - $("#trait_data_form").submit() - -update_time_remaining = (percent_complete) -> - now = new Date() - period = now.getTime() - root.start_time - console.log("period is:", period) - if period > 8000 - total_seconds_remaining = (period / percent_complete * (100 - percent_complete))/1000 - minutes_remaining = Math.round(total_seconds_remaining / 60) - #seconds_remaining = Math.round(total_seconds_remaining % 60) - #console.log("seconds_remaining:", seconds_remaining) - if minutes_remaining < 3 - $('#time_remaining').text(Math.round(total_seconds_remaining) + " seconds remaining") - else - $('#time_remaining').text(minutes_remaining + " minutes remaining") - -get_progress = -> - console.log("temp_uuid:", $("#temp_uuid").val()) - temp_uuid = $("#temp_uuid").val() - params = { key:temp_uuid } - params_str = $.param(params) - url = "/get_temp_data?" + params_str - console.log("url:", url) - $.ajax( - type: "GET" - url: url - success: (progress_data) => - percent_complete = progress_data['percent_complete'] - console.log("in get_progress data:", progress_data) - - $('#marker_regression_progress').css("width", percent_complete + "%") - - if root.start_time - unless isNaN(percent_complete) - update_time_remaining(percent_complete) - else - root.start_time = new Date().getTime() - ) - return false - -##Block Outliers Code -block_outliers = -> - $('.outlier').each (_index, element) => - $(element).find('.trait_value_input').val('x') - -do_ajax_post = (url, form_data) -> - $.ajax( - type: "POST" - url: url - data: form_data - error: (xhr, ajaxOptions, thrownError) => - alert("Sorry, an error occurred") - console.log(xhr) - clearInterval(this.my_timer) - $('#progress_bar_container').modal('hide') - $('#static_progress_bar_container').modal('hide') - $("body").html("We got an error.") - success: (data) => - clearInterval(this.my_timer) - $('#progress_bar_container').modal('hide') - $('#static_progress_bar_container').modal('hide') - open_mapping_results(data) - #$("body").html(data) - ) - console.log("settingInterval") - - this.my_timer = setInterval(get_progress, 1000) - return false - -open_mapping_results = (data) -> - #results_window = window.open("/mapping_results_container") - #results_window.onload = -> - # results_window.document.getElementById("mapping_results_container").innerHTML = data - - $.colorbox( - html: data - href: "#mapping_results_holder" - height: "90%" - width: "90%" - onComplete: => - root.create_lod_chart() - - #Set filename - filename = "lod_chart_" + js_data.this_trait - - getSvgXml = -> - svg = $("#topchart").find("svg")[0] - (new XMLSerializer).serializeToString(svg) - - $("#exportform > #export").click => - svg_xml = getSvgXml() - form = $("#exportform") - form.find("#data").val(svg_xml) - form.find("#filename").val(filename) - form.submit() - - $("#exportpdfform > #export_pdf").click => - svg_xml = getSvgXml() - form = $("#exportpdfform") - form.find("#data").val(svg_xml) - form.find("#filename").val(filename) - form.submit() - ) - -outlier_text = "One or more outliers exist in this data set. Please review values before mapping. \ - Including outliers when mapping may lead to misleading results. \ - We recommend winsorising the outliers \ - or simply deleting them." - -showalert = (message,alerttype) -> - $('#alert_placeholder').append('
×'+message+'
') - - -$('#suggestive').hide() - -$('input[name=display_all]').change(() => - console.log("check") - if $('input[name=display_all]:checked').val() == "False" - $('#suggestive').show() - else - $('#suggestive').hide() -) - -$("#pylmm_mapping_compute").on("mouseover", => - if ( $(".outlier").length and $(".outlier-alert").length < 1 ) - showalert(outlier_text, "alert-success outlier-alert") -) - -$("#pylmm_compute").on("click", => - $("#progress_bar_container").modal() - url = "/marker_regression" - $('input[name=method]').val("pylmm") - $('input[name=num_perm]').val($('input[name=num_perm_pylmm]').val()) - $('input[name=manhattan_plot]').val($('input[name=manhattan_plot_pylmm]:checked').val()) - form_data = $('#trait_data_form').serialize() - console.log("form_data is:", form_data) - - #remove_outliers = confirm("Remove outliers?") - #if use_outliers == true - # block_outliers() - do_ajax_post(url, form_data) -) - - -$("#rqtl_geno_compute").on("click", => - $("#progress_bar_container").modal() - url = "/marker_regression" - $('input[name=method]').val("rqtl_geno") - $('input[name=num_perm]').val($('input[name=num_perm_rqtl_geno]').val()) - $('input[name=manhattan_plot]').val($('input[name=manhattan_plot_rqtl]:checked').val()) - $('input[name=control_marker]').val($('input[name=control_rqtl_geno]').val()) - form_data = $('#trait_data_form').serialize() - console.log("form_data is:", form_data) - - #remove_outliers = confirm("Remove outliers?") - #if use_outliers == true - # block_outliers() - do_ajax_post(url, form_data) -) - - -$("#plink_compute").on("click", => - $("#static_progress_bar_container").modal() - url = "/marker_regression" - $('input[name=method]').val("plink") - #$('input[name=mapping_display_all]').val($('input[name=display_all_plink]').val()) - #$('input[name=suggestive]').val($('input[name=suggestive_plink]').val()) - $('input[name=maf]').val($('input[name=maf_plink]').val()) - form_data = $('#trait_data_form').serialize() - console.log("form_data is:", form_data) - - do_ajax_post(url, form_data) -) - -$("#gemma_compute").on("click", => - console.log("RUNNING GEMMA") - $("#static_progress_bar_container").modal() - url = "/marker_regression" - $('input[name=method]').val("gemma") - #$('input[name=mapping_display_all]').val($('input[name=display_all_gemma]').val()) - #$('input[name=suggestive]').val($('input[name=suggestive_gemma]').val()) - $('input[name=maf]').val($('input[name=maf_gemma]').val()) - form_data = $('#trait_data_form').serialize() - console.log("form_data is:", form_data) - - do_ajax_post(url, form_data) -) - -$("#interval_mapping_compute").on("mouseover", => - if ( $(".outlier").length and $(".outlier-alert").length < 1 ) - showalert(outlier_text, "alert-success outlier-alert") -) - -$("#interval_mapping_compute").on("click", => - console.log("In interval mapping") - $("#progress_bar_container").modal() - url = "/interval_mapping" - - $('input[name=method]').val("reaper") - $('input[name=manhattan_plot]').val($('input[name=manhattan_plot_reaper]:checked').val()) - $('input[name=mapping_display_all]').val($('input[name=display_all_reaper]')) - $('input[name=suggestive]').val($('input[name=suggestive_reaper]')) - form_data = $('#trait_data_form').serialize() - console.log("form_data is:", form_data) - - do_ajax_post(url, form_data) -) - -#$(".submit_special").click(submit_special) - -composite_mapping_fields = -> - $(".composite_fields").toggle() -mapping_method_fields = -> - $(".mapping_method_fields").toggle() - - -$("#use_composite_choice").change(composite_mapping_fields) -$("#mapping_method_choice").change(mapping_method_fields) - - -#### Todo: Redo below so its like submit_special and requires no js hardcoding -toggle_enable_disable = (elem) -> - $(elem).prop("disabled", !$(elem).prop("disabled")) - -$("#choose_closet_control").change(-> - toggle_enable_disable("#control_locus") -) - -$("#display_all_lrs").change(-> - toggle_enable_disable("#suggestive_lrs") -); diff --git a/wqflask/wqflask/static/new/javascript/stats.coffee b/wqflask/wqflask/static/new/javascript/stats.coffee deleted file mode 100644 index bf79d6c3..00000000 --- a/wqflask/wqflask/static/new/javascript/stats.coffee +++ /dev/null @@ -1,71 +0,0 @@ -class Stats - constructor: (@the_values) -> - - add_value: (value) -> - @the_values.push(value) - - n_of_samples: -> - return @the_values.length - - sum: -> - total = 0 - total += value for value in @the_values - return total - - mean: -> - return @sum() / @n_of_samples() - - median: -> - is_odd = @the_values.length % 2 - median_position = Math.floor(@the_values.length / 2) - the_values_sorted = @the_values.sort((a,b) -> return a - b) - if is_odd - return the_values_sorted[median_position] - else - return (the_values_sorted[median_position] + - the_values_sorted[median_position - 1]) / 2 - - std_dev: -> - sum = 0 - for value in @the_values - step_a = Math.pow(value - @mean(), 2) - sum += step_a - step_b = sum / @the_values.length - return Math.sqrt(step_b) - - std_error: -> - return @std_dev() / Math.sqrt(@n_of_samples()) - - # We could also just use the first value here (and last in max) because we assume the - # lists are sorted for things like interquartile (and in fact they are) - min: -> - return Math.min(@the_values...) - - max: -> - return Math.max(@the_values...) - - range: -> - return @max() - @min() - - range_fold: -> - return Math.pow(2, @range()) - - interquartile: -> - length = @the_values.length - # Todo: Consider averaging q1 and a3 when the length is odd - console.log("in interquartile the_values are:", @the_values) - console.log("length is:", length) - q1 = @the_values[Math.floor(length * .25)] - q3 = @the_values[Math.floor(length * .75)] - iq = q3 - q1 - return Math.pow(2, iq) - - -bxd_only = new Stats([3, 5, 7, 8]) -console.log("[xred] bxd_only mean:", bxd_only.mean()) -console.log("[xgreen] bxd_only median:", bxd_only.median()) -console.log("[xpurple] bxd_only std_dev:", bxd_only.std_dev()) -console.log("[xmagenta] bxd_only std_error:", bxd_only.std_error()) -console.log("[xyellow] bxd_only min:", bxd_only.min()) - -window.Stats = Stats diff --git a/wqflask/wqflask/static/new/javascript/thank_you.coffee b/wqflask/wqflask/static/new/javascript/thank_you.coffee deleted file mode 100644 index 975f85c6..00000000 --- a/wqflask/wqflask/static/new/javascript/thank_you.coffee +++ /dev/null @@ -1,4 +0,0 @@ -$ -> - console.log("Starting transform") - $('#login_out').text('Sign out').attr('href', '/logout').removeClass('modalize') - console.log("Transformed to sign out I hope") diff --git a/wqflask/wqflask/static/new/javascript/validation.coffee b/wqflask/wqflask/static/new/javascript/validation.coffee deleted file mode 100644 index 901f8c7c..00000000 --- a/wqflask/wqflask/static/new/javascript/validation.coffee +++ /dev/null @@ -1,42 +0,0 @@ -$ -> - - remove_samples_is_valid = (input)-> - #Validate if input is empty or just white spaces - if _.trim(input).length == 0 - return true - splats = input.split(",") - new_splats = (_.trim(input) for input in splats) - console.log("new_splats:", new_splats) - pattern = /^\d+\s*(?:-\s*\d+)?\s*$/ #Pattern like 3, 10-15, 24 - for splat in new_splats - console.log("splat is:", splat) - if not splat.match(pattern) - return false - return true - - validate_remove_samples = -> - ### - Check if input for the remove samples function is valid and notify the user if not - ### - input = $('#remove_samples_field').val() - console.log("input is:", input) - if remove_samples_is_valid(input) - console.log("input is valid") - $('#remove_samples_invalid').hide() - else - console.log("input isn't valid") - $('#remove_samples_invalid').show() - - validate_pylmm_permutation = -> - ### - Check if number of permutations is high (and will take long to compute) - ### - input = $('input[name=num_perm_pylmm]').val() - console.log("input:", input) - if input > 20 - $('#permutations_alert').show() - else - $('#permutations_alert').hide() - - $('input[name=num_perm_pylmm]').change(validate_pylmm_permutation) - $('#remove_samples_field').change(validate_remove_samples) \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/validation.js b/wqflask/wqflask/static/new/javascript/validation.js index d5725c2d..6769b490 100644 --- a/wqflask/wqflask/static/new/javascript/validation.js +++ b/wqflask/wqflask/static/new/javascript/validation.js @@ -1,6 +1,6 @@ // Generated by CoffeeScript 1.8.0 $(function() { - var remove_samples_is_valid, validate_pylmm_permutation, validate_remove_samples; + var remove_samples_is_valid, validate_remove_samples; remove_samples_is_valid = function(input) { var new_splats, pattern, splat, splats, _i, _len; if (_.trim(input).length === 0) { @@ -43,20 +43,5 @@ $(function() { return $('#remove_samples_invalid').show(); } }; - validate_pylmm_permutation = function() { - - /* - Check if number of permutations is high (and will take long to compute) - */ - var input; - input = $('input[name=num_perm_pylmm]').val(); - console.log("input:", input); - if (input > 20) { - return $('#permutations_alert').show(); - } else { - return $('#permutations_alert').hide(); - } - }; - $('input[name=num_perm_pylmm]').change(validate_pylmm_permutation); return $('#remove_samples_field').change(validate_remove_samples); }); -- cgit v1.2.3