mirror of
https://github.com/galaxyproject/galaxy.git
synced 2026-09-24 16:30:27 +08:00
Tweaking trackster UI to fit Galaxy interface a little better (broke something with spacing though)
This commit is contained in:
James Taylor
@@ -68,8 +68,8 @@ $.extend( View.prototype, {
|
||||
// Minimum width for usability
|
||||
width: Math.max( 12, ( ( this.high - this.low ) / this.span ) * $("#overview-viewport").width() )
|
||||
}).show();
|
||||
$("#low").text( commatize(this.low) );
|
||||
$("#high").text( commatize(this.high) );
|
||||
$("#low").val( commatize(this.low) );
|
||||
$("#high").val( commatize(this.high) );
|
||||
for ( var i = 0, len = this.tracks.length; i < len; i++ ) {
|
||||
this.tracks[i].draw();
|
||||
}
|
||||
@@ -204,9 +204,11 @@ $.extend( LineTrack.prototype, TiledTrack.prototype, {
|
||||
chrom: track.view.chrom, low: null, high: null,
|
||||
dataset_id: track.dataset_id }, function ( data ) {
|
||||
if (!data || data == "error") {
|
||||
track.content_div.addClass("error").text(DATA_ERROR);
|
||||
track.container_div.addClass("error");
|
||||
track.content_div.text(DATA_ERROR);
|
||||
} else if (data == "no data") {
|
||||
track.content_div.addClass("nodata").text(DATA_NONE);
|
||||
track.container_div.addClass("nodata");
|
||||
track.content_div.text(DATA_NONE);
|
||||
} else {
|
||||
track.content_div.css( "height", track.height_px + "px" );
|
||||
track.min_value = data.min;
|
||||
@@ -298,9 +300,11 @@ $.extend( FeatureTrack.prototype, TiledTrack.prototype, {
|
||||
high: track.view.max_high, dataset_id: track.dataset_id,
|
||||
chrom: track.view.chrom }, function ( data ) {
|
||||
if (data == "error") {
|
||||
track.content_div.addClass("error").text(DATA_ERROR);
|
||||
track.container_div.addClass("error");
|
||||
track.content_div.text(DATA_ERROR);
|
||||
} else if (data.length === 0 || data == "no data") {
|
||||
track.content_div.addClass("nodata").text(DATA_NONE);
|
||||
track.container_div.addClass("nodata");
|
||||
track.content_div.text(DATA_NONE);
|
||||
} else {
|
||||
track.content_div.css( "height", track.height_px + "px" );
|
||||
track.values = data;
|
||||
|
||||
+49
-23
@@ -25,9 +25,25 @@ body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
input {
|
||||
font-size: 100%;
|
||||
}
|
||||
|
||||
#nav {
|
||||
padding: 0.5em 0;
|
||||
background:#cccccc;
|
||||
background-image:url(style/panel_header_bg.png);
|
||||
background-position:top center;
|
||||
background-repeat:repeat-x;border-top:solid #999 1px;
|
||||
color:#333;font-weight:bold;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
#nav-controls {
|
||||
padding: 15px 0;
|
||||
}
|
||||
*/
|
||||
#nav-controls a {
|
||||
color: white;
|
||||
padding: 0.1em 0.4em;
|
||||
@@ -37,6 +53,8 @@ body {
|
||||
-webkit-border-radius: 1em;
|
||||
-moz-border-radius: 1em;
|
||||
}
|
||||
|
||||
/*
|
||||
#low {
|
||||
margin-left: 0.1em;
|
||||
float: left;
|
||||
@@ -45,27 +63,30 @@ body {
|
||||
margin-right: 0.1em;
|
||||
float: right;
|
||||
}
|
||||
*/
|
||||
|
||||
#overview {
|
||||
width: 100%;
|
||||
margin: 0px;
|
||||
background: #333;
|
||||
color: white;
|
||||
}
|
||||
|
||||
#overview-viewport {
|
||||
height: 20px;
|
||||
position: relative;
|
||||
height: 14px;
|
||||
/* border-top: solid #666 1px;*/
|
||||
/* border-bottom: solid #aaa 1px;*/
|
||||
background: #888;
|
||||
background: white;
|
||||
border: solid grey 1px;
|
||||
margin: 5px;
|
||||
}
|
||||
#overview-box {
|
||||
position: absolute;
|
||||
margin-top: 1px;
|
||||
height: 16px;
|
||||
margin-top: 0px;
|
||||
height: 14px;
|
||||
background: grey;
|
||||
background: #ddd url(images/visualization/draggable_horizontal.png) center center no-repeat;
|
||||
border-style: outset;
|
||||
border-width: 1px;
|
||||
/*border-style: outset;*/
|
||||
}
|
||||
|
||||
#viewport {
|
||||
@@ -80,29 +101,25 @@ body {
|
||||
height: 100px;
|
||||
}
|
||||
.track {
|
||||
/* border-top: solid gray 1px;*/
|
||||
border-bottom: solid gray 1px;
|
||||
/* border-top: solid gray 1px; */
|
||||
/* border-bottom: solid gray 1px; */
|
||||
}
|
||||
|
||||
.track-header {
|
||||
text-align: center;
|
||||
padding: 2px 0;
|
||||
}
|
||||
|
||||
.track-content {
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.track-content.error {
|
||||
text-align: center;
|
||||
padding-top: 10px;
|
||||
.track.error {
|
||||
background-color: #ECB4AF;
|
||||
height: 30px;
|
||||
}
|
||||
.track-content.nodata {
|
||||
text-align: center;
|
||||
padding-top: 10px;
|
||||
.track.nodata {
|
||||
background-color: #ddd;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.loading {
|
||||
@@ -110,12 +127,21 @@ body {
|
||||
}
|
||||
|
||||
.label-track {
|
||||
font-weight: bold;
|
||||
font-size: 10px;
|
||||
background-color: #333;
|
||||
color: white;
|
||||
/* font-weight: bold; */
|
||||
/* font-size: 10px; */
|
||||
|
||||
}
|
||||
.label-track .label {
|
||||
border-left: solid gray 1px;
|
||||
padding-left: 2px;
|
||||
border-left: solid #999 1px;
|
||||
padding: 1px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#top-labeltrack {
|
||||
border-bottom: solid #999 1px;
|
||||
}
|
||||
|
||||
#nav-labeltrack {
|
||||
border-top: solid #999 1px;
|
||||
border-bottom: solid #999 1px;
|
||||
}
|
||||
|
||||
@@ -105,25 +105,24 @@ ${h.js( "jquery", "jquery.event.drag", "jquery.mousewheel", "lrucache", "trackst
|
||||
<div id="content">
|
||||
<div id="top-labeltrack"></div>
|
||||
<div id="viewport"></div>
|
||||
<div id="nav-labeltrack"></div>
|
||||
</div>
|
||||
<div id="nav">
|
||||
<div id="nav-labeltrack"></div>
|
||||
<div id="nav-controls">
|
||||
<form name="chr" id="chr" method="get">
|
||||
<select id="chrom" name="chrom" style="width: 15em;">
|
||||
<option value="">Loading</option>
|
||||
</select>
|
||||
<input id="low" size="12"></input>:<input id="high" size="12"></input>
|
||||
## <input type="hidden" name="dataset_ids" value="${dataset_ids}" />
|
||||
<input type="hidden" name="id" value="${id}" />
|
||||
<a href="#" onclick="javascript:view.zoom_in();view.redraw();">+</a>
|
||||
<a href="#" onclick="javascript:view.zoom_out();view.redraw();">-</a>
|
||||
</form>
|
||||
</div>
|
||||
<div id="overview">
|
||||
<div id="overview-viewport">
|
||||
<div id="overview-box"></div>
|
||||
</div>
|
||||
</div>
|
||||
<span id="low"></span>
|
||||
<span id="high"></span>
|
||||
<div id="nav-controls">
|
||||
<form name="chr" id="chr" method="get">
|
||||
<select id="chrom" name="chrom">
|
||||
<option value="">Loading</option>
|
||||
</select>
|
||||
## <input type="hidden" name="dataset_ids" value="${dataset_ids}" />
|
||||
<input type="hidden" name="id" value="${id}" />
|
||||
<a href="#" onclick="javascript:view.zoom_in();view.redraw();">+</a>
|
||||
<a href="#" onclick="javascript:view.zoom_out();view.redraw();">-</a>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user