From 0fbaff432c9acb99c88201022ee842110d0f699d Mon Sep 17 00:00:00 2001 From: Pujan Joshi Date: Mon, 12 Oct 2015 15:47:15 -0400 Subject: [PATCH] minor changes. refactor. --- VQI_GenomeBrowser.js | 1275 +++++++++++++++++++++--------------------- 1 file changed, 644 insertions(+), 631 deletions(-) diff --git a/VQI_GenomeBrowser.js b/VQI_GenomeBrowser.js index 7970c6d..e6f9b78 100755 --- a/VQI_GenomeBrowser.js +++ b/VQI_GenomeBrowser.js @@ -1,4 +1,9 @@ -function VQI_GenomeBrowser(id, serviceURL) { +function VQI_GenomeBrowser(id) { + var resourceFolder = 'js/modules/VQI_GenomeBrowser/'; + var serviceURL = resourceFolder + 'dynamic_loading.php'; + var deleteImage = resourceFolder + 'DeleteTrack.png'; + var exportImage = resourceFolder + 'ExportTrack.png'; + var divId = id; var width = 1000; @@ -43,7 +48,7 @@ function VQI_GenomeBrowser(id, serviceURL) { var navigateToRegion = function () { var navigate = $("#" + divId + " #navigate").val(); navigate = navigate.split(/[:-]/); - if (navigate.length == 3){ + if (navigate.length == 3) { var chrom = navigate[0].trim(); var chrom_start = Number(navigate[1].trim()); var chrom_end = Number(navigate[2].trim()); @@ -63,19 +68,19 @@ function VQI_GenomeBrowser(id, serviceURL) { browseToGene(); } }; - var addRecentTrack = function(){ + var addRecentTrack = function () { var track = $("#" + divId + " #RecentTracks").val(); - for (i in trackList){ - if (trackList[i].name == track){ + for (i in trackList) { + if (trackList[i].name == track) { return; } } - for (i in trackInfo){ + for (i in trackInfo) { - if (trackInfo[i].name == track){ - self.addTrack(trackInfo[i].name , trackInfo[i].type , trackInfo[i].args); + if (trackInfo[i].name == track) { + self.addTrack(trackInfo[i].name, trackInfo[i].type, trackInfo[i].args); break; - } + } } } @@ -105,40 +110,40 @@ function VQI_GenomeBrowser(id, serviceURL) { }; - + this.makeNavMenu = function () { - var menu = "" - var homeTable = ""+ - ""+ - ""+ - ""+ - "
" - - var tackMenuTable = ""+ - ""+ - ""+ - ""+ - "
" - - var analysisMenuTable = ""+ - ""+ - ""+ - "
" - - var menuContent = "
"+ - //"
"+homeTable+"
"+ - "
"+tackMenuTable+"
"+ - "
"+analysisMenuTable+"
"+ - "
"+ - "
" - - - var menuContainer = "
"+menu+menuContent+"
"; + var menu = "" + var homeTable = "" + + "" + + "" + + "" + + "
" + + var tackMenuTable = "" + + "" + + "" + + "" + + "
" + + var analysisMenuTable = "" + + "" + + "" + + "
" + + var menuContent = "
" + + //"
"+homeTable+"
"+ + "
" + tackMenuTable + "
" + + "
" + analysisMenuTable + "
" + + "
" + + "
" + + + var menuContainer = "
" + menu + menuContent + "
"; $("#" + divId).append(menuContainer); }; @@ -151,7 +156,9 @@ function VQI_GenomeBrowser(id, serviceURL) { var form = ""; $("#" + divId).append(form); $("#" + divId + " #navigatebutton").on("click", navigateToRegion.bind(this)); - $("#" + divId + " #genomes").on("change", function(){self.setGenome($("#" + divId + " #genomes").val())}); + $("#" + divId + " #genomes").on("change", function () { + self.setGenome($("#" + divId + " #genomes").val()) + }); }; this.makeNavigationForm(); @@ -159,8 +166,8 @@ function VQI_GenomeBrowser(id, serviceURL) { var track1Name = $("#" + divId + " #track1").val(); var track2Name = $("#" + divId + " #track2").val(); var coloc_dist = $("#" + divId + " #coloc_dist").val(); - - if(track1Name === track2Name){ + + if (track1Name === track2Name) { alert("Track1 and Track2 cannot be same for colocalization."); return; } @@ -264,16 +271,16 @@ function VQI_GenomeBrowser(id, serviceURL) { this.makeFormForColocalization(); /*var removeSelectedTracks = function () { - for (var i = trackList.length - 1; i >= 0; i--) { - if (trackList[i].isSelected()) - { - trackList[i].group.remove(); - trackList.splice(i, 1); - } - } - reorderTracks(); - updateAllTracksSelectBoxes(); - }*/ + for (var i = trackList.length - 1; i >= 0; i--) { + if (trackList[i].isSelected()) + { + trackList[i].group.remove(); + trackList.splice(i, 1); + } + } + reorderTracks(); + updateAllTracksSelectBoxes(); + }*/ var removeTrack = function (track_name) { for (var i = trackList.length - 1; i >= 0; i--) { @@ -298,39 +305,39 @@ function VQI_GenomeBrowser(id, serviceURL) { reorderTracks(); updateAllTracksSelectBoxes(); } - -/* this.getSelectedTrackNames = function(){ - var tracknames = [] - for (var i in trackList) { - if (trackList[i].isSelected()) - { - tracknames.push(trackList[i].name); - } - } - return tracknames; - } - this.getSelectedTracks = function(){ - tracknames = thisObj.getSelectedTrackNames(); - tracks = []; - for (var i in tracknames) { - tracks.push(thisObj.getTrackByName(tracknames[i])); - } - return tracks; - } - - var exportSelectedTracks = function () { - var tracknames = [] - for (var i in trackList) { - if (trackList[i].isSelected()) - { - tracknames.push(trackList[i].name); - } - } - for (var i in tracknames) { - exportTrack(tracknames[i]); - } - }*/ + /* this.getSelectedTrackNames = function(){ + var tracknames = [] + for (var i in trackList) { + if (trackList[i].isSelected()) + { + tracknames.push(trackList[i].name); + } + } + return tracknames; + } + + this.getSelectedTracks = function(){ + tracknames = thisObj.getSelectedTrackNames(); + tracks = []; + for (var i in tracknames) { + tracks.push(thisObj.getTrackByName(tracknames[i])); + } + return tracks; + } + + var exportSelectedTracks = function () { + var tracknames = [] + for (var i in trackList) { + if (trackList[i].isSelected()) + { + tracknames.push(trackList[i].name); + } + } + for (var i in tracknames) { + exportTrack(tracknames[i]); + } + }*/ var exportTrack = function (track_name) { @@ -340,41 +347,41 @@ function VQI_GenomeBrowser(id, serviceURL) { } - this.makeUploadForm = function() { + this.makeUploadForm = function () { var fileInput = document.createElement('input'); fileInput.type = 'file'; fileInput.addEventListener('change', function (e) { - var file = fileInput.files[0]; - var textType = /text.*/; - if (file.type.match(textType)) { - var reader = new FileReader(); - - reader.onload = function (e) { - var Data = reader.result; - uploadFile(Data); - } + var file = fileInput.files[0]; + var textType = /text.*/; + if (file.type.match(textType)) { + var reader = new FileReader(); + + reader.onload = function (e) { + var Data = reader.result; + uploadFile(Data); + } - reader.readAsText(file); + reader.readAsText(file); - } else { - alert("File not supported!"); + } else { + alert("File not supported!"); - } + } }); var f = document.createElement("form"); - fileInput.style.display="inline"; + fileInput.style.display = "inline"; f.innerHTML = "Add track by uploading file: "; f.appendChild(fileInput); $("#" + divId + " #uploadDataContainer").append(f); } this.makeUploadForm(); - this.makeRecentTrackForm = function (){ + this.makeRecentTrackForm = function () { var trackSelect = "Recent tracks: "; @@ -399,9 +406,9 @@ function VQI_GenomeBrowser(id, serviceURL) { var mcScoreButton = ""; var entScoreButton = ""; //var removeExportform = "
" + removeButton + "   "+exportButton +"
"; - var mcEntForm = "
" + mcScoreButton + "   "+entScoreButton +"
"; + var mcEntForm = "
" + mcScoreButton + "   " + entScoreButton + "
"; //$("#" + divId +" #exportRemoveContainer").append(removeExportform); - $("#" + divId +" #mcEntContainer").append(mcEntForm); + $("#" + divId + " #mcEntContainer").append(mcEntForm); //$("#" + divId + " #removetrackbutton").on("click", removeSelectedTracks.bind(this)); //$("#" + divId + " #exporttrackbutton").on("click", exportSelectedTracks.bind(this)); }; @@ -441,62 +448,62 @@ function VQI_GenomeBrowser(id, serviceURL) { var rubberbanding = false; var rubberbandingX; - svg.on("mousedown", function() { - svg.selectAll("rect.selection").remove(); - if(d3.event.shiftKey){ - d3.event.preventDefault(); - zoom.on("zoom",null); - svg.call(zoom); - rubberbanding = true; - var p = d3.mouse(this); - // create rubber band selector - - if(p[0] > margin && p[0] < margin + width) - { - svg.append( "rect") + svg.on("mousedown", function () { + svg.selectAll("rect.selection").remove(); + if (d3.event.shiftKey) { + d3.event.preventDefault(); + zoom.on("zoom", null); + svg.call(zoom); + rubberbanding = true; + var p = d3.mouse(this); + // create rubber band selector + + if (p[0] > margin && p[0] < margin + width) + { + svg.append("rect") .attr({ - class : "selection", - x : p[0], - y : 0, - width : 0, - height : height + 2 * margin + trackList.length * (trackHeight + bufferSpace) + class: "selection", + x: p[0], + y: 0, + width: 0, + height: height + 2 * margin + trackList.length * (trackHeight + bufferSpace) }) .style("fill-opacity", ".2") .on("mousedown", navigateToRegion); - } - rubberbandingX = p[0]; - } - }) - .on("mousemove", function() { + } + rubberbandingX = p[0]; + } + }) + .on("mousemove", function () { // rubber band selector var s = svg.select("rect.selection"); - if(!s.empty() && rubberbanding) { + if (!s.empty() && rubberbanding) { d3.event.preventDefault(); // get cursor coordinate var p = d3.mouse(this); // get rubber band selector coordinate and size - newX = Math.min(Math.max(p[0] , margin), width + margin); + newX = Math.min(Math.max(p[0], margin), width + margin); var c = { - x : Math.min(newX, rubberbandingX), - width : Math.abs(newX - rubberbandingX) - }; - + x: Math.min(newX, rubberbandingX), + width: Math.abs(newX - rubberbandingX) + }; + s.attr(c); } }) - .on("mouseup", function() { + .on("mouseup", function () { // remove rubber band selector - zoom.on("zoom",zoomed); - svg.call(zoom).on("dblclick.zoom", null); - rubberbanding = false; + zoom.on("zoom", zoomed); + svg.call(zoom).on("dblclick.zoom", null); + rubberbanding = false; var s = svg.select("rect.selection"); - if(!s.empty()){ + if (!s.empty()) { $("#" + divId + " #navigate").val(chrom_curr + ":" - + Math.round(xScale.invert(parseInt(s.attr("x"))-margin)) + "-" - + Math.round(xScale.invert(parseInt(s.attr("x")) + parseInt(s.attr("width")) - margin))); - } + + Math.round(xScale.invert(parseInt(s.attr("x")) - margin)) + "-" + + Math.round(xScale.invert(parseInt(s.attr("x")) + parseInt(s.attr("width")) - margin))); + } }); var clipPath = graphRegion.append("clipPath") @@ -508,11 +515,11 @@ function VQI_GenomeBrowser(id, serviceURL) { var zoomed = function () { - svg.selectAll("rect.selection").remove(); + svg.selectAll("rect.selection").remove(); zoom.translate([panLimit(), 0]); - for(i in trackList) + for (i in trackList) { trackList[i].zoomed(); } @@ -529,18 +536,18 @@ function VQI_GenomeBrowser(id, serviceURL) { "font-family": "sans-serif", "font-size": "11px"}); - if (waitTime != undefined) - { - clearTimeout(waitTime); - } + if (waitTime != undefined) + { + clearTimeout(waitTime); + } waitTime = setTimeout(updateTrack, 100); $("#" + divId + " #navigate").val(chrom_curr + ":" + Math.round(xScale.domain()[0]) + "-" + Math.round(xScale.domain()[1])); }; - var uploadFile = function(data,name,genome){ + var uploadFile = function (data, name, genome) { //console.log(data); - headerArray = ["CHROM","CHROM_START","CHROM_END","GENESYMBOL","SCORE","STRAND"]; + headerArray = ["CHROM", "CHROM_START", "CHROM_END", "GENESYMBOL", "SCORE", "STRAND"]; for (i in headerArray) { indexArray[headerArray[i]] = i; @@ -559,32 +566,32 @@ function VQI_GenomeBrowser(id, serviceURL) { }).success(function (data) { var CurrentFileHandle = data; var trackName = CurrentFileHandle; - if(name !== undefined){ + if (name !== undefined) { var trackName = name; } trackInfo.push({name: trackName, type: "custom", args: {table_name: CurrentFileHandle, exportable: true}}); updateRecentTrackDropDown(); - self.addTrack(trackName , "custom" , {table_name: CurrentFileHandle}); + self.addTrack(trackName, "custom", {table_name: CurrentFileHandle}); }).error(function (req, status, error) { $("body").append(status + ": " + error); }); } - this.uploadFileFromServer = function(data,name,genome){ + this.uploadFileFromServer = function (data, name, genome) { var temp = []; for (i in data) { temp.push(data[i].join('\t')); } trackData = temp.join('\n'); - uploadFile(trackData,name,genome); + uploadFile(trackData, name, genome); } - var updateTrack = function(){ + var updateTrack = function () { for (i in trackList) { - trackList[i].updateTrack(); + trackList[i].updateTrack(); } } - var testRemove = function(){ + var testRemove = function () { removeTrack("HG191"); reorderTracks(); } @@ -624,9 +631,9 @@ function VQI_GenomeBrowser(id, serviceURL) { svg.call(zoom).on("dblclick.zoom", null); var scale = (panExtent[1] - panExtent[0]) / (xMax - xMin) / initialZoom; - if(scale > (panExtent[1] - panExtent[0]) / 50 / initialZoom) + if (scale > (panExtent[1] - panExtent[0]) / 50 / initialZoom) scale = (panExtent[1] - panExtent[0]) / 50 / initialZoom; - if(scale < 1 / initialZoom) + if (scale < 1 / initialZoom) scale = 1 / initialZoom; zoom.scale(scale) @@ -645,13 +652,13 @@ function VQI_GenomeBrowser(id, serviceURL) { //transitions start from the previous transition, so I make a transition that first zooms //to the current view in no time, then another transition that zooms to the desired view svg.transition() - .duration(0) - .call(zoom.translate(prevTranslate).scale(prevScale).event) - .each("end", function(){ - svg.transition() - .duration(1000) - .call(zoom.scale(scale).translate([zoomWidth, 0]).event) - }) + .duration(0) + .call(zoom.translate(prevTranslate).scale(prevScale).event) + .each("end", function () { + svg.transition() + .duration(1000) + .call(zoom.scale(scale).translate([zoomWidth, 0]).event) + }) zoomed(); } @@ -677,8 +684,8 @@ function VQI_GenomeBrowser(id, serviceURL) { var distance = (panExtent[1] - panExtent[0]) / initialZoom; fullXScale = d3.scale.linear() - .domain([panExtent[0], panExtent[0] + distance]) - .range([0, width]); + .domain([panExtent[0], panExtent[0] + distance]) + .range([0, width]); } var graph = function (chromosome, min, max) { @@ -705,33 +712,33 @@ function VQI_GenomeBrowser(id, serviceURL) { } } - this.loadGenomes = function(genomesData) { + this.loadGenomes = function (genomesData) { genomes = genomesData; - selectBox = $("#" + divId +" #genomes").get(0); + selectBox = $("#" + divId + " #genomes").get(0); selectBox.options.length = 0; var optionIndex = 0; for (var key in genomes) { var text = key; var value = key; selectBox.options[optionIndex++] = new Option(text, value); - for(var key2 in genomes[key]) + for (var key2 in genomes[key]) { - if(key2 === 'custom' || key2 ==='genes') + if (key2 === 'custom' || key2 === 'genes') { checkTableUpload(genomes[key][key2].table_name, genomes[key][key2].file) } - if(key2 === 'cpg') + if (key2 === 'cpg') { var tempHandles = genomes[key][key2].table_name.split(","); var fileHandles = genomes[key][key2].file.split(","); - for(var i in tempHandles) + for (var i in tempHandles) { checkTableUpload(tempHandles[i].trim(), fileHandles[i].trim()) } } } } - selectBox = $("#" + divId +" #genomes").get(0); + selectBox = $("#" + divId + " #genomes").get(0); selectBox.options.length = 0; var optionIndex = 0; for (var key in genomes) { @@ -739,24 +746,24 @@ function VQI_GenomeBrowser(id, serviceURL) { var value = key; selectBox.options[optionIndex++] = new Option(text, value); } - + } - this.setGenome = function(genome) { + this.setGenome = function (genome) { removeAllTracks(); - $("#" + divId +" #genomes").val(genome); + $("#" + divId + " #genomes").val(genome); - if(genomes.hasOwnProperty(genome)){ - for(var key in genomes[genome]) + if (genomes.hasOwnProperty(genome)) { + for (var key in genomes[genome]) { - this.addTrack(genome+"_"+key, key, genomes[genome][key]) - trackInfo.push({name: genome+"_"+key, type: key, args: genomes[genome][key]}); + this.addTrack(genome + "_" + key, key, genomes[genome][key]) + trackInfo.push({name: genome + "_" + key, type: key, args: genomes[genome][key]}); updateRecentTrackDropDown(); } } } - var checkTableUpload = function(tableName,filePath) { + var checkTableUpload = function (tableName, filePath) { $.ajax({ url: serviceURL, @@ -767,40 +774,37 @@ function VQI_GenomeBrowser(id, serviceURL) { "tableName": tableName, "filePath": filePath } - - }).success(function (returnData) { - } - ).error(function (req, status, error) { - $("body").append(status + ": " + error); - }); + + }).success(function (returnData) { + } + ).error(function (req, status, error) { + $("body").append(status + ": " + error); + }); } this.addTrack = function (name, type, args, fromServer) { - if(fromServer){ + if (fromServer) { var temp = []; for (i in args) { temp.push(args[i].join('\t')); } trackData = temp.join('\n'); - uploadFile(trackData,name); + uploadFile(trackData, name); } - else{ + else { var trackIndex = trackList.length; var trackCount = trackIndex + 1; //name of track name = name || "track-" + (trackIndex + 1); - if(type == "cpg") - { + if (type == "cpg") { trackList.push(new CpgTrack(name, graphRegion.append("g"), args)); } - else if(type == "genes") - { + else if (type == "genes") { trackList.push(new BedTrack(name, graphRegion.append("g"), args)); } - else if(type == "fasta") - { + else if (type == "fasta") { trackList.push(new FastaTrack(name, graphRegion.append("g"), args)); } else @@ -816,41 +820,41 @@ function VQI_GenomeBrowser(id, serviceURL) { zoomOnly = true; zoomed(); zoomOnly = false; - + reorderTracks(); updateAllTracksSelectBoxes(); } - - } - /*this.addTrackFile = function (dataFile, name, type, header) { - $.get(dataFile, function (data) { - var dataRows = thisObj.parseTrackFile(data, header); - - thisObj.addTrack(dataRows, name, type); - - }); } - this.parseTrackFile = function (data, header) { - var delimeter = "\t"; - var thisData = new Array(); - var txtContent = data.split(/\r\n|\r|\n/g); - var startRow = 0; - if (header) { - startRow = 1; - } - for (var i = startRow; i < txtContent.length; i++) { - var thisRow = txtContent[i].split(delimeter); - var thisObject = {}; - thisObject = thisRow; - if (thisRow[0].indexOf("##") === 0) { - continue; - } - thisData.push(thisObject); - } - return thisData; - };*/ + /*this.addTrackFile = function (dataFile, name, type, header) { + $.get(dataFile, function (data) { + var dataRows = thisObj.parseTrackFile(data, header); + + thisObj.addTrack(dataRows, name, type); + + }); + } + + this.parseTrackFile = function (data, header) { + var delimeter = "\t"; + var thisData = new Array(); + var txtContent = data.split(/\r\n|\r|\n/g); + var startRow = 0; + if (header) { + startRow = 1; + } + for (var i = startRow; i < txtContent.length; i++) { + var thisRow = txtContent[i].split(delimeter); + var thisObject = {}; + thisObject = thisRow; + if (thisRow[0].indexOf("##") === 0) { + continue; + } + thisData.push(thisObject); + } + return thisData; + };*/ this.getTrackByName = function (name) { for (var i in trackList) { @@ -933,7 +937,7 @@ function VQI_GenomeBrowser(id, serviceURL) { .attr("x2", width) .attr("y2", 0) .style("stroke", "blue") - .style("stroke-opacity" , 0.5); + .style("stroke-opacity", 0.5); group.append("text") .attr("x", 0) @@ -947,23 +951,23 @@ function VQI_GenomeBrowser(id, serviceURL) { group.append("foreignObject") .attr("width", 20) .attr("height", 20) - .attr("x", width+5) + .attr("x", width + 5) .attr("y", -15) .append("xhtml:div") - .html("
") + .html("
") .on("click", function () { deleteConfirm.style("visibility", "visible"); }); - if(args.exportable) + if (args.exportable) { group.append("foreignObject") .attr("width", 20) .attr("height", 20) - .attr("x", width+5) + .attr("x", width + 5) .attr("y", 0) .append("xhtml:div") - .html("
") + .html("
") .on("click", function () { exportTrack(name); }); @@ -972,33 +976,34 @@ function VQI_GenomeBrowser(id, serviceURL) { group.append("foreignObject") .attr("width", 20) .attr("height", 20) - .attr("x", width+25) + .attr("x", width + 25) .attr("y", -10) .attr("class", "checkbox") .append("xhtml:div") .html("
") .on("click", function () { - xAxisSelection.call(xAxis)});//I have no idea why it won't redraw the checkbox unless I call this + xAxisSelection.call(xAxis) + });//I have no idea why it won't redraw the checkbox unless I call this var deleteConfirm = group.append("g") - .style("visibility", "hidden"); + .style("visibility", "hidden"); deleteConfirm.append("rect") - .attr("width", 40) - .attr("height", 50) - .attr("x", width+5) - .attr("y", -25) - .style("fill", "white") + .attr("width", 40) + .attr("height", 50) + .attr("x", width + 5) + .attr("y", -25) + .style("fill", "white") deleteConfirm.append("text") - .attr("x", width+5) - .attr("y", -25) - .text("Delete?") + .attr("x", width + 5) + .attr("y", -25) + .text("Delete?") deleteConfirm.append("foreignObject") .attr("width", 40) .attr("height", 20) - .attr("x", width+5) + .attr("x", width + 5) .attr("y", -20) .append("xhtml:div") .html("
") @@ -1009,7 +1014,7 @@ function VQI_GenomeBrowser(id, serviceURL) { deleteConfirm.append("foreignObject") .attr("width", 40) .attr("height", 20) - .attr("x", width+5) + .attr("x", width + 5) .attr("y", 0) .append("xhtml:div") .html("
") @@ -1052,22 +1057,26 @@ function VQI_GenomeBrowser(id, serviceURL) { }); this.trackGroup = group.append("g") - .attr("clip-path", "url(#clip)") - .append("g"); + .attr("clip-path", "url(#clip)") + .append("g"); - this.isSelected = function() { + this.isSelected = function () { return group.select("#check").node().checked; } //Updates currently loaded objects whenever zooming or scrolling - this.zoomed = function(){}; + this.zoomed = function () { + }; //Pull in new data from database if neccessary when zooming/scrolling stops - this.updateTrack = function(){}; + this.updateTrack = function () { + }; - this.getData = function(){}; + this.getData = function () { + }; - this.getRange = function(){}; + this.getRange = function () { + }; } function CpgTrack(name, group, args) { @@ -1083,14 +1092,14 @@ function VQI_GenomeBrowser(id, serviceURL) { var redrawCutoff = 1000; //Scale at which rectangles will be drawn individually - var getScale = function(){ - if(zoom.scale() < redrawCutoff) + var getScale = function () { + if (zoom.scale() < redrawCutoff) return fullXScale; else return xScale; } - var drawTrack = function(data) + var drawTrack = function (data) { var thisScale = getScale(); @@ -1136,79 +1145,82 @@ function VQI_GenomeBrowser(id, serviceURL) { return offset;//height / 2 + margin + offset }) - addTooltip(trackGroup.selectAll("rect") - .filter(function (d) { - return d[indexArray.type] == "cpg";}), "cpg", cpgFileHandle); + addTooltip(trackGroup.selectAll("rect") + .filter(function (d) { + return d[indexArray.type] == "cpg"; + }), "cpg", cpgFileHandle); - addTooltip(trackGroup.selectAll("rect") - .filter(function (d) { - return d[indexArray.type] == "shore";}), "shore", shoreFileHandle); + addTooltip(trackGroup.selectAll("rect") + .filter(function (d) { + return d[indexArray.type] == "shore"; + }), "shore", shoreFileHandle); - addTooltip(trackGroup.selectAll("rect") - .filter(function (d) { - return d[indexArray.type] == "shelve";}), "shelve", shelveFileHandle); + addTooltip(trackGroup.selectAll("rect") + .filter(function (d) { + return d[indexArray.type] == "shelve"; + }), "shelve", shelveFileHandle); } - var addTooltip = function(selection, type, fileHandle) + var addTooltip = function (selection, type, fileHandle) { var start = (Math.round(xScale.domain()[0])).toString(); var end = (Math.round(xScale.domain()[1])).toString(); - var scale = (end - start)/1000; + var scale = (end - start) / 1000; selection.each( - function(d){ - $(this).qtip({ - content: { - text: "Loading..." - }, - position: { - my: 'top center', - at: 'top center', - target: 'mouse', - adjust: { - mouse: true, // Can be omitted (e.g. default behaviour) - y: 10 - } - } - }) - }); - - selection.each(function(){ - var selected = $(this); - var hoverTimeout = 0; - $(this).mousemove(function(event) { - clearTimeout(hoverTimeout); - hoverTimeout = setTimeout(function(){ - var pixelWidth = (xScale.domain()[1] - xScale.domain()[0])/1000 - var min = (event.pageX - 60) * pixelWidth + xScale.domain()[0]; - var max = (event.pageX - 58) * pixelWidth + xScale.domain()[0]; - $.ajax({ - url: serviceURL, - type: 'POST', - dataType: "json", - data: { - "loadTooltip": "", - "chrom": chrom_curr, - "type" : type, - "min" : min, - "max": max, - 'fileHandle': fileHandle + function (d) { + $(this).qtip({ + content: { + text: "Loading..." + }, + position: { + my: 'top center', + at: 'top center', + target: 'mouse', + adjust: { + mouse: true, // Can be omitted (e.g. default behaviour) + y: 10 } - }) - .then(function(content) { - // Set the tooltip content upon successful retrieval - selected.qtip('option', 'content.text', content); - selected.qtip('reposition', event); - }, function(xhr, status, error) { - // Upon failure... set the tooltip content to the status and error value - selected.qtip('option', 'content.text', status + ': ' + error); - }); - } , 200); + } + }) }); + + selection.each(function () { + var selected = $(this); + var hoverTimeout = 0; + $(this).mousemove(function (event) { + clearTimeout(hoverTimeout); + hoverTimeout = setTimeout(function () { + var pixelWidth = (xScale.domain()[1] - xScale.domain()[0]) / 1000 + var min = (event.pageX - 60) * pixelWidth + xScale.domain()[0]; + var max = (event.pageX - 58) * pixelWidth + xScale.domain()[0]; + $.ajax({ + url: serviceURL, + type: 'POST', + dataType: "json", + data: { + "loadTooltip": "", + "chrom": chrom_curr, + "type": type, + "min": min, + "max": max, + 'fileHandle': fileHandle + } + }) + .then(function (content) { + // Set the tooltip content upon successful retrieval + selected.qtip('option', 'content.text', content); + selected.qtip('reposition', event); + }, function (xhr, status, error) { + // Upon failure... set the tooltip content to the status and error value + selected.qtip('option', 'content.text', status + ': ' + error); + }); + }, 200); }); + }); } - this.updateTrack = function(){ + this.updateTrack = function () { var start = (Math.round(xScale.domain()[0])).toString(); var end = (Math.round(xScale.domain()[1])).toString(); var chrom = chrom_curr; @@ -1217,19 +1229,19 @@ function VQI_GenomeBrowser(id, serviceURL) { var LoadingText = group.append("g") LoadingText.append("rect") - .attr("x", 450) - .attr("width", 100) - .attr("y", -10) - .attr("height", 20) - .attr("rx", 6) - .attr("ry", 6) - .style("fill-opacity", .6) - .style("fill", "white") - + .attr("x", 450) + .attr("width", 100) + .attr("y", -10) + .attr("height", 20) + .attr("rx", 6) + .attr("ry", 6) + .style("fill-opacity", .6) + .style("fill", "white") + LoadingText.append("text") - .text("Loading...") - .attr("x", 475) - .attr("y", 5); + .text("Loading...") + .attr("x", 475) + .attr("y", 5); $.ajax({ url: serviceURL, @@ -1243,30 +1255,30 @@ function VQI_GenomeBrowser(id, serviceURL) { "start": start, "end": end } - - }).success(function (returnData) { - drawTrack(returnData); - LoadingText.remove(); - } - ).error(function (req, status, error) { - $("body").append(status + ": " + error); - }); + + }).success(function (returnData) { + drawTrack(returnData); + LoadingText.remove(); + } + ).error(function (req, status, error) { + $("body").append(status + ": " + error); + }); } var previousScale = 1; - this.zoomed = function() { + this.zoomed = function () { var thisScale = getScale(); - if(zoom.scale() < redrawCutoff) + if (zoom.scale() < redrawCutoff) { - if(previousScale > redrawCutoff) + if (previousScale > redrawCutoff) { trackGroup.selectAll("rect") - .attr("width", function (d) { - return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) - }) - .attr("x", function (d) { - return thisScale(d[indexArray.start]) - }); + .attr("width", function (d) { + return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) + }) + .attr("x", function (d) { + return thisScale(d[indexArray.start]) + }); } trackGroup.attr("transform", "translate(" + zoom.translate()[0] + ",0)scale(" + zoom.scale() + ",1)"); } @@ -1274,27 +1286,27 @@ function VQI_GenomeBrowser(id, serviceURL) { { trackGroup.attr("transform", null); trackGroup.selectAll("rect") - .attr("width", function (d) { - return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) - }) - .attr("x", function (d) { - return thisScale(d[indexArray.start]) - }); + .attr("width", function (d) { + return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) + }) + .attr("x", function (d) { + return thisScale(d[indexArray.start]) + }); } previousScale = zoom.scale(); } - this.getData = function(){ + this.getData = function () { return data; } - this.getRange = function(){ + this.getRange = function () { var range; $.ajax({ url: serviceURL, type: 'POST', dataType: "json", - async : false, + async: false, data: { "getRange": "", "fileHandle": fileHandle, @@ -1305,7 +1317,7 @@ function VQI_GenomeBrowser(id, serviceURL) { range = returnData; }).error(function (req, status, error) { $("body").append(status + ": " + error); - }); + }); return range; } @@ -1319,14 +1331,14 @@ function VQI_GenomeBrowser(id, serviceURL) { var data; var redrawCutoff = 1000; //Scale at which rectangles will be drawn individually - var getScale = function(){ - if(zoom.scale() < redrawCutoff) + var getScale = function () { + if (zoom.scale() < redrawCutoff) return fullXScale; else return xScale; } - var drawTrack = function(data, exons) + var drawTrack = function (data, exons) { if (data.length === 0) { return; @@ -1372,10 +1384,11 @@ function VQI_GenomeBrowser(id, serviceURL) { return d[indexArray.score] > 0 ? "red" : d[indexArray.score] < 0 ? "green" : "grey"; }) .style("vector-effect", "non-scaling-stroke") - - addTooltip(trackGroup.selectAll("rect") - .data(data, function (d) { - return d;}), "gene") + + addTooltip(trackGroup.selectAll("rect") + .data(data, function (d) { + return d; + }), "gene") if (exons) { @@ -1385,7 +1398,7 @@ function VQI_GenomeBrowser(id, serviceURL) { }) .enter() .append("rect"); - + trackGroup.selectAll("rect") .data(exons, function (d) { return d; @@ -1402,93 +1415,94 @@ function VQI_GenomeBrowser(id, serviceURL) { .style("stroke", "black") .style("fill", "black") .style("vector-effect", "non-scaling-stroke") - - addTooltip(trackGroup.selectAll("rect") - .data(exons, function (d) { - return d;}), "exon") - + + addTooltip(trackGroup.selectAll("rect") + .data(exons, function (d) { + return d; + }), "exon") + } } - var addTooltip = function(selection, type) + var addTooltip = function (selection, type) { var start = (Math.round(xScale.domain()[0])).toString(); var end = (Math.round(xScale.domain()[1])).toString(); - var scale = (end - start)/1000; + var scale = (end - start) / 1000; selection.each( - function(d){ - $(this).qtip({ - content: { - text: "Loading..." - }, - position: { - my: 'top center', - at: 'top center', - target: 'mouse', - adjust: { - mouse: true, // Can be omitted (e.g. default behaviour) - y: 10 - } - } - }) - }); - - selection.each(function(){ - var selected = $(this); - var hoverTimeout = 0; - $(this).mousemove(function(event) { - clearTimeout(hoverTimeout); - hoverTimeout = setTimeout(function(){ - var pixelWidth = (xScale.domain()[1] - xScale.domain()[0])/1000 - var min = (event.pageX - 60) * pixelWidth + xScale.domain()[0]; - var max = (event.pageX - 58) * pixelWidth + xScale.domain()[0]; - $.ajax({ - url: serviceURL, - type: 'POST', - dataType: "json", - data: { - "loadTooltip": "", - "chrom": chrom_curr, - "type" : type, - "min" : min, - "max": max, - 'fileHandle': fileHandle + function (d) { + $(this).qtip({ + content: { + text: "Loading..." + }, + position: { + my: 'top center', + at: 'top center', + target: 'mouse', + adjust: { + mouse: true, // Can be omitted (e.g. default behaviour) + y: 10 } - }) - .then(function(content) { - // Set the tooltip content upon successful retrieval - selected.qtip('option', 'content.text', content); - selected.qtip('reposition', event); - }, function(xhr, status, error) { - // Upon failure... set the tooltip content to the status and error value - selected.qtip('option', 'content.text', status + ': ' + error); - }); - } , 200); + } + }) }); + + selection.each(function () { + var selected = $(this); + var hoverTimeout = 0; + $(this).mousemove(function (event) { + clearTimeout(hoverTimeout); + hoverTimeout = setTimeout(function () { + var pixelWidth = (xScale.domain()[1] - xScale.domain()[0]) / 1000 + var min = (event.pageX - 60) * pixelWidth + xScale.domain()[0]; + var max = (event.pageX - 58) * pixelWidth + xScale.domain()[0]; + $.ajax({ + url: serviceURL, + type: 'POST', + dataType: "json", + data: { + "loadTooltip": "", + "chrom": chrom_curr, + "type": type, + "min": min, + "max": max, + 'fileHandle': fileHandle + } + }) + .then(function (content) { + // Set the tooltip content upon successful retrieval + selected.qtip('option', 'content.text', content); + selected.qtip('reposition', event); + }, function (xhr, status, error) { + // Upon failure... set the tooltip content to the status and error value + selected.qtip('option', 'content.text', status + ': ' + error); + }); + }, 200); }); + }); } - this.updateTrack = function(){ + this.updateTrack = function () { var start = (Math.round(xScale.domain()[0])).toString(); var end = (Math.round(xScale.domain()[1])).toString(); var chrom = chrom_curr; var LoadingText = group.append("g") LoadingText.append("rect") - .attr("x", 450) - .attr("width", 100) - .attr("y", -10) - .attr("height", 20) - .attr("rx", 6) - .attr("ry", 6) - .style("fill-opacity", .6) - .style("fill", "white") - + .attr("x", 450) + .attr("width", 100) + .attr("y", -10) + .attr("height", 20) + .attr("rx", 6) + .attr("ry", 6) + .style("fill-opacity", .6) + .style("fill", "white") + LoadingText.append("text") - .text("Loading...") - .attr("x", 475) - .attr("y", 5); + .text("Loading...") + .attr("x", 475) + .attr("y", 5); $.ajax({ url: serviceURL, @@ -1502,37 +1516,37 @@ function VQI_GenomeBrowser(id, serviceURL) { "start": start, "end": end } - - }).success(function (returnData) { - if(returnData.length == 2) {//exons exist - - drawTrack(returnData[0], returnData[1]); - } - else{ - drawTrack(returnData); - } - LoadingText.remove(); + + }).success(function (returnData) { + if (returnData.length == 2) {//exons exist + + drawTrack(returnData[0], returnData[1]); } - ).error(function (req, status, error) { - $("body").append(status + ": " + error); - }); - this.zoomed(); + else { + drawTrack(returnData); + } + LoadingText.remove(); + } + ).error(function (req, status, error) { + $("body").append(status + ": " + error); + }); + this.zoomed(); } var previousScale = 1; - this.zoomed = function() { + this.zoomed = function () { var thisScale = getScale(); - if(zoom.scale() < redrawCutoff) + if (zoom.scale() < redrawCutoff) { - if(previousScale > redrawCutoff) + if (previousScale > redrawCutoff) { trackGroup.selectAll("rect") - .attr("width", function (d) { - return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) - }) - .attr("x", function (d) { - return thisScale(d[indexArray.start]) - }); + .attr("width", function (d) { + return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) + }) + .attr("x", function (d) { + return thisScale(d[indexArray.start]) + }); } trackGroup.attr("transform", "translate(" + zoom.translate()[0] + ",0)scale(" + zoom.scale() + ",1)"); } @@ -1540,44 +1554,44 @@ function VQI_GenomeBrowser(id, serviceURL) { { trackGroup.attr("transform", null); trackGroup.selectAll("rect") - .attr("width", function (d) { - return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) - }) - .attr("x", function (d) { - return thisScale(d[indexArray.start]) - }); + .attr("width", function (d) { + return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) + }) + .attr("x", function (d) { + return thisScale(d[indexArray.start]) + }); } previousScale = zoom.scale(); } - this.getData = function(){ + this.getData = function () { var data; $.ajax({ url: serviceURL, type: 'POST', dataType: "json", - async : false, + async: false, data: { "getFullTrackData": "", "fileHandle": fileHandle } }).success(function (returnData) { data = returnData; - data.unshift(["CHROM","CHROM_START","CHROM_END","GENESYMBOL","SCORE","STRAND"]); + data.unshift(["CHROM", "CHROM_START", "CHROM_END", "GENESYMBOL", "SCORE", "STRAND"]); }).error(function (req, status, error) { $("body").append(status + ": " + error); - }); + }); return data; } - this.getRange = function(){ + this.getRange = function () { var range; $.ajax({ url: serviceURL, type: 'POST', dataType: "json", - async : false, + async: false, data: { "getRange": "", "fileHandle": fileHandle, @@ -1588,7 +1602,7 @@ function VQI_GenomeBrowser(id, serviceURL) { range = returnData; }).error(function (req, status, error) { $("body").append(status + ": " + error); - }); + }); return range; } @@ -1602,14 +1616,14 @@ function VQI_GenomeBrowser(id, serviceURL) { var data; var redrawCutoff = 1000; //Scale at which rectangles will be drawn individually - var getScale = function(){ - if(zoom.scale() < redrawCutoff) + var getScale = function () { + if (zoom.scale() < redrawCutoff) return fullXScale; else return xScale; } - var drawTrack = function(data, exons) + var drawTrack = function (data, exons) { if (data.length === 0) { return; @@ -1655,91 +1669,92 @@ function VQI_GenomeBrowser(id, serviceURL) { return d[indexArray.score] > 0 ? "red" : d[indexArray.score] < 0 ? "green" : "grey"; }) .style("vector-effect", "non-scaling-stroke") - - addTooltip(trackGroup.selectAll("rect") - .data(data, function (d) { - return d;}), "custom") + + addTooltip(trackGroup.selectAll("rect") + .data(data, function (d) { + return d; + }), "custom") } - var addTooltip = function(selection, type) + var addTooltip = function (selection, type) { var start = (Math.round(xScale.domain()[0])).toString(); var end = (Math.round(xScale.domain()[1])).toString(); - var scale = (end - start)/1000; + var scale = (end - start) / 1000; selection.each( - function(d){ - $(this).qtip({ - content: { - text: "Loading..." - }, - position: { - my: 'top center', - at: 'top center', - target: 'mouse', - adjust: { - mouse: true, // Can be omitted (e.g. default behaviour) - y: 10 - } - } - }) - }); - - selection.each(function(){ - var selected = $(this); - var hoverTimeout = 0; - $(this).mousemove(function(event) { - clearTimeout(hoverTimeout); - hoverTimeout = setTimeout(function(){ - var pixelWidth = (xScale.domain()[1] - xScale.domain()[0])/1000 - var min = (event.pageX - 60) * pixelWidth + xScale.domain()[0]; - var max = (event.pageX - 58) * pixelWidth + xScale.domain()[0]; - $.ajax({ - url: serviceURL, - type: 'POST', - dataType: "json", - data: { - "loadTooltip": "", - "chrom": chrom_curr, - "type" : "custom", - "min" : min, - "max": max, - 'fileHandle': fileHandle + function (d) { + $(this).qtip({ + content: { + text: "Loading..." + }, + position: { + my: 'top center', + at: 'top center', + target: 'mouse', + adjust: { + mouse: true, // Can be omitted (e.g. default behaviour) + y: 10 } - }) - .then(function(content) { - // Set the tooltip content upon successful retrieval - selected.qtip('option', 'content.text', content); - selected.qtip('reposition', event); - }, function(xhr, status, error) { - // Upon failure... set the tooltip content to the status and error value - selected.qtip('option', 'content.text', status + ': ' + error); - }); - } , 200); + } + }) }); + + selection.each(function () { + var selected = $(this); + var hoverTimeout = 0; + $(this).mousemove(function (event) { + clearTimeout(hoverTimeout); + hoverTimeout = setTimeout(function () { + var pixelWidth = (xScale.domain()[1] - xScale.domain()[0]) / 1000 + var min = (event.pageX - 60) * pixelWidth + xScale.domain()[0]; + var max = (event.pageX - 58) * pixelWidth + xScale.domain()[0]; + $.ajax({ + url: serviceURL, + type: 'POST', + dataType: "json", + data: { + "loadTooltip": "", + "chrom": chrom_curr, + "type": "custom", + "min": min, + "max": max, + 'fileHandle': fileHandle + } + }) + .then(function (content) { + // Set the tooltip content upon successful retrieval + selected.qtip('option', 'content.text', content); + selected.qtip('reposition', event); + }, function (xhr, status, error) { + // Upon failure... set the tooltip content to the status and error value + selected.qtip('option', 'content.text', status + ': ' + error); + }); + }, 200); }); + }); } - this.updateTrack = function(){ + this.updateTrack = function () { var start = (Math.round(xScale.domain()[0])).toString(); var end = (Math.round(xScale.domain()[1])).toString(); var chrom = chrom_curr; var LoadingText = group.append("g") LoadingText.append("rect") - .attr("x", 450) - .attr("width", 100) - .attr("y", -10) - .attr("height", 20) - .attr("rx", 6) - .attr("ry", 6) - .style("fill-opacity", .6) - .style("fill", "white") - + .attr("x", 450) + .attr("width", 100) + .attr("y", -10) + .attr("height", 20) + .attr("rx", 6) + .attr("ry", 6) + .style("fill-opacity", .6) + .style("fill", "white") + LoadingText.append("text") - .text("Loading...") - .attr("x", 475) - .attr("y", 5); + .text("Loading...") + .attr("x", 475) + .attr("y", 5); $.ajax({ url: serviceURL, @@ -1753,37 +1768,37 @@ function VQI_GenomeBrowser(id, serviceURL) { "start": start, "end": end } - - }).success(function (returnData) { - if(returnData.length == 2) {//exons exist - - drawTrack(returnData[0], returnData[1]); - } - else{ - drawTrack(returnData); - } - LoadingText.remove(); + + }).success(function (returnData) { + if (returnData.length == 2) {//exons exist + + drawTrack(returnData[0], returnData[1]); } - ).error(function (req, status, error) { - $("body").append(status + ": " + error); - }); - this.zoomed(); + else { + drawTrack(returnData); + } + LoadingText.remove(); + } + ).error(function (req, status, error) { + $("body").append(status + ": " + error); + }); + this.zoomed(); } var previousScale = 1; - this.zoomed = function() { + this.zoomed = function () { var thisScale = getScale(); - if(zoom.scale() < redrawCutoff) + if (zoom.scale() < redrawCutoff) { - if(previousScale > redrawCutoff) + if (previousScale > redrawCutoff) { trackGroup.selectAll("rect") - .attr("width", function (d) { - return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) - }) - .attr("x", function (d) { - return thisScale(d[indexArray.start]) - }); + .attr("width", function (d) { + return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) + }) + .attr("x", function (d) { + return thisScale(d[indexArray.start]) + }); } trackGroup.attr("transform", "translate(" + zoom.translate()[0] + ",0)scale(" + zoom.scale() + ",1)"); } @@ -1791,44 +1806,44 @@ function VQI_GenomeBrowser(id, serviceURL) { { trackGroup.attr("transform", null); trackGroup.selectAll("rect") - .attr("width", function (d) { - return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) - }) - .attr("x", function (d) { - return thisScale(d[indexArray.start]) - }); + .attr("width", function (d) { + return thisScale(d[indexArray.end]) - thisScale(d[indexArray.start]) + }) + .attr("x", function (d) { + return thisScale(d[indexArray.start]) + }); } previousScale = zoom.scale(); } - this.getData = function(){ + this.getData = function () { var data; $.ajax({ url: serviceURL, type: 'POST', dataType: "json", - async : false, + async: false, data: { "getFullTrackData": "", "fileHandle": fileHandle } }).success(function (returnData) { data = returnData; - data.unshift(["CHROM","CHROM_START","CHROM_END","GENESYMBOL","SCORE","STRAND"]); + data.unshift(["CHROM", "CHROM_START", "CHROM_END", "GENESYMBOL", "SCORE", "STRAND"]); }).error(function (req, status, error) { $("body").append(status + ": " + error); - }); + }); return data; } - this.getRange = function(){ + this.getRange = function () { var range; $.ajax({ url: serviceURL, type: 'POST', dataType: "json", - async : false, + async: false, data: { "getRange": "", "fileHandle": fileHandle, @@ -1839,7 +1854,7 @@ function VQI_GenomeBrowser(id, serviceURL) { range = returnData; }).error(function (req, status, error) { $("body").append(status + ": " + error); - }); + }); return range; } @@ -1852,27 +1867,28 @@ function VQI_GenomeBrowser(id, serviceURL) { var file = args.fasta; var indexFile = args.index - var drawTrack = function(data) - { + var drawTrack = function (data) { trackGroup.selectAll("text") - .data(data, function (d) { - return d; - }) - .exit() - .remove(); + .data(data, function (d) { + return d; + }) + .exit() + .remove(); trackGroup.selectAll("text") - .data(data, function (d) { - return d; - }) - .enter() - .append("text") + .data(data, function (d) { + return d; + }) + .enter() + .append("text") trackGroup.selectAll("text") .data(data, function (d) { return d; }) - .text(function (d) {return d[0]}) + .text(function (d) { + return d[0] + }) .attr("x", function (d) { return xScale(d[1]) - 2; //-2 to center text }) @@ -1880,61 +1896,59 @@ function VQI_GenomeBrowser(id, serviceURL) { addTooltip(trackGroup.selectAll("text")) } - var clearTrack = function() - { + var clearTrack = function () { trackGroup.selectAll("text").remove(); } - var addTooltip = function(selection) - { + var addTooltip = function (selection) { var start = (Math.round(xScale.domain()[0])).toString(); var end = (Math.round(xScale.domain()[1])).toString(); - var scale = (end - start)/1000; + var scale = (end - start) / 1000; selection.each( - function(d){ - $(this).qtip({ - content: { - text: d[1] - }, - position: { - my: 'top center', - at: 'top center', - target: 'mouse', - adjust: { - mouse: true, // Can be omitted (e.g. default behaviour) - y: 10 - } - } - }) - }); + function (d) { + $(this).qtip({ + content: { + text: d[1] + }, + position: { + my: 'top center', + at: 'top center', + target: 'mouse', + adjust: { + mouse: true, // Can be omitted (e.g. default behaviour) + y: 10 + } + } + }) + }); } - this.zoomed = function(){ + this.zoomed = function () { trackGroup.selectAll("text") - .attr("x", function (d) { - return xScale(d[1]) - 2; - }) + .attr("x", function (d) { + return xScale(d[1]) - 2; + }) } - this.updateTrack = function(){ - if( zoom.scale() >= (panExtent[1] - panExtent[0]) / 100/ initialZoom) + this.updateTrack = function () { + if (zoom.scale() >= (panExtent[1] - panExtent[0]) / 100 / initialZoom) { var LoadingText = group.append("g") LoadingText.append("rect") - .attr("x", 450) - .attr("width", 100) - .attr("y", -10) - .attr("height", 20) - .attr("rx", 6) - .attr("ry", 6) - .style("fill-opacity", .6) - .style("fill", "white") - + .attr("x", 450) + .attr("width", 100) + .attr("y", -10) + .attr("height", 20) + .attr("rx", 6) + .attr("ry", 6) + .style("fill-opacity", .6) + .style("fill", "white") + LoadingText.append("text") - .text("Loading...") - .attr("x", 475) - .attr("y", 5); + .text("Loading...") + .attr("x", 475) + .attr("y", 5); var xStart = Math.floor(xScale.domain()[0]); var length = Math.ceil(xScale.domain()[1]) - xStart; @@ -1944,15 +1958,15 @@ function VQI_GenomeBrowser(id, serviceURL) { dataType: "json", data: { "loadFastaData": "", - "chrom" : chrom_curr, + "chrom": chrom_curr, "start": xStart, "length": length, "file": file, "indexFile": indexFile - } + } }).success(function (returnData) { var data = returnData.split(""); - for(var i = 0; i < returnData.length; i++) + for (var i = 0; i < returnData.length; i++) { data[i] = [data[i], xStart + i] } @@ -1962,19 +1976,18 @@ function VQI_GenomeBrowser(id, serviceURL) { $("body").append(status + ": " + error); }); } - else - { + else { clearTrack(); } } - this.getRange = function(){ + this.getRange = function () { var range; $.ajax({ url: serviceURL, type: 'POST', dataType: "json", - async : false, + async: false, data: { "getFastaRange": "", "chrom": chrom_curr, @@ -1986,7 +1999,7 @@ function VQI_GenomeBrowser(id, serviceURL) { $("body").append(status + ": " + error); }); - return range; + return range; } } }