Skip to content

Commit

Permalink
Merge branch 'release/0.6.1'
Browse files Browse the repository at this point in the history
  • Loading branch information
@abought
abought committed Oct 26, 2017
2 parents 972aa1b + 259d7dd commit 410f52f
Show file tree
Hide file tree
Showing 12 changed files with 114 additions and 18 deletions.
1 change: 1 addition & 0 deletions .travis.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ script:
branches:
only:
- master
- develop
notifications:
email:
- [email protected]
Expand Down
2 changes: 1 addition & 1 deletion assets/js/app/LocusZoom.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
* @namespace
*/
var LocusZoom = {
version: "0.6.0"
version: "0.6.1"
};

/**
Expand Down
11 changes: 11 additions & 0 deletions assets/js/app/Plot.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,13 @@ LocusZoom.Plot = function(id, datasource, layout) {
}
LocusZoom.Layouts.merge(this.layout, LocusZoom.Plot.DefaultLayout);

/**
* Values in the layout object may change during rendering etc. Retain a copy of the original plot state
* @member {Object}
*/
this._base_layout = JSON.parse(JSON.stringify(this.layout));


/**
* Create a shortcut to the state in the layout on the Plot. Tracking in the layout allows the plot to be created
* with initial state/setup.
Expand Down Expand Up @@ -558,6 +565,10 @@ LocusZoom.Plot.prototype.removePanel = function(id){

// Call positionPanels() to keep panels from overlapping and ensure filling all available vertical space
if (this.initialized){
// Allow the plot to shrink when panels are removed, by forcing it to recalculate min dimensions from scratch
this.layout.min_height = this._base_layout.min_height;
this.layout.min_width = this._base_layout.min_width;

this.positionPanels();
// An extra call to setDimensions with existing discrete dimensions fixes some rounding errors with tooltip
// positioning. TODO: make this additional call unnecessary.
Expand Down
2 changes: 1 addition & 1 deletion examples/covariates_model.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ <h4>Top Hits</h4>
// Define Data Sources
var apiBase = "https://portaldev.sph.umich.edu/api/v1/";
var data_sources = new LocusZoom.DataSources()
.add("assoc", ["AssociationLZ", {url: apiBase + "statistic/single/", params: {analysis: 3, id_field: "variant"}}])
.add("assoc", ["AssociationLZ", {url: apiBase + "statistic/single/", params: {analysis: 45, id_field: "variant"}}])
.add("ld", ["LDLZ" ,apiBase + "pair/LD/"])
.add("gene", ["GeneLZ", { url: apiBase + "annotation/genes/", params: {source: 2} }])
.add("recomb", ["RecombLZ", { url: apiBase + "annotation/recomb/results/", params: {source: 15} }])
Expand Down
2 changes: 1 addition & 1 deletion examples/interval_annotations.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ <h4>Top Hits</h4>
// Define Data Sources
var apiBase = "https://portaldev.sph.umich.edu/api/v1/";
var data_sources = new LocusZoom.DataSources()
.add("assoc", ["AssociationLZ", {url: apiBase + "statistic/single/", params: {analysis: 3, id_field: "variant"}}])
.add("assoc", ["AssociationLZ", {url: apiBase + "statistic/single/", params: {analysis: 45, id_field: "variant"}}])
.add("ld", ["LDLZ" ,apiBase + "pair/LD/"])
.add("gene", ["GeneLZ", { url: apiBase + "annotation/genes/", params: {source: 2} }])
.add("recomb", ["RecombLZ", { url: apiBase + "annotation/recomb/results/", params: {source: 15} }])
Expand Down
8 changes: 4 additions & 4 deletions examples/multiple_phenotypes_layered.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -96,10 +96,10 @@ <h4>Top Hits</h4>

// Define a set of studies/phenotypes and loop through them to add a data source and data layer for each one
var phenos = [
{ namespace: "fasting_glucose", title: "Fasting glucose meta-analysis", color: "rgb(212, 63, 58)", study_id: 23 },
{ namespace: "fasting_insulin", title: "Fasting insulin meta-analysis", color: "rgb(238, 162, 54)", study_id: 24 },
{ namespace: "triglycerides", title: "Triglycerides meta-analysis", color: "rgb(92, 184, 92)", study_id: 47 },
{ namespace: "cholesterol", title: "Total cholesterol meta-analysis", color: "rgb(53, 126, 189)", study_id: 48 }
{ namespace: "fasting_glucose", title: "Fasting glucose meta-analysis", color: "rgb(212, 63, 58)", study_id: 31 },
{ namespace: "fasting_insulin", title: "Fasting insulin meta-analysis", color: "rgb(238, 162, 54)", study_id: 32 },
{ namespace: "triglycerides", title: "Triglycerides meta-analysis", color: "rgb(92, 184, 92)", study_id: 29 },
{ namespace: "cholesterol", title: "Total cholesterol meta-analysis", color: "rgb(53, 126, 189)", study_id: 30 }
];
phenos.forEach(function(pheno){
data_sources.add(pheno.namespace, ["AssociationLZ", {url: apiBase + "statistic/single/", params: {analysis: pheno.study_id, id_field: "variant"}}]);
Expand Down
1 change: 1 addition & 0 deletions gulpfile.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ gulp.task("test", function () {
.on("error", function (err) {
console.error(err);
if (argv.force){
// Note: If running gulp via npm script, npm will intercept "--force" and not pass it to gulp
this.failed = true;
this.emit("end");
} else {
Expand Down
12 changes: 6 additions & 6 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -61,17 +61,17 @@ <h4>Top Hits</h4>
<a name="get_it"></a>
<h3>Get LocusZoom.js</h3>

<h5><strong>Current stable release: <a href="https://github.com/statgen/locuszoom/releases/tag/v0.6.0">v0.6.0</a></strong></h5>
<h5><strong>Current stable release: <a href="https://github.com/statgen/locuszoom/releases/tag/v0.6.1">v0.6.1</a></strong></h5>
<p>To use LocusZoom.js in your application you will need <i>both</i> LocusZoom's compiled Javascript and CSS <i>and</i> two third-party Javascript libraries (available here in a single vendor bundle).</p>

<div class="row">
<div class="three columns">
<h6><strong>Javascript</strong></h6>
</div>
<div class="nine columns">
<tt><a href="https://statgen.github.io/locuszoom/versions/0.6.0/locuszoom.app.js">https://statgen.github.io/locuszoom/versions/0.6.0/locuszoom.app.js</a></tt>
<tt><a href="https://statgen.github.io/locuszoom/versions/0.6.1/locuszoom.app.js">https://statgen.github.io/locuszoom/versions/0.6.1/locuszoom.app.js</a></tt>
<br>
<small><i>minified:</i> <tt><a href="https://statgen.github.io/locuszoom/versions/0.6.0/locuszoom.app.min.js">locuszoom.app.min.js</a></tt></small>
<small><i>minified:</i> <tt><a href="https://statgen.github.io/locuszoom/versions/0.6.1/locuszoom.app.min.js">locuszoom.app.min.js</a></tt></small>
</div>
</div>

Expand All @@ -82,7 +82,7 @@ <h6><strong>Javascript</strong></h6>
<h6><strong>CSS</strong></h6>
</div>
<div class="nine columns">
<tt><a href="https://statgen.github.io/locuszoom/versions/0.6.0/locuszoom.css">https://statgen.github.io/locuszoom/versions/0.6.0/locuszoom.css</a></tt>
<tt><a href="https://statgen.github.io/locuszoom/versions/0.6.1/locuszoom.css">https://statgen.github.io/locuszoom/versions/0.6.1/locuszoom.css</a></tt>
<br>
<small><i>All CSS classes are namespaced to avoid collisions</i></small>
</div>
Expand Down Expand Up @@ -185,15 +185,15 @@ <h6><strong>Covariates Model</strong></h6>
if (online){
apiBase = "https://portaldev.sph.umich.edu/api/v1/";
data_sources = new LocusZoom.DataSources()
.add("assoc", ["AssociationLZ", {url: apiBase + "statistic/single/", params: {analysis: 3, id_field: "variant"}}])
.add("assoc", ["AssociationLZ", {url: apiBase + "statistic/single/", params: {analysis: 45, id_field: "variant"}}])
.add("ld", ["LDLZ" ,apiBase + "pair/LD/"])
.add("gene", ["GeneLZ", { url: apiBase + "annotation/genes/", params: {source: 2} }])
.add("recomb", ["RecombLZ", { url: apiBase + "annotation/recomb/results/", params: {source: 15} }])
.add("constraint", ["GeneConstraintLZ", { url: "http://exac.broadinstitute.org/api/constraint" }]);
} else {
apiBase = window.location.origin + window.location.pathname.substr(0, window.location.pathname.lastIndexOf("/") + 1) + "staticdata/";
data_sources = new LocusZoom.DataSources()
.add("assoc", ["AssociationLZ", {url: apiBase + "assoc_10_114550452-115067678.json?", params: {analysis: 3, id_field: "variant"}}])
.add("assoc", ["AssociationLZ", {url: apiBase + "assoc_10_114550452-115067678.json?", params: {analysis: 45, id_field: "variant"}}])
.add("ld", ["LDLZ", { url: apiBase + "ld_10_114550452-115067678.json?" }])
.add("gene", ["GeneLZ", { url: apiBase + "genes_10_114550452-115067678.json?" }])
.add("recomb", ["RecombLZ", { url: apiBase + "recomb_10_114550452-115067678.json?" }])
Expand Down
13 changes: 12 additions & 1 deletion locuszoom.app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@
* @namespace
*/
var LocusZoom = {
version: "0.6.0"
version: "0.6.1"
};

/**
Expand Down Expand Up @@ -8347,6 +8347,13 @@ LocusZoom.Plot = function(id, datasource, layout) {
}
LocusZoom.Layouts.merge(this.layout, LocusZoom.Plot.DefaultLayout);

/**
* Values in the layout object may change during rendering etc. Retain a copy of the original plot state
* @member {Object}
*/
this._base_layout = JSON.parse(JSON.stringify(this.layout));


/**
* Create a shortcut to the state in the layout on the Plot. Tracking in the layout allows the plot to be created
* with initial state/setup.
Expand Down Expand Up @@ -8823,6 +8830,10 @@ LocusZoom.Plot.prototype.removePanel = function(id){

// Call positionPanels() to keep panels from overlapping and ensure filling all available vertical space
if (this.initialized){
// Allow the plot to shrink when panels are removed, by forcing it to recalculate min dimensions from scratch
this.layout.min_height = this._base_layout.min_height;
this.layout.min_width = this._base_layout.min_width;

this.positionPanels();
// An extra call to setDimensions with existing discrete dimensions fixes some rounding errors with tooltip
// positioning. TODO: make this additional call unnecessary.
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "locuszoom",
"version": "0.6.0",
"version": "0.6.1",
"description": "Generate interactive visualizations of statistical genetic data",
"keywords": [
"visualization",
Expand Down
4 changes: 2 additions & 2 deletions plot_builder.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@ <h2>LocusZoom Plot Builder</h2>
// Define LocusZoom Data Sources object
var apiBase = "http://portaldev.sph.umich.edu/api/v1/";
var data_sources = new LocusZoom.DataSources()
.add("base", ["AssociationLZ", {url:apiBase + "statistic/single/", params: { analysis: 3, id_field: "variant" }}])
.add("assoc", ["AssociationLZ", {url:apiBase + "statistic/single/", params: { analysis: 45, id_field: "variant" }}])
.add("ld", ["LDLZ", apiBase + "pair/LD/"])
.add("gene", ["GeneLZ", { url: apiBase + "annotation/genes/", params: { source: 2 } }])
.add("recomb", ["RecombLZ", { url: apiBase + "annotation/recomb/results/", params: {source: 15} }])
Expand All @@ -102,7 +102,7 @@ <h2>LocusZoom Plot Builder</h2>

function addAnalysis(){
var ns = "a" + Math.floor(Math.random()*Math.pow(10,8));
var analysis = [23, 24, 25][Math.floor(Math.random()*3)];
var analysis = [31,36,35,33][Math.floor(Math.random()*3)];
var assoc_source = [ "AssociationLZ",
{ url: apiBase + "statistic/single/",
params: {
Expand Down
74 changes: 73 additions & 1 deletion test/Plot.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -231,7 +231,7 @@ describe("LocusZoom.Plot", function(){
d3.select("body").append("div").attr("id", "plot");
this.plot = LocusZoom.populate("#plot", datasources, layout);
});
it("Should adjust the size of the plot if a single panel is added that does not completely fill it", function(){
it("Should adjust the size of the panel if a single panel is added that does not completely fill min_height", function(){
var panelA = { id: "panelA", width: 100, height: 50 };
this.plot.addPanel(panelA);
var svg = d3.select("#plot svg");
Expand Down Expand Up @@ -286,6 +286,78 @@ describe("LocusZoom.Plot", function(){
this.plot.panels.panelB.layout.origin.y.should.be.exactly(0);
this.plot.sumProportional("height").should.be.exactly(1);
});
it("Should resize the plot as panels are removed, when panels specify min_height", function() {
// Regression test for a reported edge case where `min_height` caused resizing logic to work differently

// Small hack; resize the plot after it was created
this.plot.layout.min_height = this.plot._base_layout.min_height = 600;
this.plot.layout.height = this.plot._base_layout.height = 600;
this.plot.layout.width = this.plot._base_layout.width = 800;
this.plot.layout.min_width = this.plot._base_layout.min_width = 800;
this.plot.layout.responsive_resize = this.plot._base_layout.responsive_resize = true;

// These numbers are based on a real plot. Expected behavior is chosen to match behavior of a layout where
// panels had no min_height specified.
var panelA = { id: "panelA", width: 800, height: 300, min_height: 300 };
var panelB = { id: "panelB", width: 800, height: 50, min_height: 50 };
var panelC = { id: "panelC", width: 800, height: 225, min_height: 112.5 };

// Set up the scenario
this.plot.addPanel(panelA);
this.plot.addPanel(panelB);
this.plot.addPanel(panelC);

this.plot.removePanel("panelC");
// Check dimensions. Some checks are approximate due to floating point rounding issues.
this.plot.layout.width.should.be.exactly(800, "Plot width is incorrect");
this.plot.layout.height.should.be.approximately(650, 0.000001, "Plot height is incorrect");

this.plot.panels.panelB.layout.width.should.be.exactly(800, "Panel B width is incorrect");
this.plot.panels.panelB.layout.height.should.be.exactly(50, "Panel B height is incorrect");
// When the overall plot specifies a min_height larger than any panel, the final resizing of the panels
// must respect that setting. Thus, panels A and B will not have the same relative proportions
// after panel C is removed.
this.plot.panels.panelA.layout.proportional_height.should.be.approximately(600/650, 0.000001, "Panel A proportional height is incorrect");
this.plot.panels.panelB.layout.proportional_height.should.be.approximately(50/650, 0.000001, "Panel B proportional height is incorrect");
this.plot.panels.panelB.layout.proportional_origin.y.should.be.exactly(1 - 50/650, "Panel B proportional_origin.y is incorrect");
this.plot.panels.panelB.layout.origin.y.should.be.exactly(600, "Panel B origin.y is incorrect");
this.plot.sumProportional("height").should.be.approximately(1, 0.000001, "Total height should be 1");
});
it("Should resize the plot while retaining panel proportions when panel is removed, if plot min_height does not take precedence", function() {
// When we remove a panel, we often want the plot to shrink by exactly that size. (so that the bottom
// section simply disappears without changing the appearance of the panels that remain) But if plot
// min_height is larger than any one panel, the space actually gets reallocated, and the remaining
// panels stretch or shrink.
// This test ensures that we will see the desired behavior when plot min_height isn't dominant.
var panelA = { id: "panelA", width: 800, height: 300, min_height: 300 };
var panelB = { id: "panelB", width: 800, height: 50, min_height: 50 };
var panelC = { id: "panelC", width: 800, height: 225, min_height: 112.5 };

// Set up the scenario
this.plot.addPanel(panelA);
this.plot.addPanel(panelB);
this.plot.addPanel(panelC);

// Verify that panel A and B adopt a specific proportion (when 3 panels are present)
this.plot.panels.panelA.layout.height.should.be.exactly(300, "Panel A height is incorrect (before)");
this.plot.panels.panelB.layout.height.should.be.exactly(50, "Panel B height is incorrect (before)");

this.plot.removePanel("panelC");
// Check dimensions. Some checks are approximate due to floating point rounding issues.
this.plot.layout.width.should.be.exactly(800, "Plot width is incorrect");
this.plot.layout.height.should.be.exactly(350, "Plot height is incorrect");

// Panels A and B will have the same size and relative proportions after resize as before
this.plot.panels.panelA.layout.height.should.be.exactly(300, "Panel A height is incorrect (after)");
this.plot.panels.panelB.layout.height.should.be.exactly(50, "Panel B height is incorrect (after)");
this.plot.panels.panelB.layout.width.should.be.exactly(800, "Panel B width is incorrect");

this.plot.panels.panelA.layout.proportional_height.should.be.approximately(300/350, 0.000001, "Panel A proportional height is incorrect");
this.plot.panels.panelB.layout.proportional_height.should.be.approximately(50/350, 0.000001, "Panel B proportional height is incorrect");
this.plot.panels.panelB.layout.proportional_origin.y.should.be.approximately(1 - 50/350, 0.000001, "Panel B proportional_origin.y is incorrect");
this.plot.panels.panelB.layout.origin.y.should.be.exactly(300, "Panel B origin.y is incorrect");
this.plot.sumProportional("height").should.be.approximately(1, 0.000001, "Total proportional height should be 1");
});
it("Should allow for inserting panels at discrete y indexes", function(){
var panelA = { id: "panelA", width: 100, height: 60 };
var panelB = { id: "panelB", idth: 100, height: 60 };
Expand Down

0 comments on commit 410f52f

Please sign in to comment.