[galaxy-dev] [hg] galaxy 3419: trackster:

24 Feb 2010

details:   http://www.bx.psu.edu/hg/galaxy/rev/1e23f73647bb
changeset: 3419:1e23f73647bb
user:      Kanwei Li <kanwei@gmail.com>
date:      Fri Feb 19 17:54:44 2010 -0500
description:
trackster:
- Refactor
- Focus on new browser text
- Fixed linetrack bug when switching chroms

diffstat:

 static/scripts/packed/trackster.js |    2 +-
 static/scripts/trackster.js        |  152 +++++++++++++++++-------------------
 templates/tracks/browser.mako      |   13 +-
 templates/tracks/new_browser.mako  |    2 +-
 4 files changed, 83 insertions(+), 86 deletions(-)

diffs (313 lines):

diff -r 879432079138 -r 1e23f73647bb static/scripts/packed/trackster.js

--- a/static/scripts/packed/trackster.js	Fri Feb 19 14:34:25 2010 -0500
+++ b/static/scripts/packed/trackster.js	Fri Feb 19 17:54:44 2010 -0500
@@ -1,1 +1,1 @@
-var DEBUG=false;var DENSITY=1000,FEATURE_LEVELS=10,DATA_ERROR="There was an error in indexing this dataset.",DATA_NONE="No data for this chrom/contig.",DATA_PENDING="Currently indexing... please wait",DATA_LOADING="Loading data...",CACHED_TILES_FEATURE=10,CACHED_TILES_LINE=30,CACHED_DATA=20,CONTEXT=$("<canvas></canvas>").get(0).getContext("2d"),RIGHT_STRAND,LEFT_STRAND;var right_img=new Image();right_img.src="../images/visualization/strand_right.png";right_img.onload=function(){RIGHT_STRAND=CONTEXT.createPattern(right_img,"repeat")};var left_img=new Image();left_img.src="../images/visualization/strand_left.png";left_img.onload=function(){LEFT_STRAND=CONTEXT.createPattern(left_img,"repeat")};var right_img_inv=new Image();right_img_inv.src="../images/visualization/strand_right_inv.png";right_img_inv.onload=function(){RIGHT_STRAND_INV=CONTEXT.createPattern(right_img_inv,"repeat")};var left_img_inv=new Image();left_img_inv.src="../images/visualization/strand_left_inv.png";left_!
 img_inv.onload=function(){LEFT_STRAND_INV=CONTEXT.createPattern(left_img_inv,"repeat")};function commatize(b){b+="";var a=/(\d+)(\d{3})/;while(a.test(b)){b=b.replace(a,"$1,$2")}return b}var Cache=function(a){this.num_elements=a;this.clear()};$.extend(Cache.prototype,{get:function(b){var a=this.key_ary.indexOf(b);if(a!=-1){this.key_ary.splice(a,1);this.key_ary.push(b)}return this.obj_cache[b]},set:function(b,c){if(!this.obj_cache[b]){if(this.key_ary.length>=this.num_elements){var a=this.key_ary.shift();delete this.obj_cache[a]}this.key_ary.push(b)}this.obj_cache[b]=c;return c},clear:function(){this.obj_cache={};this.key_ary=[]}});var View=function(b,d,c,a){this.vis_id=c;this.dbkey=a;this.title=d;this.chrom=b;this.tracks=[];this.label_tracks=[];this.max_low=0;this.max_high=0;this.center=(this.max_high-this.max_low)/2;this.zoom_factor=3;this.zoom_level=0;this.track_id_counter=0};$.extend(View.prototype,{add_track:function(a){a.view=this;a.track_id=this.track_id_counter;this.tr!
 acks.push(a);if(a.init){a.init()}a.container_div.attr("id","track_"+a.
track_id);this.track_id_counter+=1},add_label_track:function(a){a.view=this;this.label_tracks.push(a)},remove_track:function(a){a.container_div.fadeOut("slow",function(){$(this).remove()});delete this.tracks[a]},update_options:function(){var b=$("ul#sortable-ul").sortable("toArray");var d=[];var c=$("#viewport > div").sort(function(g,f){return b.indexOf($(g).attr("id"))>b.indexOf($(f).attr("id"))});$("#viewport > div").remove();$("#viewport").html(c);for(var e in view.tracks){var a=view.tracks[e];if(a.update_options){a.update_options(e)}}},redraw:function(f){this.span=this.max_high-this.max_low;var d=this.span/Math.pow(this.zoom_factor,this.zoom_level),b=this.center-(d/2),e=b+d;if(b<0){b=0;e=b+d}else{if(e>this.max_high){e=this.max_high;b=e-d}}this.low=Math.floor(b);this.high=Math.ceil(e);this.center=Math.round(this.low+(this.high-this.low)/2);this.resolution=Math.pow(10,Math.ceil(Math.log((this.high-this.low)/DENSITY)/Math.LN10));this.zoom_res=Math.pow(FEATURE_LEVELS,Math.ma!
 x(0,Math.ceil(Math.log(this.resolution,FEATURE_LEVELS)/Math.log(FEATURE_LEVELS))));$("#overview-box").css({left:(this.low/this.span)*$("#overview-viewport").width(),width:Math.max(12,((this.high-this.low)/this.span)*$("#overview-viewport").width())}).show();$("#low").val(commatize(this.low));$("#high").val(commatize(this.high));if(!f){for(var c=0,a=this.tracks.length;c<a;c++){this.tracks[c].draw()}for(var c=0,a=this.label_tracks.length;c<a;c++){this.label_tracks[c].draw()}}},zoom_in:function(a){if(this.max_high===0||this.high-this.low<30){return}if(a){this.center=a/$(document).width()*(this.high-this.low)+this.low}this.zoom_level+=1;this.redraw()},zoom_out:function(){if(this.max_high===0){return}if(this.zoom_level<=0){this.zoom_level=0;return}this.zoom_level-=1;this.redraw()}});var Track=function(a,b){this.name=a;this.parent_element=b;this.init_global()};$.extend(Track.prototype,{init_global:function(){this.header_div=$("<div class='track-header'>").text(this.name);this.con!
 tent_div=$("<div class='track-content'>");this.container_div=$("<div><
/div>").addClass("track").append(this.header_div).append(this.content_div);this.parent_element.append(this.container_div)}});var TiledTrack=function(){};$.extend(TiledTrack.prototype,Track.prototype,{draw:function(){var i=this.view.low,e=this.view.high,f=e-i,d=this.view.resolution;if(DEBUG){$("#debug").text(d+" "+this.view.zoom_res)}var k=$("<div style='position: relative;'></div>");this.content_div.children(":first").remove();this.content_div.append(k);var l=this.content_div.width()/f;var h;var a=Math.floor(i/d/DENSITY);while((a*DENSITY*d)<e){var j=this.content_div.width()+"_"+this.view.zoom_level+"_"+a;var c=this.tile_cache.get(j);if(c){var g=a*DENSITY*d;var b=(g-i)*l;if(this.left_offset){b-=this.left_offset}c.css({left:b});k.append(c);this.max_height=Math.max(this.max_height,c.height())}else{this.delayed_draw(this,j,i,e,a,d,k,l)}a+=1}},delayed_draw:function(c,e,a,f,b,d,g,h){setTimeout(function(){if(!(a>c.view.high||f<c.view.low)){tile_element=c.draw_tile(d,b,g,h);if(tile_!
 element){c.tile_cache.set(e,tile_element);c.max_height=Math.max(c.max_height,tile_element.height());c.content_div.css("height",c.max_height)}}},50)}});var LabelTrack=function(a){Track.call(this,null,a);this.track_type="LabelTrack";this.hidden=true;this.container_div.addClass("label-track")};$.extend(LabelTrack.prototype,Track.prototype,{draw:function(){var c=this.view,d=c.high-c.low,g=Math.floor(Math.pow(10,Math.floor(Math.log(d)/Math.log(10)))),a=Math.floor(c.low/g)*g,e=this.content_div.width(),b=$("<div style='position: relative; height: 1.3em;'></div>");while(a<c.high){var f=(a-c.low)/d*e;b.append($("<div class='label'>"+commatize(a)+"</div>").css({position:"absolute",left:f-1}));a+=g}this.content_div.children(":first").remove();this.content_div.append(b)}});var LineTrack=function(c,a,d,b){this.track_type="LineTrack";this.tile_cache=new Cache(CACHED_TILES_LINE);Track.call(this,c,$("#viewport"));TiledTrack.call(this);this.indexer=d;this.height_px=100;this.container_div.ad!
 dClass("line-track");this.dataset_id=a;this.prefs={min_value:undefined
,max_value:undefined};if(b.min_value!==undefined){this.prefs.min_value=b.min_value}if(b.max_value!==undefined){this.prefs.max_value=b.max_value}};$.extend(LineTrack.prototype,TiledTrack.prototype,{init:function(){this.data_queue={};this.data_cache=new Cache(CACHED_DATA);var a=this,b=a.view.tracks.indexOf(a);a.content_div.text(DATA_LOADING);a.container_div.removeClass("nodata error pending");$.getJSON(data_url,{stats:true,indexer:a.indexer,chrom:a.view.chrom,low:null,high:null,dataset_id:a.dataset_id},function(d){if(!d||d=="error"){a.container_div.addClass("error");a.content_div.text(DATA_ERROR)}else{if(d.length===0||d=="no data"){a.container_div.addClass("nodata");a.content_div.text(DATA_NONE)}else{if(d=="pending"){a.container_div.addClass("pending");a.content_div.text(DATA_PENDING);setTimeout(function(){a.init()},5000)}else{a.content_div.text("");a.content_div.css("height",a.height_px+"px");if(a.prefs.min_value===undefined||a.prefs.max_value===undefined){a.prefs.min_value=d!
 .min;a.prefs.max_value=d.max;$("#track_"+b+"_minval").val(a.prefs.min_value);$("#track_"+b+"_maxval").val(a.prefs.max_value)}a.vertical_range=a.prefs.max_value-a.prefs.min_value;if($("#linetrack_"+b+"_minval").length===0){var e=$("<div></div>").addClass("yaxislabel").attr("id","linetrack_"+b+"_minval").text(a.prefs.min_value);var c=$("<div></div>").addClass("yaxislabel").attr("id","linetrack_"+b+"_maxval").text(a.prefs.max_value);c.css({position:"relative",top:"25px"});c.prependTo(a.container_div);e.css({position:"relative",top:a.height_px+55+"px"});e.prependTo(a.container_div)}a.draw()}}}})},get_data:function(d,b){var c=this,a=b*DENSITY*d,f=(b+1)*DENSITY*d,e=d+"_"+b;if(!c.data_queue[e]){c.data_queue[e]=true;$.getJSON(data_url,{indexer:this.indexer,chrom:this.view.chrom,low:a,high:f,dataset_id:this.dataset_id,resolution:this.view.resolution},function(g){c.data_cache.set(e,g);delete c.data_queue[e];c.draw()})}},draw_tile:function(n,p,c,e){if(this.vertical_range===undefined){!
 return}var q=p*DENSITY*n,a=DENSITY*n,b=$("<canvas class='tile'></canva
s>"),s=n+"_"+p;if(!this.data_cache.get(s)){this.get_data(n,p);return}var r=this.data_cache.get(s);b.css({position:"absolute",top:0,left:(q-this.view.low)*e});b.get(0).width=Math.ceil(a*e);b.get(0).height=this.height_px;var m=b.get(0).getContext("2d"),j=false,k=this.prefs.min_value,f=this.prefs.max_value,l=this.vertical_range,d=this.height_px;m.beginPath();for(var o=0;o<r.length-1;o++){var h=r[o][0]-q;var g=r[o][1];if(isNaN(g)){j=false}else{h=h*e;if(g<=k){g=k}else{if(g>=f){g=f}}g=Math.round(d-(g-k)/l*d);if(j){m.lineTo(h,g)}else{m.moveTo(h,g);j=true}}}m.stroke();c.append(b);return b},gen_options:function(j){var a=$("<div></div>").addClass("form-row");var e="track_"+j+"_minval",g="track_"+j+"_maxval",h=$("<label></label>").attr("for",e).text("Min value:"),b=(this.prefs.min_value===undefined?"":this.prefs.min_value),i=$("<input></input>").attr("id",e).val(b),d=$("<label></label>").attr("for",g).text("Max value:"),f=(this.prefs.max_value===undefined?"":this.prefs.max_value),c=$("!
 <input></input>").attr("id",g).val(f);return a.append(h).append(i).append(d).append(c)},update_options:function(c){var a=$("#track_"+c+"_minval").val(),b=$("#track_"+c+"_maxval").val();if(a!==this.prefs.min_value||b!==this.prefs.max_value){this.prefs.min_value=parseFloat(a);this.prefs.max_value=parseFloat(b);this.vertical_range=this.prefs.max_value-this.prefs.min_value;$("#linetrack_"+c+"_minval").text(this.prefs.min_value);$("#linetrack_"+c+"_maxval").text(this.prefs.max_value);this.tile_cache.clear();this.draw()}}});var FeatureTrack=function(c,a,d,b){this.track_type="FeatureTrack";this.tile_cache=new Cache(CACHED_TILES_FEATURE);Track.call(this,c,$("#viewport"));TiledTrack.call(this);this.indexer=d;this.height_px=100;this.container_div.addClass("feature-track");this.dataset_id=a;this.zo_slots={};this.show_labels_scale=0.001;this.showing_details=false;this.vertical_detail_px=10;this.vertical_nodetail_px=3;this.default_font="9px Monaco, Lucida Console, monospace";this.left_o!
 ffset=200;this.inc_slots={};this.data_queue={};this.s_e_by_tile={};thi
s.data_cache=new Cache(20);this.prefs={block_color:"black",label_color:"black"};if(b.block_color!==undefined){this.prefs.block_color=b.block_color}if(b.label_color!==undefined){this.prefs.label_color=b.label_color}};$.extend(FeatureTrack.prototype,TiledTrack.prototype,{init:function(){var a=this;a.content_div.text(DATA_LOADING);a.container_div.removeClass("nodata error pending");$.getJSON(data_url,{indexer:a.indexer,low:a.view.max_low,high:a.view.max_high,dataset_id:a.dataset_id,chrom:a.view.chrom},function(b){if(b=="error"){a.container_div.addClass("error");a.content_div.text(DATA_ERROR)}else{if(b.length===0||b=="no data"){a.container_div.addClass("nodata");a.content_div.text(DATA_NONE)}else{if(b=="pending"){a.container_div.adClass("pending");a.content_div.text(DATA_PENDING);setTimeout(function(){a.init()},5000)}else{a.content_div.text("");a.content_div.css("height",a.height_px+"px");a.values=b;a.calc_slots();a.slots=a.zo_slots;a.draw()}}}})},get_data:function(a,d){var b=th!
 is,c=a+"_"+d;if(!b.data_queue[c]){b.data_queue[c]=true;$.getJSON(data_url,{indexer:b.indexer,chrom:b.view.chrom,low:a,high:d,dataset_id:b.dataset_id,include_blocks:true},function(e){b.data_cache.set(c,e);delete b.data_queue[c];b.draw()})}},calc_slots:function(){var b=[],a=this.content_div.width()/(this.view.high-this.view.low),d=this.view.max_low;for(var e=0,f=this.values.length;e<f;e++){var g,h,k=this.values[e];g=Math.floor((k.start-d)*a);h=Math.ceil((k.end-d)*a);var c=0;while(true){if(b[c]===undefined||b[c]<g){b[c]=h;this.zo_slots[k.uid]=c;break}c++}}this.height_px=b.length*this.vertical_nodetail_px+15;this.content_div.css("height",this.height_px+"px")},incremental_slots:function(a,f){if(!this.inc_slots[a]){this.inc_slots[a]={};this.inc_slots[a].w_scale=1/a;this.s_e_by_tile[a]={}}var h=this.inc_slots[a].w_scale,s=[],g=0,b=$("<canvas></canvas>").get(0).getContext("2d"),l=this.view.max_low;var c,e,u=[];for(var p=0,q=f.length;p<q;p++){var d=f[p];if(this.inc_slots[a][d.uid]!=!
 =undefined){g=Math.max(g,this.inc_slots[a][d.uid]);u.push(this.inc_slo
ts[a][d.uid])}else{s.push(p)}}for(var p=0,q=s.length;p<q;p++){var d=f[s[p]];c=Math.floor((d.start-l)*h);c-=b.measureText(d.name).width;e=Math.ceil((d.end-l)*h);var o=0;while(true){var m=true;if(this.s_e_by_tile[a][o]!==undefined){for(var n=0,t=this.s_e_by_tile[a][o].length;n<t;n++){var r=this.s_e_by_tile[a][o][n];if(e>r[0]&&c<r[1]){m=false;break}}}if(m){if(this.s_e_by_tile[a][o]===undefined){this.s_e_by_tile[a][o]=[]}this.s_e_by_tile[a][o].push([c,e]);this.inc_slots[a][d.uid]=o;g=Math.max(g,o);break}o++}}return g},draw_tile:function(B,f,g,M){if(!this.values){return}var s=f*DENSITY*B,G=(f+1)*DENSITY*B,r=DENSITY*B;var K,L,m;if(M>this.show_labels_scale){if(!this.showing_details){this.showing_details=true}for(var H in this.data_cache.obj_cache){var C=H.split("_"),z=C[0],c=C[1];if(z<=s&&c>=G){K=this.data_cache.get(H);break}}if(!K){this.data_queue[[s,G]]=true;this.get_data(s,G);return}m=this.incremental_slots(this.view.zoom_res,K)*this.vertical_detail_px+15;L=this.inc_slots[this.v!
 iew.zoom_res]}else{if(this.showing_details){this.showing_details=false}m=this.height_px;L=this.zo_slots;K=this.values}var a=Math.ceil(r*M),u=$("<canvas class='tile'></canvas>"),D=this.prefs.label_color,e=this.prefs.block_color,x=this.left_offset,N=this.showing_details,O=(this.showing_details?this.vertical_detail_px:this.vertical_nodetail_px);u.css({position:"absolute",top:0,left:(s-this.view.low)*M-x});u.get(0).width=a+x;u.get(0).height=m;var p=u.get(0).getContext("2d");p.fillStyle=this.prefs.block_color;p.font=this.default_font;p.textAlign="right";var I=0;for(var J=0,o=K.length;J<o;J++){var v=K[J];if(v.start<=G&&v.end>=s){var A=Math.floor(Math.max(0,(v.start-s)*M)),q=Math.ceil(Math.min(a,(v.end-s)*M)),y=L[v.uid]*O;var n,E,t=null,P=null;if(v.thick_start&&v.thick_end){t=Math.floor(Math.max(0,(v.thick_start-s)*M));P=Math.ceil(Math.min(a,(v.thick_end-s)*M))}if(!N){p.fillRect(A+x,y+5,q-A,1)}else{if(v.start>s){p.fillStyle=D;p.fillText(v.name,A-1+x,y+8);p.fillStyle=e}var Q=v.bloc!
 ks;if(Q){if(v.strand){if(v.strand=="+"){p.fillStyle=RIGHT_STRAND}else{
if(v.strand=="-"){p.fillStyle=LEFT_STRAND}}p.fillRect(A+x,y,q-A,10);p.fillStyle=e}for(var H=0,d=Q.length;H<d;H++){var h=Q[H],b=Math.floor(Math.max(0,(h[0]-s)*M)),w=Math.ceil(Math.min(a,(h[1]-s)*M));if(b>w){continue}n=5;E=3;p.fillRect(b+x,y+E,w-b,n);if(t!==undefined&&!(b>P||w<t)){n=9;E=1;var F=Math.max(b,t),l=Math.min(w,P);p.fillRect(F+x,y+E,l-F,n)}}}else{n=9;E=1;p.fillRect(A+x,y+E,q-A,n);if(v.strand){if(v.strand=="+"){p.fillStyle=RIGHT_STRAND_INV}else{if(v.strand=="-"){p.fillStyle=LEFT_STRAND_INV}}p.fillRect(A+x,y,q-A,10);p.fillStyle=prefs.block_color}}}I++}}g.append(u);return u},gen_options:function(g){var a=$("<div></div>").addClass("form-row");var d="track_"+g+"_block_color",c=$("<label></label>").attr("for",d).text("Block color:"),b=$("<input></input>").attr("id",d).attr("name",d).val(this.prefs.block_color),f="track_"+g+"_label_color",h=$("<label></label>").attr("for",f).text("Label color:"),e=$("<input></input>").attr("id",f).attr("name",f).val(this.prefs.label_color);!
 return a.append(c).append(b).append(h).append(e)},update_options:function(c){var a=$("#track_"+c+"_block_color").val(),b=$("#track_"+c+"_label_color").val();if(a!==this.prefs.block_color||b!==this.prefs.label_color){this.prefs.block_color=a;this.prefs.label_color=b;this.tile_cache.clear();this.draw()}}});var ReadTrack=function(c,a,d,b){this.track_type="ReadTrack";this.tile_cache=new Cache(CACHED_TILES_FEATURE);Track.call(this,c,$("#viewport"));TiledTrack.call(this);FeatureTrack.call(this,c,a,d,b)};$.extend(ReadTrack.prototype,TiledTrack.prototype,FeatureTrack.prototype,{draw_tile:function(v,z,m,n){if(!this.values){return}var A=z*DENSITY*v,e=(z+1)*DENSITY*v,q=DENSITY*v;var D,p,h;h=this.height_px;p=this.zo_slots;D=this.values;var t=Math.ceil(q*n),r=$("<canvas class='tile'></canvas>");r.css({position:"absolute",top:0,left:(A-this.view.low)*n-this.left_offset});r.get(0).width=t+this.left_offset;r.get(0).height=h;var u=r.get(0).getContext("2d");u.fillStyle=this.prefs.block_color!
 ;u.font=this.default_font;u.textAlign="right";var s=u.measureText("A")
.width;var w=0;for(var x=0,y=D.length;x<y;x++){var l=D[x];if(l.start<=e&&l.end>=A){var g=Math.floor(Math.max(0,(l.start-A)*n)),k=Math.ceil(Math.min(t,(l.end-A)*n)),f=p[l.uid]*this.vertical_detail_px;var a,E,d=null,o=null;if(n>s){for(var B=0,b=l.name.length;B<b;B++){var C=Math.floor(Math.max(0,(l.start+B-A)*n));u.fillText(l.name[B],C+this.left_offset,f+8)}}else{u.fillRect(g+this.left_offset,f+4,k-g,3)}}}m.append(r);return r}});
\ No newline at end of file
+var DEBUG=false;var DENSITY=1000,FEATURE_LEVELS=10,DATA_ERROR="There was an error in indexing this dataset.",DATA_NONE="No data for this chrom/contig.",DATA_PENDING="Currently indexing... please wait",DATA_LOADING="Loading data...",CACHED_TILES_FEATURE=10,CACHED_TILES_LINE=30,CACHED_DATA=20,CONTEXT=$("<canvas></canvas>").get(0).getContext("2d"),RIGHT_STRAND,LEFT_STRAND;var right_img=new Image();right_img.src="../images/visualization/strand_right.png";right_img.onload=function(){RIGHT_STRAND=CONTEXT.createPattern(right_img,"repeat")};var left_img=new Image();left_img.src="../images/visualization/strand_left.png";left_img.onload=function(){LEFT_STRAND=CONTEXT.createPattern(left_img,"repeat")};var right_img_inv=new Image();right_img_inv.src="../images/visualization/strand_right_inv.png";right_img_inv.onload=function(){RIGHT_STRAND_INV=CONTEXT.createPattern(right_img_inv,"repeat")};var left_img_inv=new Image();left_img_inv.src="../images/visualization/strand_left_inv.png";left_!
 img_inv.onload=function(){LEFT_STRAND_INV=CONTEXT.createPattern(left_img_inv,"repeat")};function commatize(b){b+="";var a=/(\d+)(\d{3})/;while(a.test(b)){b=b.replace(a,"$1,$2")}return b}var Cache=function(a){this.num_elements=a;this.clear()};$.extend(Cache.prototype,{get:function(b){var a=this.key_ary.indexOf(b);if(a!=-1){this.key_ary.splice(a,1);this.key_ary.push(b)}return this.obj_cache[b]},set:function(b,c){if(!this.obj_cache[b]){if(this.key_ary.length>=this.num_elements){var a=this.key_ary.shift();delete this.obj_cache[a]}this.key_ary.push(b)}this.obj_cache[b]=c;return c},clear:function(){this.obj_cache={};this.key_ary=[]}});var View=function(b,d,c,a){this.vis_id=c;this.dbkey=a;this.title=d;this.chrom=b;this.tracks=[];this.label_tracks=[];this.max_low=0;this.max_high=0;this.center=(this.max_high-this.max_low)/2;this.zoom_factor=3;this.zoom_level=0;this.track_id_counter=0};$.extend(View.prototype,{add_track:function(a){a.view=this;a.track_id=this.track_id_counter;this.tr!
 acks.push(a);if(a.init){a.init()}a.container_div.attr("id","track_"+a.
track_id);this.track_id_counter+=1},add_label_track:function(a){a.view=this;this.label_tracks.push(a)},remove_track:function(a){a.container_div.fadeOut("slow",function(){$(this).remove()});delete this.tracks[a]},update_options:function(){var b=$("ul#sortable-ul").sortable("toArray");var d=[];var c=$("#viewport > div").sort(function(g,f){return b.indexOf($(g).attr("id"))>b.indexOf($(f).attr("id"))});$("#viewport > div").remove();$("#viewport").html(c);for(var e in view.tracks){var a=view.tracks[e];if(a.update_options){a.update_options(e)}}},redraw:function(f){this.span=this.max_high-this.max_low;var d=this.span/Math.pow(this.zoom_factor,this.zoom_level),b=this.center-(d/2),e=b+d;if(b<0){b=0;e=b+d}else{if(e>this.max_high){e=this.max_high;b=e-d}}this.low=Math.floor(b);this.high=Math.ceil(e);this.center=Math.round(this.low+(this.high-this.low)/2);this.resolution=Math.pow(10,Math.ceil(Math.log((this.high-this.low)/DENSITY)/Math.LN10));this.zoom_res=Math.pow(FEATURE_LEVELS,Math.ma!
 x(0,Math.ceil(Math.log(this.resolution,FEATURE_LEVELS)/Math.log(FEATURE_LEVELS))));$("#overview-box").css({left:(this.low/this.span)*$("#overview-viewport").width(),width:Math.max(12,((this.high-this.low)/this.span)*$("#overview-viewport").width())}).show();$("#low").val(commatize(this.low));$("#high").val(commatize(this.high));if(!f){for(var c=0,a=this.tracks.length;c<a;c++){this.tracks[c].draw()}for(var c=0,a=this.label_tracks.length;c<a;c++){this.label_tracks[c].draw()}}},zoom_in:function(a){if(this.max_high===0||this.high-this.low<30){return}if(a){this.center=a/$(document).width()*(this.high-this.low)+this.low}this.zoom_level+=1;this.redraw()},zoom_out:function(){if(this.max_high===0){return}if(this.zoom_level<=0){this.zoom_level=0;return}this.zoom_level-=1;this.redraw()}});var Track=function(a,b){this.name=a;this.parent_element=b;this.init_global()};$.extend(Track.prototype,{init_global:function(){this.header_div=$("<div class='track-header'>").text(this.name);this.con!
 tent_div=$("<div class='track-content'>");this.container_div=$("<div><
/div>").addClass("track").append(this.header_div).append(this.content_div);this.parent_element.append(this.container_div)},init_each:function(c,b){var a=this;a.data_queue={};a.tile_cache.clear();a.data_cache.clear();a.content_div.css("height","30px");a.content_div.text(DATA_LOADING);a.container_div.removeClass("nodata error pending");if(a.view.chrom){$.getJSON(data_url,c,function(d){if(!d||d=="error"){a.container_div.addClass("error");a.content_div.text(DATA_ERROR)}else{if(d.length===0||d=="no data"){a.container_div.addClass("nodata");a.content_div.text(DATA_NONE)}else{if(d=="pending"){a.container_div.addClass("pending");a.content_div.text(DATA_PENDING);setTimeout(function(){a.init()},5000)}else{a.content_div.text("");a.content_div.css("height",a.height_px+"px");b(d);a.draw()}}}})}else{a.container_div.addClass("nodata");a.content_div.text(DATA_NONE)}}});var TiledTrack=function(){};$.extend(TiledTrack.prototype,Track.prototype,{draw:function(){var i=this.view.low,e=this.view.!
 high,f=e-i,d=this.view.resolution;if(DEBUG){$("#debug").text(d+" "+this.view.zoom_res)}var k=$("<div style='position: relative;'></div>");this.content_div.children(":first").remove();this.content_div.append(k);var l=this.content_div.width()/f;var h;var a=Math.floor(i/d/DENSITY);while((a*DENSITY*d)<e){var j=this.content_div.width()+"_"+this.view.zoom_level+"_"+a;var c=this.tile_cache.get(j);if(c){var g=a*DENSITY*d;var b=(g-i)*l;if(this.left_offset){b-=this.left_offset}c.css({left:b});k.append(c);this.max_height=Math.max(this.max_height,c.height())}else{this.delayed_draw(this,j,i,e,a,d,k,l)}a+=1}},delayed_draw:function(c,e,a,f,b,d,g,h){setTimeout(function(){if(!(a>c.view.high||f<c.view.low)){tile_element=c.draw_tile(d,b,g,h);if(tile_element){c.tile_cache.set(e,tile_element);c.max_height=Math.max(c.max_height,tile_element.height());c.content_div.css("height",c.max_height+"px")}}},50)}});var LabelTrack=function(a){Track.call(this,null,a);this.track_type="LabelTrack";this.hidden!
 =true;this.container_div.addClass("label-track")};$.extend(LabelTrack.
prototype,Track.prototype,{draw:function(){var c=this.view,d=c.high-c.low,g=Math.floor(Math.pow(10,Math.floor(Math.log(d)/Math.log(10)))),a=Math.floor(c.low/g)*g,e=this.content_div.width(),b=$("<div style='position: relative; height: 1.3em;'></div>");while(a<c.high){var f=(a-c.low)/d*e;b.append($("<div class='label'>"+commatize(a)+"</div>").css({position:"absolute",left:f-1}));a+=g}this.content_div.children(":first").remove();this.content_div.append(b)}});var LineTrack=function(c,a,d,b){this.track_type="LineTrack";Track.call(this,c,$("#viewport"));TiledTrack.call(this);this.indexer=d;this.height_px=100;this.container_div.addClass("line-track");this.dataset_id=a;this.data_cache=new Cache(CACHED_DATA);this.tile_cache=new Cache(CACHED_TILES_LINE);this.prefs={min_value:undefined,max_value:undefined};if(b.min_value!==undefined){this.prefs.min_value=b.min_value}if(b.max_value!==undefined){this.prefs.max_value=b.max_value}};$.extend(LineTrack.prototype,TiledTrack.prototype,{init:fu!
 nction(){var a=this,b=a.view.tracks.indexOf(a);a.vertical_range=undefined;this.init_each({stats:true,indexer:a.indexer,chrom:a.view.chrom,low:null,high:null,dataset_id:a.dataset_id},function(d){if(isNaN(parseFloat(a.prefs.min_value))||isNaN(parseFloat(a.prefs.max_value))){a.prefs.min_value=d.min;a.prefs.max_value=d.max;$("#track_"+b+"_minval").val(a.prefs.min_value);$("#track_"+b+"_maxval").val(a.prefs.max_value)}a.vertical_range=a.prefs.max_value-a.prefs.min_value;$("#linetrack_"+b+"_minval").remove();$("#linetrack_"+b+"_maxval").remove();var e=$("<div></div>").addClass("yaxislabel").attr("id","linetrack_"+b+"_minval").text(a.prefs.min_value);var c=$("<div></div>").addClass("yaxislabel").attr("id","linetrack_"+b+"_maxval").text(a.prefs.max_value);c.css({position:"relative",top:"25px"});c.prependTo(a.container_div);e.css({position:"relative",top:a.height_px+55+"px"});e.prependTo(a.container_div)})},get_data:function(d,b){var c=this,a=b*DENSITY*d,f=(b+1)*DENSITY*d,e=d+"_"+b;!
 if(!c.data_queue[e]){c.data_queue[e]=true;$.getJSON(data_url,{indexer:
this.indexer,chrom:this.view.chrom,low:a,high:f,dataset_id:this.dataset_id,resolution:this.view.resolution,},function(g){c.data_cache.set(e,g);delete c.data_queue[e];c.draw()})}},draw_tile:function(n,p,c,e){if(this.vertical_range===undefined){return}var q=p*DENSITY*n,a=DENSITY*n,b=$("<canvas class='tile'></canvas>"),s=n+"_"+p;if(!this.data_cache.get(s)){this.get_data(n,p);return}var r=this.data_cache.get(s);b.css({position:"absolute",top:0,left:(q-this.view.low)*e});b.get(0).width=Math.ceil(a*e);b.get(0).height=this.height_px;var m=b.get(0).getContext("2d"),j=false,k=this.prefs.min_value,f=this.prefs.max_value,l=this.vertical_range,d=this.height_px;m.beginPath();for(var o=0;o<r.length-1;o++){var h=r[o][0]-q;var g=r[o][1];if(isNaN(g)){j=false}else{h=h*e;if(g<=k){g=k}else{if(g>=f){g=f}}g=Math.round(d-(g-k)/l*d);if(j){m.lineTo(h,g)}else{m.moveTo(h,g);j=true}}}m.stroke();c.append(b);return b},gen_options:function(j){var a=$("<div></div>").addClass("form-row");var e="track_"+j+"_!
 minval",g="track_"+j+"_maxval",h=$("<label></label>").attr("for",e).text("Min value:"),b=(this.prefs.min_value===undefined?"":this.prefs.min_value),i=$("<input></input>").attr("id",e).val(b),d=$("<label></label>").attr("for",g).text("Max value:"),f=(this.prefs.max_value===undefined?"":this.prefs.max_value),c=$("<input></input>").attr("id",g).val(f);return a.append(h).append(i).append(d).append(c)},update_options:function(c){var a=$("#track_"+c+"_minval").val(),b=$("#track_"+c+"_maxval").val();if(a!==this.prefs.min_value||b!==this.prefs.max_value){this.prefs.min_value=parseFloat(a);this.prefs.max_value=parseFloat(b);this.vertical_range=this.prefs.max_value-this.prefs.min_value;$("#linetrack_"+c+"_minval").text(this.prefs.min_value);$("#linetrack_"+c+"_maxval").text(this.prefs.max_value);this.tile_cache.clear();this.draw()}}});var FeatureTrack=function(c,a,d,b){this.track_type="FeatureTrack";Track.call(this,c,$("#viewport"));TiledTrack.call(this);this.indexer=d;this.height_px!
 =100;this.container_div.addClass("feature-track");this.dataset_id=a;th
is.zo_slots={};this.show_labels_scale=0.001;this.showing_details=false;this.vertical_detail_px=10;this.vertical_nodetail_px=3;this.default_font="9px Monaco, Lucida Console, monospace";this.left_offset=200;this.inc_slots={};this.data_queue={};this.s_e_by_tile={};this.tile_cache=new Cache(CACHED_TILES_FEATURE);this.data_cache=new Cache(20);this.prefs={block_color:"black",label_color:"black"};if(b.block_color!==undefined){this.prefs.block_color=b.block_color}if(b.label_color!==undefined){this.prefs.label_color=b.label_color}};$.extend(FeatureTrack.prototype,TiledTrack.prototype,{init:function(){var a=this;this.init_each({indexer:a.indexer,low:a.view.max_low,high:a.view.max_high,dataset_id:a.dataset_id,chrom:a.view.chrom},function(b){a.values=b;a.calc_slots();a.slots=a.zo_slots})},get_data:function(a,d){var b=this,c=a+"_"+d;if(!b.data_queue[c]){b.data_queue[c]=true;$.getJSON(data_url,{indexer:b.indexer,chrom:b.view.chrom,low:a,high:d,dataset_id:b.dataset_id,include_blocks:true},!
 function(e){b.data_cache.set(c,e);delete b.data_queue[c];b.draw()})}},calc_slots:function(){var b=[],a=this.content_div.width()/(this.view.high-this.view.low),d=this.view.max_low;for(var e=0,f=this.values.length;e<f;e++){var g,h,k=this.values[e];g=Math.floor((k.start-d)*a);h=Math.ceil((k.end-d)*a);var c=0;while(true){if(b[c]===undefined||b[c]<g){b[c]=h;this.zo_slots[k.uid]=c;break}c++}}this.height_px=b.length*this.vertical_nodetail_px+15;this.content_div.css("height",this.height_px+"px")},incremental_slots:function(a,f){if(!this.inc_slots[a]){this.inc_slots[a]={};this.inc_slots[a].w_scale=1/a;this.s_e_by_tile[a]={}}var h=this.inc_slots[a].w_scale,s=[],g=0,b=$("<canvas></canvas>").get(0).getContext("2d"),l=this.view.max_low;var c,e,u=[];for(var p=0,q=f.length;p<q;p++){var d=f[p];if(this.inc_slots[a][d.uid]!==undefined){g=Math.max(g,this.inc_slots[a][d.uid]);u.push(this.inc_slots[a][d.uid])}else{s.push(p)}}for(var p=0,q=s.length;p<q;p++){var d=f[s[p]];c=Math.floor((d.start-l)!
 *h);c-=b.measureText(d.name).width;e=Math.ceil((d.end-l)*h);var o=0;wh
ile(true){var m=true;if(this.s_e_by_tile[a][o]!==undefined){for(var n=0,t=this.s_e_by_tile[a][o].length;n<t;n++){var r=this.s_e_by_tile[a][o][n];if(e>r[0]&&c<r[1]){m=false;break}}}if(m){if(this.s_e_by_tile[a][o]===undefined){this.s_e_by_tile[a][o]=[]}this.s_e_by_tile[a][o].push([c,e]);this.inc_slots[a][d.uid]=o;g=Math.max(g,o);break}o++}}return g},draw_tile:function(B,f,g,M){if(!this.values){return}var s=f*DENSITY*B,G=(f+1)*DENSITY*B,r=DENSITY*B;var K,L,m;if(M>this.show_labels_scale){if(!this.showing_details){this.showing_details=true}for(var H in this.data_cache.obj_cache){var C=H.split("_"),z=C[0],c=C[1];if(z<=s&&c>=G){K=this.data_cache.get(H);break}}if(!K){this.data_queue[[s,G]]=true;this.get_data(s,G);return}m=this.incremental_slots(this.view.zoom_res,K)*this.vertical_detail_px+15;L=this.inc_slots[this.view.zoom_res]}else{if(this.showing_details){this.showing_details=false}m=this.height_px;L=this.zo_slots;K=this.values}var a=Math.ceil(r*M),u=$("<canvas class='tile'></can!
 vas>"),D=this.prefs.label_color,e=this.prefs.block_color,x=this.left_offset,N=this.showing_details,O=(this.showing_details?this.vertical_detail_px:this.vertical_nodetail_px);u.css({position:"absolute",top:0,left:(s-this.view.low)*M-x});u.get(0).width=a+x;u.get(0).height=m;var p=u.get(0).getContext("2d");p.fillStyle=this.prefs.block_color;p.font=this.default_font;p.textAlign="right";var I=0;for(var J=0,o=K.length;J<o;J++){var v=K[J];if(v.start<=G&&v.end>=s){var A=Math.floor(Math.max(0,(v.start-s)*M)),q=Math.ceil(Math.min(a,(v.end-s)*M)),y=L[v.uid]*O;var n,E,t=null,P=null;if(v.thick_start&&v.thick_end){t=Math.floor(Math.max(0,(v.thick_start-s)*M));P=Math.ceil(Math.min(a,(v.thick_end-s)*M))}if(!N){p.fillRect(A+x,y+5,q-A,1)}else{if(v.start>s){p.fillStyle=D;p.fillText(v.name,A-1+x,y+8);p.fillStyle=e}var Q=v.blocks;if(Q){if(v.strand){if(v.strand=="+"){p.fillStyle=RIGHT_STRAND}else{if(v.strand=="-"){p.fillStyle=LEFT_STRAND}}p.fillRect(A+x,y,q-A,10);p.fillStyle=e}for(var H=0,d=Q.le!
 ngth;H<d;H++){var h=Q[H],b=Math.floor(Math.max(0,(h[0]-s)*M)),w=Math.c
eil(Math.min(a,(h[1]-s)*M));if(b>w){continue}n=5;E=3;p.fillRect(b+x,y+E,w-b,n);if(t!==undefined&&!(b>P||w<t)){n=9;E=1;var F=Math.max(b,t),l=Math.min(w,P);p.fillRect(F+x,y+E,l-F,n)}}}else{n=9;E=1;p.fillRect(A+x,y+E,q-A,n);if(v.strand){if(v.strand=="+"){p.fillStyle=RIGHT_STRAND_INV}else{if(v.strand=="-"){p.fillStyle=LEFT_STRAND_INV}}p.fillRect(A+x,y,q-A,10);p.fillStyle=prefs.block_color}}}I++}}g.append(u);return u},gen_options:function(g){var a=$("<div></div>").addClass("form-row");var d="track_"+g+"_block_color",c=$("<label></label>").attr("for",d).text("Block color:"),b=$("<input></input>").attr("id",d).attr("name",d).val(this.prefs.block_color),f="track_"+g+"_label_color",h=$("<label></label>").attr("for",f).text("Label color:"),e=$("<input></input>").attr("id",f).attr("name",f).val(this.prefs.label_color);return a.append(c).append(b).append(h).append(e)},update_options:function(c){var a=$("#track_"+c+"_block_color").val(),b=$("#track_"+c+"_label_color").val();if(a!==this.p!
 refs.block_color||b!==this.prefs.label_color){this.prefs.block_color=a;this.prefs.label_color=b;this.tile_cache.clear();this.draw()}}});var ReadTrack=function(c,a,d,b){this.track_type="ReadTrack";this.tile_cache=new Cache(CACHED_TILES_FEATURE);Track.call(this,c,$("#viewport"));TiledTrack.call(this);FeatureTrack.call(this,c,a,d,b)};$.extend(ReadTrack.prototype,TiledTrack.prototype,FeatureTrack.prototype,{draw_tile:function(v,z,m,n){if(!this.values){return}var A=z*DENSITY*v,e=(z+1)*DENSITY*v,q=DENSITY*v;var D,p,h;h=this.height_px;p=this.zo_slots;D=this.values;var t=Math.ceil(q*n),r=$("<canvas class='tile'></canvas>");r.css({position:"absolute",top:0,left:(A-this.view.low)*n-this.left_offset});r.get(0).width=t+this.left_offset;r.get(0).height=h;var u=r.get(0).getContext("2d");u.fillStyle=this.prefs.block_color;u.font=this.default_font;u.textAlign="right";var s=u.measureText("A").width;var w=0;for(var x=0,y=D.length;x<y;x++){var l=D[x];if(l.start<=e&&l.end>=A){var g=Math.floor(!
 Math.max(0,(l.start-A)*n)),k=Math.ceil(Math.min(t,(l.end-A)*n)),f=p[l.
uid]*this.vertical_detail_px;var a,E,d=null,o=null;if(n>s){for(var B=0,b=l.name.length;B<b;B++){var C=Math.floor(Math.max(0,(l.start+B-A)*n));u.fillText(l.name[B],C+this.left_offset,f+8)}}else{u.fillRect(g+this.left_offset,f+4,k-g,3)}}}m.append(r);return r}});
\ No newline at end of file
diff -r 879432079138 -r 1e23f73647bb static/scripts/trackster.js
--- a/static/scripts/trackster.js	Fri Feb 19 14:34:25 2010 -0500
+++ b/static/scripts/trackster.js	Fri Feb 19 17:54:44 2010 -0500
@@ -198,6 +198,39 @@
         this.content_div = $("<div class='track-content'>");
         this.container_div = $("<div></div>").addClass('track').append( this.header_div ).append( this.content_div );
         this.parent_element.append( this.container_div );
+    },
+    init_each: function(params, success_fn) {
+        var track = this;
+        track.data_queue = {};
+        track.tile_cache.clear();
+        track.data_cache.clear();
+        track.content_div.css( "height", "30px" );
+        track.content_div.text(DATA_LOADING);
+        track.container_div.removeClass("nodata error pending");
+
+        if (track.view.chrom) {
+            $.getJSON( data_url, params, function ( data ) {
+                if (!data || data == "error") {
+                    track.container_div.addClass("error");
+                    track.content_div.text(DATA_ERROR);
+                } else if (data.length === 0 || data == "no data") {
+                    track.container_div.addClass("nodata");
+                    track.content_div.text(DATA_NONE);
+                } else if (data == "pending") {
+                    track.container_div.addClass("pending");
+                    track.content_div.text(DATA_PENDING);
+                    setTimeout(function() { track.init(); }, 5000);
+                } else {
+                    track.content_div.text("");
+                    track.content_div.css( "height", track.height_px + "px" );
+                    success_fn(data);
+                    track.draw();
+                }
+            });
+        } else {
+            track.container_div.addClass("nodata");
+            track.content_div.text(DATA_NONE);
+        }
     }
 });
 
@@ -233,9 +266,7 @@
                 if (this.left_offset) {
                     left -= this.left_offset;
                 }
-                cached.css( {
-                    left: left
-                });
+                cached.css({ left: left });
                 // Our responsibility to move the element to the new parent
                 parent_element.append( cached );
                 this.max_height = Math.max( this.max_height, cached.height() );
@@ -252,7 +283,7 @@
                 if ( tile_element ) {
                     track.tile_cache.set(key, tile_element);
                     track.max_height = Math.max( track.max_height, tile_element.height() );
-                    track.content_div.css( "height", track.max_height );
+                    track.content_div.css( "height", track.max_height + "px");
                 }
             }
         }, 50);
@@ -289,7 +320,6 @@
 
 var LineTrack = function ( name, dataset_id, indexer, prefs ) {
     this.track_type = "LineTrack";
-    this.tile_cache = new Cache(CACHED_TILES_LINE);
     Track.call( this, name, $("#viewport") );
     TiledTrack.call( this );
     
@@ -297,61 +327,42 @@
     this.height_px = 100;
     this.container_div.addClass( "line-track" );
     this.dataset_id = dataset_id;
+    this.data_cache = new Cache(CACHED_DATA);
+    this.tile_cache = new Cache(CACHED_TILES_LINE);
     this.prefs = { 'min_value': undefined, 'max_value': undefined };
     if (prefs.min_value !== undefined) { this.prefs.min_value = prefs.min_value; }
     if (prefs.max_value !== undefined) { this.prefs.max_value = prefs.max_value; }
 };
 $.extend( LineTrack.prototype, TiledTrack.prototype, {
     init: function() {
-        this.data_queue = {};
-        this.data_cache = new Cache(CACHED_DATA); // We need to cache some data because of
-                                             // asynchronous calls
         var track = this,
             track_id = track.view.tracks.indexOf(track);
         
-        track.content_div.text(DATA_LOADING);
-        track.container_div.removeClass("nodata error pending");
-        $.getJSON( data_url, {  stats: true, indexer: track.indexer,
+        track.vertical_range = undefined;
+        this.init_each({  stats: true, indexer: track.indexer,
                                 chrom: track.view.chrom, low: null, high: null,
-                                dataset_id: track.dataset_id }, function ( data ) {
-            if (!data || data == "error") {
-                track.container_div.addClass("error");
-                track.content_div.text(DATA_ERROR);
-            } else if (data.length === 0 || data == "no data") {
-                track.container_div.addClass("nodata");
-                track.content_div.text(DATA_NONE);
-            } else if (data == "pending") {
-                track.container_div.addClass("pending");
-                track.content_div.text(DATA_PENDING);
-                setTimeout(function() { track.init(); }, 5000);
-            } else {
-                track.content_div.text("");
-                track.content_div.css( "height", track.height_px + "px" );
-                
-                if (track.prefs.min_value === undefined || track.prefs.max_value === undefined) {
-                    track.prefs.min_value = data.min;
-                    track.prefs.max_value = data.max;
-
-                    // Update the config
-                    $('#track_' + track_id + '_minval').val(track.prefs.min_value);
-                    $('#track_' + track_id + '_maxval').val(track.prefs.max_value);
-                }
-                track.vertical_range = track.prefs.max_value - track.prefs.min_value;
-                
-                // Draw y-axis labels if necessary
-                if ( $('#linetrack_' + track_id + '_minval').length === 0) {
-                    var min_label = $("<div></div>").addClass('yaxislabel').attr("id", 'linetrack_' + track_id + '_minval').text(track.prefs.min_value);
-                    var max_label = $("<div></div>").addClass('yaxislabel').attr("id", 'linetrack_' + track_id + '_maxval').text(track.prefs.max_value);
-                
-                    max_label.css({ position: "relative", top: "25px" });
-                    max_label.prependTo(track.container_div);
-                
-                    min_label.css({ position: "relative", top: track.height_px + 55 + "px" });
-                    min_label.prependTo(track.container_div);
-                }
-                
-                track.draw();
+                                dataset_id: track.dataset_id }, function(data) {
+            if ( isNaN(parseFloat(track.prefs.min_value)) || isNaN(parseFloat(track.prefs.max_value)) ) {
+                track.prefs.min_value = data.min;
+                track.prefs.max_value = data.max;
+                // Update the config
+                $('#track_' + track_id + '_minval').val(track.prefs.min_value);
+                $('#track_' + track_id + '_maxval').val(track.prefs.max_value);
             }
+            track.vertical_range = track.prefs.max_value - track.prefs.min_value;
+        
+            // Draw y-axis labels if necessary
+            $('#linetrack_' + track_id + '_minval').remove();
+            $('#linetrack_' + track_id + '_maxval').remove();
+            
+            var min_label = $("<div></div>").addClass('yaxislabel').attr("id", 'linetrack_' + track_id + '_minval').text(track.prefs.min_value);
+            var max_label = $("<div></div>").addClass('yaxislabel').attr("id", 'linetrack_' + track_id + '_maxval').text(track.prefs.max_value);
+            
+            max_label.css({ position: "relative", top: "25px" });
+            max_label.prependTo(track.container_div);
+    
+            min_label.css({ position: "relative", top: track.height_px + 55 + "px" });
+            min_label.prependTo(track.container_div);
         });
     },
     get_data: function( resolution, position ) {
@@ -362,9 +373,9 @@
         
         if (!track.data_queue[key]) {
             track.data_queue[key] = true;
-            $.getJSON( data_url, {  indexer: this.indexer, chrom: this.view.chrom, 
-                                    low: low, high: high, dataset_id: this.dataset_id,
-                                    resolution: this.view.resolution }, function ( data ) {
+            $.getJSON( data_url, {  "indexer": this.indexer, "chrom": this.view.chrom, 
+                                    "low": low, "high": high, "dataset_id": this.dataset_id,
+                                    "resolution": this.view.resolution, }, function (data) {
                 track.data_cache.set(key, data);
                 delete track.data_queue[key];
                 track.draw();
@@ -392,7 +403,7 @@
             top: 0,
             left: ( tile_low - this.view.low ) * w_scale
         });
-                
+        
         canvas.get(0).width = Math.ceil( tile_length * w_scale );
         canvas.get(0).height = this.height_px;
         var ctx = canvas.get(0).getContext("2d"),
@@ -462,7 +473,6 @@
 
 var FeatureTrack = function ( name, dataset_id, indexer, prefs ) {
     this.track_type = "FeatureTrack";
-    this.tile_cache = new Cache(CACHED_TILES_FEATURE);
     Track.call( this, name, $("#viewport") );
     TiledTrack.call( this );
     
@@ -480,7 +490,9 @@
     this.inc_slots = {};
     this.data_queue = {};
     this.s_e_by_tile = {};
+    this.tile_cache = new Cache(CACHED_TILES_FEATURE);
     this.data_cache = new Cache(20);
+    
     this.prefs = { 'block_color': 'black', 'label_color': 'black' };
     if (prefs.block_color !== undefined) { this.prefs.block_color = prefs.block_color; }
     if (prefs.label_color !== undefined) { this.prefs.label_color = prefs.label_color; }
@@ -489,33 +501,15 @@
 $.extend( FeatureTrack.prototype, TiledTrack.prototype, {
     init: function() {
         var track = this;
-        track.content_div.text(DATA_LOADING);
-        track.container_div.removeClass("nodata error pending");
-        $.getJSON( data_url, {  indexer: track.indexer, low: track.view.max_low, 
-                                high: track.view.max_high, dataset_id: track.dataset_id,
-                                chrom: track.view.chrom }, function ( data ) {
-            if (data == "error") {
-                track.container_div.addClass("error");
-                track.content_div.text(DATA_ERROR);
-            } else if (data.length === 0 || data == "no data") {
-                track.container_div.addClass("nodata");
-                track.content_div.text(DATA_NONE);
-            } else if (data == "pending") {
-                track.container_div.adClass("pending");
-                track.content_div.text(DATA_PENDING);
-                setTimeout(function() { track.init(); }, 5000);
-            } else {
-                track.content_div.text("");
-                track.content_div.css( "height", track.height_px + "px" );
-                track.values = data;
-                track.calc_slots();
-                track.slots = track.zo_slots;
-                track.draw();
-            }
+        this.init_each({  indexer: track.indexer, low: track.view.max_low, 
+                                    high: track.view.max_high, dataset_id: track.dataset_id,
+                                    chrom: track.view.chrom }, function (data) {
+            track.values = data;
+            track.calc_slots();
+            track.slots = track.zo_slots;
         });
     },
     get_data: function( low, high ) {
-        // console.log("getting: ", low, high);
         var track = this,
             key = low + '_' + high;
         
@@ -523,7 +517,7 @@
             track.data_queue[key] = true;
             $.getJSON( data_url, {  indexer: track.indexer, chrom: track.view.chrom, 
                                     low: low, high: high, dataset_id: track.dataset_id,
-                                    include_blocks: true }, function ( data ) {
+                                    include_blocks: true }, function (data) {
                 track.data_cache.set(key, data);
                 // console.log("datacache", track.data_cache.get(key));
                 delete track.data_queue[key];
diff -r 879432079138 -r 1e23f73647bb templates/tracks/browser.mako
--- a/templates/tracks/browser.mako	Fri Feb 19 14:34:25 2010 -0500
+++ b/templates/tracks/browser.mako	Fri Feb 19 17:54:44 2010 -0500
@@ -107,8 +107,10 @@
                 error: function() { alert( "Couldn't create new browser" ) },
                 success: function(form_html) {
                     show_modal("New Track Browser", form_html, {
+                        "Cancel": function() { window.location = "/"; },
                         "Continue": continue_fn
                     });
+                    $("#new-title").focus();
                 }
             });
         %endif
@@ -292,7 +294,7 @@
                             track.init();
                         }
                     }
-                    // view.redraw();
+                    view.redraw();
                 });
             });
             
@@ -301,8 +303,9 @@
                     var track_id = track.track_id,
                         label = $('<label for="track_' + track_id + 'title">' + track.name + '</label>'),
                         title = $('<div class="historyItemTitle"></div>'),
-                        del_icon = $('<a style="display:block; float:right" href="#" class="icon-button delete" />'),
-                        edit_icon = $('<a style="display:block; float:right" href="#" class="icon-button edit" />'),
+                        icon_div = $('<div class="historyItemButtons"></div>');
+                        del_icon = $('<a href="#" class="icon-button delete" />'),
+                        edit_icon = $('<a href="#" class="icon-button edit" />'),
                         body = $('<div class="historyItemBody"></div>'),
                         checkbox = $('<input type="checkbox" checked="checked"></input>').attr("id", "track_" + track_id + "title"),
                         li = $('<li class="sortable"></li>').attr("id", "track_" + track_id),
@@ -318,8 +321,8 @@
                         view.remove_track(track);
                         view.update_options();
                     });
-                    
-                    title.append(label).append(del_icon).append(edit_icon);
+                    icon_div.append(edit_icon).append(del_icon);
+                    title.append(label).prepend(icon_div);
                     if (track.gen_options) {
                         editable.append(track.gen_options(track_id)).appendTo(body);
                     }
diff -r 879432079138 -r 1e23f73647bb templates/tracks/new_browser.mako
--- a/templates/tracks/new_browser.mako	Fri Feb 19 14:34:25 2010 -0500
+++ b/templates/tracks/new_browser.mako	Fri Feb 19 17:54:44 2010 -0500
@@ -2,7 +2,7 @@
     <div class="form-row">
         <label for="title">Browser name:</label>
         <div class="form-row-input">
-            <input type="text" name="title" id="new-title" value="Unnamed Browser"></input>
+            <input type="text" name="title" id="new-title" value="Unnamed"></input>
         </div>
         <div style="clear: both;"></div>
     </div>

    

[galaxy-dev] [hg] galaxy 3419: trackster:

Greg Von Kuster