From b7699f7cf01246a8acfb23759f4752cdd3ee100c Mon Sep 17 00:00:00 2001 From: Jeremy Goecks Date: Fri, 18 Nov 2011 11:52:24 -0500 Subject: [PATCH] Trackster performance improvements: (a) build tile messages only once during tile creation and (b) move tiles rather than show/hide tiles when scrolling. --- static/june_2007_style/blue/trackster.css | 2 +- static/june_2007_style/trackster.css.tmpl | 1 + static/scripts/packed/trackster.js | 2 +- static/scripts/trackster.js | 112 +++++++++++++--------- 4 files changed, 68 insertions(+), 49 deletions(-) diff --git a/static/june_2007_style/blue/trackster.css b/static/june_2007_style/blue/trackster.css index 9ac99cd5ea7..dab20f2faed 100644 --- a/static/june_2007_style/blue/trackster.css +++ b/static/june_2007_style/blue/trackster.css @@ -24,7 +24,7 @@ .track{background:white;} .track-header{text-align:left;padding:4px 0px;color:#666;} .track-header .menubutton{margin-left:0px;} -.track-content{text-align:center;border-top:1px solid #eee;border-bottom:2px solid #eee;background:#eee url('../images/tracks/diag_bg.gif');min-height:16px;} +.track-content{text-align:center;border-top:1px solid #eee;border-bottom:2px solid #eee;background:#eee url('../images/tracks/diag_bg.gif');min-height:16px;position:relative;} .track-name{float:left;margin-top:2px;height:16px;} .label-track .track-content{background:white;} .track-tile{background:white;} diff --git a/static/june_2007_style/trackster.css.tmpl b/static/june_2007_style/trackster.css.tmpl index 98d68c0bf02..bccf5540313 100644 --- a/static/june_2007_style/trackster.css.tmpl +++ b/static/june_2007_style/trackster.css.tmpl @@ -161,6 +161,7 @@ border-bottom: 2px solid #eee; background: #eee url('../images/tracks/diag_bg.gif'); min-height: 16px; + position: relative; } .track-name { diff --git a/static/scripts/packed/trackster.js b/static/scripts/packed/trackster.js index c87a6529b4d..a314d9b6318 100644 --- a/static/scripts/packed/trackster.js +++ b/static/scripts/packed/trackster.js @@ -1 +1 @@ -var class_module=function(b,a){var c=function(){var f=arguments[0];for(var e=1;ec){a=AFTER}else{if(f<=c){a=CONTAINED_BY}else{a=OVERLAP_END}}}return a};var is_overlap=function(c,b){var a=compute_overlap(c,b);return(a!==BEFORE&&a!==AFTER)};var get_random_color=function(a){if(!a){a="#ffffff"}if(typeof(a)==="string"){a=[a]}for(var j=0;jak){$(this).insertAfter(al);var av=n[al.attr("id")];av.remove_drawable(ap);av.container.add_drawable(ap);return}}}al=null;for(ao=0;ao=au&&at.offsetY<=ak){if(at.offsetY-au0?ao-1:ao))}}}).bind("dragstart",function(){ag["border-top"]=af.css("border-top");ag["border-bottom"]=af.css("border-bottom");$(this).css({"border-top":"1px solid blue","border-bottom":"1px solid blue"})}).bind("dragend",function(){$(this).css(ag)})};X.moveable=m;var ad=16,H=9,E=20,T=H+2,z=100,J=12000,R=200,C=5,v=10,L=5000,w=100,o="There was an error in indexing this dataset. ",K="A converter for this dataset is not installed. Please check your datatypes_conf.xml file.",F="No data for this chrom/contig.",t="Currently indexing... please wait",x="Tool cannot be rerun: ",a="Loading data...",Y="Ready for display",d=10,u=5,B=5;function Z(ag,af){if(!af){af=0}var ah=Math.pow(10,af);return Math.round(ag*ah)/ah}var c=function(af){this.num_elements=af;this.clear()};p(c.prototype,{get:function(ag){var af=this.key_ary.indexOf(ag);if(af!==-1){if(this.obj_cache[ag].stale){this.key_ary.splice(af,1);delete this.obj_cache[ag]}else{this.move_key_to_end(ag,af)}}return this.obj_cache[ag]},set:function(ag,ah){if(!this.obj_cache[ag]){if(this.key_ary.length>=this.num_elements){var af=this.key_ary.shift();delete this.obj_cache[af]}this.key_ary.push(ag)}this.obj_cache[ag]=ah;return ah},move_key_to_end:function(ag,af){this.key_ary.splice(af,1);this.key_ary.push(ag)},clear:function(){this.obj_cache={};this.key_ary=[]},size:function(){return this.key_ary.length}});var S=function(ag,af,ah){c.call(this,ag);this.track=af;this.subset=(ah!==undefined?ah:true)};p(S.prototype,c.prototype,{load_data:function(ao,aj,am,ag,al){var an=this.track.view.chrom,ai={chrom:an,low:ao,high:aj,mode:am,resolution:ag,dataset_id:this.track.dataset_id,hda_ldda:this.track.hda_ldda};$.extend(ai,al);if(this.track.filters_manager){var ap=[];var af=this.track.filters_manager.filters;for(var ak=0;ak1){return{data:null}}return S.prototype.load_data.call(this,af,ai,aj,ag,ah)}});var q=function(ai,ag,af,ah,ak){if(!q.id_counter){q.id_counter=0}this.id=q.id_counter++;this.name=ai;this.view=ag;this.container=af;this.config=new G({track:this,params:[{key:"name",label:"Name",type:"text",default_value:ai}],saved_values:ah,onchange:function(){this.track.set_name(this.track.config.values.name)}});this.prefs=this.config.values;this.drag_handle_class=ak;this.is_overview=false;this.content_visible=true;this.container_div=this.build_container_div();this.header_div=this.build_header_div();if(this.header_div){this.container_div.append(this.header_div);this.icons_div=this.build_icons_div().hide();this.header_div.append(this.icons_div);this.header_div.dblclick(function(al){al.stopPropagation()});var aj=this;this.container_div.hover(function(){aj.icons_div.show()},function(){aj.icons_div.hide()});$("
").appendTo(this.container_div)}};p(q.prototype,{init:function(){},request_draw:function(){},_draw:function(){},to_json:function(){},update_icons:function(){},set_name:function(af){this.old_name=this.name;this.name=af;this.name_div.text(this.name)},revert_name:function(){this.name=this.old_name;this.name_div.text(this.name)},remove:function(){this.container.remove_drawable(this);this.container_div.hide(0,function(){$(this).remove();view.update_intro_div();view.has_changes=true})},build_container_div:function(){},build_header_div:function(){},build_icons_div:function(){},update_icons:function(){},hide_contents:function(){},show_contents:function(){}});var y=function(aj,ai,ag,af,ah,ak){q.call(this,ai,ag,af,ah,ak);this.obj_type=aj;this.drawables=[]};p(y.prototype,q.prototype,{init:function(){for(var af=0;af").addClass("content-div").attr("id","group_"+this.id+"_content_div").appendTo(this.container_div);l(this.container_div,this);l(this.content_div,this);m(this.container_div,this.drag_handle_class,".group",this)};p(Q.prototype,q.prototype,y.prototype,{build_container_div:function(){return $("
").addClass("group").attr("id","group_"+this.id).appendTo(this.container.content_div)},build_header_div:function(){var af=$("
").addClass("track-header");af.append($("
").addClass(this.drag_handle_class));this.name_div=$("
").addClass("track-name").text(this.name).appendTo(af);return af},build_icons_div:function(){var af=$("
").css("float","left");this.toggle_icon=$("").attr("href","javascript:void(0);").attr("title","Hide/show group content").addClass("icon-button toggle").tipsy({gravity:"s"}).appendTo(af);this.settings_icon=$("").attr("href","javascript:void(0);").attr("title","Edit settings").addClass("icon-button settings-icon").tipsy({gravity:"s"}).appendTo(af);this.remove_icon=$("").attr("href","javascript:void(0);").attr("title","Remove").addClass("icon-button remove-icon").tipsy({gravity:"s"}).appendTo(af);var ag=this;this.toggle_icon.click(function(){if(ag.content_visible){ag.toggle_icon.addClass("toggle-expand").removeClass("toggle");ag.hide_contents();ag.content_visible=false}else{ag.toggle_icon.addClass("toggle").removeClass("toggle-expand");ag.content_visible=true;ag.show_contents()}});this.settings_icon.click(function(){var aj=function(){hide_modal();$(window).unbind("keypress.check_enter_esc")},ah=function(){ag.config.update_from_form($(".dialog-box"));hide_modal();$(window).unbind("keypress.check_enter_esc")},ai=function(ak){if((ak.keyCode||ak.which)===27){aj()}else{if((ak.keyCode||ak.which)===13){ah()}}};$(window).bind("keypress.check_enter_esc",ai);show_modal("Configure Group",ag.config.build_form(),{Cancel:aj,OK:ah})});this.remove_icon.click(function(){$(".tipsy").remove();ag.remove()});return af},hide_contents:function(){this.content_div.hide()},show_contents:function(){this.content_div.show();this.request_draw()}});var ac=function(af,ai,ah,ag){y.call(this,"View");this.container=af;this.chrom=null;this.vis_id=ah;this.dbkey=ag;this.title=ai;this.label_tracks=[];this.tracks_to_be_redrawn=[];this.max_low=0;this.max_high=0;this.zoom_factor=3;this.min_separation=30;this.has_changes=false;this.load_chroms_deferred=null;this.init();this.canvas_manager=new ae(af.get(0).ownerDocument);this.reset()};p(ac.prototype,y.prototype,{init:function(){var ah=this.container,af=this;this.top_container=$("
").addClass("top-container").appendTo(ah);this.browser_content_div=$("
").addClass("content").css("position","relative").appendTo(ah);this.bottom_container=$("
").addClass("bottom-container").appendTo(ah);this.top_labeltrack=$("
").addClass("top-labeltrack").appendTo(this.top_container);this.viewport_container=$("
").addClass("viewport-container").attr("id","viewport-container").appendTo(this.browser_content_div);this.content_div=this.viewport_container;l(this.viewport_container,af);this.intro_div=$("
").addClass("intro").appendTo(this.viewport_container).hide();var ai=$("
").text("Add Datasets to Visualization").addClass("action-button").appendTo(this.intro_div).click(function(){add_tracks()});this.nav_labeltrack=$("
").addClass("nav-labeltrack").appendTo(this.bottom_container);this.nav_container=$("
").addClass("nav-container").prependTo(this.top_container);this.nav=$("
").addClass("nav").appendTo(this.nav_container);this.overview=$("
").addClass("overview").appendTo(this.bottom_container);this.overview_viewport=$("
").addClass("overview-viewport").appendTo(this.overview);this.overview_close=$("").attr("href","javascript:void(0);").attr("title","Close overview").addClass("icon-button overview-close tooltip").hide().appendTo(this.overview_viewport);this.overview_highlight=$("
").addClass("overview-highlight").hide().appendTo(this.overview_viewport);this.overview_box_background=$("
").addClass("overview-boxback").appendTo(this.overview_viewport);this.overview_box=$("
").addClass("overview-box").appendTo(this.overview_viewport);this.default_overview_height=this.overview_box.height();this.nav_controls=$("
").addClass("nav-controls").appendTo(this.nav);this.chrom_select=$("").addClass("nav-input").hide().bind("keyup focusout",ag).appendTo(this.nav_controls);this.location_span=$("").addClass("location").attr("original-title","Click to change location").tipsy({gravity:"n"}).appendTo(this.nav_controls);this.location_span.click(function(){af.location_span.hide();af.chrom_select.hide();af.nav_input.val(af.chrom+":"+af.low+"-"+af.high);af.nav_input.css("display","inline-block");af.nav_input.select();af.nav_input.focus()});if(this.vis_id!==undefined){this.hidden_input=$("").attr("type","hidden").val(this.vis_id).appendTo(this.nav_controls)}this.zo_link=$("").attr("id","zoom-out").attr("title","Zoom out").tipsy({gravity:"n"}).click(function(){af.zoom_out();af.request_redraw()}).appendTo(this.nav_controls);this.zi_link=$("").attr("id","zoom-in").attr("title","Zoom in").tipsy({gravity:"n"}).click(function(){af.zoom_in();af.request_redraw()}).appendTo(this.nav_controls);this.load_chroms_deferred=this.load_chroms({low:0});this.chrom_select.bind("change",function(){af.change_chrom(af.chrom_select.val())});this.browser_content_div.click(function(aj){$(this).find("input").trigger("blur")});this.browser_content_div.bind("dblclick",function(aj){af.zoom_in(aj.pageX,this.viewport_container)});this.overview_box.bind("dragstart",function(aj,ak){this.current_x=ak.offsetX}).bind("drag",function(aj,al){var am=al.offsetX-this.current_x;this.current_x=al.offsetX;var ak=Math.round(am/af.viewport_container.width()*(af.max_high-af.max_low));af.move_delta(-ak)});this.overview_close.click(function(){af.reset_overview()});this.viewport_container.bind("draginit",function(aj,ak){if(aj.clientX>af.viewport_container.width()-16){return false}}).bind("dragstart",function(aj,ak){ak.original_low=af.low;ak.current_height=aj.clientY;ak.current_x=ak.offsetX}).bind("drag",function(al,an){var aj=$(this);var ao=an.offsetX-an.current_x;var ak=aj.scrollTop()-(al.clientY-an.current_height);aj.scrollTop(ak);an.current_height=al.clientY;an.current_x=an.offsetX;var am=Math.round(ao/af.viewport_container.width()*(af.high-af.low));af.move_delta(am)}).bind("mousewheel",function(al,an,ak,aj){if(ak){ak*=50;var am=Math.round(-ak/af.viewport_container.width()*(af.high-af.low));af.move_delta(am)}});this.top_labeltrack.bind("dragstart",function(aj,ak){return $("
").css({height:af.browser_content_div.height()+af.top_labeltrack.height()+af.nav_labeltrack.height()+1,top:"0px",position:"absolute","background-color":"#ccf",opacity:0.5,"z-index":1000}).appendTo($(this))}).bind("drag",function(an,ao){$(ao.proxy).css({left:Math.min(an.pageX,ao.startX),width:Math.abs(an.pageX-ao.startX)});var ak=Math.min(an.pageX,ao.startX)-af.container.offset().left,aj=Math.max(an.pageX,ao.startX)-af.container.offset().left,am=(af.high-af.low),al=af.viewport_container.width();af.update_location(Math.round(ak/al*am)+af.low,Math.round(aj/al*am)+af.low)}).bind("dragend",function(ao,ap){var ak=Math.min(ao.pageX,ap.startX),aj=Math.max(ao.pageX,ap.startX),am=(af.high-af.low),al=af.viewport_container.width(),an=af.low;af.low=Math.round(ak/al*am)+an;af.high=Math.round(aj/al*am)+an;$(ap.proxy).remove();af.request_redraw()});this.add_label_track(new ab(this,{content_div:this.top_labeltrack}));this.add_label_track(new ab(this,{content_div:this.nav_labeltrack}));$(window).bind("resize",function(){af.resize_window()});$(document).bind("redraw",function(){af.redraw()});this.reset();$(window).trigger("resize")},update_intro_div:function(){if(this.drawables.length===0){this.intro_div.show()}else{this.intro_div.hide()}},update_location:function(af,ag){this.location_span.text(commatize(af)+" - "+commatize(ag));this.nav_input.val(this.chrom+":"+commatize(af)+"-"+commatize(ag))},load_chroms:function(ah){ah.num=w;$.extend(ah,(this.vis_id!==undefined?{vis_id:this.vis_id}:{dbkey:this.dbkey}));var af=this,ag=$.Deferred();$.ajax({url:chrom_url,data:ah,dataType:"json",success:function(aj){if(aj.chrom_info.length===0){alert("Invalid chromosome: "+ah.chrom);return}if(aj.reference){af.add_label_track(new A(af))}af.chrom_data=aj.chrom_info;var am='';for(var al=0,ai=af.chrom_data.length;al'+ak+""}if(aj.prev_chroms){am+='"}if(aj.next_chroms){am+='"}af.chrom_select.html(am);af.chrom_start_index=aj.start_index;ag.resolve(aj)},error:function(){alert("Could not load chroms for this dbkey:",af.dbkey)}});return ag},change_chrom:function(ak,ag,am){if(!ak||ak==="None"){return}var ah=this;if(ak==="previous"){ah.load_chroms({low:this.chrom_start_index-w});return}if(ak==="next"){ah.load_chroms({low:this.chrom_start_index+w});return}var al=$.grep(ah.chrom_data,function(an,ao){return an.chrom===ak})[0];if(al===undefined){ah.load_chroms({chrom:ak},function(){ah.change_chrom(ak,ag,am)});return}else{if(ak!==ah.chrom){ah.chrom=ak;ah.chrom_select.val(ah.chrom);ah.max_high=al.len-1;ah.reset();ah.request_redraw(true);for(var aj=0,af=ah.drawables.length;ajaf.max_high){af.high=af.max_high;af.low=af.max_high-ag}else{af.high-=ah;af.low-=ah}}af.request_redraw()},add_drawable:function(af){y.prototype.add_drawable.call(this,af);af.init();this.has_changes=true;this.update_intro_div()},add_label_track:function(af){af.view=this;af.init();this.label_tracks.push(af)},remove_drawable:function(ah,ag){y.prototype.remove_drawable.call(this,ah);if(ag){var af=this;ah.container_div.hide(0,function(){$(this).remove();af.update_intro_div()});this.has_changes=true}},reset:function(){this.low=this.max_low;this.high=this.max_high;this.viewport_container.find(".yaxislabel").remove()},request_redraw:function(an,af,am,ag){var al=this,aj=(ag?[ag]:al.drawables),ah;var ag;for(var ak=0;akthis.max_high){ai=this.max_high}var ao=this.high-this.low;if(this.high!==0&&ao").addClass("dynamic-tool").hide();this.parent_div.bind("drag",function(aw){aw.stopPropagation()}).click(function(aw){aw.stopPropagation()}).bind("dblclick",function(aw){aw.stopPropagation()});var aq=$("
").appendTo(this.parent_div).text(this.name);var ao=this.params;var am=this;$.each(this.params,function(ax,aA){var az=$("
").addClass("param-row").appendTo(am.parent_div);var aw=$("
").addClass("param-label").text(aA.label).appendTo(az);var ay=$("
").addClass("slider").html(aA.html).appendTo(az);ay.find(":input").val(aA.value);$("
").appendTo(az)});this.parent_div.find("input").click(function(){$(this).select()});var av=$("
").addClass("param-row").appendTo(this.parent_div);var ak=$("").attr("value","Run on complete dataset").appendTo(av);var af=$("").attr("value","Run on visible region").css("margin-left","3em").appendTo(av);var am=this;af.click(function(){am.run_on_region()});ak.click(function(){am.run_on_dataset()})};p(r.prototype,{get_param_values_dict:function(){var af={};this.parent_div.find(":input").each(function(){var ag=$(this).attr("name"),ah=$(this).val();af[ag]=JSON.stringify(ah)});return af},get_param_values:function(){var ag=[];var af={};this.parent_div.find(":input").each(function(){var ah=$(this).attr("name"),ai=$(this).val();if(ah){ag[ag.length]=ai}});return ag},run_on_dataset:function(){var af=this;af.run({dataset_id:this.track.original_dataset_id,tool_id:af.name},null,function(ag){show_modal(af.name+" is Running",af.name+" is running on the complete dataset. Tool outputs are in dataset's history.",{Close:hide_modal})})},run_on_region:function(){var ag={dataset_id:this.track.original_dataset_id,chrom:this.track.view.chrom,low:this.track.view.low,high:this.track.view.high,tool_id:this.name},aj=this.track,ah=ag.tool_id+aj.tool_region_and_parameters_str(ag.chrom,ag.low,ag.high),af;if(aj.container===view){var ai=new Q(this.name,this.track.view,this.track.container);aj.container.add_drawable(ai);aj.container.remove_drawable(aj);ai.add_drawable(aj);aj.container_div.appendTo(ai.content_div);af=ai}else{af=aj.container}var ak=new aj.constructor(ah,view,af,"hda");ak.init_for_tool_data();ak.change_mode(aj.mode);af.add_drawable(ak);ak.content_div.text("Starting job.");this.run(ag,ak,function(al){ak.dataset_id=al.dataset_id;ak.content_div.text("Running job.");ak.init()})},run:function(ag,ah,ai){$.extend(ag,this.get_param_values_dict());var af=function(){$.getJSON(rerun_tool_url,ag,function(aj){if(aj==="no converter"){ah.container_div.addClass("error");ah.content_div.text(K)}else{if(aj.error){ah.container_div.addClass("error");ah.content_div.text(x+aj.message)}else{if(aj==="pending"){ah.container_div.addClass("pending");ah.content_div.text("Converting input data so that it can be used quickly with tool.");setTimeout(af,2000)}else{ai(aj)}}}})};af()}});var O=function(ag,af,ah,ai){this.name=ag;this.label=af;this.html=ah;this.value=ai};var g=function(ah,ag,aj,ak,ai,af){O.call(this,ah,ag,aj,ak);this.min=ai;this.max=af};var h=function(ag,af,ah,ai){this.name=ag;this.index=af;this.tool_id=ah;this.tool_exp_name=ai};var V=function(ag,af,ah,ai){h.call(this,ag,af,ah,ai);this.low=-Number.MAX_VALUE;this.high=Number.MAX_VALUE;this.min=Number.MAX_VALUE;this.max=-Number.MAX_VALUE;this.container=null;this.slider=null;this.slider_label=null};p(V.prototype,{applies_to:function(af){if(af.length>this.index){return true}return false},keep:function(af){if(!this.applies_to(af)){return true}var ag=af[this.index];return(isNaN(ag)||(ag>=this.low&&ag<=this.high))},update_attrs:function(ag){var af=false;if(!this.applies_to(ag)){return af}if(ag[this.index]this.max){this.max=Math.ceil(ag[this.index]);af=true}return af},update_ui_elt:function(){if(this.min!=this.max){this.container.show()}else{this.container.hide()}var ah=function(ak,ai){var aj=ai-ak;return(aj<=2?0.01:1)};var ag=this.slider.slider("option","min"),af=this.slider.slider("option","max");if(this.minaf){this.slider.slider("option","min",this.min);this.slider.slider("option","max",this.max);this.slider.slider("option","step",ah(this.min,this.max));this.slider.slider("option","values",[this.min,this.max])}}});var aa=function(aq,ay){this.track=aq;this.filters=[];for(var at=0;at").attr("size",input_size).attr("maxlength",input_size).attr("value",aD).appendTo(aB).focus().select().click(function(aE){aE.stopPropagation()}).blur(function(){$(this).remove();aB.text(aD)}).keyup(function(aI){if(aI.keyCode===27){$(this).trigger("blur")}else{if(aI.keyCode===13){var aG=aC.slider("option","min"),aE=aC.slider("option","max"),aH=function(aJ){return(isNaN(aJ)||aJ>aE||aJ").addClass("filters").hide();this.parent_div.bind("drag",function(aA){aA.stopPropagation()}).click(function(aA){aA.stopPropagation()}).bind("dblclick",function(aA){aA.stopPropagation()}).bind("keydown",function(aA){aA.stopPropagation()});var av=$("
").addClass("sliders").appendTo(this.parent_div);var an=this;$.each(this.filters,function(aD,aF){aF.container=$("
").addClass("filter-row slider-row").appendTo(av);var aE=$("
").addClass("elt-label").appendTo(aF.container);var aC=$("").addClass("slider-name").text(aF.name+" ").appendTo(aE);var aB=$("");var aH=$("").addClass("slider-value").appendTo(aE).append("[").append(aB).append("]");var aA=$("
").addClass("slider").appendTo(aF.container);aF.control_element=$("
").attr("id",aF.name+"-filter-control").appendTo(aA);var aG=[0,0];aF.control_element.slider({range:true,min:Number.MAX_VALUE,max:-Number.MIN_VALUE,values:[0,0],slide:function(aJ,aK){var aI=aK.values;aB.text(aI[0]+"-"+aI[1]);aF.low=aI[0];aF.high=aI[1];an.track.request_draw(true,true)},change:function(aI,aJ){aF.control_element.slider("option","slide").call(aF.control_element,aI,aJ)}});aF.slider=aF.control_element;aF.slider_label=aB;ai(aH,aB,aF.control_element);$("
").appendTo(aF.container)});if(this.filters.length!==0){var ak=$("
").addClass("param-row").appendTo(av);var am=$("").attr("value","Run on complete dataset").appendTo(ak);var ag=this;am.click(function(){ag.run_on_dataset()})}var ap=$("
").addClass("display-controls").appendTo(this.parent_div),ar,al,ao,aj={Transparency:function(aA){an.alpha_filter=aA},Height:function(aA){an.height_filter=aA}};$.each(aj,function(aC,aB){ar=$("
").addClass("filter-row").appendTo(ap),al=$("").addClass("elt-label").text(aC+":").appendTo(ar),ao=$("').attr("id",ak).attr("name",ak).attr("checked",at))}else{if(ah.type==="text"){av.append($('').attr("id",ak).val(at).click(function(){$(this).select()}))}else{if(ah.type=="select"){var aq=$("").attr("id",ak).attr("name",ak).val(at);var ar=$("
").hide();var al=$("
").appendTo(ar);var au=$("
").appendTo(al).farbtastic({width:100,height:100,callback:ap,color:at});$("
").append(ap).append(ar).appendTo(av).bind("click",function(aw){ar.css({left:$(this).position().left+$(ap).width()+5,top:$(this).position().top-($(ar).height()/2)+($(ap).height()/2)}).show();$(document).bind("click.color-picker",function(){ar.hide();$(document).unbind("click.color-picker")});aw.stopPropagation()})}else{av.append($("").attr("id",ak).attr("name",ak).val(at))}}}}if(ah.help){av.append($("
").text(ah.help))}}}ag(this.params,af);return af},update_from_form:function(af){var ah=this;var ag=false;$.each(this.params,function(ai,ak){if(!ak.hidden){var al="param_"+ai;var aj=af.find("#"+al).val();if(ak.type==="float"){aj=parseFloat(aj)}else{if(ak.type==="int"){aj=parseInt(aj)}else{if(ak.type==="bool"){aj=af.find("#"+al).is(":checked")}}}if(aj!==ah.values[ak.key]){ah.values[ak.key]=aj;ag=true}}});if(ag){this.onchange()}}});var b=function(af,ai,ah,ag,aj){this.track=af;this.index=ai;this.low=ai*R*ah;this.high=(ai+1)*R*ah;this.resolution=ah;this.canvas=$("
").append(ag);this.data=aj;this.stale=false};b.prototype.predisplay_actions=function(){};var k=function(af,ai,ah,ag,aj,ak){b.call(this,af,ai,ah,ag,aj);this.max_val=ak};p(k.prototype,b.prototype);var P=function(af,aj,ai,ah,al,am,ak,ag){b.call(this,af,aj,ai,ah,al);this.mode=am;this.message=ak;this.feature_mapper=ag};p(P.prototype,b.prototype);P.prototype.predisplay_actions=function(){var ag=this,af={};if(ag.mode!=="Pack"){return}$(this.canvas).hover(function(){this.hovered=true;$(this).mousemove()},function(){this.hovered=false;$(this).siblings(".feature-popup").remove()}).mousemove(function(ar){if(!this.hovered){return}var am=$(this).offset(),aq=ar.pageX-am.left,ap=ar.pageY-am.top,aw=ag.feature_mapper.get_feature_data(aq,ap),an=(aw?aw[0]:null);$(this).siblings(".feature-popup").each(function(){if(!an||$(this).attr("id")!==an.toString()){$(this).remove()}});if(aw){var ai=af[an];if(!ai){var an=aw[0],at={name:aw[3],start:aw[1],end:aw[2],strand:aw[4]},al=ag.track.filters_manager.filters,ak;for(var ao=0;ao").attr("id",an).addClass("feature-popup"),ax=$(""),av,au,ay;for(av in at){au=at[av];ay=$("").appendTo(ax);$("
").appendTo(ay).text(av);$("").attr("align","left").appendTo(ay).text(typeof(au)=="number"?Z(au,2):au)}ai.append($("
").append(ax));af[an]=ai}ai.appendTo($(ag.canvas).parent());var aj=aq+parseInt(ag.canvas.css("left"))-ai.width()/2,ah=ap+parseInt(ag.canvas.css("top"))+7;ai.css("left",aj+"px").css("top",ah+"px")}else{if(!ar.isPropagationStopped()){ar.stopPropagation();$(this).siblings().each(function(){$(this).trigger(ar)})}}}).mouseleave(function(){$(this).siblings(".feature-popup").remove()})};var i=function(ai,ag,af,ah,aj,ak){q.call(this,ai,ag,af,{},"draghandle");this.data_url=(aj?aj:default_data_url);this.data_url_extra_params={};this.data_query_wait=(ak?ak:L);this.dataset_check_url=converted_datasets_state_url;if(!i.id_counter){i.id_counter=0}this.id=i.id_counter++;this.content_div=$("
").appendTo(this.container_div);this.container.content_div.append(this.container_div)};p(i.prototype,q.prototype,{build_container_div:function(){return $("
").addClass("track").attr("id","track_"+this.id).css("position","relative")},build_header_div:function(){var af=$("
");if(this.view.editor){this.drag_div=$("
").addClass(this.drag_handle_class).appendTo(af)}this.name_div=$("
").addClass("track-name").appendTo(af).text(this.name).attr("id",this.name.replace(/\s+/g,"-").replace(/[^a-zA-Z0-9\-]/g,"").toLowerCase());return af},build_icons_div:function(){var aj=$("
").css("float","left");this.mode_icon=$("").attr("href","javascript:void(0);").attr("title","Set display mode").addClass("icon-button chevron-expand").tipsy({gravity:"s"}).appendTo(aj);this.toggle_icon=$("").attr("href","javascript:void(0);").attr("title","Hide/show track content").addClass("icon-button toggle").tipsy({gravity:"s"}).appendTo(aj);this.settings_icon=$("").attr("href","javascript:void(0);").attr("title","Edit settings").addClass("icon-button settings-icon").tipsy({gravity:"s"}).appendTo(aj);this.overview_icon=$("").attr("href","javascript:void(0);").attr("title","Set as overview").addClass("icon-button overview-icon").tipsy({gravity:"s"}).appendTo(aj);this.filters_icon=$("").attr("href","javascript:void(0);").attr("title","Filters").addClass("icon-button filters-icon").tipsy({gravity:"s"}).appendTo(aj).hide();this.tools_icon=$("").attr("href","javascript:void(0);").attr("title","Tools").addClass("icon-button tools-icon").tipsy({gravity:"s"}).appendTo(aj).hide();this.remove_icon=$("").attr("href","javascript:void(0);").attr("title","Remove").addClass("icon-button remove-icon").tipsy({gravity:"s"}).appendTo(aj);var ag=this;if(ag.display_modes!==undefined){var al=(ag.config&&ag.config.values.mode?ag.config.values.mode:ag.display_modes[0]);ag.mode=al;this.mode_icon.attr("title","Set display mode (now: "+ag.mode+")");var ai={};for(var ah=0,af=ag.display_modes.length;ah").text("View error").click(function(){show_modal("Trackster Error","
"+ag.message+"
",{Close:hide_modal})});af.content_div.append(ah)}}else{if(ag==="no converter"){af.container_div.addClass("error");af.content_div.text(K)}else{if(ag==="no data"||(ag.data!==undefined&&(ag.data===null||ag.data.length===0))){af.container_div.addClass("nodata");af.content_div.text(F)}else{if(ag==="pending"){af.container_div.addClass("pending");af.content_div.text(t);setTimeout(function(){af.init()},af.data_query_wait)}else{if(ag.status==="data"){if(ag.valid_chroms){af.valid_chroms=ag.valid_chroms;af.update_icons()}af.content_div.text(Y);if(af.view.chrom){af.content_div.text("");af.content_div.css("height",af.height_px+"px");af.enabled=true;$.when(af.predraw_init()).done(function(){af.container_div.removeClass("nodata error pending");af.request_draw()})}}}}}}});this.update_icons()},predraw_init:function(){}});var N=function(aj,ah,ag,ai,al,ak){i.call(this,aj,ah,ag,ai);var af=this,ah=af.view;m(af.container_div,af.drag_handle_class,".group",af);this.filters_manager=new aa(this,(al!==undefined?al:{}));this.filters_available=false;this.filters_visible=false;this.tool=(ak!==undefined&&obj_length(ak)>0?new r(this,ak):undefined);if(this.header_div){if(this.filters_manager){this.filters_div=this.filters_manager.parent_div;this.header_div.after(this.filters_div)}if(this.tool){this.dynamic_tool_div=this.tool.parent_div;this.header_div.after(this.dynamic_tool_div)}}};p(N.prototype,q.prototype,i.prototype,{copy:function(af){return new this.constructor(this.name,this.view,af,this.hda_ldda,this.dataset_id,this.prefs,this.filters,this.tool)},to_json:function(){return{track_type:this.get_type(),name:this.name,hda_ldda:this.hda_ldda,dataset_id:this.dataset_id,prefs:this.prefs,mode:this.mode,}},change_mode:function(ag){var af=this;af.mode=ag;af.config.values.mode=ag;af.tile_cache.clear();af.request_draw();this.mode_icon.attr("title","Set display mode (now: "+af.mode+")");return af},update_icons:function(){var af=this;if(af.filters_available>0){af.filters_icon.show()}else{af.filters_icon.hide()}if(af.tool){af.tools_icon.show()}else{af.tools_icon.hide()}},_gen_tile_cache_key:function(ag,ah,af){return ag+"_"+ah+"_"+af},request_draw:function(ag,af){this.view.request_redraw(false,ag,af,this)},_draw:function(ah,ap){if(!this.enabled){return}if(!this.content_visible){return}if(!(this instanceof A)&&(!this.dataset_id)){return}var ao=this.view.low,al=this.view.high,am=al-ao,ai=this.view.container.width(),at=ai/am,ak=this.view.resolution,ar=$("
");if(this.is_overview){ao=this.view.max_low;al=this.view.max_high;ak=Math.pow(C,Math.ceil(Math.log((view.max_high-view.max_low)/R)/Math.log(C)));at=ai/(view.max_high-view.max_low)}if(!ap){this.content_div.children().remove()}this.content_div.append(ar);this.max_height=0;var ag=Math.floor(ao/ak/R);var an=true;var aq=[];var af=0;while((ag*R*ak)view.canvas_manager.char_width_px){au=view.reference_track.data_manager.get_data(an,av,aj.mode,al,view.reference_track.data_url_extra_params);if(ap(au)){ak=false}}if(ak){p(af,am);var ao=aj.draw_tile(af,aj.mode,al,ai,aw,au);if(ao!==undefined){aj.tile_cache.set(aq,ao);aj.show_tile(ao,ar,aw)}return ao}$.when(af,au).then(function(){view.request_redraw(false,false,false,aj)});return null},show_tile:function(al,an,ao){var ah=this,ag=al.canvas,ak=ag;if(al.message){var ap=$("
"),am=$("
").addClass("tile-message").text(al.message).css({height:E-1,width:al.canvas.width}).appendTo(ap),aj=$("").addClass("icon more-down").appendTo(am),af=$("").addClass("icon more-across").appendTo(am);ap.append(ag);ak=ap;aj.click(function(){al.stale=true;ah.data_manager.get_more_data(al.low,al.high,ah.mode,al.resolution,{},ah.data_manager.DEEP_DATA_REQ);ah.request_draw()}).dblclick(function(aq){aq.stopPropagation()});af.click(function(){al.stale=true;ah.data_manager.get_more_data(al.low,al.high,ah.mode,al.resolution,{},ah.data_manager.BROAD_DATA_REQ);ah.request_draw()}).dblclick(function(aq){aq.stopPropagation()})}al.predisplay_actions();var ai=(al.low-(this.is_overview?this.view.max_low:this.view.low))*ao;if(this.left_offset){ai-=this.left_offset}ak.css({position:"absolute",top:0,left:ai,height:""});an.append(ak);ah.max_height=Math.max(ah.max_height,ak.height());ah.content_div.css("height",ah.max_height+"px");an.children().css("height",ah.max_height+"px")},_get_tile_bounds:function(af,ag){var ai=af*R*ag,aj=R*ag,ah=(ai+aj<=this.view.max_high?ai+aj:this.view.max_high);return[ai,ah]},tool_region_and_parameters_str:function(ah,af,ai){var ag=this,aj=(ah!==undefined&&af!==undefined&&ai!==undefined?ah+":"+af+"-"+ai:"all");return" - region=["+aj+"], parameters=["+ag.tool.get_param_values().join(", ")+"]"},init_for_tool_data:function(){this.data_url=raw_data_url;this.data_query_wait=1000;this.dataset_check_url=dataset_state_url;this.predraw_init=function(){var ag=this;var af=function(){if(ag.data_manager.size()===0){setTimeout(af,300)}else{ag.data_url=default_data_url;ag.data_query_wait=L;ag.dataset_state_url=converted_datasets_state_url;$.getJSON(ag.dataset_state_url,{dataset_id:ag.dataset_id,hda_ldda:ag.hda_ldda},function(ah){})}};af()}}});var ab=function(ag,af){i.call(this,"label",ag,af,false,{});this.container_div.addClass("label-track")};p(ab.prototype,i.prototype,{build_header_div:function(){},init:function(){this.enabled=true},_draw:function(){var ah=this.view,ai=ah.high-ah.low,al=Math.floor(Math.pow(10,Math.floor(Math.log(ai)/Math.log(10)))),af=Math.floor(ah.low/al)*al,aj=this.view.container.width(),ag=$("
");while(af"+commatize(af)+"
").css({position:"absolute",left:ak-1}));af+=al}this.content_div.children(":first").remove();this.content_div.append(ag)}});var A=function(af){N.call(this,"reference",af,{content_div:af.top_labeltrack},{});af.reference_track=this;this.left_offset=200;this.height_px=12;this.container_div.addClass("reference-track");this.content_div.css("background","none");this.content_div.css("min-height","0px");this.content_div.css("border","none");this.data_url=reference_url;this.data_url_extra_params={dbkey:af.dbkey};this.data_manager=new I(B,this,false);this.tile_cache=new c(u)};p(A.prototype,q.prototype,N.prototype,{build_header_div:function(){},init:function(){this.enabled=true},draw_tile:function(ap,al,ak,ag,aq){var aj=this,ah=R*ak;if(aq>this.view.canvas_manager.char_width_px){if(ap.data===null){aj.content_div.css("height","0px");return}var ai=this.view.canvas_manager.new_canvas();var ao=ai.getContext("2d");ai.width=Math.ceil(ah*aq+aj.left_offset);ai.height=aj.height_px;ao.font=ao.canvas.manager.default_font;ao.textAlign="center";ap=ap.data;for(var am=0,an=ap.length;am");$(af.container_div).hover(function(){if(af.content_visible){ai=true;ag.show()}},function(){ai=false;if(!ah){ag.hide()}});ag.hide().bind("dragstart",function(aj,ak){ah=true;ak.original_height=$(af.content_div).height()}).bind("drag",function(ak,al){var aj=Math.min(Math.max(al.original_height+al.deltaY,af.min_height_px),af.max_height_px);$(af.content_div).css("height",aj);af.height_px=aj;af.request_draw(true)}).bind("dragend",function(aj,ak){af.tile_cache.clear();ah=false;if(!ai){ag.hide()}af.config.values.height=af.height_px}).appendTo(af.container_div)},predraw_init:function(){var af=this;af.vertical_range=undefined;return $.getJSON(af.data_url,{stats:true,chrom:af.view.chrom,low:null,high:null,hda_ldda:af.hda_ldda,dataset_id:af.dataset_id},function(ag){af.container_div.addClass("line-track");var aj=ag.data;if(isNaN(parseFloat(af.prefs.min_value))||isNaN(parseFloat(af.prefs.max_value))){var ah=aj.min;var al=aj.max;ah=Math.floor(Math.min(0,Math.max(ah,aj.mean-2*aj.sd)));al=Math.ceil(Math.max(0,Math.min(al,aj.mean+2*aj.sd)));af.prefs.min_value=ah;af.prefs.max_value=al;$("#track_"+af.dataset_id+"_minval").val(af.prefs.min_value);$("#track_"+af.dataset_id+"_maxval").val(af.prefs.max_value)}af.vertical_range=af.prefs.max_value-af.prefs.min_value;af.total_frequency=aj.total_frequency;af.container_div.find(".yaxislabel").remove();var ak=$("
").addClass("yaxislabel").attr("id","linetrack_"+af.dataset_id+"_minval").text(Z(af.prefs.min_value,3));var ai=$("
").addClass("yaxislabel").attr("id","linetrack_"+af.dataset_id+"_maxval").text(Z(af.prefs.max_value,3));ai.css({position:"absolute",top:"24px",left:"10px"});ai.prependTo(af.container_div);ak.css({position:"absolute",bottom:"2px",left:"10px"});ak.prependTo(af.container_div)})},draw_tile:function(ar,ak,aj,ah,aq){if(this.vertical_range===undefined){return}var af=this._get_tile_bounds(ah,aj),al=af[0],ap=af[1],ag=Math.ceil((ap-al)*aq),an=this.height_px;var ai=this.view.canvas_manager.new_canvas();ai.width=ag,ai.height=an;var ao=ai.getContext("2d");var am=new M.LinePainter(ar.data,al,ap,this.prefs,ak);am.draw(ao,ag,an);return new b(this.track,ah,aj,ai,ar.data)}});var e=function(af,al,ag,ak,an,am,ai,aj){var ah=this;this.display_modes=["Auto","Histogram","Dense","Squish","Pack"];N.call(this,af,al,ag,am,ai,aj);this.config=new G({track:this,params:[{key:"name",label:"Name",type:"text",default_value:af},{key:"block_color",label:"Block color",type:"color",default_value:get_random_color()},{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:"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},],saved_values:am,onchange:function(){ah.set_name(ah.prefs.name);ah.tile_cache.clear();ah.set_painter_from_config();ah.request_draw()}});this.prefs=this.config.values;this.height_px=0;this.container_div.addClass("feature-track");this.hda_ldda=ak;this.dataset_id=an;this.original_dataset_id=an;this.show_labels_scale=0.001;this.showing_details=false;this.summary_draw_height=30;this.inc_slots={};this.start_end_dct={};this.tile_cache=new c(d);this.data_manager=new S(20,this);this.left_offset=200;this.set_painter_from_config()};p(e.prototype,q.prototype,N.prototype,{set_painter_from_config:function(){if(this.config.values.connector_style=="arcs"){this.painter=M.ArcLinkedFeaturePainter}else{this.painter=M.LinkedFeaturePainter}},postdraw_actions:function(av,af,aw,au){N.prototype.postdraw_actions.call(this,av,au);var ai=this;if(au){var ak=ai.content_div.children();var al=false;for(var aj=ak.length-1,ap=0;aj>=ap;aj--){var ah=$(ak[aj]);if(al){ah.remove()}else{if(ah.children().length!==0){al=true}}}}if(ai.mode=="Histogram"){var ao=-1;for(var aj=0;ajao){ao=at}}for(var aj=0;ajah-am){av=ah-am}var aq=Math.floor((ah-am)/av),au=[],ai=0;var ak=0,al=0,ap,at=0,an=[],ar,ao;var ag=function(ay,ax,az,aw){ay[0]=ax+az*aw;ay[1]=ax+(az+1)*aw};while(atai){ai=ar[1]}at++}return{max:ai,delta:aq,data:au}},draw_tile:function(au,ax,aB,aF,ap,ai){var ay=this,ak=ay._get_tile_bounds(aF,aB),aI=ak[0],ag=ak[1],aw=ag-aI,az=Math.ceil(aw*ap),aO=25,aj=this.left_offset,av,al;if(ax==="Auto"){if(au.dataset_type==="summary_tree"){ax=au.dataset_type}else{if(au.extra_info==="no_detail"||ay.is_overview){ax="no_detail"}else{var aN=au.data;if(this.view.high-this.view.low>J){ax="Squish"}else{ax="Pack"}}}this.update_auto_mode(ax)}if(ax==="summary_tree"||ax==="Histogram"){al=this.summary_draw_height;this.container_div.find(".yaxislabel").remove();var af=$("
").addClass("yaxislabel");af.text(au.max);af.css({position:"absolute",top:"24px",left:"10px",color:this.prefs.label_color});af.prependTo(this.container_div);var ah=this.view.canvas_manager.new_canvas();ah.width=az+aj;ah.height=al+T;if(au.dataset_type!="summary_tree"){var aq=this.get_summary_tree_data(au.data,aI,ag,200);if(au.max){aq.max=au.max}au=aq}var aK=new M.SummaryTreePainter(au,aI,ag,this.prefs);var aA=ah.getContext("2d");aA.translate(aj,T);aK.draw(aA,az,al);return new k(ay,aF,aB,ah,au.data,au.max)}var av,an=1;if(ax==="no_detail"||ax==="Squish"||ax==="Pack"){an=this.incremental_slots(ap,au.data,ax);av=this.inc_slots[ap].slots}var ao=[];if(au.data){var ar=this.filters_manager.filters;for(var aC=0,aE=au.data.length;aCi[0]&&F=0){g-=v;j="left"}else{k+=v;j="right"}}var t=q(g,k);if(t>=0){if(h[t]===undefined){h[t]=[]}h[t].push([g,k]);s[o]=t;n=Math.max(n,t)}else{}}return n+1}})};var painters_module=function(i,x){var u=i("class").extend;var p=function(I,A,G,z,F,D){if(D===undefined){D=4}var C=z-A;var B=F-G;var E=Math.floor(Math.sqrt(C*C+B*B)/D);var J=C/E;var H=B/E;var y;for(y=0;y1){C=Math.ceil((T[1][0]-T[0][0])*B)}else{C=10}for(var O=0,P=T.length;OD){Q=true;E=D}}if(I==="Histogram"){E=Math.round(E/J*z);N.fillRect(R,U,C,-E)}else{if(I==="Intensity"){E=255-Math.floor((E-H)/J*255);N.fillStyle="rgb("+E+","+E+","+E+")";N.fillRect(R,0,C,z)}else{E=Math.round(z-(E-H)/J*z);if(F){N.lineTo(R,E)}else{F=true;if(I==="Filled"){N.moveTo(R,z);N.lineTo(R,E)}else{N.moveTo(R,E)}}}}N.fillStyle=this.prefs.overflow_color;if(Q||G){var S;if(I==="Histogram"||I==="Intensity"){S=C}else{R-=2;S=4}if(Q){N.fillRect(R,0,S,3)}if(G){N.fillRect(R,z-3,S,3)}}N.fillStyle=this.prefs.color}if(I==="Filled"){if(F){N.lineTo(R,U);N.lineTo(0,U)}N.fill()}else{N.stroke()}N.restore()};var m=function(y){this.feature_positions={};this.slot_height=y;this.translation=0;this.y_translation=0};m.prototype.map_feature_data=function(z,B,y,A){if(!this.feature_positions[B]){this.feature_positions[B]=[]}this.feature_positions[B].push({data:z,x_start:y,x_end:A})};m.prototype.get_feature_data=function(z,D){var C=Math.floor((D-this.y_translation)/this.slot_height),B;if(!this.feature_positions[C]){return null}z+=this.translation;for(var A=0;A=B.x_start&&z<=B.x_end){return B.data}}};var o=function(A,D,y,z,C,E,B){l.call(this,A,D,y,z,C);this.alpha_scaler=(E?E:new d());this.height_scaler=(B?B:new d())};o.prototype.default_prefs={block_color:"#FFF",connector_color:"#FFF"};u(o.prototype,{get_required_height:function(A,z){var y=y_scale=this.get_row_height(),B=this.mode;if(B==="no_detail"||B==="Squish"||B==="Pack"){y=A*y_scale}return y+this.get_top_padding(z)+this.get_bottom_padding(z)},get_top_padding:function(y){return 0},get_bottom_padding:function(y){return Math.max(Math.round(this.get_row_height()/2),5)},draw:function(K,I,G,F){var Q=this.data,D=this.view_start,M=this.view_end;K.save();K.fillStyle=this.prefs.block_color;K.textAlign="right";var H=this.view_end-this.view_start,E=I/H,L=this.get_row_height(),P=new m(L),B;for(var N=0,O=Q.length;ND)&&(this.mode=="Dense"||z!==null)){B=this.draw_element(K,this.mode,A,z,D,M,E,L,I);P.map_feature_data(A,z,B[0],B[1])}}K.restore();P.y_translation=this.get_top_padding(I);return P},draw_element:function(E,A,G,C,B,D,F,z,y){console.log("WARNING: Unimplemented function.");return[0,0]}});var c=10,h=3,k=5,w=10,f=1,s=9,e=3,a=9,j=2,g="#ccc";var r=function(A,D,y,z,C,E,B){o.call(this,A,D,y,z,C,E,B);this.draw_background_connector=true;this.draw_individual_connectors=false};u(r.prototype,o.prototype,{get_row_height:function(){var z=this.mode,y;if(z==="Dense"){y=c}else{if(z==="no_detail"){y=h}else{if(z==="Squish"){y=k}else{y=w}}}return y},draw_element:function(M,D,X,H,O,aj,an,ap,y){var T=X[0],al=X[1],ad=X[2],Q=X[3],ae=Math.floor(Math.max(0,(al-O)*an)),N=Math.ceil(Math.min(y,Math.max(0,(ad-O)*an))),ac=ae,ao=N,aa=(D==="Dense"?0:(0+H))*ap+this.get_top_padding(y),L,ah,R=null,ar=null,B=this.prefs.block_color,ag=this.prefs.label_color;M.globalAlpha=this.alpha_scaler.gen_val(X);if(D==="Dense"){H=1}if(D==="no_detail"){M.fillStyle=B;M.fillRect(ae,aa+5,N-ae,f)}else{var K=X[4],Z=X[5],af=X[6],C=X[7],V=true;if(Z&&af){R=Math.floor(Math.max(0,(Z-O)*an));ar=Math.ceil(Math.min(y,Math.max(0,(af-O)*an)))}var am,U;if(D==="Squish"){am=1;U=e;V=false}else{if(D==="Dense"){am=5;U=s}else{am=5;U=a}}if(!C){M.fillStyle=B;M.fillRect(ae,aa+1,N-ae,U);if(K&&V){if(K==="+"){M.fillStyle=M.canvas.manager.get_pattern("right_strand_inv")}else{if(K==="-"){M.fillStyle=M.canvas.manager.get_pattern("left_strand_inv")}}M.fillRect(ae,aa+1,N-ae,U)}}else{var J,W;if(D==="Squish"||D==="Dense"){J=aa+Math.floor(e/2)+1;W=1}else{if(K){J=aa;W=U}else{J+=(e/2)+1;W=1}}if(this.draw_background_connector){if(D==="Squish"||D==="Dense"){M.fillStyle=g}else{if(K){if(K==="+"){M.fillStyle=M.canvas.manager.get_pattern("right_strand")}else{if(K==="-"){M.fillStyle=M.canvas.manager.get_pattern("left_strand")}}}else{M.fillStyle=g}}M.fillRect(ae,J,N-ae,W)}var E;for(var ak=0,A=C.length;akY){continue}M.fillStyle=B;M.fillRect(z,aa+(U-am)/2+1,Y-z,am);if(R!==undefined&&af>Z&&!(z>ar||YO){M.fillStyle=ag;if(O===0&&ae-M.measureText(Q).width<0){M.textAlign="left";M.fillText(Q,N+j,aa+8);ao+=M.measureText(Q).width+j}else{M.textAlign="right";M.fillText(Q,ae-j,aa+8);ac-=M.measureText(Q).width+j}}}M.globalAlpha=1;return[ac,ao]}});var t=function(B,E,y,A,D,F,C,z){o.call(this,B,E,y,A,D,F,C);this.ref_seq=(z?z.data:null)};u(t.prototype,o.prototype,{get_row_height:function(){var y,z=this.mode;if(z==="Dense"){y=c}else{if(z==="Squish"){y=k}else{y=w;if(this.prefs.show_insertions){y*=2}}}return y},draw_read:function(K,A,ag,V,L,aa,ad,C,B,M){K.textAlign="center";var J=this,R=[L,aa],Z=0,W=0,D=0,F=K.canvas.manager.char_width_px,y=(B==="+"?this.prefs.block_color:this.prefs.reverse_strand_color);var O=[];if((A==="Pack"||this.mode==="Auto")&&M!==undefined&&ag>F){D=Math.round(ag/2)}if(!C){C=[[0,M.length]]}for(var G=0,I=C.length;G0){K.fillStyle=y;K.fillRect(Y-D,V+1,ab-Y,9);K.fillStyle=g;for(var af=0,H=N.length;af=L&&U+af<=aa){var X=Math.floor(Math.max(0,(U+af-L)*ag));K.fillText(N[af],X,V+9)}}}else{K.fillStyle=y;K.fillRect(Y,V+4,ab-Y,e)}}W+=S;Z+=S;break;case"N":K.fillStyle=g;K.fillRect(Y-D,V+5,ab-Y,1);Z+=S;break;case"D":K.fillStyle="red";K.fillRect(Y-D,V+4,ab-Y,3);Z+=S;break;case"P":break;case"I":var ah=Y-D;if(is_overlap([U,U+S],R)){var N=M.slice(W,W+S);if(this.prefs.show_insertions){var T=Y-(ab-Y)/2;if((A==="Pack"||this.mode==="Auto")&&M!==undefined&&ag>F){K.fillStyle="yellow";K.fillRect(T-D,V-9,ab-Y,9);O[O.length]={type:"triangle",data:[ah,V+4,5]};K.fillStyle=g;switch(compute_overlap([U,U+S],R)){case (OVERLAP_START):N=N.slice(L-U);break;case (OVERLAP_END):N=N.slice(0,U-aa);break;case (CONTAINED_BY):break;case (CONTAINS):N=N.slice(L-U,U-aa);break}for(var af=0,H=N.length;afF){O.push({type:"text",data:[N.length,ah,V+9]})}else{}}}W+=S;break;case"X":W+=S;break}}K.fillStyle="yellow";var Q,ai,ae;for(var ac=0;acR.canvas.manager.char_width_px){var O=Math.round(I/2)}if(E[5] instanceof Array){var N=Math.floor(Math.max(0,(E[4][0]-U)*I)),L=Math.ceil(Math.min(P,Math.max(0,(E[4][1]-U)*I))),K=Math.floor(Math.max(0,(E[5][0]-U)*I)),y=Math.ceil(Math.min(P,Math.max(0,(E[5][1]-U)*I)));if(E[4][1]>=U&&E[4][0]<=z&&E[4][2]){this.draw_read(R,M,I,C,U,z,E[4][0],E[4][2],E[4][3],E[4][4])}if(E[5][1]>=U&&E[5][0]<=z&&E[5][2]){this.draw_read(R,M,I,C,U,z,E[5][0],E[5][2],E[5][3],E[5][4])}if(K>L){R.fillStyle=g;p(R,L-O,C+5,K-O,C+5)}}else{this.draw_read(R,M,I,C,U,z,Q,E[4],E[5],E[6])}if(M==="Pack"&&Q>U&&J!=="."){R.fillStyle=this.prefs.label_color;var T=1;if(T===0&&D-R.measureText(J).width<0){R.textAlign="left";R.fillText(J,F+j-O,C+8)}else{R.textAlign="right";R.fillText(J,D-j-O,C+8)}}return[0,0]}});var n=function(A,D,y,z,C,E,B){r.call(this,A,D,y,z,C,E,B);this.longest_feature_length=this.calculate_longest_feature_length();this.draw_background_connector=false;this.draw_individual_connectors=true};u(n.prototype,o.prototype,r.prototype,{calculate_longest_feature_length:function(){var z=0;for(var C=0,y=this.data.length;C0){G.beginPath();G.arc(y,D,H-y,Math.PI,0);G.stroke()}}});x.Scaler=d;x.SummaryTreePainter=v;x.LinePainter=b;x.LinkedFeaturePainter=r;x.ReadPainter=t;x.ArcLinkedFeaturePainter=n};(function(d){var c={};var b=function(e){return c[e]};var a=function(f,g){var e={};g(b,e);c[f]=e};a("class",class_module);a("slotting",slotting_module);a("painters",painters_module);a("trackster",trackster_module);for(key in c.trackster){d[key]=c.trackster[key]}})(window); \ No newline at end of file +var class_module=function(b,a){var c=function(){var f=arguments[0];for(var e=1;ec){a=AFTER}else{if(f<=c){a=CONTAINED_BY}else{a=OVERLAP_END}}}return a};var is_overlap=function(c,b){var a=compute_overlap(c,b);return(a!==BEFORE&&a!==AFTER)};var get_random_color=function(a){if(!a){a="#ffffff"}if(typeof(a)==="string"){a=[a]}for(var j=0;jak){$(this).insertAfter(al);var av=n[al.attr("id")];av.remove_drawable(ap);av.container.add_drawable(ap);return}}}al=null;for(ao=0;ao=au&&at.offsetY<=ak){if(at.offsetY-au0?ao-1:ao))}}}).bind("dragstart",function(){ag["border-top"]=af.css("border-top");ag["border-bottom"]=af.css("border-bottom");$(this).css({"border-top":"1px solid blue","border-bottom":"1px solid blue"})}).bind("dragend",function(){$(this).css(ag)})};X.moveable=m;var ad=16,H=9,E=20,T=H+2,z=100,J=12000,R=200,C=5,v=10,L=5000,w=100,o="There was an error in indexing this dataset. ",K="A converter for this dataset is not installed. Please check your datatypes_conf.xml file.",F="No data for this chrom/contig.",t="Currently indexing... please wait",x="Tool cannot be rerun: ",a="Loading data...",Y="Ready for display",d=10,u=5,B=5;function Z(ag,af){if(!af){af=0}var ah=Math.pow(10,af);return Math.round(ag*ah)/ah}var c=function(af){this.num_elements=af;this.clear()};p(c.prototype,{get:function(ag){var af=this.key_ary.indexOf(ag);if(af!==-1){if(this.obj_cache[ag].stale){this.key_ary.splice(af,1);delete this.obj_cache[ag]}else{this.move_key_to_end(ag,af)}}return this.obj_cache[ag]},set:function(ag,ah){if(!this.obj_cache[ag]){if(this.key_ary.length>=this.num_elements){var af=this.key_ary.shift();delete this.obj_cache[af]}this.key_ary.push(ag)}this.obj_cache[ag]=ah;return ah},move_key_to_end:function(ag,af){this.key_ary.splice(af,1);this.key_ary.push(ag)},clear:function(){this.obj_cache={};this.key_ary=[]},size:function(){return this.key_ary.length}});var S=function(ag,af,ah){c.call(this,ag);this.track=af;this.subset=(ah!==undefined?ah:true)};p(S.prototype,c.prototype,{load_data:function(ao,aj,am,ag,al){var an=this.track.view.chrom,ai={chrom:an,low:ao,high:aj,mode:am,resolution:ag,dataset_id:this.track.dataset_id,hda_ldda:this.track.hda_ldda};$.extend(ai,al);if(this.track.filters_manager){var ap=[];var af=this.track.filters_manager.filters;for(var ak=0;ak1){return{data:null}}return S.prototype.load_data.call(this,af,ai,aj,ag,ah)}});var q=function(ai,ag,af,ah,ak){if(!q.id_counter){q.id_counter=0}this.id=q.id_counter++;this.name=ai;this.view=ag;this.container=af;this.config=new G({track:this,params:[{key:"name",label:"Name",type:"text",default_value:ai}],saved_values:ah,onchange:function(){this.track.set_name(this.track.config.values.name)}});this.prefs=this.config.values;this.drag_handle_class=ak;this.is_overview=false;this.content_visible=true;this.container_div=this.build_container_div();this.header_div=this.build_header_div();if(this.header_div){this.container_div.append(this.header_div);this.icons_div=this.build_icons_div().hide();this.header_div.append(this.icons_div);this.header_div.dblclick(function(al){al.stopPropagation()});var aj=this;this.container_div.hover(function(){aj.icons_div.show()},function(){aj.icons_div.hide()});$("
").appendTo(this.container_div)}};p(q.prototype,{init:function(){},request_draw:function(){},_draw:function(){},to_json:function(){},update_icons:function(){},set_name:function(af){this.old_name=this.name;this.name=af;this.name_div.text(this.name)},revert_name:function(){this.name=this.old_name;this.name_div.text(this.name)},remove:function(){this.container.remove_drawable(this);this.container_div.hide(0,function(){$(this).remove();view.update_intro_div();view.has_changes=true})},build_container_div:function(){},build_header_div:function(){},build_icons_div:function(){},update_icons:function(){},hide_contents:function(){},show_contents:function(){}});var y=function(aj,ai,ag,af,ah,ak){q.call(this,ai,ag,af,ah,ak);this.obj_type=aj;this.drawables=[]};p(y.prototype,q.prototype,{init:function(){for(var af=0;af").addClass("content-div").attr("id","group_"+this.id+"_content_div").appendTo(this.container_div);l(this.container_div,this);l(this.content_div,this);m(this.container_div,this.drag_handle_class,".group",this)};p(Q.prototype,q.prototype,y.prototype,{build_container_div:function(){return $("
").addClass("group").attr("id","group_"+this.id).appendTo(this.container.content_div)},build_header_div:function(){var af=$("
").addClass("track-header");af.append($("
").addClass(this.drag_handle_class));this.name_div=$("
").addClass("track-name").text(this.name).appendTo(af);return af},build_icons_div:function(){var af=$("
").css("float","left");this.toggle_icon=$("").attr("href","javascript:void(0);").attr("title","Hide/show group content").addClass("icon-button toggle").tipsy({gravity:"s"}).appendTo(af);this.settings_icon=$("").attr("href","javascript:void(0);").attr("title","Edit settings").addClass("icon-button settings-icon").tipsy({gravity:"s"}).appendTo(af);this.remove_icon=$("").attr("href","javascript:void(0);").attr("title","Remove").addClass("icon-button remove-icon").tipsy({gravity:"s"}).appendTo(af);var ag=this;this.toggle_icon.click(function(){if(ag.content_visible){ag.toggle_icon.addClass("toggle-expand").removeClass("toggle");ag.hide_contents();ag.content_visible=false}else{ag.toggle_icon.addClass("toggle").removeClass("toggle-expand");ag.content_visible=true;ag.show_contents()}});this.settings_icon.click(function(){var aj=function(){hide_modal();$(window).unbind("keypress.check_enter_esc")},ah=function(){ag.config.update_from_form($(".dialog-box"));hide_modal();$(window).unbind("keypress.check_enter_esc")},ai=function(ak){if((ak.keyCode||ak.which)===27){aj()}else{if((ak.keyCode||ak.which)===13){ah()}}};$(window).bind("keypress.check_enter_esc",ai);show_modal("Configure Group",ag.config.build_form(),{Cancel:aj,OK:ah})});this.remove_icon.click(function(){$(".tipsy").remove();ag.remove()});return af},hide_contents:function(){this.content_div.hide()},show_contents:function(){this.content_div.show();this.request_draw()}});var ac=function(af,ai,ah,ag){y.call(this,"View");this.container=af;this.chrom=null;this.vis_id=ah;this.dbkey=ag;this.title=ai;this.label_tracks=[];this.tracks_to_be_redrawn=[];this.max_low=0;this.max_high=0;this.zoom_factor=3;this.min_separation=30;this.has_changes=false;this.load_chroms_deferred=null;this.init();this.canvas_manager=new ae(af.get(0).ownerDocument);this.reset()};p(ac.prototype,y.prototype,{init:function(){var ah=this.container,af=this;this.top_container=$("
").addClass("top-container").appendTo(ah);this.browser_content_div=$("
").addClass("content").css("position","relative").appendTo(ah);this.bottom_container=$("
").addClass("bottom-container").appendTo(ah);this.top_labeltrack=$("
").addClass("top-labeltrack").appendTo(this.top_container);this.viewport_container=$("
").addClass("viewport-container").attr("id","viewport-container").appendTo(this.browser_content_div);this.content_div=this.viewport_container;l(this.viewport_container,af);this.intro_div=$("
").addClass("intro").appendTo(this.viewport_container).hide();var ai=$("
").text("Add Datasets to Visualization").addClass("action-button").appendTo(this.intro_div).click(function(){add_tracks()});this.nav_labeltrack=$("
").addClass("nav-labeltrack").appendTo(this.bottom_container);this.nav_container=$("
").addClass("nav-container").prependTo(this.top_container);this.nav=$("
").addClass("nav").appendTo(this.nav_container);this.overview=$("
").addClass("overview").appendTo(this.bottom_container);this.overview_viewport=$("
").addClass("overview-viewport").appendTo(this.overview);this.overview_close=$("").attr("href","javascript:void(0);").attr("title","Close overview").addClass("icon-button overview-close tooltip").hide().appendTo(this.overview_viewport);this.overview_highlight=$("
").addClass("overview-highlight").hide().appendTo(this.overview_viewport);this.overview_box_background=$("
").addClass("overview-boxback").appendTo(this.overview_viewport);this.overview_box=$("
").addClass("overview-box").appendTo(this.overview_viewport);this.default_overview_height=this.overview_box.height();this.nav_controls=$("
").addClass("nav-controls").appendTo(this.nav);this.chrom_select=$("").addClass("nav-input").hide().bind("keyup focusout",ag).appendTo(this.nav_controls);this.location_span=$("").addClass("location").attr("original-title","Click to change location").tipsy({gravity:"n"}).appendTo(this.nav_controls);this.location_span.click(function(){af.location_span.hide();af.chrom_select.hide();af.nav_input.val(af.chrom+":"+af.low+"-"+af.high);af.nav_input.css("display","inline-block");af.nav_input.select();af.nav_input.focus()});if(this.vis_id!==undefined){this.hidden_input=$("").attr("type","hidden").val(this.vis_id).appendTo(this.nav_controls)}this.zo_link=$("").attr("id","zoom-out").attr("title","Zoom out").tipsy({gravity:"n"}).click(function(){af.zoom_out();af.request_redraw()}).appendTo(this.nav_controls);this.zi_link=$("").attr("id","zoom-in").attr("title","Zoom in").tipsy({gravity:"n"}).click(function(){af.zoom_in();af.request_redraw()}).appendTo(this.nav_controls);this.load_chroms_deferred=this.load_chroms({low:0});this.chrom_select.bind("change",function(){af.change_chrom(af.chrom_select.val())});this.browser_content_div.click(function(aj){$(this).find("input").trigger("blur")});this.browser_content_div.bind("dblclick",function(aj){af.zoom_in(aj.pageX,this.viewport_container)});this.overview_box.bind("dragstart",function(aj,ak){this.current_x=ak.offsetX}).bind("drag",function(aj,al){var am=al.offsetX-this.current_x;this.current_x=al.offsetX;var ak=Math.round(am/af.viewport_container.width()*(af.max_high-af.max_low));af.move_delta(-ak)});this.overview_close.click(function(){af.reset_overview()});this.viewport_container.bind("draginit",function(aj,ak){if(aj.clientX>af.viewport_container.width()-16){return false}}).bind("dragstart",function(aj,ak){ak.original_low=af.low;ak.current_height=aj.clientY;ak.current_x=ak.offsetX}).bind("drag",function(al,an){var aj=$(this);var ao=an.offsetX-an.current_x;var ak=aj.scrollTop()-(al.clientY-an.current_height);aj.scrollTop(ak);an.current_height=al.clientY;an.current_x=an.offsetX;var am=Math.round(ao/af.viewport_container.width()*(af.high-af.low));af.move_delta(am)}).bind("mousewheel",function(al,an,ak,aj){if(ak){ak*=50;var am=Math.round(-ak/af.viewport_container.width()*(af.high-af.low));af.move_delta(am)}});this.top_labeltrack.bind("dragstart",function(aj,ak){return $("
").css({height:af.browser_content_div.height()+af.top_labeltrack.height()+af.nav_labeltrack.height()+1,top:"0px",position:"absolute","background-color":"#ccf",opacity:0.5,"z-index":1000}).appendTo($(this))}).bind("drag",function(an,ao){$(ao.proxy).css({left:Math.min(an.pageX,ao.startX),width:Math.abs(an.pageX-ao.startX)});var ak=Math.min(an.pageX,ao.startX)-af.container.offset().left,aj=Math.max(an.pageX,ao.startX)-af.container.offset().left,am=(af.high-af.low),al=af.viewport_container.width();af.update_location(Math.round(ak/al*am)+af.low,Math.round(aj/al*am)+af.low)}).bind("dragend",function(ao,ap){var ak=Math.min(ao.pageX,ap.startX),aj=Math.max(ao.pageX,ap.startX),am=(af.high-af.low),al=af.viewport_container.width(),an=af.low;af.low=Math.round(ak/al*am)+an;af.high=Math.round(aj/al*am)+an;$(ap.proxy).remove();af.request_redraw()});this.add_label_track(new ab(this,{content_div:this.top_labeltrack}));this.add_label_track(new ab(this,{content_div:this.nav_labeltrack}));$(window).bind("resize",function(){af.resize_window()});$(document).bind("redraw",function(){af.redraw()});this.reset();$(window).trigger("resize")},update_intro_div:function(){if(this.drawables.length===0){this.intro_div.show()}else{this.intro_div.hide()}},update_location:function(af,ag){this.location_span.text(commatize(af)+" - "+commatize(ag));this.nav_input.val(this.chrom+":"+commatize(af)+"-"+commatize(ag))},load_chroms:function(ah){ah.num=w;$.extend(ah,(this.vis_id!==undefined?{vis_id:this.vis_id}:{dbkey:this.dbkey}));var af=this,ag=$.Deferred();$.ajax({url:chrom_url,data:ah,dataType:"json",success:function(aj){if(aj.chrom_info.length===0){alert("Invalid chromosome: "+ah.chrom);return}if(aj.reference){af.add_label_track(new A(af))}af.chrom_data=aj.chrom_info;var am='';for(var al=0,ai=af.chrom_data.length;al'+ak+""}if(aj.prev_chroms){am+='"}if(aj.next_chroms){am+='"}af.chrom_select.html(am);af.chrom_start_index=aj.start_index;ag.resolve(aj)},error:function(){alert("Could not load chroms for this dbkey:",af.dbkey)}});return ag},change_chrom:function(ak,ag,am){if(!ak||ak==="None"){return}var ah=this;if(ak==="previous"){ah.load_chroms({low:this.chrom_start_index-w});return}if(ak==="next"){ah.load_chroms({low:this.chrom_start_index+w});return}var al=$.grep(ah.chrom_data,function(an,ao){return an.chrom===ak})[0];if(al===undefined){ah.load_chroms({chrom:ak},function(){ah.change_chrom(ak,ag,am)});return}else{if(ak!==ah.chrom){ah.chrom=ak;ah.chrom_select.val(ah.chrom);ah.max_high=al.len-1;ah.reset();ah.request_redraw(true);for(var aj=0,af=ah.drawables.length;ajaf.max_high){af.high=af.max_high;af.low=af.max_high-ag}else{af.high-=ah;af.low-=ah}}af.request_redraw()},add_drawable:function(af){y.prototype.add_drawable.call(this,af);af.init();this.has_changes=true;this.update_intro_div()},add_label_track:function(af){af.view=this;af.init();this.label_tracks.push(af)},remove_drawable:function(ah,ag){y.prototype.remove_drawable.call(this,ah);if(ag){var af=this;ah.container_div.hide(0,function(){$(this).remove();af.update_intro_div()});this.has_changes=true}},reset:function(){this.low=this.max_low;this.high=this.max_high;this.viewport_container.find(".yaxislabel").remove()},request_redraw:function(an,af,am,ag){var al=this,aj=(ag?[ag]:al.drawables),ah;var ag;for(var ak=0;akthis.max_high){ai=this.max_high}var ao=this.high-this.low;if(this.high!==0&&ao").addClass("dynamic-tool").hide();this.parent_div.bind("drag",function(aw){aw.stopPropagation()}).click(function(aw){aw.stopPropagation()}).bind("dblclick",function(aw){aw.stopPropagation()});var aq=$("
").appendTo(this.parent_div).text(this.name);var ao=this.params;var am=this;$.each(this.params,function(ax,aA){var az=$("
").addClass("param-row").appendTo(am.parent_div);var aw=$("
").addClass("param-label").text(aA.label).appendTo(az);var ay=$("
").addClass("slider").html(aA.html).appendTo(az);ay.find(":input").val(aA.value);$("
").appendTo(az)});this.parent_div.find("input").click(function(){$(this).select()});var av=$("
").addClass("param-row").appendTo(this.parent_div);var ak=$("").attr("value","Run on complete dataset").appendTo(av);var af=$("").attr("value","Run on visible region").css("margin-left","3em").appendTo(av);var am=this;af.click(function(){am.run_on_region()});ak.click(function(){am.run_on_dataset()})};p(r.prototype,{get_param_values_dict:function(){var af={};this.parent_div.find(":input").each(function(){var ag=$(this).attr("name"),ah=$(this).val();af[ag]=JSON.stringify(ah)});return af},get_param_values:function(){var ag=[];var af={};this.parent_div.find(":input").each(function(){var ah=$(this).attr("name"),ai=$(this).val();if(ah){ag[ag.length]=ai}});return ag},run_on_dataset:function(){var af=this;af.run({dataset_id:this.track.original_dataset_id,tool_id:af.name},null,function(ag){show_modal(af.name+" is Running",af.name+" is running on the complete dataset. Tool outputs are in dataset's history.",{Close:hide_modal})})},run_on_region:function(){var ag={dataset_id:this.track.original_dataset_id,chrom:this.track.view.chrom,low:this.track.view.low,high:this.track.view.high,tool_id:this.name},aj=this.track,ah=ag.tool_id+aj.tool_region_and_parameters_str(ag.chrom,ag.low,ag.high),af;if(aj.container===view){var ai=new Q(this.name,this.track.view,this.track.container);aj.container.add_drawable(ai);aj.container.remove_drawable(aj);ai.add_drawable(aj);aj.container_div.appendTo(ai.content_div);af=ai}else{af=aj.container}var ak=new aj.constructor(ah,view,af,"hda");ak.init_for_tool_data();ak.change_mode(aj.mode);af.add_drawable(ak);ak.content_div.text("Starting job.");this.run(ag,ak,function(al){ak.dataset_id=al.dataset_id;ak.content_div.text("Running job.");ak.init()})},run:function(ag,ah,ai){$.extend(ag,this.get_param_values_dict());var af=function(){$.getJSON(rerun_tool_url,ag,function(aj){if(aj==="no converter"){ah.container_div.addClass("error");ah.content_div.text(K)}else{if(aj.error){ah.container_div.addClass("error");ah.content_div.text(x+aj.message)}else{if(aj==="pending"){ah.container_div.addClass("pending");ah.content_div.text("Converting input data so that it can be used quickly with tool.");setTimeout(af,2000)}else{ai(aj)}}}})};af()}});var O=function(ag,af,ah,ai){this.name=ag;this.label=af;this.html=ah;this.value=ai};var g=function(ah,ag,aj,ak,ai,af){O.call(this,ah,ag,aj,ak);this.min=ai;this.max=af};var h=function(ag,af,ah,ai){this.name=ag;this.index=af;this.tool_id=ah;this.tool_exp_name=ai};var V=function(ag,af,ah,ai){h.call(this,ag,af,ah,ai);this.low=-Number.MAX_VALUE;this.high=Number.MAX_VALUE;this.min=Number.MAX_VALUE;this.max=-Number.MAX_VALUE;this.container=null;this.slider=null;this.slider_label=null};p(V.prototype,{applies_to:function(af){if(af.length>this.index){return true}return false},keep:function(af){if(!this.applies_to(af)){return true}var ag=af[this.index];return(isNaN(ag)||(ag>=this.low&&ag<=this.high))},update_attrs:function(ag){var af=false;if(!this.applies_to(ag)){return af}if(ag[this.index]this.max){this.max=Math.ceil(ag[this.index]);af=true}return af},update_ui_elt:function(){if(this.min!=this.max){this.container.show()}else{this.container.hide()}var ah=function(ak,ai){var aj=ai-ak;return(aj<=2?0.01:1)};var ag=this.slider.slider("option","min"),af=this.slider.slider("option","max");if(this.minaf){this.slider.slider("option","min",this.min);this.slider.slider("option","max",this.max);this.slider.slider("option","step",ah(this.min,this.max));this.slider.slider("option","values",[this.min,this.max])}}});var aa=function(aq,ay){this.track=aq;this.filters=[];for(var at=0;at").attr("size",input_size).attr("maxlength",input_size).attr("value",aD).appendTo(aB).focus().select().click(function(aE){aE.stopPropagation()}).blur(function(){$(this).remove();aB.text(aD)}).keyup(function(aI){if(aI.keyCode===27){$(this).trigger("blur")}else{if(aI.keyCode===13){var aG=aC.slider("option","min"),aE=aC.slider("option","max"),aH=function(aJ){return(isNaN(aJ)||aJ>aE||aJ").addClass("filters").hide();this.parent_div.bind("drag",function(aA){aA.stopPropagation()}).click(function(aA){aA.stopPropagation()}).bind("dblclick",function(aA){aA.stopPropagation()}).bind("keydown",function(aA){aA.stopPropagation()});var av=$("
").addClass("sliders").appendTo(this.parent_div);var an=this;$.each(this.filters,function(aD,aF){aF.container=$("
").addClass("filter-row slider-row").appendTo(av);var aE=$("
").addClass("elt-label").appendTo(aF.container);var aC=$("").addClass("slider-name").text(aF.name+" ").appendTo(aE);var aB=$("");var aH=$("").addClass("slider-value").appendTo(aE).append("[").append(aB).append("]");var aA=$("
").addClass("slider").appendTo(aF.container);aF.control_element=$("
").attr("id",aF.name+"-filter-control").appendTo(aA);var aG=[0,0];aF.control_element.slider({range:true,min:Number.MAX_VALUE,max:-Number.MIN_VALUE,values:[0,0],slide:function(aJ,aK){var aI=aK.values;aB.text(aI[0]+"-"+aI[1]);aF.low=aI[0];aF.high=aI[1];an.track.request_draw(true,true)},change:function(aI,aJ){aF.control_element.slider("option","slide").call(aF.control_element,aI,aJ)}});aF.slider=aF.control_element;aF.slider_label=aB;ai(aH,aB,aF.control_element);$("
").appendTo(aF.container)});if(this.filters.length!==0){var ak=$("
").addClass("param-row").appendTo(av);var am=$("").attr("value","Run on complete dataset").appendTo(ak);var ag=this;am.click(function(){ag.run_on_dataset()})}var ap=$("
").addClass("display-controls").appendTo(this.parent_div),ar,al,ao,aj={Transparency:function(aA){an.alpha_filter=aA},Height:function(aA){an.height_filter=aA}};$.each(aj,function(aC,aB){ar=$("
").addClass("filter-row").appendTo(ap),al=$("").addClass("elt-label").text(aC+":").appendTo(ar),ao=$("').attr("id",ak).attr("name",ak).attr("checked",at))}else{if(ah.type==="text"){av.append($('').attr("id",ak).val(at).click(function(){$(this).select()}))}else{if(ah.type=="select"){var aq=$("").attr("id",ak).attr("name",ak).val(at);var ar=$("
").hide();var al=$("
").appendTo(ar);var au=$("
").appendTo(al).farbtastic({width:100,height:100,callback:ap,color:at});$("
").append(ap).append(ar).appendTo(av).bind("click",function(aw){ar.css({left:$(this).position().left+$(ap).width()+5,top:$(this).position().top-($(ar).height()/2)+($(ap).height()/2)}).show();$(document).bind("click.color-picker",function(){ar.hide();$(document).unbind("click.color-picker")});aw.stopPropagation()})}else{av.append($("").attr("id",ak).attr("name",ak).val(at))}}}}if(ah.help){av.append($("
").text(ah.help))}}}ag(this.params,af);return af},update_from_form:function(af){var ah=this;var ag=false;$.each(this.params,function(ai,ak){if(!ak.hidden){var al="param_"+ai;var aj=af.find("#"+al).val();if(ak.type==="float"){aj=parseFloat(aj)}else{if(ak.type==="int"){aj=parseInt(aj)}else{if(ak.type==="bool"){aj=af.find("#"+al).is(":checked")}}}if(aj!==ah.values[ak.key]){ah.values[ak.key]=aj;ag=true}}});if(ag){this.onchange()}}});var b=function(af,ai,ah,ag,aj){this.track=af;this.index=ai;this.low=ai*R*ah;this.high=(ai+1)*R*ah;this.resolution=ah;this.canvas=$("
").append(ag);this.data=aj;this.stale=false};b.prototype.predisplay_actions=function(){};var k=function(af,ai,ah,ag,aj,ak){b.call(this,af,ai,ah,ag,aj);this.max_val=ak};p(k.prototype,b.prototype);var P=function(ah,am,ai,ag,ak,al,ap,an){b.call(this,ah,am,ai,ag,ak);this.mode=al;this.message=ap;this.feature_mapper=an;if(this.message){var ag=this.canvas.children()[0],ao=$("
").addClass("tile-message").text(this.message).css({height:E-1,width:ag.width}).prependTo(this.canvas),aj=$("").addClass("icon more-down").appendTo(ao),af=$("").addClass("icon more-across").appendTo(ao);aj.click(function(){tile.stale=true;ah.data_manager.get_more_data(tile.low,tile.high,ah.mode,tile.resolution,{},ah.data_manager.DEEP_DATA_REQ);ah.request_draw()}).dblclick(function(aq){aq.stopPropagation()});af.click(function(){tile.stale=true;ah.data_manager.get_more_data(tile.low,tile.high,ah.mode,tile.resolution,{},ah.data_manager.BROAD_DATA_REQ);ah.request_draw()}).dblclick(function(aq){aq.stopPropagation()})}};p(P.prototype,b.prototype);P.prototype.predisplay_actions=function(){var ag=this,af={};if(ag.mode!=="Pack"){return}$(this.canvas).hover(function(){this.hovered=true;$(this).mousemove()},function(){this.hovered=false;$(this).siblings(".feature-popup").remove()}).mousemove(function(ar){if(!this.hovered){return}var am=$(this).offset(),aq=ar.pageX-am.left,ap=ar.pageY-am.top,aw=ag.feature_mapper.get_feature_data(aq,ap),an=(aw?aw[0]:null);$(this).siblings(".feature-popup").each(function(){if(!an||$(this).attr("id")!==an.toString()){$(this).remove()}});if(aw){var ai=af[an];if(!ai){var an=aw[0],at={name:aw[3],start:aw[1],end:aw[2],strand:aw[4]},al=ag.track.filters_manager.filters,ak;for(var ao=0;ao").attr("id",an).addClass("feature-popup"),ax=$(""),av,au,ay;for(av in at){au=at[av];ay=$("").appendTo(ax);$("
").appendTo(ay).text(av);$("").attr("align","left").appendTo(ay).text(typeof(au)=="number"?Z(au,2):au)}ai.append($("
").append(ax));af[an]=ai}ai.appendTo($(ag.canvas).parent());var aj=aq+parseInt(ag.canvas.css("left"))-ai.width()/2,ah=ap+parseInt(ag.canvas.css("top"))+7;ai.css("left",aj+"px").css("top",ah+"px")}else{if(!ar.isPropagationStopped()){ar.stopPropagation();$(this).siblings().each(function(){$(this).trigger(ar)})}}}).mouseleave(function(){$(this).siblings(".feature-popup").remove()})};var i=function(ai,ag,af,ah,aj,ak){q.call(this,ai,ag,af,{},"draghandle");this.data_url=(aj?aj:default_data_url);this.data_url_extra_params={};this.data_query_wait=(ak?ak:L);this.dataset_check_url=converted_datasets_state_url;if(!i.id_counter){i.id_counter=0}this.id=i.id_counter++;this.content_div=$("
").appendTo(this.container_div);this.container.content_div.append(this.container_div)};p(i.prototype,q.prototype,{build_container_div:function(){return $("
").addClass("track").attr("id","track_"+this.id).css("position","relative")},build_header_div:function(){var af=$("
");if(this.view.editor){this.drag_div=$("
").addClass(this.drag_handle_class).appendTo(af)}this.name_div=$("
").addClass("track-name").appendTo(af).text(this.name).attr("id",this.name.replace(/\s+/g,"-").replace(/[^a-zA-Z0-9\-]/g,"").toLowerCase());return af},build_icons_div:function(){var aj=$("
").css("float","left");this.mode_icon=$("").attr("href","javascript:void(0);").attr("title","Set display mode").addClass("icon-button chevron-expand").tipsy({gravity:"s"}).appendTo(aj);this.toggle_icon=$("").attr("href","javascript:void(0);").attr("title","Hide/show track content").addClass("icon-button toggle").tipsy({gravity:"s"}).appendTo(aj);this.settings_icon=$("").attr("href","javascript:void(0);").attr("title","Edit settings").addClass("icon-button settings-icon").tipsy({gravity:"s"}).appendTo(aj);this.overview_icon=$("").attr("href","javascript:void(0);").attr("title","Set as overview").addClass("icon-button overview-icon").tipsy({gravity:"s"}).appendTo(aj);this.filters_icon=$("").attr("href","javascript:void(0);").attr("title","Filters").addClass("icon-button filters-icon").tipsy({gravity:"s"}).appendTo(aj).hide();this.tools_icon=$("").attr("href","javascript:void(0);").attr("title","Tools").addClass("icon-button tools-icon").tipsy({gravity:"s"}).appendTo(aj).hide();this.remove_icon=$("").attr("href","javascript:void(0);").attr("title","Remove").addClass("icon-button remove-icon").tipsy({gravity:"s"}).appendTo(aj);var ag=this;if(ag.display_modes!==undefined){var al=(ag.config&&ag.config.values.mode?ag.config.values.mode:ag.display_modes[0]);ag.mode=al;this.mode_icon.attr("title","Set display mode (now: "+ag.mode+")");var ai={};for(var ah=0,af=ag.display_modes.length;ah").text("View error").click(function(){show_modal("Trackster Error","
"+ag.message+"
",{Close:hide_modal})});af.content_div.append(ah)}}else{if(ag==="no converter"){af.container_div.addClass("error");af.content_div.text(K)}else{if(ag==="no data"||(ag.data!==undefined&&(ag.data===null||ag.data.length===0))){af.container_div.addClass("nodata");af.content_div.text(F)}else{if(ag==="pending"){af.container_div.addClass("pending");af.content_div.text(t);setTimeout(function(){af.init()},af.data_query_wait)}else{if(ag.status==="data"){if(ag.valid_chroms){af.valid_chroms=ag.valid_chroms;af.update_icons()}af.content_div.text(Y);if(af.view.chrom){af.content_div.text("");af.content_div.css("height",af.height_px+"px");af.enabled=true;$.when(af.predraw_init()).done(function(){af.container_div.removeClass("nodata error pending");af.request_draw()})}}}}}}});this.update_icons()},predraw_init:function(){}});var N=function(aj,ah,ag,ai,al,ak){i.call(this,aj,ah,ag,ai);var af=this,ah=af.view;m(af.container_div,af.drag_handle_class,".group",af);this.filters_manager=new aa(this,(al!==undefined?al:{}));this.filters_available=false;this.filters_visible=false;this.tool=(ak!==undefined&&obj_length(ak)>0?new r(this,ak):undefined);if(this.header_div){if(this.filters_manager){this.filters_div=this.filters_manager.parent_div;this.header_div.after(this.filters_div)}if(this.tool){this.dynamic_tool_div=this.tool.parent_div;this.header_div.after(this.dynamic_tool_div)}}};p(N.prototype,q.prototype,i.prototype,{copy:function(af){return new this.constructor(this.name,this.view,af,this.hda_ldda,this.dataset_id,this.prefs,this.filters,this.tool)},to_json:function(){return{track_type:this.get_type(),name:this.name,hda_ldda:this.hda_ldda,dataset_id:this.dataset_id,prefs:this.prefs,mode:this.mode,}},change_mode:function(ag){var af=this;af.mode=ag;af.config.values.mode=ag;af.tile_cache.clear();af.request_draw();this.mode_icon.attr("title","Set display mode (now: "+af.mode+")");return af},update_icons:function(){var af=this;if(af.filters_available>0){af.filters_icon.show()}else{af.filters_icon.hide()}if(af.tool){af.tools_icon.show()}else{af.tools_icon.hide()}},_gen_tile_cache_key:function(ag,ah,af){return ag+"_"+ah+"_"+af},request_draw:function(ag,af){this.view.request_redraw(false,ag,af,this)},_draw:function(ah,ap){if(!this.enabled){return}if(!this.content_visible){return}if(!(this instanceof A)&&(!this.dataset_id)){return}var ao=this.view.low,al=this.view.high,am=al-ao,ai=this.view.container.width(),at=ai/am,ak=this.view.resolution,ar=this.content_div;if(this.is_overview){ao=this.view.max_low;al=this.view.max_high;ak=Math.pow(C,Math.ceil(Math.log((view.max_high-view.max_low)/R)/Math.log(C)));at=ai/(view.max_high-view.max_low)}if(!ap){this.content_div.children().addClass("remove")}this.max_height=0;var ag=Math.floor(ao/ak/R);var an=true;var aq=[];var af=0;while((ag*R*ak)view.canvas_manager.char_width_px){au=view.reference_track.data_manager.get_data(an,av,aj.mode,al,view.reference_track.data_url_extra_params);if(ap(au)){ak=false}}if(ak){p(af,am);var ao=aj.draw_tile(af,aj.mode,al,ai,aw,au);if(ao!==undefined){aj.tile_cache.set(aq,ao);aj.show_tile(ao,ar,aw)}return ao}$.when(af,au).then(function(){view.request_redraw(false,false,false,aj)});return null},show_tile:function(ah,aj,ak){var ag=this,af=ah.canvas;ah.predisplay_actions();var ai=(ah.low-(this.is_overview?this.view.max_low:this.view.low))*ak;if(this.left_offset){ai-=this.left_offset}af.css({position:"absolute",top:0,left:ai,height:""});if(af.hasClass("remove")){af.removeClass("remove")}else{aj.append(af)}ag.max_height=Math.max(ag.max_height,af.height());ag.content_div.css("height",ag.max_height+"px");aj.children().css("height",ag.max_height+"px")},_get_tile_bounds:function(af,ag){var ai=af*R*ag,aj=R*ag,ah=(ai+aj<=this.view.max_high?ai+aj:this.view.max_high);return[ai,ah]},tool_region_and_parameters_str:function(ah,af,ai){var ag=this,aj=(ah!==undefined&&af!==undefined&&ai!==undefined?ah+":"+af+"-"+ai:"all");return" - region=["+aj+"], parameters=["+ag.tool.get_param_values().join(", ")+"]"},init_for_tool_data:function(){this.data_url=raw_data_url;this.data_query_wait=1000;this.dataset_check_url=dataset_state_url;this.predraw_init=function(){var ag=this;var af=function(){if(ag.data_manager.size()===0){setTimeout(af,300)}else{ag.data_url=default_data_url;ag.data_query_wait=L;ag.dataset_state_url=converted_datasets_state_url;$.getJSON(ag.dataset_state_url,{dataset_id:ag.dataset_id,hda_ldda:ag.hda_ldda},function(ah){})}};af()}}});var ab=function(ag,af){i.call(this,"label",ag,af,false,{});this.container_div.addClass("label-track")};p(ab.prototype,i.prototype,{build_header_div:function(){},init:function(){this.enabled=true},_draw:function(){var ah=this.view,ai=ah.high-ah.low,al=Math.floor(Math.pow(10,Math.floor(Math.log(ai)/Math.log(10)))),af=Math.floor(ah.low/al)*al,aj=this.view.container.width(),ag=$("
");while(af"+commatize(af)+"
").css({position:"absolute",left:ak-1}));af+=al}this.content_div.children(":first").remove();this.content_div.append(ag)}});var A=function(af){N.call(this,"reference",af,{content_div:af.top_labeltrack},{});af.reference_track=this;this.left_offset=200;this.height_px=12;this.container_div.addClass("reference-track");this.content_div.css("background","none");this.content_div.css("min-height","0px");this.content_div.css("border","none");this.data_url=reference_url;this.data_url_extra_params={dbkey:af.dbkey};this.data_manager=new I(B,this,false);this.tile_cache=new c(u)};p(A.prototype,q.prototype,N.prototype,{build_header_div:function(){},init:function(){this.enabled=true},draw_tile:function(ap,al,ak,ag,aq){var aj=this,ah=R*ak;if(aq>this.view.canvas_manager.char_width_px){if(ap.data===null){aj.content_div.css("height","0px");return}var ai=this.view.canvas_manager.new_canvas();var ao=ai.getContext("2d");ai.width=Math.ceil(ah*aq+aj.left_offset);ai.height=aj.height_px;ao.font=ao.canvas.manager.default_font;ao.textAlign="center";ap=ap.data;for(var am=0,an=ap.length;am");$(af.container_div).hover(function(){if(af.content_visible){ai=true;ag.show()}},function(){ai=false;if(!ah){ag.hide()}});ag.hide().bind("dragstart",function(aj,ak){ah=true;ak.original_height=$(af.content_div).height()}).bind("drag",function(ak,al){var aj=Math.min(Math.max(al.original_height+al.deltaY,af.min_height_px),af.max_height_px);$(af.content_div).css("height",aj);af.height_px=aj;af.request_draw(true)}).bind("dragend",function(aj,ak){af.tile_cache.clear();ah=false;if(!ai){ag.hide()}af.config.values.height=af.height_px}).appendTo(af.container_div)},predraw_init:function(){var af=this;af.vertical_range=undefined;return $.getJSON(af.data_url,{stats:true,chrom:af.view.chrom,low:null,high:null,hda_ldda:af.hda_ldda,dataset_id:af.dataset_id},function(ag){af.container_div.addClass("line-track");var aj=ag.data;if(isNaN(parseFloat(af.prefs.min_value))||isNaN(parseFloat(af.prefs.max_value))){var ah=aj.min;var al=aj.max;ah=Math.floor(Math.min(0,Math.max(ah,aj.mean-2*aj.sd)));al=Math.ceil(Math.max(0,Math.min(al,aj.mean+2*aj.sd)));af.prefs.min_value=ah;af.prefs.max_value=al;$("#track_"+af.dataset_id+"_minval").val(af.prefs.min_value);$("#track_"+af.dataset_id+"_maxval").val(af.prefs.max_value)}af.vertical_range=af.prefs.max_value-af.prefs.min_value;af.total_frequency=aj.total_frequency;af.container_div.find(".yaxislabel").remove();var ak=$("
").addClass("yaxislabel").attr("id","linetrack_"+af.dataset_id+"_minval").text(Z(af.prefs.min_value,3));var ai=$("
").addClass("yaxislabel").attr("id","linetrack_"+af.dataset_id+"_maxval").text(Z(af.prefs.max_value,3));ai.css({position:"absolute",top:"24px",left:"10px"});ai.prependTo(af.container_div);ak.css({position:"absolute",bottom:"2px",left:"10px"});ak.prependTo(af.container_div)})},draw_tile:function(ar,ak,aj,ah,aq){if(this.vertical_range===undefined){return}var af=this._get_tile_bounds(ah,aj),al=af[0],ap=af[1],ag=Math.ceil((ap-al)*aq),an=this.height_px;var ai=this.view.canvas_manager.new_canvas();ai.width=ag,ai.height=an;var ao=ai.getContext("2d");var am=new M.LinePainter(ar.data,al,ap,this.prefs,ak);am.draw(ao,ag,an);return new b(this.track,ah,aj,ai,ar.data)}});var e=function(af,al,ag,ak,an,am,ai,aj){var ah=this;this.display_modes=["Auto","Histogram","Dense","Squish","Pack"];N.call(this,af,al,ag,am,ai,aj);this.config=new G({track:this,params:[{key:"name",label:"Name",type:"text",default_value:af},{key:"block_color",label:"Block color",type:"color",default_value:get_random_color()},{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:"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},],saved_values:am,onchange:function(){ah.set_name(ah.prefs.name);ah.tile_cache.clear();ah.set_painter_from_config();ah.request_draw()}});this.prefs=this.config.values;this.height_px=0;this.container_div.addClass("feature-track");this.hda_ldda=ak;this.dataset_id=an;this.original_dataset_id=an;this.show_labels_scale=0.001;this.showing_details=false;this.summary_draw_height=30;this.inc_slots={};this.start_end_dct={};this.tile_cache=new c(d);this.data_manager=new S(20,this);this.left_offset=200;this.set_painter_from_config()};p(e.prototype,q.prototype,N.prototype,{set_painter_from_config:function(){if(this.config.values.connector_style=="arcs"){this.painter=M.ArcLinkedFeaturePainter}else{this.painter=M.LinkedFeaturePainter}},postdraw_actions:function(av,af,aw,au){N.prototype.postdraw_actions.call(this,av,au);var ai=this;if(au){var ak=ai.content_div.children();var al=false;for(var aj=ak.length-1,ap=0;aj>=ap;aj--){var ah=$(ak[aj]);if(al){ah.remove()}else{if(ah.children().length!==0){al=true}}}}if(ai.mode=="Histogram"){var ao=-1;for(var aj=0;ajao){ao=at}}for(var aj=0;ajah-am){av=ah-am}var aq=Math.floor((ah-am)/av),au=[],ai=0;var ak=0,al=0,ap,at=0,an=[],ar,ao;var ag=function(ay,ax,az,aw){ay[0]=ax+az*aw;ay[1]=ax+(az+1)*aw};while(atai){ai=ar[1]}at++}return{max:ai,delta:aq,data:au}},draw_tile:function(au,ax,aB,aF,ap,ai){var ay=this,ak=ay._get_tile_bounds(aF,aB),aI=ak[0],ag=ak[1],aw=ag-aI,az=Math.ceil(aw*ap),aO=25,aj=this.left_offset,av,al;if(ax==="Auto"){if(au.dataset_type==="summary_tree"){ax=au.dataset_type}else{if(au.extra_info==="no_detail"||ay.is_overview){ax="no_detail"}else{var aN=au.data;if(this.view.high-this.view.low>J){ax="Squish"}else{ax="Pack"}}}this.update_auto_mode(ax)}if(ax==="summary_tree"||ax==="Histogram"){al=this.summary_draw_height;this.container_div.find(".yaxislabel").remove();var af=$("
").addClass("yaxislabel");af.text(au.max);af.css({position:"absolute",top:"24px",left:"10px",color:this.prefs.label_color});af.prependTo(this.container_div);var ah=this.view.canvas_manager.new_canvas();ah.width=az+aj;ah.height=al+T;if(au.dataset_type!="summary_tree"){var aq=this.get_summary_tree_data(au.data,aI,ag,200);if(au.max){aq.max=au.max}au=aq}var aK=new M.SummaryTreePainter(au,aI,ag,this.prefs);var aA=ah.getContext("2d");aA.translate(aj,T);aK.draw(aA,az,al);return new k(ay,aF,aB,ah,au.data,au.max)}var av,an=1;if(ax==="no_detail"||ax==="Squish"||ax==="Pack"){an=this.incremental_slots(ap,au.data,ax);av=this.inc_slots[ap].slots}var ao=[];if(au.data){var ar=this.filters_manager.filters;for(var aC=0,aE=au.data.length;aCi[0]&&F=0){g-=v;j="left"}else{k+=v;j="right"}}var t=q(g,k);if(t>=0){if(h[t]===undefined){h[t]=[]}h[t].push([g,k]);s[o]=t;n=Math.max(n,t)}else{}}return n+1}})};var painters_module=function(i,x){var u=i("class").extend;var p=function(I,A,G,z,F,D){if(D===undefined){D=4}var C=z-A;var B=F-G;var E=Math.floor(Math.sqrt(C*C+B*B)/D);var J=C/E;var H=B/E;var y;for(y=0;y1){C=Math.ceil((T[1][0]-T[0][0])*B)}else{C=10}for(var O=0,P=T.length;OD){Q=true;E=D}}if(I==="Histogram"){E=Math.round(E/J*z);N.fillRect(R,U,C,-E)}else{if(I==="Intensity"){E=255-Math.floor((E-H)/J*255);N.fillStyle="rgb("+E+","+E+","+E+")";N.fillRect(R,0,C,z)}else{E=Math.round(z-(E-H)/J*z);if(F){N.lineTo(R,E)}else{F=true;if(I==="Filled"){N.moveTo(R,z);N.lineTo(R,E)}else{N.moveTo(R,E)}}}}N.fillStyle=this.prefs.overflow_color;if(Q||G){var S;if(I==="Histogram"||I==="Intensity"){S=C}else{R-=2;S=4}if(Q){N.fillRect(R,0,S,3)}if(G){N.fillRect(R,z-3,S,3)}}N.fillStyle=this.prefs.color}if(I==="Filled"){if(F){N.lineTo(R,U);N.lineTo(0,U)}N.fill()}else{N.stroke()}N.restore()};var m=function(y){this.feature_positions={};this.slot_height=y;this.translation=0;this.y_translation=0};m.prototype.map_feature_data=function(z,B,y,A){if(!this.feature_positions[B]){this.feature_positions[B]=[]}this.feature_positions[B].push({data:z,x_start:y,x_end:A})};m.prototype.get_feature_data=function(z,D){var C=Math.floor((D-this.y_translation)/this.slot_height),B;if(!this.feature_positions[C]){return null}z+=this.translation;for(var A=0;A=B.x_start&&z<=B.x_end){return B.data}}};var o=function(A,D,y,z,C,E,B){l.call(this,A,D,y,z,C);this.alpha_scaler=(E?E:new d());this.height_scaler=(B?B:new d())};o.prototype.default_prefs={block_color:"#FFF",connector_color:"#FFF"};u(o.prototype,{get_required_height:function(A,z){var y=y_scale=this.get_row_height(),B=this.mode;if(B==="no_detail"||B==="Squish"||B==="Pack"){y=A*y_scale}return y+this.get_top_padding(z)+this.get_bottom_padding(z)},get_top_padding:function(y){return 0},get_bottom_padding:function(y){return Math.max(Math.round(this.get_row_height()/2),5)},draw:function(K,I,G,F){var Q=this.data,D=this.view_start,M=this.view_end;K.save();K.fillStyle=this.prefs.block_color;K.textAlign="right";var H=this.view_end-this.view_start,E=I/H,L=this.get_row_height(),P=new m(L),B;for(var N=0,O=Q.length;ND)&&(this.mode=="Dense"||z!==null)){B=this.draw_element(K,this.mode,A,z,D,M,E,L,I);P.map_feature_data(A,z,B[0],B[1])}}K.restore();P.y_translation=this.get_top_padding(I);return P},draw_element:function(E,A,G,C,B,D,F,z,y){console.log("WARNING: Unimplemented function.");return[0,0]}});var c=10,h=3,k=5,w=10,f=1,s=9,e=3,a=9,j=2,g="#ccc";var r=function(A,D,y,z,C,E,B){o.call(this,A,D,y,z,C,E,B);this.draw_background_connector=true;this.draw_individual_connectors=false};u(r.prototype,o.prototype,{get_row_height:function(){var z=this.mode,y;if(z==="Dense"){y=c}else{if(z==="no_detail"){y=h}else{if(z==="Squish"){y=k}else{y=w}}}return y},draw_element:function(M,D,X,H,O,aj,an,ap,y){var T=X[0],al=X[1],ad=X[2],Q=X[3],ae=Math.floor(Math.max(0,(al-O)*an)),N=Math.ceil(Math.min(y,Math.max(0,(ad-O)*an))),ac=ae,ao=N,aa=(D==="Dense"?0:(0+H))*ap+this.get_top_padding(y),L,ah,R=null,ar=null,B=this.prefs.block_color,ag=this.prefs.label_color;M.globalAlpha=this.alpha_scaler.gen_val(X);if(D==="Dense"){H=1}if(D==="no_detail"){M.fillStyle=B;M.fillRect(ae,aa+5,N-ae,f)}else{var K=X[4],Z=X[5],af=X[6],C=X[7],V=true;if(Z&&af){R=Math.floor(Math.max(0,(Z-O)*an));ar=Math.ceil(Math.min(y,Math.max(0,(af-O)*an)))}var am,U;if(D==="Squish"){am=1;U=e;V=false}else{if(D==="Dense"){am=5;U=s}else{am=5;U=a}}if(!C){M.fillStyle=B;M.fillRect(ae,aa+1,N-ae,U);if(K&&V){if(K==="+"){M.fillStyle=M.canvas.manager.get_pattern("right_strand_inv")}else{if(K==="-"){M.fillStyle=M.canvas.manager.get_pattern("left_strand_inv")}}M.fillRect(ae,aa+1,N-ae,U)}}else{var J,W;if(D==="Squish"||D==="Dense"){J=aa+Math.floor(e/2)+1;W=1}else{if(K){J=aa;W=U}else{J+=(e/2)+1;W=1}}if(this.draw_background_connector){if(D==="Squish"||D==="Dense"){M.fillStyle=g}else{if(K){if(K==="+"){M.fillStyle=M.canvas.manager.get_pattern("right_strand")}else{if(K==="-"){M.fillStyle=M.canvas.manager.get_pattern("left_strand")}}}else{M.fillStyle=g}}M.fillRect(ae,J,N-ae,W)}var E;for(var ak=0,A=C.length;akY){continue}M.fillStyle=B;M.fillRect(z,aa+(U-am)/2+1,Y-z,am);if(R!==undefined&&af>Z&&!(z>ar||YO){M.fillStyle=ag;if(O===0&&ae-M.measureText(Q).width<0){M.textAlign="left";M.fillText(Q,N+j,aa+8);ao+=M.measureText(Q).width+j}else{M.textAlign="right";M.fillText(Q,ae-j,aa+8);ac-=M.measureText(Q).width+j}}}M.globalAlpha=1;return[ac,ao]}});var t=function(B,E,y,A,D,F,C,z){o.call(this,B,E,y,A,D,F,C);this.ref_seq=(z?z.data:null)};u(t.prototype,o.prototype,{get_row_height:function(){var y,z=this.mode;if(z==="Dense"){y=c}else{if(z==="Squish"){y=k}else{y=w;if(this.prefs.show_insertions){y*=2}}}return y},draw_read:function(K,A,ag,V,L,aa,ad,C,B,M){K.textAlign="center";var J=this,R=[L,aa],Z=0,W=0,D=0,F=K.canvas.manager.char_width_px,y=(B==="+"?this.prefs.block_color:this.prefs.reverse_strand_color);var O=[];if((A==="Pack"||this.mode==="Auto")&&M!==undefined&&ag>F){D=Math.round(ag/2)}if(!C){C=[[0,M.length]]}for(var G=0,I=C.length;G0){K.fillStyle=y;K.fillRect(Y-D,V+1,ab-Y,9);K.fillStyle=g;for(var af=0,H=N.length;af=L&&U+af<=aa){var X=Math.floor(Math.max(0,(U+af-L)*ag));K.fillText(N[af],X,V+9)}}}else{K.fillStyle=y;K.fillRect(Y,V+4,ab-Y,e)}}W+=S;Z+=S;break;case"N":K.fillStyle=g;K.fillRect(Y-D,V+5,ab-Y,1);Z+=S;break;case"D":K.fillStyle="red";K.fillRect(Y-D,V+4,ab-Y,3);Z+=S;break;case"P":break;case"I":var ah=Y-D;if(is_overlap([U,U+S],R)){var N=M.slice(W,W+S);if(this.prefs.show_insertions){var T=Y-(ab-Y)/2;if((A==="Pack"||this.mode==="Auto")&&M!==undefined&&ag>F){K.fillStyle="yellow";K.fillRect(T-D,V-9,ab-Y,9);O[O.length]={type:"triangle",data:[ah,V+4,5]};K.fillStyle=g;switch(compute_overlap([U,U+S],R)){case (OVERLAP_START):N=N.slice(L-U);break;case (OVERLAP_END):N=N.slice(0,U-aa);break;case (CONTAINED_BY):break;case (CONTAINS):N=N.slice(L-U,U-aa);break}for(var af=0,H=N.length;afF){O.push({type:"text",data:[N.length,ah,V+9]})}else{}}}W+=S;break;case"X":W+=S;break}}K.fillStyle="yellow";var Q,ai,ae;for(var ac=0;acR.canvas.manager.char_width_px){var O=Math.round(I/2)}if(E[5] instanceof Array){var N=Math.floor(Math.max(0,(E[4][0]-U)*I)),L=Math.ceil(Math.min(P,Math.max(0,(E[4][1]-U)*I))),K=Math.floor(Math.max(0,(E[5][0]-U)*I)),y=Math.ceil(Math.min(P,Math.max(0,(E[5][1]-U)*I)));if(E[4][1]>=U&&E[4][0]<=z&&E[4][2]){this.draw_read(R,M,I,C,U,z,E[4][0],E[4][2],E[4][3],E[4][4])}if(E[5][1]>=U&&E[5][0]<=z&&E[5][2]){this.draw_read(R,M,I,C,U,z,E[5][0],E[5][2],E[5][3],E[5][4])}if(K>L){R.fillStyle=g;p(R,L-O,C+5,K-O,C+5)}}else{this.draw_read(R,M,I,C,U,z,Q,E[4],E[5],E[6])}if(M==="Pack"&&Q>U&&J!=="."){R.fillStyle=this.prefs.label_color;var T=1;if(T===0&&D-R.measureText(J).width<0){R.textAlign="left";R.fillText(J,F+j-O,C+8)}else{R.textAlign="right";R.fillText(J,D-j-O,C+8)}}return[0,0]}});var n=function(A,D,y,z,C,E,B){r.call(this,A,D,y,z,C,E,B);this.longest_feature_length=this.calculate_longest_feature_length();this.draw_background_connector=false;this.draw_individual_connectors=true};u(n.prototype,o.prototype,r.prototype,{calculate_longest_feature_length:function(){var z=0;for(var C=0,y=this.data.length;C0){G.beginPath();G.arc(y,D,H-y,Math.PI,0);G.stroke()}}});x.Scaler=d;x.SummaryTreePainter=v;x.LinePainter=b;x.LinkedFeaturePainter=r;x.ReadPainter=t;x.ArcLinkedFeaturePainter=n};(function(d){var c={};var b=function(e){return c[e]};var a=function(f,g){var e={};g(b,e);c[f]=e};a("class",class_module);a("slotting",slotting_module);a("painters",painters_module);a("trackster",trackster_module);for(key in c.trackster){d[key]=c.trackster[key]}})(window); \ No newline at end of file diff --git a/static/scripts/trackster.js b/static/scripts/trackster.js index 28633f8eecf..2740f334bf5 100644 --- a/static/scripts/trackster.js +++ b/static/scripts/trackster.js @@ -2318,10 +2318,43 @@ var SummaryTreeTile = function(track, index, resolution, canvas, data, max_val) extend(SummaryTreeTile.prototype, Tile.prototype); var FeatureTrackTile = function(track, index, resolution, canvas, data, mode, message, feature_mapper) { + // Attribute init. Tile.call(this, track, index, resolution, canvas, data); this.mode = mode; this.message = message; this.feature_mapper = feature_mapper; + + // Add message + action icons to tile's "canvas" TODO: rename canvas to element/html or something similar. + if (this.message) { + var + canvas = this.canvas.children()[0], + message_div = $("
").addClass("tile-message").text(this.message). + // -1 to account for border. + css({'height': ERROR_PADDING-1, 'width': canvas.width}).prependTo(this.canvas), + more_down_icon = $("").addClass("icon more-down").appendTo(message_div), + more_across_icon = $("").addClass("icon more-across").appendTo(message_div); + + // Set up actions for icons. + more_down_icon.click(function() { + // Mark tile as stale, request more data, and redraw track. + tile.stale = true; + track.data_manager.get_more_data(tile.low, tile.high, track.mode, tile.resolution, {}, track.data_manager.DEEP_DATA_REQ); + track.request_draw(); + }).dblclick(function(e) { + // Do not propogate as this would normally zoom in. + e.stopPropagation(); + }); + + more_across_icon.click(function() { + // Mark tile as stale, request more data, and redraw track. + tile.stale = true; + track.data_manager.get_more_data(tile.low, tile.high, track.mode, tile.resolution, {}, track.data_manager.BROAD_DATA_REQ); + track.request_draw(); + }).dblclick(function(e) { + // Do not propogate as this would normally zoom in. + e.stopPropagation(); + }); + } }; extend(FeatureTrackTile.prototype, Tile.prototype); @@ -2852,7 +2885,8 @@ extend(TiledTrack.prototype, Drawable.prototype, Track.prototype, { // w_scale units are pixels per base. w_scale = width / range, resolution = this.view.resolution, - parent_element = $("
"); + // FIXME: parent element is not currently needed, but it may be useful for multitrack drawing. + parent_element = this.content_div; // For overview, adjust high, low, resolution, and w_scale. if (this.is_overview) { @@ -2861,9 +2895,19 @@ extend(TiledTrack.prototype, Drawable.prototype, Track.prototype, { resolution = Math.pow(RESOLUTION, Math.ceil( Math.log( (view.max_high - view.max_low) / DENSITY ) / Math.log(RESOLUTION) )); w_scale = width / (view.max_high - view.max_low); } + + // + // Method for moving and/or removing tiles: + // (a) mark all elements for removal using class 'remove' + // (b) during tile drawing/placement, remove class for elements that are moved; + // this occurs in show_tile() + // (c) after drawing all tiles, remove elements still marked for removal + // (i.e. that still have class 'remove'). + // - if (!clear_after) { this.content_div.children().remove(); } - this.content_div.append( parent_element ); + // Step (a) for (re)moving tiles. + if (!clear_after) { this.content_div.children().addClass("remove"); } + this.max_height = 0; // Index of first tile that overlaps visible region var tile_index = Math.floor( low / resolution / DENSITY ); @@ -2882,6 +2926,9 @@ extend(TiledTrack.prototype, Drawable.prototype, Track.prototype, { tile_index += 1; tile_count++; } + + // Step (c) for (re)moving tiles. + if (!clear_after) { this.content_div.children(".remove").remove(); } // Use interval to check if tiles have been drawn. When all tiles are drawn, call post-draw actions. var track = this; @@ -2978,65 +3025,36 @@ extend(TiledTrack.prototype, Drawable.prototype, Track.prototype, { return null; }, /** - * Show track tile and perform associated actions. + * Show track tile and perform associated actions. Showing tile may actually move + * an existing tile rather than reshowing it. */ show_tile: function(tile, parent_element, w_scale) { - // Readability. var track = this, - canvas = tile.canvas, - tile_element = canvas; + tile_element = tile.canvas; // - // If tile has message, display message and button to show more data. - // TODO: need to handle other messages, not assume message === show more data. - // - if (tile.message) { - var - container_div = $("
"), - message_div = $("
").addClass("tile-message").text(tile.message). - // -1 to account for border. - css({'height': ERROR_PADDING-1, 'width': tile.canvas.width}).appendTo(container_div), - more_down_icon = $("").addClass("icon more-down").appendTo(message_div), - more_across_icon = $("").addClass("icon more-across").appendTo(message_div); - container_div.append(canvas); - tile_element = container_div; - - // Set up actions for icons. - more_down_icon.click(function() { - // Mark tile as stale, request more data, and redraw track. - tile.stale = true; - track.data_manager.get_more_data(tile.low, tile.high, track.mode, tile.resolution, {}, track.data_manager.DEEP_DATA_REQ); - track.request_draw(); - }).dblclick(function(e) { - // Do not propogate as this would normally zoom in. - e.stopPropagation(); - }); - - more_across_icon.click(function() { - // Mark tile as stale, request more data, and redraw track. - tile.stale = true; - track.data_manager.get_more_data(tile.low, tile.high, track.mode, tile.resolution, {}, track.data_manager.BROAD_DATA_REQ); - track.request_draw(); - }).dblclick(function(e) { - // Do not propogate as this would normally zoom in. - e.stopPropagation(); - }); - } - - // - // Show tile element. + // Show/move tile element. // tile.predisplay_actions(); - // Position tile element, recalculate left position at display time + // Position tile element based on current viewport. var left = ( tile.low - (this.is_overview? this.view.max_low : this.view.low) ) * w_scale; if (this.left_offset) { left -= this.left_offset; } tile_element.css({ position: 'absolute', top: 0, left: left, height: '' }); - parent_element.append(tile_element); + + if ( tile_element.hasClass("remove") ) { + // Step (b) for (re)moving tiles. See _draw() function for description of algorithm + // for removing tiles. + tile_element.removeClass("remove"); + } + else { + // Showing new tile. + parent_element.append(tile_element); + } // Set track height. track.max_height = Math.max(track.max_height, tile_element.height());