diff options
| author | Pjotr Prins | 2019-02-13 12:34:00 +0000 |
|---|---|---|
| committer | Pjotr Prins | 2019-02-13 12:34:00 +0000 |
| commit | ebfbd730ef30389f1484e2a134cbff7e10712e88 (patch) | |
| tree | 27799847c811d092eed9ca46b3f0255ad3864f4b | |
| parent | b6350b0d4cf6eb8002d40e86378d71e2823dacfb (diff) | |
| download | genenetwork2-ebfbd730ef30389f1484e2a134cbff7e10712e88.tar.gz | |
Remove all coffee files
30 files changed, 1 insertions, 5199 deletions
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 = '<svg height="15" width="120"> \ - <rect x="0" width="20" height="15" style="fill: rgb(0, 0, 0);"></rect> \ - <rect x="20" width="20" height="15" style="fill: rgb(50, 0, 0);"></rect> \ - <rect x="40" width="20" height="15" style="fill: rgb(100, 0, 0);"></rect> \ - <rect x="60" width="20" height="15" style="fill: rgb(150, 0, 0);"></rect> \ - <rect x="80" width="20" height="15" style="fill: rgb(200, 0, 0);"></rect> \ - <rect x="100" width="20" height="15" style="fill: rgb(255, 0, 0);"></rect> \ - </svg>' - 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('<div class="qtlcharts" id="topchart"></div>')
- 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('<div class="qtlcharts" id="topchart"></div>')
- 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('<div class="qtlcharts" id="topchart"></div>')
- #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 '<b style="font-size: 20px">' + obj.point.name + '</b>'
- )
-
- 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\
- "<span style='color:red'>"+pvalue+"</span>"
- 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("<h3>Normal probability plot</h3>"+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('<input type="hidden" name="samples" value="[' + samples.toString() + ']" />') - $('#hidden_inputs').append('<input type="hidden" name="vals" value="[' + vals.toString() + ']" />') - - this_trait_vals = get_this_trait_vals(samples) - - #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 = "<button id='back_to_collections' class='btn btn-inverse btn-small'>" - the_html += "<i class='icon-white icon-arrow-left'></i> Back </button>" - the_html += " <button id='submit' class='btn btn-primary btn-small'> Submit </button>" - - the_html += "<table class='table table-hover'>" - the_html += "<thead><tr><th></th><th>Record</th><th>Data Set</th><th>Description</th><th>Mean</th></tr></thead>" - the_html += "<tbody>" - for trait in trait_data - the_html += "<tr class='trait_line'>" - the_html += "<td class='select_trait'><input type='checkbox' name='selectCheck' class='checkbox edit_sample_checkbox'></td>" - the_html += "<td class='trait'>#{ trait.name }</td>" - the_html += "<td class='dataset'>#{ trait.dataset }</td>" - the_html += "<td>#{ trait.description }</td>" - the_html += "<td>#{ trait.mean or ' ' }</td></tr>" - the_html += "</tbody>" - the_html += "</table>" - - $("#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('<div class="qtlcharts" id="topchart"></div>') - 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 <strong>terrible</strong>" - 1: "a <strong>bad</strong>" - 2: "a <strong>mediocre</strong>" - 3: "a <strong>good</strong>" - 4: "an <strong>excellent</strong>" - 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 = "<thead><tr><th> </th>" - 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 += """<th id="#{ the_id }">#{ value }</th>""" - header += "</thead>" - console.log("windex header is:", header) - - #console.log("rows are:", rows) - the_rows = "<tbody>" - #console.log("length of rows:", rows.length) - for row in Stat_Table_Rows - console.log("rowing") - row_line = """<tr>""" - if row.url? - row_line += """<td id="#{ row.vn }"><a href="#{row.url }">#{ row.pretty }</a></td>""" - else - row_line += """<td id="#{ row.vn }">#{ row.pretty }</td>""" - 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 += """<td id="#{ the_id }">foo</td>""" - row_line += """</tr>""" - console.log("row line:", row_line) - the_rows += row_line - the_rows += "</tbody>" - 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 """<option val=#{value}>#{value}</option>""" - - 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 <A HREF=\"http://en.wikipedia.org/wiki/Winsorising\">winsorising</A> the outliers \ - or simply deleting them." - -showalert = (message,alerttype) -> - $('#alert_placeholder').append('<div id="alertdiv" class="alert ' + alerttype + '"><a class="close" data-dismiss="alert">×</a><span>'+message+'</span></div>') - - -$('#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); }); |