diff options
8 files changed, 137 insertions, 145 deletions
diff --git a/wqflask/wqflask/static/new/javascript/create_lodchart.coffee b/wqflask/wqflask/static/new/javascript/create_lodchart.coffee index 76be5490..f1da65d7 100644 --- a/wqflask/wqflask/static/new/javascript/create_lodchart.coffee +++ b/wqflask/wqflask/static/new/javascript/create_lodchart.coffee @@ -44,8 +44,8 @@ create_manhattan_plot = -> d3.select(this) .transition().duration(500).attr("r", r*3) .transition().duration(500).attr("r", r) - -create_manhattan_plot() + +root.create_manhattan_plot = create_manhattan_plot $("#export").click => #Get d3 SVG element diff --git a/wqflask/wqflask/static/new/javascript/create_lodchart.js b/wqflask/wqflask/static/new/javascript/create_lodchart.js index f61f05bd..546d7c18 100644 --- a/wqflask/wqflask/static/new/javascript/create_lodchart.js +++ b/wqflask/wqflask/static/new/javascript/create_lodchart.js @@ -1,73 +1,76 @@ -// Generated by CoffeeScript 1.8.0 -var create_manhattan_plot; +// Generated by CoffeeScript 1.9.2 +(function() { + var create_manhattan_plot; -create_manhattan_plot = function() { - var additive, chrrect, data, h, halfh, margin, mychart, totalh, totalw, w; - 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' in js_data) { - additive = js_data.additive; - } else { - additive = false; - } - console.log("js_data:", js_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); - chrrect = mychart.chrSelect(); - chrrect.on("mouseover", function() { - return d3.select(this).attr("fill", "#E9CFEC"); - }).on("mouseout", function(d, i) { - return d3.select(this).attr("fill", function() { - if (i % 2) { - return "#F1F1F9"; - } - return "#FBFBFF"; + create_manhattan_plot = function() { + var additive, chrrect, data, h, halfh, margin, mychart, totalh, totalw, w; + 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' in js_data) { + additive = js_data.additive; + } else { + additive = false; + } + console.log("js_data:", js_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); + chrrect = mychart.chrSelect(); + chrrect.on("mouseover", function() { + return d3.select(this).attr("fill", "#E9CFEC"); + }).on("mouseout", function(d, i) { + return d3.select(this).attr("fill", function() { + if (i % 2) { + return "#F1F1F9"; + } + return "#FBFBFF"; + }); + }); + return mychart.markerSelect().on("click", function(d) { + var r; + r = d3.select(this).attr("r"); + return d3.select(this).transition().duration(500).attr("r", r * 3).transition().duration(500).attr("r", r); }); - }); - return mychart.markerSelect().on("click", function(d) { - var r; - r = d3.select(this).attr("r"); - return d3.select(this).transition().duration(500).attr("r", r * 3).transition().duration(500).attr("r", r); - }); -}; + }; -create_manhattan_plot(); + root.create_manhattan_plot = create_manhattan_plot; -$("#export").click((function(_this) { - return function() { - var filename, form, svg, svg_xml; - svg = $("#topchart").find("svg")[0]; - svg_xml = (new XMLSerializer).serializeToString(svg); - console.log("svg_xml:", svg_xml); - filename = "manhattan_plot_" + js_data.this_trait; - form = $("#exportform"); - form.find("#data").val(svg_xml); - form.find("#filename").val(filename); - return form.submit(); - }; -})(this)); + $("#export").click((function(_this) { + return function() { + var filename, form, svg, svg_xml; + svg = $("#topchart").find("svg")[0]; + svg_xml = (new XMLSerializer).serializeToString(svg); + console.log("svg_xml:", svg_xml); + filename = "manhattan_plot_" + js_data.this_trait; + form = $("#exportform"); + form.find("#data").val(svg_xml); + form.find("#filename").val(filename); + return form.submit(); + }; + })(this)); -$("#export_pdf").click((function(_this) { - return function() { - var filename, form, svg, svg_xml; - svg = $("#topchart").find("svg")[0]; - svg_xml = (new XMLSerializer).serializeToString(svg); - console.log("svg_xml:", svg_xml); - filename = "manhattan_plot_" + js_data.this_trait; - form = $("#exportpdfform"); - form.find("#data").val(svg_xml); - form.find("#filename").val(filename); - return form.submit(); - }; -})(this)); + $("#export_pdf").click((function(_this) { + return function() { + var filename, form, svg, svg_xml; + svg = $("#topchart").find("svg")[0]; + svg_xml = (new XMLSerializer).serializeToString(svg); + console.log("svg_xml:", svg_xml); + filename = "manhattan_plot_" + js_data.this_trait; + form = $("#exportpdfform"); + form.find("#data").val(svg_xml); + form.find("#filename").val(filename); + return form.submit(); + }; + })(this)); + +}).call(this); diff --git a/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee b/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee index 9e070c97..29a637ee 100755 --- a/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee +++ b/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.coffee @@ -76,14 +76,13 @@ do_ajax_post = (url, form_data) -> return false open_mapping_results = (data) -> - results_window = window.open() - $(results_window.document.body).html(data) - #$.colorbox( - # html: data - # href: "#mapping_results_holder" - # height: "90%" - # width: "90%" - #) + $.colorbox( + html: data + href: "#mapping_results_holder" + height: "90%" + width: "90%" + onComplete: => root.create_manhattan_plot() + ) showalert = (message,alerttype) -> $('#alert_placeholder').append('<div id="alertdiv" class="alert ' + alerttype + '"><a class="close" data-dismiss="alert">×</a><span>'+message+'</span></div>') @@ -119,7 +118,7 @@ $('input[name=display_all]').change(() => ) $("#pylmm_compute").on("click", => - #$("#progress_bar_container").modal() + $("#progress_bar_container").modal() url = "/marker_regression" $('input[name=method]').val("pylmm") $('input[name=num_perm]').val($('input[name=num_perm_pylmm]').val()) diff --git a/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.js b/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.js index cc1ddf37..03862cf8 100755 --- a/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.js +++ b/wqflask/wqflask/static/new/javascript/show_trait_mapping_tools.js @@ -1,4 +1,4 @@ -// Generated by CoffeeScript 1.8.0 +// Generated by CoffeeScript 1.9.2 (function() { var block_outliers, composite_mapping_fields, do_ajax_post, get_progress, mapping_method_fields, open_mapping_results, showalert, submit_special, toggle_enable_disable, update_time_remaining; @@ -97,9 +97,17 @@ }; open_mapping_results = function(data) { - var results_window; - results_window = window.open(); - return $(results_window.document.body).html(data); + return $.colorbox({ + html: data, + href: "#mapping_results_holder", + height: "90%", + width: "90%", + onComplete: (function(_this) { + return function() { + return root.create_manhattan_plot(); + }; + })(this) + }); }; showalert = function(message, alerttype) { @@ -139,6 +147,7 @@ $("#pylmm_compute").on("click", (function(_this) { return function() { var form_data, url; + $("#progress_bar_container").modal(); url = "/marker_regression"; $('input[name=method]').val("pylmm"); $('input[name=num_perm]').val($('input[name=num_perm_pylmm]').val()); diff --git a/wqflask/wqflask/templates/base.html b/wqflask/wqflask/templates/base.html index 30519e24..78682710 100755 --- a/wqflask/wqflask/templates/base.html +++ b/wqflask/wqflask/templates/base.html @@ -1,3 +1,4 @@ +{% from "base_macro.html" import header, flash_me, timeago %} <!DOCTYPE HTML> <html lang="en"> <html xmlns="http://www.w3.org/1999/xhtml"> @@ -19,37 +20,6 @@ </head> -{% macro header(main, second) %} - <header class="jumbotron subhead" id="overview" > - <div class="container"> - <h1>{{ main }}</h1> - <p class="lead"> - {{ second }} - </p> - </div> - </header> - - {{ flash_me() }} -{% endmacro %} - - -{% macro flash_me() -%} - {% with messages = get_flashed_messages(with_categories=true) %} - {% if messages %} - <div class="container"> - {% for category, message in messages %} - <div class="alert {{ category }}">{{ message }}</div> - {% endfor %} - </div> - {% endif %} - {% endwith %} -{% endmacro %} - -{% macro timeago(timestamp) %} -<time class="timeago" datetime="{{ timestamp }}">{{ timestamp }}</time> -{% endmacro %} - - <body style="width: 1500px !important;"> <!-- Navbar ================================================== --> diff --git a/wqflask/wqflask/templates/base_macro.html b/wqflask/wqflask/templates/base_macro.html new file mode 100644 index 00000000..c2905ebe --- /dev/null +++ b/wqflask/wqflask/templates/base_macro.html @@ -0,0 +1,28 @@ +{% macro flash_me() -%} + {% with messages = get_flashed_messages(with_categories=true) %} + {% if messages %} + <div class="container"> + {% for category, message in messages %} + <div class="alert {{ category }}">{{ message }}</div> + {% endfor %} + </div> + {% endif %} + {% endwith %} +{% endmacro %} + +{% macro header(main, second) %} + <header class="jumbotron subhead" id="overview" > + <div class="container"> + <h1>{{ main }}</h1> + <p class="lead"> + {{ second }} + </p> + </div> + </header> + + {{ flash_me() }} +{% endmacro %} + +{% macro timeago(timestamp) %} +<time class="timeago" datetime="{{ timestamp }}">{{ timestamp }}</time> +{% endmacro %} diff --git a/wqflask/wqflask/templates/marker_regression.html b/wqflask/wqflask/templates/marker_regression.html index 62146662..0cd004cd 100755 --- a/wqflask/wqflask/templates/marker_regression.html +++ b/wqflask/wqflask/templates/marker_regression.html @@ -1,16 +1,5 @@ -{% extends "base.html" %} -{% block title %}Interval Mapping{% endblock %} -{% block css %} - <link rel="stylesheet" type="text/css" href="/static/new/css/marker_regression.css" /> - <link rel="stylesheet" type="text/css" href="/static/new/css/show_trait.css" /> - <link rel="stylesheet" type="text/css" href="/static/new/packages/DataTables/css/jquery.dataTables.css" /> - <link rel="stylesheet" type="text/css" href="/static/packages/DT_bootstrap/DT_bootstrap.css" /> - <link rel="stylesheet" type="text/css" href="/static/packages/TableTools/media/css/TableTools.css" /> - <link rel="stylesheet" type="text/css" href="/static/new/css/d3-tip.min.css" /> - <link rel="stylesheet" type="text/css" href="/static/new/css/panelutil.css" /> -{% endblock %} -{% block content %} <!-- Start of body --> - +{% from "base_macro.html" import header %} +{% block content %} {{ header("Mapping", '{}: {}'.format(this_trait.name, this_trait.description_fmt)) }} @@ -76,22 +65,6 @@ js_data = {{ js_data | safe }} </script> - <script language="javascript" type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/js_external/d3-tip.min.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/packages/jsPDF/libs/FileSaver.js/FileSaver.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/packages/jsPDF/libs/Blob.js/BlobBuilder.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/packages/jsPDF/jspdf.plugin.standard_fonts_metrics.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/packages/jsPDF/jspdf.plugin.from_html.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/javascript/panelutil.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/javascript/chr_lod_chart.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/javascript/lod_chart.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/javascript/create_lodchart.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/jquery.dataTables.min.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/dataTables.scientific.js"></script> - <script language="javascript" type="text/javascript" src="/static/packages/DT_bootstrap/DT_bootstrap.js"></script> - <script language="javascript" type="text/javascript" src="/static/packages/TableTools/media/js/TableTools.min.js"></script> - <script language="javascript" type="text/javascript" src="/static/packages/underscore/underscore-min.js"></script> - <script type="text/javascript" charset="utf-8"> $(document).ready( function () { console.time("Creating table"); @@ -118,4 +91,4 @@ console.timeEnd("Creating table"); }); </script> -{% endblock %}
\ No newline at end of file +{% endblock %} diff --git a/wqflask/wqflask/templates/show_trait.html b/wqflask/wqflask/templates/show_trait.html index ca530162..cdde5d9d 100755 --- a/wqflask/wqflask/templates/show_trait.html +++ b/wqflask/wqflask/templates/show_trait.html @@ -12,6 +12,8 @@ <link rel="stylesheet" type="text/css" href="/static/new/packages/nvd3/nv.d3.min.css" /> <link rel="stylesheet" type="text/css" href="/static/new/packages/DataTables/css/jquery.dataTables.css" /> <link rel="stylesheet" type="text/css" href="/static/packages/DT_bootstrap/DT_bootstrap.css" /> + <link rel="stylesheet" type="text/css" href="/static/packages/TableTools/media/css/TableTools.css" /> + {% endblock %} {% block content %} <!-- Start of body --> @@ -133,8 +135,16 @@ <script type="text/javascript" src="/static/new/javascript/show_trait.js"></script> <script type="text/javascript" src="/static/new/javascript/get_traits_from_collection.js"></script> <script type="text/javascript" src="/static/new/javascript/validation.js"></script> - + <script language="javascript" type="text/javascript" src="/static/new/packages/jsPDF/libs/FileSaver.js/FileSaver.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/packages/jsPDF/libs/Blob.js/BlobBuilder.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/packages/jsPDF/jspdf.plugin.standard_fonts_metrics.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/packages/jsPDF/jspdf.plugin.from_html.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/javascript/chr_lod_chart.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/javascript/create_lodchart.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/javascript/lod_chart.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/jquery.dataTables.min.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/dataTables.scientific.js"></script> <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/dataTables.naturalSort.js"></script> <script language="javascript" type="text/javascript" src="/static/packages/DT_bootstrap/DT_bootstrap.js"></script> <script language="javascript" type="text/javascript" src="/static/packages/TableTools/media/js/TableTools.min.js"></script> |