mirror of
https://github.com/galaxyproject/galaxy.git
synced 2026-09-24 16:30:27 +08:00
Trackster: add histogram max to FeatureTrack preferences and make histogram max inline editable. Pack scripts as well.
This commit is contained in:
@@ -18,7 +18,8 @@
|
||||
.overview-boxback{width:100%;bottom:0px;z-index:50;position:absolute;height:14px;background:#eee;border:solid #999 1px;}
|
||||
.overview-box{cursor:pointer;bottom:0px;z-index:100;position:absolute;margin-top:0px;height:14px;background:#C1C9E5 url(../images/visualization/draggable_horizontal.png) center center no-repeat;border:solid #666 1px;}
|
||||
.viewport-canvas{width:100%;height:100px;}
|
||||
.yaxislabel{color:#777;z-index:100;}
|
||||
.yaxislabel{z-index:101;}
|
||||
.yaxislabel.histogram-max{position:absolute;top:24px;left:10px;}
|
||||
.line-track .track-content{border-top:1px solid #eee;border-bottom:1px solid #eee;}
|
||||
.group-handle{cursor:move;float:left;background:#eee url('../images/tracks/block.png');width:12px;height:12px;}
|
||||
.group{min-height:20px;border-top:2px solid #888;border-bottom:2px solid #888;}
|
||||
|
||||
@@ -121,9 +121,15 @@
|
||||
}
|
||||
|
||||
.yaxislabel {
|
||||
color: #777;
|
||||
z-index: 100;
|
||||
/* Needs to be > canvas z-index. */
|
||||
z-index: 101;
|
||||
}
|
||||
.yaxislabel.histogram-max {
|
||||
position: absolute;
|
||||
top: 24px;
|
||||
left: 10px;
|
||||
}
|
||||
|
||||
/* Line track needs borders to show range */
|
||||
.line-track .track-content {
|
||||
border-top: 1px solid #eee;
|
||||
|
||||
@@ -345,7 +345,7 @@ function get_editable_text_elt(text, use_textarea, num_cols, num_rows, on_finish
|
||||
}
|
||||
|
||||
// Create div for element.
|
||||
var container = $("<div/>").addClass("editable-text").text(text).click(function() {
|
||||
var container = $("<div/>").addClass("editable-text").text(text).click(function(e) {
|
||||
// If there's already an input element, editing is active, so do nothing.
|
||||
if ($(this).children(":input").length > 0) {
|
||||
return;
|
||||
@@ -411,7 +411,10 @@ function get_editable_text_elt(text, use_textarea, num_cols, num_rows, on_finish
|
||||
}
|
||||
input_elt.focus();
|
||||
input_elt.select();
|
||||
});
|
||||
|
||||
// Do not propogate to elements below b/c that blurs input and prevents it from being used.
|
||||
e.stopPropagation();
|
||||
});
|
||||
return container;
|
||||
}
|
||||
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+24
-11
@@ -4163,6 +4163,7 @@ var FeatureTrack = function(name, view, container, hda_ldda, dataset_id, prefs,
|
||||
{ key: 'label_color', label: 'Label color', type: 'color', default_value: 'black' },
|
||||
{ key: 'show_counts', label: 'Show summary counts', type: 'bool', default_value: true,
|
||||
help: 'Show the number of items in each bin when drawing summary histogram' },
|
||||
{ key: 'histogram_max', label: 'Histogram maximum', type: 'float', default_value: null, help: 'clear value to set automatically' },
|
||||
{ key: 'connector_style', label: 'Connector style', type: 'select', default_value: 'fishbones',
|
||||
options: [ { label: 'Line with arrows', value: 'fishbone' }, { label: 'Arcs', value: 'arcs' } ] },
|
||||
{ key: 'mode', type: 'string', default_value: this.mode, hidden: true },
|
||||
@@ -4268,6 +4269,26 @@ extend(FeatureTrack.prototype, Drawable.prototype, TiledTrack.prototype, {
|
||||
track.update_icons();
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// If using SummaryTree tiles, show max and make it editable.
|
||||
//
|
||||
this.container_div.find(".yaxislabel").remove();
|
||||
var first_tile = tiles[0];
|
||||
if (first_tile instanceof SummaryTreeTile) {
|
||||
var
|
||||
max_val = (this.prefs.histogram_max ? this.prefs.histogram_max : first_tile.max_val),
|
||||
max_label =
|
||||
get_editable_text_elt(max_val, false, 12, 0, function(new_val) {
|
||||
var new_val = parseFloat(new_val);
|
||||
track.prefs.histogram_max = (!isNaN(new_val) ? new_val : null);
|
||||
track.tile_cache.clear();
|
||||
track.request_draw();
|
||||
})
|
||||
.addClass('yaxislabel histogram-max')
|
||||
.css("color", this.prefs.label_color);
|
||||
this.container_div.prepend(max_label);
|
||||
}
|
||||
},
|
||||
update_auto_mode: function( mode ) {
|
||||
var mode;
|
||||
@@ -4450,15 +4471,7 @@ extend(FeatureTrack.prototype, Drawable.prototype, TiledTrack.prototype, {
|
||||
left_offset = this.left_offset;
|
||||
|
||||
// Drawing the summary tree (feature coverage histogram)
|
||||
if (mode === "summary_tree" || mode === "Histogram") {
|
||||
// Add label to container div showing maximum count
|
||||
// TODO: this shouldn't be done at the tile level
|
||||
this.container_div.find(".yaxislabel").remove();
|
||||
var max_label = $("<div />").addClass('yaxislabel');
|
||||
max_label.text(result.max);
|
||||
max_label.css({ position: "absolute", top: "24px", left: "10px", color: this.prefs.label_color });
|
||||
max_label.prependTo(this.container_div);
|
||||
|
||||
if (mode === "summary_tree" || mode === "Histogram") {
|
||||
// Get summary tree data if necessary and set max if there is one.
|
||||
if (result.dataset_type != "summary_tree") {
|
||||
var st_data = this.get_summary_tree_data(result.data, tile_low, tile_high, 200);
|
||||
@@ -4516,7 +4529,6 @@ extend(FeatureTrack.prototype, Drawable.prototype, TiledTrack.prototype, {
|
||||
ctx.fillStyle = this.prefs.block_color;
|
||||
ctx.font = ctx.canvas.manager.default_font;
|
||||
ctx.textAlign = "right";
|
||||
this.container_div.find(".yaxislabel").remove();
|
||||
|
||||
if (result.data) {
|
||||
// Draw features.
|
||||
@@ -4587,6 +4599,7 @@ var ReadTrack = function (name, view, container, hda_ldda, dataset_id, prefs, fi
|
||||
{ key: 'show_insertions', label: 'Show insertions', type: 'bool', default_value: false },
|
||||
{ key: 'show_differences', label: 'Show differences only', type: 'bool', default_value: true },
|
||||
{ key: 'show_counts', label: 'Show summary counts', type: 'bool', default_value: true },
|
||||
{ key: 'histogram_max', label: 'Histogram maximum', type: 'float', default_value: null, help: 'Clear value to set automatically' },
|
||||
{ key: 'mode', type: 'string', default_value: this.mode, hidden: true },
|
||||
],
|
||||
saved_values: prefs,
|
||||
@@ -4894,7 +4907,7 @@ SummaryTreePainter.prototype.draw = function(ctx, width, height, w_scale) {
|
||||
var view_start = this.view_start,
|
||||
view_range = this.view_end - this.view_start,
|
||||
points = this.data.data,
|
||||
max = this.data.max,
|
||||
max = (this.prefs.histogram_max ? this.prefs.histogram_max : this.data.max),
|
||||
// Set base Y so that max label and data do not overlap. Base Y is where rectangle bases
|
||||
// start. However, height of each rectangle is relative to required_height; hence, the
|
||||
// max rectangle is required_height.
|
||||
|
||||
Reference in New Issue
Block a user