Skip to content

Commit

Permalink
Generalize "paintAxis" function to work with tracks without dataRange
Browse files Browse the repository at this point in the history
  • Loading branch information
jrobinso committed Oct 30, 2024
1 parent f6f64d5 commit 1e5a2f1
Show file tree
Hide file tree
Showing 5 changed files with 40 additions and 140 deletions.
106 changes: 0 additions & 106 deletions dev/shoebox/shoebox.html

This file was deleted.

4 changes: 3 additions & 1 deletion js/feature/featureParser.js
Original file line number Diff line number Diff line change
Expand Up @@ -127,7 +127,9 @@ class FeatureParser {
const tokens = line.split(this.delimiter || "\t")
try {
const tmpHeader = Object.assign({columnNames}, header)
if (this.decode(tokens, tmpHeader)) {
let firstFeature
if (firstFeature = this.decode(tokens, tmpHeader)) {
header.firstFeature = firstFeature
break
} else {
if (tokens.length > 1) {
Expand Down
2 changes: 1 addition & 1 deletion js/shoebox/decodeShoebox.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ export default function decodeShoebox(tokens, header, maxColumnCount = Number.MA

const chr = tokens[0]
const start = parseInt(tokens[1])
const end = tokens.length > 2 ? parseInt(tokens[2]) : start + 1
const end = parseInt(tokens[2])
if (isNaN(start) || isNaN(end)) {
return new DecodeError(`Unparsable bed record.`)
}
Expand Down
47 changes: 21 additions & 26 deletions js/shoebox/shoeboxTrack.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import FeatureSource from "../feature/featureSource.js"
import TrackBase from "../trackBase.js"
import IGVGraphics from "../igv-canvas.js"
import ShoeboxColorScale from "./shoeboxColorScale.js"
import paintAxis from "../util/paintAxis.js"

/**
* Configurable properties
Expand Down Expand Up @@ -33,12 +34,6 @@ class ShoeboxTrack extends TrackBase {

this.type = "shoebox"

// Hardcoded -- todo, perhaps, get from track line
this.sampleKeys = []
for (let i = 1; i <= this.rowCount; i++) {
this.sampleKeys.push(i)
}

if (config.max) {
this.dataRange = {
min: config.min || 0,
Expand All @@ -49,9 +44,12 @@ class ShoeboxTrack extends TrackBase {
const configCopy = Object.assign({}, this.config)
configCopy.format = 'shoebox' // bit of a hack
this.featureSource = FeatureSource(configCopy, this.browser.genome)

this.paintAxis = paintAxis
}

async postInit() {

if (typeof this.featureSource.getHeader === "function") {
this.header = await this.featureSource.getHeader()
if (this.disposed) return // This track was removed during async load
Expand All @@ -62,6 +60,8 @@ class ShoeboxTrack extends TrackBase {
this.header.scale = Number.parseFloat(this.header.scale)
}
this.setTrackProperties(this.header)

this.rowCount = this.header.firstFeature ? this.header.firstFeature.values.length : 100
}

// Must do the following after setting track properties as they can be overriden via a track line
Expand All @@ -76,10 +76,6 @@ class ShoeboxTrack extends TrackBase {

}

get rowCount() {
return 100 // TODO Hardcoded, get from data
}

get color() {
return this._color || "rgb(0,0,255)"
}
Expand All @@ -91,6 +87,14 @@ class ShoeboxTrack extends TrackBase {
}
}

get axisMin() {
return 1
}

get axisMax() {
return this.rowCount
}

menuItemList() {

const menuItems = []
Expand All @@ -99,6 +103,7 @@ class ShoeboxTrack extends TrackBase {
let object = $('<div>')
object.text('Set row height')

const browser = this.browser
function dialogHandler(e) {

const callback = () => {
Expand All @@ -107,6 +112,8 @@ class ShoeboxTrack extends TrackBase {

if (undefined !== number) {

browser.sampleNameViewportWidth = undefined // TODO, a better way to trigger this

const tracks = []
if (this.trackView.track.selected) {
tracks.push(...(this.trackView.browser.getSelectedTrackViews().map(({track}) => track)))
Expand All @@ -116,7 +123,7 @@ class ShoeboxTrack extends TrackBase {

for (const track of tracks) {
track.rowHeight = number
if(track.rowHeight * track.rowCount < track.height) {
if (track.rowHeight * track.rowCount < track.height) {
track.trackView.setTrackHeight(track.rowHeight * track.rowCount, true)
}
track.trackView.checkContentHeight()
Expand Down Expand Up @@ -165,23 +172,12 @@ class ShoeboxTrack extends TrackBase {
this.trackView.repaintViews()
}

hasSamples() {
return true // by definition
}

getSamples() {
return {
names: this.sampleKeys,
height: this.rowHeight,
yOffset: 0
}
}

async getFeatures(chr, start, end, bpPerPixel) {
const visibilityWindow = this.visibilityWindow
return this.featureSource.getFeatures({chr, start, end, bpPerPixel, visibilityWindow})
}
const features = await this.featureSource.getFeatures({chr, start, end, bpPerPixel, visibilityWindow})

return features
}

draw({context, pixelTop, pixelWidth, pixelHeight, features, bpPerPixel, bpStart}) {

Expand Down Expand Up @@ -254,7 +250,6 @@ class ShoeboxTrack extends TrackBase {
const rect = feature.pixelRect
return rect && y >= rect.y && y <= (rect.y + rect.h)
})

}

hoverText(clickState) {
Expand Down
21 changes: 15 additions & 6 deletions js/util/paintAxis.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,21 +4,28 @@ const shim = .01
const diagnosticColor = "rgb(251,128,114)"
const colorStripWidth = 4
const axesXOffset = colorStripWidth + 1

function paintAxis(ctx, width, height, colorOrUndefined) {

if (undefined === this.dataRange || undefined === this.dataRange.max || undefined === this.dataRange.min) {
let axisMin = this.axisMin //|| this.dataRange ? this.dataRange.min : 0
let axisMax = this.axisMax //|| this.dataRange ? this.dataRange.max : undefined
if (undefined === axisMax && this.dataRange) {
axisMin = this.dataRange.min || 0
axisMax = this.dataRange.max
}
if (undefined === axisMax) {
return
}

IGVGraphics.fillRect(ctx, 0, 0, width, height, { fillStyle: 'white' })
IGVGraphics.fillRect(ctx, 0, 0, width, height, {fillStyle: 'white'})
if (colorOrUndefined) {
IGVGraphics.fillRect(ctx, width - colorStripWidth - 2, 0, colorStripWidth, height, { fillStyle: colorOrUndefined })
IGVGraphics.fillRect(ctx, width - colorStripWidth - 2, 0, colorStripWidth, height, {fillStyle: colorOrUndefined})
}

const flipAxis = (undefined === this.flipAxis) ? false : this.flipAxis

const xTickStart = 0.95 * width - 8 - axesXOffset
const xTickEnd = 0.95 * width - axesXOffset
const xTickEnd = 0.95 * width - axesXOffset

const properties =
{
Expand All @@ -30,13 +37,13 @@ function paintAxis(ctx, width, height, colorOrUndefined) {

// tick
IGVGraphics.strokeLine(ctx, xTickStart, shim * height, xTickEnd, shim * height, properties)
IGVGraphics.fillText(ctx, prettyPrint(flipAxis ? this.dataRange.min : this.dataRange.max), xTickStart + 4, shim * height + 12, properties)
IGVGraphics.fillText(ctx, prettyPrint(flipAxis ? axisMin : axisMax), xTickStart + 4, shim * height + 12, properties)

const y = (1.0 - shim) * height

// tick
IGVGraphics.strokeLine(ctx, xTickStart, y, xTickEnd, y, properties)
IGVGraphics.fillText(ctx, prettyPrint(flipAxis ? this.dataRange.max : this.dataRange.min), xTickStart + 4, y - 4, properties)
IGVGraphics.fillText(ctx, prettyPrint(flipAxis ? axisMax : axisMin), xTickStart + 4, y - 4, properties)

// vertical axis
IGVGraphics.strokeLine(ctx, xTickEnd, shim * height, xTickEnd, y, properties)
Expand All @@ -45,6 +52,8 @@ function paintAxis(ctx, width, height, colorOrUndefined) {

if (number === 0) {
return "0"
} else if (Number.isInteger()) {
return number
} else if (Math.abs(number) >= 10) {
return number.toFixed()
} else if (Math.abs(number) >= 1) {
Expand Down

0 comments on commit 1e5a2f1

Please sign in to comment.