From b7a232ae09b8aa1c44acad28073928cbd015afa8 Mon Sep 17 00:00:00 2001 From: Colin Date: Sat, 19 Dec 2020 19:35:51 -0500 Subject: [PATCH] Make softclip indicator black if none --- .../src/PileupRenderer/PileupRenderer.ts | 25 +++++++++++++------ website/docs/faq.md | 7 ++++++ 2 files changed, 24 insertions(+), 8 deletions(-) diff --git a/plugins/alignments/src/PileupRenderer/PileupRenderer.ts b/plugins/alignments/src/PileupRenderer/PileupRenderer.ts index d5ea3bd8a90..404622755de 100644 --- a/plugins/alignments/src/PileupRenderer/PileupRenderer.ts +++ b/plugins/alignments/src/PileupRenderer/PileupRenderer.ts @@ -249,6 +249,7 @@ export default class PileupRenderer extends BoxRendererType { ctx.fillStyle = readConfObject(config, 'color', [feature]) ctx.fillRect(leftPx, topPx, Math.max(rightPx - leftPx, 1.5), heightPx) const mismatches: Mismatch[] = feature.get('mismatches') + const seq = feature.get('seq') if (mismatches) { const colorForBase: { [key: string]: string } = { @@ -309,9 +310,12 @@ export default class PileupRenderer extends BoxRendererType { } } else if ( mismatch.type === 'hardclip' || - (!showSoftClip && mismatch.type === 'softclip') + mismatch.type === 'softclip' ) { ctx.fillStyle = mismatch.type === 'hardclip' ? 'red' : 'blue' + if (!seq) { + ctx.fillStyle = 'black' + } const pos = mismatchLeftPx - 1 ctx.fillRect(pos, topPx + 1, w, heightPx - 2) ctx.fillRect(pos - w, topPx, w * 3, 1) @@ -345,9 +349,12 @@ export default class PileupRenderer extends BoxRendererType { // Display all bases softclipped off in lightened colors if (showSoftClip) { const seq = feature.get('seq') - if (!seq) return - for (let j = 0; j < mismatches.length; j += 1) { - const mismatch = mismatches[j] + if (!seq) { + return + } + + const clips = [mismatches[0], mismatches[mismatches.length - 1]] + clips.forEach(mismatch => { if (mismatch.type === 'softclip') { const softClipLength = mismatch.cliplen || 0 const softClipStart = @@ -370,15 +377,17 @@ export default class PileupRenderer extends BoxRendererType { Math.abs(softClipLeftPx - softClipRightPx), ) - // Black accounts for IUPAC ambiguity code bases such as N that show in soft clipping - ctx.fillStyle = lighten(colorForBase[base] || '#000000', 0.3) + // Black accounts for IUPAC ambiguity code bases such as N that + // show in soft clipping + const baseColor = colorForBase[base] || '#000000' + ctx.fillStyle = baseColor ctx.fillRect(softClipLeftPx, topPx, softClipWidthPx, heightPx) if ( softClipWidthPx >= charSize.width && heightPx >= charSize.height - 5 ) { - ctx.fillStyle = 'black' + ctx.fillStyle = theme.palette.getContrastText(baseColor) ctx.fillText( base, softClipLeftPx + (softClipWidthPx - charSize.width) / 2 + 1, @@ -387,7 +396,7 @@ export default class PileupRenderer extends BoxRendererType { } } } - } + }) } } }) diff --git a/website/docs/faq.md b/website/docs/faq.md index cb714c7b8a5..810ffbcfd9e 100644 --- a/website/docs/faq.md +++ b/website/docs/faq.md @@ -136,3 +136,10 @@ In JBrowse 1, the app level menu operated on the single linear genome view, but with JBrowse 2, the top level menu only performs global operations and the linear genome view has it's own hamburger menu. Note that each track also has it's own track level menu. + +### Why do some of my reads not display soft clipping? + +Some reads, such as secondary reads, do not have a SEQ field on their records, +so they will not display softclipping. + +These reads will display their soft-clipping indicator as black